/* ============================================================
   home.css — homepage-only sections (signature hero)
   Loaded after styles.css on index.html only.
   ============================================================ */

.hero{ position:relative; isolation:isolate; min-height:100svh; display:flex; align-items:center;
  padding:8rem 0 4rem; overflow:hidden; }
.hero__poster,#hero-gl{ position:absolute; inset:0; width:100%; height:100%; }
/* CSS-gradient poster = instant LCP, zero image weight, and the WebGL fallback */
.hero__poster{ z-index:0;
  background:
    radial-gradient(1200px 720px at 80% 4%, rgba(231,180,90,.20), transparent 56%),
    radial-gradient(1100px 820px at 8% 22%, rgba(84,214,192,.20), transparent 56%),
    radial-gradient(900px 700px at 50% 122%, rgba(231,180,90,.10), transparent 60%),
    var(--ink-900); }
#hero-gl{ z-index:1; opacity:0; transition:opacity 1.2s ease; }
#hero-gl.ready{ opacity:1; }
.hero::after{ content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(180deg, rgba(10,13,16,.18), rgba(10,13,16,.32) 60%, var(--ink-900)); }
.hero .container{ position:relative; z-index:3; }

.hero-inner{ max-width:940px; }
.signal-pill{ display:inline-flex; align-items:center; gap:.55rem; font-size:.82rem; color:var(--ivory-66);
  background:var(--glass); border:1px solid var(--line-2); border-radius:100px; padding:.45rem .9rem; backdrop-filter:blur(6px); margin-bottom:1.5rem; }
.signal-pill .live{ width:8px; height:8px; border-radius:50%; background:var(--teal); animation:pulse 2.2s infinite; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(84,214,192,.5);} 70%{ box-shadow:0 0 0 9px rgba(84,214,192,0);} 100%{ box-shadow:0 0 0 0 rgba(84,214,192,0);} }
@media (prefers-reduced-motion:reduce){ .signal-pill .live{ animation:none; } }

.hero h1{ margin-bottom:1.5rem; }
.hero h1 .grad{ display:inline-block; }
.hero .lead{ max-width:660px; margin-bottom:2.2rem; font-size:clamp(1.06rem,1.5vw,1.28rem); color:var(--ivory-90); }
.hero .lead strong{ color:#fff; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:.9rem; margin-bottom:3.2rem; }

/* split chars need solid color (gradient breaks across split wrappers) */
.hero h1 .char{ display:inline-block; }

.scroll-cue{ position:absolute; left:50%; bottom:1.6rem; transform:translateX(-50%); z-index:3; color:var(--ivory-46);
  font-size:.72rem; letter-spacing:.16em; text-transform:uppercase; display:flex; flex-direction:column; align-items:center; gap:.5rem; }
.scroll-cue .line{ width:1px; height:38px; background:linear-gradient(var(--gold),transparent); }
@media(max-width:680px){ .scroll-cue{ display:none; } .hero{ min-height:auto; } }
@media (max-width:880px){ .hero-trust{ grid-template-columns:1fr 1fr; } }