/* ═══════════════════════════════════════════
   HERO — Centered Layout with Pill Badge
   ═══════════════════════════════════════════ */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#0a1628}

/* Full-bleed background image */
.hero-bg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;z-index:0}

/* Centered overlay */
.hero-overlay{position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(ellipse at center,
      rgba(10,22,40,0.7) 0%,
      rgba(10,22,40,0.5) 40%,
      rgba(10,22,40,0.75) 100%);
  pointer-events:none}

/* Content — centered */
.hero-content--centered{position:relative;z-index:2;max-width:820px;padding:0 40px;text-align:center;display:flex;flex-direction:column;align-items:center}

/* Pill badge */
.hero-pill{display:inline-flex;padding:8px 24px;border-radius:var(--radius-pill);font-size:12px;letter-spacing:0.16em;text-transform:uppercase;font-weight:600;color:rgba(6,182,212,0.9);border:1px solid rgba(6,182,212,0.25);background:rgba(6,182,212,0.08);backdrop-filter:blur(8px);margin-bottom:32px;opacity:0;animation:fadeUp .8s .3s forwards}

/* Headline */
.hero-h1{font-size:clamp(44px,6.5vw,82px);font-weight:900;line-height:1.05;letter-spacing:-0.04em;color:#fff;opacity:0;animation:fadeUp .9s .5s forwards}
.hero-h1 .gr{background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;color:transparent;display:block;filter:drop-shadow(0 2px 12px rgba(14,116,144,0.25))}

/* Subtitle */
.hero-sub{font-size:17px;color:rgba(200,210,230,0.75);line-height:1.85;font-weight:400;max-width:620px;margin:32px 0 0;opacity:0;animation:fadeUp .8s .75s forwards}

/* CTAs */
.hero-actions{display:flex;gap:16px;margin-top:44px;opacity:0;animation:fadeUp .8s .95s forwards}

/* Hero-specific button overrides for dark bg */
.hero .btn-secondary{background:transparent;border:1px solid rgba(255,255,255,0.25);color:#fff;box-shadow:none}
.hero .btn-secondary:hover{background:rgba(255,255,255,0.1);border-color:rgba(255,255,255,0.45);box-shadow:0 4px 24px rgba(255,255,255,0.08);transform:translateY(-3px)}

/* ── Responsive ── */
@media(max-width:1024px){
  .hero-content--centered{max-width:700px}
  .hero-h1{font-size:clamp(44px,5.5vw,68px)}
  .hero-sub{max-width:540px}
}

@media(max-width:768px){
  .hero{min-height:92vh;min-height:92svh}
  .hero-content--centered{padding:0 24px;max-width:100%}
  .hero-h1{font-size:44px;line-height:1.08;letter-spacing:-0.02em}
  .hero-sub{font-size:15px;line-height:1.75;margin-top:22px;max-width:100%}
  .hero-actions{flex-direction:column;gap:12px;width:100%}
  .hero-pill{font-size:10px;padding:6px 18px;margin-bottom:24px}
  .hero-overlay{background:
    radial-gradient(ellipse at center,
      rgba(10,22,40,0.8) 0%,
      rgba(10,22,40,0.7) 60%,
      rgba(10,22,40,0.88) 100%) !important}
}

@media(max-width:420px){
  .hero{min-height:88vh;min-height:88svh}
  .hero-content--centered{padding:0 20px}
  .hero-h1{font-size:36px;letter-spacing:-0.025em}
  .hero-sub{font-size:14px;line-height:1.7;margin-top:18px}
  .hero-actions{margin-top:28px;gap:10px}
}