/* Approved hero, scoped so the full-page cards and typography retain their styles. */
.hero.slab{color:var(--hf)}
.hero{--hf:rgba(255,255,255,.94);--hm:rgba(255,255,255,.68);--ht:rgba(255,255,255,.44);--hl:rgba(201,196,244,.16);--hring:rgba(201,196,244,.26);--hpanel:rgba(255,255,255,.05);--ink:#1B1D4A;--line2:#D5D2EC;--faint:#9A9CBB;--ok-deep:#177B57;--ok-bg:#E9F7F1;--ok-line:#CBEBDD;color:var(--hf)}
.day .hero{--hf:#1B1D4A;--hm:#62658C;--ht:rgba(98,101,140,.72);--hl:rgba(27,29,74,.1);--hring:rgba(79,70,229,.28);--hpanel:rgba(255,255,255,.62);background:radial-gradient(rgba(79,70,229,.2) 1px,transparent 1.3px) 0 0/22px 22px,linear-gradient(160deg,#F2F3FF 0%,#D8D5F6 100%)}
.hero .hnav{color:var(--hm)}
.hero .hnav nav,.hero .hnav .login{color:var(--hm)}
.hero .hnav a:hover{color:var(--hf)}
.hero .btn.pri:hover{color:var(--white)}
.hero .btn.ghost{color:var(--hf);box-shadow:inset 0 0 0 1px var(--hring)}
.hero .btn.ghost:hover{background:var(--hl)}
.hero .btn.ghost .arr{background:var(--hl)}
.hero .hgrid{padding-bottom:clamp(56px,6vw,84px)}
.hero .hgrid>*{min-width:0}
.hero .pillb{background:var(--hpanel);color:var(--hm);box-shadow:inset 0 0 0 1px var(--hl)}
.day .hero .pillb em{background:var(--ok-bg);color:var(--ok-deep)}
.hero .chipw{display:inline-block;padding:0 .16em .05em;margin-left:-.06em;border-radius:.2em;color:var(--tint1);background:linear-gradient(180deg,rgba(165,148,255,.32),rgba(99,102,241,.22));box-shadow:inset 0 0 0 1px rgba(165,148,255,.5)}
.day .hero .chipw{color:var(--deep);background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,.45));box-shadow:inset 0 0 0 1px rgba(99,102,241,.45)}
.hero .sub{color:var(--ht)}
.hero .sub em{color:var(--hf)}
.hero .offer{color:var(--hm)}
.hero .offer li{box-shadow:inset 0 0 0 1px var(--hl)}
.hero .strip,.hero .strip div{border-color:var(--hl)}
.hero .strip dt{color:var(--ht)}
.hero .stage{position:relative;justify-self:end;width:100%;aspect-ratio:52/45;border-radius:26px}
/* The lab palettes set the actual 3D materials; preserve their colors instead
   of applying the old day-mode brightness/saturation approximation. */
.day #lineup-stage .logo-visual[data-logo-palette] :is(.logo-gl,.logo-dither){filter:drop-shadow(var(--logo-shadow-x,0px) var(--logo-shadow-y,18px) var(--logo-shadow-blur,14px) rgba(27,29,74,.25))}
.hero .fc{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:9px;padding:7px 14px 7px 7px;border-radius:999px;background:var(--white);color:var(--ink);font:500 13.5px/1 var(--sans);letter-spacing:-.01em;white-space:nowrap}
.hero .fc i{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;flex:none}
.hero .fc i .ic{width:12px;height:12px;stroke-width:2.4}
.hero .fc.done i{color:var(--ok-deep)}
.hero .fc.now{color:var(--white)}
.hero .fc.now i{background:rgba(255,255,255,.2)}
.hero .fc.now i::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--white)}
.hero .fc.next i::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--faint)}
/* An open, staggered orbit: keep the active shipment in front and give the
   supporting statuses smaller faces, thinner edges, and quieter shadows. */
#lineup-stage[data-pill-layout="orbit"] .fc:not(.now){font-size:12px;--pill-step:1.2px;--pill-edge-dark:#9B97B3}
#lineup-stage[data-pill-layout="orbit"] .fc:not(.now) .pill-face{padding:6px 12px 6px 6px;gap:8px}
#lineup-stage[data-pill-layout="orbit"] .fc:not(.now) i{width:22px;height:22px}
#lineup-stage[data-pill-layout="orbit"] .fc:not(.now) .pill-edge:nth-child(5){box-shadow:0 1px 0 var(--pill-edge-dark),0 1px 2px rgba(27,29,74,.12),calc(var(--pill-shadow-x,1px) * .5) calc(var(--pill-shadow-y,10px) * .55) calc(var(--pill-shadow-blur,19px) * .75) -5px rgba(27,29,74,.2)}
#lineup-stage[data-pill-layout="orbit"] .fc.now{font-size:11px;--pill-step:1.4px}
#lineup-stage[data-pill-layout="orbit"] .fc.now .pill-face{padding:5px 10px 5px 5px;gap:6px}
#lineup-stage[data-pill-layout="orbit"] .fc.now i{width:18px;height:18px}
#lineup-stage[data-pill-layout="orbit"] .fc.now i::before{width:6px;height:6px}
#lineup-stage[data-pill-layout="orbit"] .fc.f1{left:1%;top:14%}
#lineup-stage[data-pill-layout="orbit"] .fc.f2{right:2%;top:20%}
#lineup-stage[data-pill-layout="orbit"] .fc.f3{left:3%;bottom:13%}
#lineup-stage[data-pill-layout="orbit"] .fc.f4{right:3%;top:74%;bottom:auto;--pill-step:1px}
#lineup-stage[data-pill-layout="orbit"] .fc.f4 .pill-edge:nth-child(5){box-shadow:0 1px 0 var(--pill-edge-dark),0 5px 12px -5px rgba(27,29,74,.16)}
@media(min-width:981px) and (max-width:1200px){#lineup-stage[data-pill-layout="orbit"] .fc:not(.now){font-size:10px}#lineup-stage[data-pill-layout="orbit"] .fc:not(.now) .pill-face{padding:5px 9px 5px 5px;gap:6px}#lineup-stage[data-pill-layout="orbit"] .fc:not(.now) i{width:19px;height:19px}}
@media(max-width:560px),(min-width:981px) and (max-width:1200px){
  #lineup-stage[data-pill-layout="orbit"] .fc.now{font-size:10px;--pill-step:.9px}
  #lineup-stage[data-pill-layout="orbit"] .fc.now .pill-face{padding:4px 8px 4px 4px;gap:5px}
  #lineup-stage[data-pill-layout="orbit"] .fc.now i{width:16px;height:16px}
}
@media(max-width:560px){
  #lineup-stage[data-pill-layout="orbit"] .fc:not(.now){font-size:10px;--pill-step:.9px}
  #lineup-stage[data-pill-layout="orbit"] .fc:not(.now) .pill-face{padding:4px 8px 4px 4px;gap:5px}
  #lineup-stage[data-pill-layout="orbit"] .fc:not(.now) i{width:18px;height:18px}
  #lineup-stage[data-pill-layout="orbit"] .fc.f1{left:0;top:10%}
  #lineup-stage[data-pill-layout="orbit"] .fc.f2{right:0;top:25%}
  #lineup-stage[data-pill-layout="orbit"] .fc.f3{left:2%;bottom:14%}
  #lineup-stage[data-pill-layout="orbit"] .fc.f4{right:0;top:96%}
  .hero .motion-caption{margin-top:36px}
}
.hero .hnav .menu{appearance:none;border:0;padding:0;background:transparent;color:var(--hf);cursor:pointer;width:44px;height:44px;box-shadow:inset 0 0 0 1px var(--hring)}
.hero .hnav .menu span{background:currentColor;box-shadow:0 6px 0 currentColor}
.hero .mobile-nav{position:absolute;z-index:10;top:64px;left:14px;right:14px;padding:12px;background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 40px rgba(10,6,50,.2)}
.hero .mobile-nav a{display:flex;align-items:center;min-height:44px;padding:8px 12px;border-radius:8px;color:#1B1D4A}
.hero .mobile-nav a:hover{background:rgba(99,102,241,.12)}
[data-theme="dark"] .hero .mobile-nav{background:#211C45;border-color:rgba(201,196,244,.25)}
[data-theme="dark"] .hero .mobile-nav a{color:#F2F3FF}
@media(min-width:861px){.hero .mobile-nav{display:none}}
@media(max-width:860px){.hero .hnav .menu{display:grid;margin-left:16px}.hero .hnav .nr{margin-left:auto}.hero .hnav{padding-top:52px;padding-bottom:12px}.hero .mobile-nav{top:110px}}
@media(max-width:640px){.hero .hnav{padding-top:0;padding-bottom:0;min-height:60px}.hero .hnav .nr{display:none}.hero .hnav .menu{margin-left:auto}.hero .mobile-nav{top:64px}.notchbar{align-items:flex-start}.notchbar .notch{margin-left:24px}.notchbar .nchip{margin-left:24px}}
@media(max-width:400px){.hero .hgrid{padding-inline:16px}.hero .h1{font-size:clamp(2.5rem,13vw,3rem)}}