/* assets/css/styles.css — Vibrant, colorful, stealth-mode SaaS theme */
:root {
  --p1: #7C3AED; /* purple */
  --p2: #22D3EE; /* cyan */
  --p3: #EF4444; /* red */
  --p4: #22C55E; /* green */
  --p5: #F59E0B; /* amber */
  --ink: #0f1223;
}

html, body { scroll-behavior: smooth; }
body {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji';
  color: #0e102a;
  background: radial-gradient(1200px 800px at 90% -10%, rgba(124,58,237,0.22), transparent 60%),
              radial-gradient(900px 700px at -20% 20%, rgba(34,211,238,0.25), transparent 60%),
              linear-gradient(180deg, #ffffff 0%, #fcfbff 100%);
}

.navbar-brand b { letter-spacing: 0.2px; }
.navbar {
  backdrop-filter: saturate(140%) blur(8px);
  background-color: rgba(255, 255, 255, 0.8) !important;
  border-bottom: 1px solid rgba(15, 18, 35, 0.06);
}

/* NEW: brand stack — name on first line, Stealth badge on second line */
.navbar-brand {
  display: flex;
  align-items: center;
}
.navbar-brand-text {
  display: flex;
  flex-direction: column;     /* stack name + badge vertically */
  align-items: flex-start;
  line-height: 1.2;
  margin-left: .5rem;
}
.navbar-brand-text b {
  white-space: nowrap;        /* keep “Posttech Internet” on one line */
}
.navbar-brand-text .badge {
  margin-top: 2px;            /* breathing room below brand name */
}

.btn-gradient {
  background: linear-gradient(90deg, var(--p1), var(--p2), var(--p4));
  background-size: 200% 100%;
  border: none;
  color: white !important;
  transition: background-position .6s ease;
}
.btn-gradient:hover { background-position: 100% 0; opacity: 0.95; }

.hero {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid rgba(15, 18, 35, 0.06);
}
.hero .headline {
  background: linear-gradient(90deg, var(--p1) 0%, var(--p2) 35%, var(--p5) 70%, var(--p4) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.gradient-card {
  background: linear-gradient(135deg, rgba(124,58,237,0.08), rgba(34,211,238,0.08));
  border: 1px solid rgba(124,58,237,0.18);
  box-shadow: 0 20px 40px rgba(15, 18, 35, 0.06);
}

.section-muted {
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  border-top: 1px solid rgba(15, 18, 35, 0.06);
  border-bottom: 1px solid rgba(15, 18, 35, 0.06);
}

.footer {
  border-top: 1px solid rgba(15, 18, 35, 0.06);
  color: #3b3f66;
  font-size: 0.95rem;
}

.floating-blob {
  position: absolute; inset: auto;
  filter: blur(60px);
  opacity: .45;
  mix-blend-mode: multiply;
  border-radius: 999px;
  transform: translateZ(0);
}
.blob-1 { width: 420px; height: 420px; right: -60px; top: -80px; background: radial-gradient(var(--p1), transparent 60%); }
.blob-2 { width: 360px; height: 360px; left: -60px; top: 220px; background: radial-gradient(var(--p2), transparent 60%); }
.blob-3 { width: 380px; height: 380px; right: 20%; top: 420px; background: radial-gradient(var(--p5), transparent 60%); }

.badge-soft {
  background: rgba(124,58,237,0.1);
  color: var(--p1);
  border: 1px solid rgba(124,58,237,0.2);
  font-weight: 600;
}

.card-min {
  transition: transform .2s ease, box-shadow .2s ease;
}
.card-min:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(15, 18, 35, 0.08);
}

.badge-founder {
  background: linear-gradient(90deg, #8B4513, #A0522D, #CD853F); /* dark brown → sienna → golden brown */
  color: #fff !important;
  border: 0;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.6em 1.2em;
  font-weight: 600;
  font-size: 1rem;
  box-shadow: 0 6px 16px rgba(0,0,0,0.15);
}