/* Landing v2 "Daylight Mission Control" — all new classes are lp- prefixed.
   Reuses from landing.css: .l-fr*, l-float-1..4, l-bob. From styles.css: .brand*.
   Spec: docs/superpowers/specs/2026-07-02-landing-v2-daylight-control-design.md */
/* `hidden` means hidden. The UA sheet's own [hidden]{display:none} is only
   specificity (0,1,0), so ANY two-class author rule silently defeats it --
   `.lp-globe-wrap .lp-rot{display:flex}` (0,2,0) below did exactly that, and
   three controls this page's JS had explicitly hidden went on rendering:
   the rotate toggle and the Day/Space pair, all of them wired to the retired
   Mapbox hero and therefore inert. Measured live before this fix:
   #lpRotToggle and .lp-atmo both hiddenAttr:true, display:flex.
   Declared FIRST so it reads as the page-wide rule it is. */
[hidden]{display:none !important}

:root{
  --lp-sky:#EDF3FB; --lp-bg:#F6F9FD; --lp-ink:#10213F; --lp-dim:#54658A; --lp-faint:#8B99B8;
  --lp-line:rgba(16,43,84,.13); --lp-green:#0E8A55; --lp-green-bright:#12A968;
}
.lp-hero{--h-bg:var(--lp-sky);--h-ink:var(--lp-ink);--h-dim:var(--lp-dim);--h-faint:var(--lp-faint);
  --h-card:rgba(255,255,255,.92);--h-line:rgba(16,43,84,.14);--h-accent:var(--ag-color-logo-blue)}
.lp-hero.space{--h-bg:#04070F;--h-ink:#E9F0FB;--h-dim:#8CA0BF;--h-faint:#5E6F90;
  --h-card:rgba(10,18,36,.9);--h-line:rgba(93,158,255,.18);--h-accent:#8FBCE8}

body{background:var(--lp-bg);color:var(--lp-ink);font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;margin:0;overflow-x:hidden}

/* nav */
.lp-nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:0 28px;height:58px;background:rgba(255,255,255,.85);backdrop-filter:blur(14px);border-bottom:1px solid var(--lp-line)}
.lp-nav__links{display:flex;gap:26px}
.lp-nav__links a{color:var(--lp-dim);text-decoration:none;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.lp-nav__links a:hover{color:var(--lp-ink)}
.lp-nav__cta{display:flex;gap:10px;align-items:center}

/* buttons — logo palette */
.lp-btn{font-family:inherit;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;border-radius:8px;cursor:pointer;text-decoration:none;transition:.2s;border:none;background:none;display:inline-flex;align-items:center;white-space:nowrap}
.lp-btn--ghost{color:var(--lp-dim);padding:9px 14px}
.lp-btn--ghost:hover{color:var(--lp-ink)}
.lp-btn--primary{background:var(--ag-gradient-logo);color:#fff;padding:11px 20px;border:1px solid var(--ag-color-logo-navy);box-shadow:0 6px 18px rgba(24,72,144,.28)}
.lp-btn--primary:hover{filter:brightness(1.12);transform:translateY(-1px)}
.lp-btn--line{border:1.5px solid var(--ag-color-logo-blue);color:var(--ag-color-logo-blue);padding:10px 18px;background:rgba(255,255,255,.65)}
.lp-btn--line:hover{background:rgba(24,96,168,.08)}
.lp-btn--big{padding:14px 26px;font-size:13px}

/* hero */
.lp-hero{position:relative;min-height:100vh;background:var(--h-bg);transition:background .8s ease;overflow:hidden}
/* z-index:0 removed deliberately (finding 1, secondary): position:absolute + an
   explicit z-index creates a new stacking context, which pinned .lp-rot's
   z-index:6 to only rank *inside* that context -- so it could never paint
   above the sibling .lp-veil (z:2) / .lp-hero__grid (z:5), which live outside
   it. Dropping z-index leaves position:absolute (still needed for layout) but
   z-index:auto does NOT create a stacking context, so #lpMap/.lp-poster/.lp-rot
   now rank directly against .lp-veil/.lp-hero__grid at the .lp-hero level.
   That is a no-op for #lpMap (implicit 0) and .lp-poster (z:1) -- both still
   land below .lp-veil (z:2), same relative order as before -- and it is the
   fix for .lp-rot (z:6), which now legitimately paints above both. */
.lp-globe-wrap{position:absolute;top:0;bottom:0;left:14%;right:-14%}
#lpMap{position:absolute;inset:0}
/* Task 30 (Open Map Stack): the orbit-engine canvas, mounted inside #lpMap on
   the openmaps_landing flag-on path (static/landing/js/globe_hero.js). Its own
   inset:0 mirrors templates/globe/partials/_orbit.html's #ag-orbit rule so it
   fills #lpMap regardless of #lpMap staying the positioned box either way.
   cursor:grab/.dragging match engine.js, which toggles that class itself on
   pointerdown/up -- pointer-drag is the only interaction hero mode allows. */
#lpOrbit{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab}
#lpOrbit.dragging{cursor:grabbing}
.lp-poster{position:absolute;inset:0;z-index:1;background-size:contain;background-position:center;background-repeat:no-repeat;transition:opacity .9s;pointer-events:none}
.lp-poster.done{opacity:0}
.lp-globe-wrap .lp-rot{
  position:absolute; top:12px; right:12px; z-index:7;
  /* padding:0 14px on a 30px-wide box left a TWO pixel content box for a 16px
     glyph, so the icon was squeezed out of its own button. The box is the
     target here; the glyph centres itself via the flex centring below. */
  width:34px; height:34px; padding:0;
  display:flex; align-items:center; justify-content:center;
  font-size:16px; font-weight:600; line-height:1;
  /* Circular, like every other icon-only floating control on the site
     (cf. .atl-globe-btn). The 6px radius read as a stray tooltip. */
  border:0; border-radius:50%; cursor:pointer;
  /* Dark glass, not a white puck. This control floats over the globe, which
     is dark in both hero themes, and a solid #fff circle read as a foreign
     object against every other floating control on the product (the globe
     page's instrument rail is the same treatment). Border + blur rather than
     a flat fill so it still separates from bright cloud tops. */
  background:rgba(10,18,36,.72); color:#E9F0FB;
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  box-shadow:0 6px 18px rgba(0,0,0,.42);
}
.lp-globe-wrap .lp-rot:hover{ background:rgba(20,32,58,.86); border-color:rgba(255,255,255,.28); }
.lp-globe-wrap .lp-rot--active{ color:#fff; }
.lp-globe-wrap .lp-rot--blocked{ opacity:.55; cursor:not-allowed; }
@media (prefers-reduced-motion: reduce){ .lp-globe-wrap .lp-rot{ opacity:.7; } }
/* finding 1 (critical): .lp-globe-wrap sits at left:14%/right:-14%, i.e. its
   right edge lands 14% of the hero's width *past* the viewport (clipped by
   .lp-hero{overflow:hidden}). .lp-rot's right:12px is measured from that
   off-screen edge, so above 1080px the button rendered ~14% width + 12px off
   the right of the screen -- invisible. Pull it back in by the same 14% so it
   sits 12px inside the *visible* right edge instead. Scoped to >1080px only:
   the max-width:1080px block already resets .lp-globe-wrap to right:auto
   (real edge = visible edge there), so the base right:12px is already
   correct at that breakpoint and must not get the 14% added a second time.
   RTL is excluded the same way: [dir="rtl"] .lp-globe-wrap mirrors to
   left:-14%/right:14%, so its right edge is already the visible one and
   right:12px (the base rule) is already correct there too. */
@media (min-width:1081px){
  /* ...and the VERTICAL axis, which the two earlier fixes never looked at.
     Above 1080px .lp-globe-wrap is absolute with top:0, so top:12px put this
     button inside .lp-nav — a 58px bar with z-index 50 against this button's
     6. document.elementFromPoint() at the button's centre returned NAV, i.e.
     the control could not be clicked AT ALL, and where it peeked out it
     collided with JOIN FREE (nav 1300-1412 vs button 1398-1428).
     Move it to the globe's own control zone instead: .lp-atmo sits at
     right:28px/bottom:56px and is 40px tall, so bottom:104px leaves an 8px
     gap above it, and matching right:28px lines the two up on one edge.
     Below 1081px .lp-globe-wrap is position:relative inside the column and
     the hero grid already clears the header, so the base top:12px stays
     right there and must NOT get this treatment. */
  .lp-globe-wrap .lp-rot{ top:auto; bottom:104px; right:calc(14% + 28px); }
  [dir="rtl"] .lp-globe-wrap .lp-rot{ right:12px; }
}
.lp-veil{position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(90deg,var(--h-bg) 0%,var(--h-bg) 24%,transparent 52%)}
.lp-hero__grid{position:relative;z-index:5;min-height:100vh;display:grid;grid-template-columns:minmax(430px,46%) 1fr;align-items:center;padding:100px 0 64px;pointer-events:none}
.lp-hero__copy{padding:0 28px 0 56px;max-width:660px;pointer-events:auto}
.lp-systag{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;letter-spacing:.16em;color:var(--lp-green);
  border:1px solid rgba(18,169,104,.35);background:rgba(18,169,104,.08);padding:7px 12px;border-radius:6px;margin-bottom:14px;text-transform:uppercase}
.lp-pulse{width:7px;height:7px;border-radius:50%;background:var(--lp-green-bright);animation:lp-pulse 1.6s infinite}
@keyframes lp-pulse{0%{box-shadow:0 0 0 0 rgba(18,169,104,.5)}70%{box-shadow:0 0 0 9px rgba(18,169,104,0)}100%{box-shadow:0 0 0 0 rgba(18,169,104,0)}}
.lp-h1{font-weight:800;font-size:clamp(32px,4.2vw,56px);line-height:1.08;letter-spacing:-.01em;margin:0 0 14px;color:var(--h-ink);transition:color .8s}
.lp-h1__thin{font-weight:300;color:var(--h-dim);transition:color .8s}
.lp-grad-live{background:linear-gradient(120deg,#1860A8 0%,#4878A8 25%,#A890A8 50%,#184890 75%,#1860A8 100%);background-size:300% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:lp-gradpan 7s linear infinite}
@keyframes lp-gradpan{to{background-position:300% 0}}
.lp-hero.space .lp-grad-live{background-image:linear-gradient(120deg,#8FBCE8 0%,#F1C9AE 30%,#A890A8 55%,#8FBCE8 100%)}
.lp-liveline{display:flex;align-items:center;gap:10px;font-size:12.5px;font-weight:600;letter-spacing:.05em;color:var(--h-dim);min-height:24px;margin-bottom:20px;text-transform:uppercase;transition:color .8s}
.lp-liveline__tag{flex:none;color:#fff;background:var(--ag-gradient-logo);border-radius:5px;padding:3px 8px;font-size:9px;letter-spacing:.14em}
.lp-liveline__caret{flex:none;width:8px;height:15px;background:var(--ag-color-logo-blue);animation:lp-caret 1s step-end infinite}
@keyframes lp-caret{50%{opacity:0}}
.lp-sub{color:var(--h-dim);font-size:15.5px;line-height:1.65;max-width:48ch;margin:0 0 22px;transition:color .8s}
.lp-sub b{color:var(--h-ink);font-weight:600}
.lp-search{display:flex;align-items:center;background:rgba(255,255,255,.96);border:1px solid var(--lp-line);border-radius:12px;
  padding:6px 6px 6px 18px;max-width:520px;box-shadow:0 14px 34px rgba(16,33,63,.14);margin-bottom:20px;color:var(--lp-ink)}
.lp-search svg{flex:none;opacity:.45}
.lp-search input{flex:1;border:none;outline:none;background:none;font-family:inherit;font-size:14.5px;color:var(--lp-ink);padding:9px 12px;min-width:0}
.lp-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:24px}
.lp-actions--center{justify-content:center;margin-top:26px}
.lp-stats{display:flex;gap:34px;flex-wrap:wrap}
.lp-stat b{display:block;font-weight:800;font-size:24px;color:var(--h-accent);line-height:1.1;transition:color .8s}
.lp-stat span{font-size:10px;font-weight:600;letter-spacing:.12em;color:var(--h-faint);text-transform:uppercase;transition:color .8s}
.lp-hint{margin-top:18px;font-size:10.5px;font-weight:500;letter-spacing:.16em;color:var(--h-faint);text-transform:uppercase;transition:color .8s}
.lp-hint b{color:var(--h-accent)}

/* floating cluster (positions set by landing_v2.js; cards use production .l-fr) */
.lp-stage{position:absolute;right:20px;top:96px;bottom:110px;z-index:6;width:392px;pointer-events:none}
.lp-stage__head{font-size:10.5px;font-weight:600;letter-spacing:.2em;color:var(--h-faint);display:flex;justify-content:space-between;padding:0 6px;margin-bottom:10px;text-transform:uppercase;transition:color .8s}
.lp-stage__body{position:relative;height:calc(100% - 26px)}
.lp-stage .l-fr{pointer-events:auto;border:1px solid rgba(255,255,255,.35)}
.lp-stage .l-fr .lp-swap{transition:opacity .3s}
.lp-stage .l-fr.swapping .lp-swap{opacity:.1}
.lp-chip{position:absolute;pointer-events:auto;display:flex;gap:10px;align-items:center;background:var(--h-card);backdrop-filter:blur(10px);
  border:1px solid var(--h-line);border-left:3px solid var(--ag-color-logo-blue);border-radius:10px;padding:9px 12px;box-shadow:0 10px 26px rgba(16,33,63,.14);
  cursor:pointer;max-width:250px;transition:background .8s,border-color .8s,opacity .3s}
.lp-chip__t{font-size:8.5px;font-weight:700;letter-spacing:.14em;color:var(--h-faint);display:block;margin-bottom:2px;text-transform:uppercase}
.lp-chip__b{font-size:11.5px;line-height:1.35;color:var(--h-ink);display:block}
.lp-chip__b b{color:var(--h-accent)}
.lp-chip__th{flex:none;width:30px;height:40px;border-radius:6px;background-size:cover;background-position:center;border:1px solid var(--h-line)}
.lp-story{position:absolute;pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:5px}
.lp-story__ring{width:58px;height:58px;border-radius:50%;padding:3px;background:conic-gradient(from 210deg,#1860A8,#4878A8,#A890A8,#1860A8)}
.lp-story__ph{width:100%;height:100%;border-radius:50%;border:2.5px solid #fff;background-size:cover;background-position:center}
.lp-story__lb{font-size:8.5px;font-weight:600;letter-spacing:.12em;color:var(--h-faint);background:var(--h-card);border:1px solid var(--h-line);border-radius:5px;padding:3px 7px;text-transform:uppercase}

/* atmosphere toggle + scroll hint + ticker */
.lp-atmo{position:absolute;z-index:7;right:28px;bottom:56px;display:flex;align-items:center;font-size:10.5px;font-weight:600;letter-spacing:.14em;
  border:1px solid var(--h-line);border-radius:8px;overflow:hidden;background:var(--h-card);backdrop-filter:blur(10px);text-transform:uppercase;transition:background .8s}
.lp-atmo span{padding:9px 8px 9px 13px;color:var(--h-faint)}
.lp-atmo button{font-family:inherit;font-size:10.5px;font-weight:600;letter-spacing:.12em;padding:9px 13px;border:none;cursor:pointer;background:transparent;color:var(--h-dim);text-transform:uppercase}
.lp-atmo button.on{background:var(--ag-gradient-logo);color:#fff}
.lp-scrollhint{position:absolute;z-index:7;bottom:52px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;
  font-size:9.5px;font-weight:600;letter-spacing:.22em;color:var(--h-faint);text-transform:uppercase;transition:opacity .4s;animation:l-bob 2.2s ease-in-out infinite;pointer-events:none}
.lp-ticker{position:absolute;bottom:0;left:0;right:0;z-index:6;border-top:1px solid var(--h-line);background:var(--h-card);backdrop-filter:blur(10px);overflow:hidden;height:40px;display:flex;align-items:center;transition:background .8s}
.lp-ticker__inner{display:flex;gap:54px;white-space:nowrap;animation:lp-tick 46s linear infinite;font-size:11px;font-weight:500;letter-spacing:.1em;color:var(--h-dim);text-transform:uppercase;transition:color .8s}
@keyframes lp-tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* map pins + popups */
.lp-pin{position:absolute;width:14px;height:14px;cursor:pointer}
.lp-pin::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--ag-color-logo-blue);border:2.5px solid #fff;box-shadow:0 2px 10px rgba(16,40,80,.4)}
.lp-pin::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:2px solid rgba(24,96,168,.55);animation:lp-pinring 2.2s ease-out infinite}
@keyframes lp-pinring{0%{transform:scale(.5);opacity:1}100%{transform:scale(1.6);opacity:0}}
.lp-pin__lbl{position:absolute;left:20px;top:-4px;white-space:nowrap;font-size:9.5px;font-weight:600;letter-spacing:.12em;
  background:rgba(255,255,255,.94);color:var(--lp-ink);border:1px solid rgba(16,43,84,.16);border-radius:5px;padding:4px 8px;box-shadow:0 3px 12px rgba(16,33,63,.14);text-transform:uppercase}
.lp-pin--dot .lp-pin__lbl{display:none}
.lp-hero .mapboxgl-popup-content{font-family:inherit;border-radius:12px;box-shadow:0 12px 34px rgba(16,33,63,.22);padding:10px;width:200px}
.lp-pop__img{width:100%;height:96px;border-radius:8px;background-size:cover;background-position:center;margin-bottom:8px}
.lp-pop__t{font-weight:600;font-size:13px;color:var(--lp-ink)}
.lp-pop__s{font-size:11.5px;color:var(--lp-dim);margin-top:2px}
.lp-pop__a{display:inline-block;margin-top:8px;font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--ag-color-logo-blue);text-decoration:none;border-bottom:1.5px solid var(--ag-color-logo-sky);text-transform:uppercase}
.mapboxgl-scroll-zoom-blocker,.mapboxgl-touch-pan-blocker{font-family:inherit!important;font-size:12.5px!important;background:rgba(10,18,36,.72)!important}

/* sections */
/* width:100% is load-bearing: the global styles.css sets body{display:flex;
   flex-direction:column}, under which `margin:0 auto` alone makes a section
   shrink to its content width instead of filling. width:100% forces full
   width, then max-width caps and the auto margins centre it. */
.lp-section{position:relative;padding:104px 56px;width:100%;max-width:1280px;margin:0 auto;box-sizing:border-box}
.lp-label{font-size:11px;font-weight:700;letter-spacing:.24em;color:var(--ag-color-logo-blue);text-transform:uppercase;margin-bottom:16px;display:flex;align-items:center;gap:12px}
.lp-label::before{content:"";width:34px;height:1px;background:var(--ag-color-logo-blue)}
.lp-h2{font-weight:700;font-size:clamp(24px,3vw,40px);line-height:1.2;max-width:24ch;color:var(--lp-ink);letter-spacing:-.01em;margin:0}
.lp-lead{color:var(--lp-dim);font-size:15.5px;line-height:1.7;max-width:58ch;margin-top:16px}
.lp-lead b{color:var(--lp-ink)}
.lp-instruments{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:52px}
.lp-inst{background:#fff;border:1px solid var(--lp-line);border-radius:16px;padding:26px 22px 28px;display:flex;flex-direction:column;transition:.25s;box-shadow:0 4px 18px rgba(16,33,63,.05)}
.lp-inst:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(16,33,63,.12)}
.lp-inst__no{font-size:10px;font-weight:600;color:var(--lp-faint);letter-spacing:.16em;margin-bottom:28px;display:flex;justify-content:space-between;text-transform:uppercase}
.lp-inst__no .lp-live{color:var(--lp-green)}
.lp-inst__viz{height:122px;margin-bottom:22px;position:relative}
.lp-inst h3{font-weight:700;font-size:15.5px;margin:0 0 10px;letter-spacing:.04em}
.lp-inst p{color:var(--lp-dim);font-size:13.5px;line-height:1.65;flex:1;margin:0}
.lp-inst p b{color:var(--lp-ink)}
.lp-inst a{display:inline-block;margin-top:15px;font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--ag-color-logo-blue);text-decoration:none;text-transform:uppercase}
.lp-rings{display:flex;align-items:center;justify-content:center;gap:14px;height:100%}
.lp-ring{width:64px;height:64px;border-radius:50%;padding:3px;background:conic-gradient(from 210deg,#1860A8,#4878A8,#A890A8,#1860A8)}
.lp-ring__ph{width:100%;height:100%;border-radius:50%;border:2.5px solid #fff;background-size:cover;background-position:center}
.lp-ring--empty{width:64px;height:64px;border-radius:50%;border:2px dashed rgba(16,43,84,.25);display:grid;place-items:center;color:var(--lp-faint);font-size:20px;font-weight:300}
.lp-ring--empty.lp-dim{opacity:.55}
.lp-ringwrap{text-align:center}
.lp-ringwrap__nm{font-size:9px;font-weight:600;letter-spacing:.08em;color:var(--lp-faint);margin-top:6px;max-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lp-covers{display:flex;gap:8px;justify-content:center;padding-top:4px}
.lp-cover{width:56px;height:94px;border-radius:10px;position:relative;overflow:hidden;border:1px solid rgba(16,43,84,.14);box-shadow:0 8px 20px rgba(16,33,63,.14);background-size:cover;background-position:center}
.lp-cover:nth-child(1){transform:rotate(-5deg) translateY(6px)}
.lp-cover:nth-child(2){z-index:2;transform:translateY(-2px)}
.lp-cover:nth-child(3){transform:rotate(5deg) translateY(6px)}
.lp-comm{background:#F4F8FD;border:1px solid var(--lp-line);border-radius:12px;padding:12px 13px}
.lp-comm__top{display:flex;align-items:center;gap:9px;margin-bottom:7px}
.lp-comm__av{width:30px;height:30px;border-radius:9px;background:var(--ag-gradient-logo);color:#fff;display:grid;place-items:center;font-weight:700;font-size:14px}
.lp-comm__nm{font-weight:600;font-size:13.5px;color:var(--lp-ink);display:block}
.lp-comm__meta{font-size:9.5px;font-weight:600;color:var(--lp-faint);letter-spacing:.06em;text-transform:uppercase;display:block}
.lp-comm__pv{font-size:11.5px;color:var(--lp-dim);font-style:italic;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.lp-book{background:#F4F8FD;border:1px solid var(--lp-line);border-radius:12px;padding:11px 14px}
.lp-book__row{display:flex;justify-content:space-between;font-size:10px;font-weight:600;color:var(--lp-dim);letter-spacing:.05em;padding:4.5px 0;border-bottom:1px dashed rgba(16,43,84,.14);text-transform:uppercase}
.lp-book__row:last-child{border:none}
.lp-book__row .ok{color:var(--lp-green);font-weight:700}
.lp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;margin-top:60px;counter-reset:lpstep}
.lp-step{position:relative;padding-top:26px;border-top:1.5px solid rgba(16,43,84,.16)}
.lp-step::before{counter-increment:lpstep;content:"0" counter(lpstep);position:absolute;top:-13px;left:0;font-size:11px;font-weight:700;color:var(--ag-color-logo-blue);background:var(--lp-bg);padding-right:12px;letter-spacing:.18em}
.lp-step h3{font-size:16.5px;font-weight:700;margin:0 0 10px}
.lp-step p{color:var(--lp-dim);font-size:14px;line-height:1.7;margin:0}
/* Full-bleed section; the dawn glow is a background gradient sized in % so it
   always scales with the viewport (no fixed-px blob that boxes on wide screens). */
.lp-gatecta{text-align:center;padding:130px 56px 150px;max-width:none;position:relative;
  background:radial-gradient(120% 300px at 50% 100%,rgba(72,120,168,.16),rgba(24,96,168,.05) 50%,transparent 76%)}
.lp-gatecta .lp-h2{margin:0 auto 18px;max-width:20ch}
/* the shared .lp-lead has max-width:58ch and no side margins (left-aligned
   section intros elsewhere); centre it inside the centered gate CTA */
.lp-gatecta .lp-lead{margin-left:auto;margin-right:auto}

/* RTL mirroring */
[dir="rtl"] .lp-hero__copy{padding:0 56px 0 28px}
[dir="rtl"] .lp-veil{background:linear-gradient(270deg,var(--h-bg) 0%,var(--h-bg) 24%,transparent 52%)}
[dir="rtl"] .lp-globe-wrap{left:-14%;right:14%}
[dir="rtl"] .lp-stage{right:auto;left:20px}
[dir="rtl"] .lp-atmo{right:auto;left:28px}
[dir="rtl"] .lp-search{padding:6px 18px 6px 6px}
[dir="rtl"] .lp-pin__lbl{left:auto;right:20px}
[dir="rtl"] .lp-step::before{left:auto;right:0;padding-right:0;padding-left:12px}

/* responsive */
/* ≤1080px: single column. The globe stops being a right-half backdrop and
   becomes a real content band under the copy (fixes text-over-globe overlap
   and the right-edge overflow from the desktop `right:-14%` position). */
@media (max-width:1080px){
  .lp-hero{display:flex;flex-direction:column;min-height:auto}
  .lp-hero__grid{order:1;min-height:auto;grid-template-columns:1fr;padding:92px 0 20px;align-items:start}
  .lp-hero__copy{padding:0 24px}
  .lp-globe-wrap{order:2;position:relative;top:auto;bottom:auto;left:auto;right:auto;
    width:100%;max-width:460px;height:min(86vw,400px);min-height:300px;margin:0 auto}
  .lp-veil{display:none}
  .lp-stage{display:none}
  .lp-scrollhint{display:none}
  .lp-atmo{order:3;position:relative;top:auto;bottom:auto;right:auto;left:auto;align-self:center;margin:16px auto 4px}
  .lp-ticker{order:4;position:relative;bottom:auto}
  .lp-instruments{grid-template-columns:1fr 1fr}
  .lp-steps{grid-template-columns:1fr}
  .lp-section{padding:80px 28px}
  .lp-nav__links{display:none}
  [dir="rtl"] .lp-globe-wrap{left:auto;right:auto}
}
@media (max-width:640px){
  .lp-instruments{grid-template-columns:1fr}
  .lp-nav{padding:0 18px}
  .lp-hero__copy{padding:0 18px}
  .lp-section{padding:64px 20px}
  .lp-stats{gap:22px}
  .lp-search{max-width:none}
}

/* reduced motion */
@media (prefers-reduced-motion:reduce){
  .lp-grad-live,.lp-pulse,.lp-liveline__caret,.lp-scrollhint,.lp-ticker__inner,.lp-pin::after{animation:none!important}
  .lp-stage .l-fr,.lp-chip,.lp-story{animation:none!important}
}
