html{scroll-behavior:smooth}@font-face{font-family:'Space Grotesk';src:url('/assets/lander/SpaceGrotesk-VariableFont_wght.ttf') format('truetype');font-weight:300 700;font-display:swap}
body{margin:0;background:#f1f0fb;font-family:'Inter','Gantari',sans-serif}
h1,h2{-webkit-text-stroke:.5px currentColor}
a{color:#191830;text-decoration:none}a:hover{color:#6353dd}
details summary::-webkit-details-marker{display:none}
[data-anim="off"] *{animation-play-state:paused !important}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
@keyframes floatyR{0%,100%{transform:rotate(-10deg) translateY(0)}50%{transform:rotate(-7deg) translateY(-10px)}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes march{from{background-position:0 0}to{background-position:18px 0}}
@keyframes caret{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes travel{0%{transform:translateX(0);opacity:0}6%{opacity:1}94%{opacity:1}100%{transform:translateX(944px);opacity:0}}
@keyframes ringspin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes counterspin{from{transform:rotate(0deg)}to{transform:rotate(-360deg)}}
@keyframes travelWide{0%{transform:translateX(-220px)}100%{transform:translateX(calc(100vw + 80px))}}
@keyframes cloudDrift{0%{transform:translateX(-160px)}100%{transform:translateX(1440px)}}
@keyframes twinkleStar{0%,100%{opacity:.15}50%{opacity:1}}
@keyframes floatSoft{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes assetIn{from{opacity:0}to{opacity:1}}
@keyframes travelLine{0%{left:0;opacity:0}6%{opacity:1}94%{opacity:1}100%{left:100%;opacity:0}}
@keyframes pulseRing{0%{transform:scale(.75);opacity:.9}100%{transform:scale(1.45);opacity:0}}
@keyframes truckDriveDay{0%{left:-14%}100%{left:104%}}
@keyframes truckDriveNight{0%{left:-12%}100%{left:104%}}
@keyframes cloudSway{0%,100%{transform:translate(0,0)}50%{transform:translate(14px,-6px)}}
@keyframes cloudBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

@media (max-width:1023px){
[data-screen-label]:not(.rmd-hero):not([data-screen-label="Proof marquee"]):not([data-screen-label="Final CTA + Footer"]){padding-left:22px !important;padding-right:22px !important}
[data-screen-label].rmd-nav{padding:12px 18px !important}
.rmd-root{min-width:0 !important}
.rmd-navlinks{display:none !important}
.rmd-stage{display:contents !important}
.rmd-hero{display:flex !important;flex-direction:column !important}
.rmd-herocopy{position:static !important;order:-1;width:auto !important;max-width:560px;margin:0 auto !important;padding:30px 22px 24px;box-sizing:border-box}
h1{font-size:clamp(30px,8.4vw,46px) !important;letter-spacing:-1.2px !important}
h2{font-size:clamp(26px,6.4vw,34px) !important;letter-spacing:-.8px !important}
.rmd-sechead{flex-direction:column !important;align-items:flex-start !important;gap:14px}
.rmd-g3,.rmd-g2,.rmd-bento,.rmd-cgrid,.rmd-frow,.rmd-artgrid{grid-template-columns:1fr !important}
.rmd-vs,.rmd-g2x{grid-template-columns:1fr !important}
.rmd-vslabel{justify-self:center}
.rmd-tablewrap{border-radius:18px !important}
.rmd-feature{grid-template-columns:1fr !important}
.rmd-featart{min-height:200px !important;order:-1}
.rmd-featart img{width:32% !important;bottom:12% !important;right:8% !important}
.rmd-feature>div:first-child{padding:26px 22px !important}
.rmd-feature h2{font-size:26px !important}
.rmd-sub{padding:24px 22px !important}
.rmd-toc{position:static !important;flex-direction:row !important;flex-wrap:wrap;gap:8px !important}
.rmd-toc>div{display:none !important}
.rmd-toc>a{border-left:none !important;padding:6px 12px !important;background:#f1f0fb;border-radius:999px;font-size:12.5px !important}
.rmd-bento>div{grid-row:auto !important}
.rmd-bentorow{flex-direction:column}
.rmd-g6{grid-template-columns:repeat(3,1fr) !important}
.rmd-console{grid-template-columns:1fr !important}
.rmd-console>div:first-child{border-right:none !important;border-bottom:1px solid #e4e1f5}
.rmd-tblwrap{overflow-x:auto !important}
.rmd-tblrow{min-width:560px}
.rmd-stations{flex-wrap:wrap;justify-content:center !important;gap:22px;margin-top:14px !important}
.rmd-dot{display:none !important}
.rmd-ctarow{flex-wrap:wrap}
.rmd-toast{font-size:clamp(8px,1.7vw,12px) !important;padding:1vw 1.8vw !important;gap:1vw !important;box-shadow:0 3px 0 #7a63f0,0 8px 14px rgba(0,0,0,.4) !important}
.rmd-nchip{font-size:clamp(7px,1.6vw,11px) !important;padding:.9vw 1.6vw !important;border-width:1px !important;box-shadow:0 0 0 2px rgba(122,108,240,.25),0 4px 9px rgba(0,0,0,.5) !important}
.rmd-daychip{width:15% !important}
.rmd-foot{grid-template-columns:1fr 1fr !important;gap:26px !important}
}

@media (max-width:1023px){
.rmd-stage{-webkit-mask-image:none !important;mask-image:none !important;max-width:100% !important}
.rmd-fpill{position:static !important;display:block !important;width:130px !important;margin:18px auto 0 !important}
.rmd-fbanner{display:none !important}
.rmd-fcta{position:static !important;padding:26px 22px 4px}
.rmd-fcta p{font-size:14px !important;max-width:420px !important;margin:12px auto 0 !important}
.rmd-fcta h2 span{border-radius:12px !important;padding:2px 12px 4px !important;margin-top:6px !important}
.rmd-fcta .rmd-ctarow{gap:10px !important;margin-top:16px !important}
.rmd-fcta a{font-size:14px !important;padding:12px 20px !important;border-width:1.5px !important}
[data-screen-label="Final CTA + Footer"] .rmd-stage{display:flex !important;flex-direction:column !important;align-items:stretch !important}
.rmd-fcol{position:static !important;display:flex !important;flex-direction:column;width:auto !important;flex:1 1 0 !important;min-width:0;height:auto !important;box-sizing:border-box;padding:14px 8px 4px 22px;gap:8px !important;justify-content:flex-start !important;order:3}
.rmd-fbrand{order:2;flex:none !important;width:100% !important;padding:8px 22px 4px !important;align-items:center !important;text-align:center !important}
.rmd-fbrand>div{justify-content:center !important;gap:12px !important;flex-wrap:wrap}
.rmd-fcta{order:1}
.rmd-fbadge{order:4}
.rmd-flinks{display:flex !important;width:100%;order:3}
.rmd-cert{gap:9px !important;padding:10px 13px !important;border-radius:16px !important}
.rmd-seal{padding:0 !important;background:none !important;box-shadow:none !important;align-self:center}
.rmd-seal img{height:74px !important}
.rmd-cert svg{width:30px !important;height:30px !important}
.rmd-cert span span:first-child{font-size:14px !important}
.rmd-cert span span:last-child{font-size:9.5px !important}
.rmd-fcol:first-of-type div span{font-size:18px !important}
.rmd-fcol:first-of-type div div{width:16px !important;height:16px !important}
.rmd-fcol p{font-size:13px !important}
.rmd-fcol>span{font-size:11px !important;padding:4px 12px !important;letter-spacing:.1em !important}
.rmd-fcol a{font-size:13.5px !important;gap:7px !important}
.rmd-fcol a>span{width:6px !important;height:6px !important}
.rmd-fcol>div{font-size:11px !important}
.rmd-fbadge{position:static !important;float:none !important;font-size:11px !important;padding:6px 14px !important;border-width:1px !important;width:fit-content !important;max-width:calc(100% - 44px);box-sizing:border-box;white-space:nowrap;align-self:flex-start !important;margin:14px 0 8px 22px !important}
.rmd-fbadge:last-child{align-self:flex-end !important;margin:0 22px 20px 0 !important}
[data-screen-label="Final CTA + Footer"]{padding-bottom:8px;overflow:hidden}
.rmd-fcta{padding-top:8px !important}
}

@media (max-width:640px){
.rmd-cband{padding:52px 22px 62px !important}
.rmd-cband img[src*="cloud"]{width:22% !important}
.rmd-cband img[src*="mascot"],.rmd-cband img[src*="footer-pill"]{width:20% !important;right:5% !important}
.rmd-cband h1{font-size:clamp(30px,8.6vw,40px) !important}
.rmd-cband p{font-size:15.5px !important;max-width:100% !important}
.rmd-cform{padding:22px !important;border-radius:20px !important}
.rmd-cform>div:first-child{font-size:21px !important}
.rmd-cform button{width:100% !important;justify-content:center}
.rmd-cform>div:last-child{flex-direction:column-reverse !important;align-items:stretch !important;gap:12px !important}
.rmd-cform>div:last-child>span{text-align:center}
.rmd-cgrid{gap:20px !important}
}
@media (max-width:560px){
.rmd-g6{grid-template-columns:repeat(2,1fr) !important}
}

/* --- generated from style-hover (dc-runtime createPseudoSheet) --- */
.rh0:hover{transform:translateY(-1px) !important;box-shadow:0 12px 26px rgba(99,83,221,.5) !important}
.rh1:hover{transform:translate(-1px,-1px) !important;box-shadow:3px 3px 0 #191830 !important}
.rh2:hover{transform:translateY(-1px) !important;box-shadow:0 12px 26px rgba(255,201,61,.4) !important}
.rh3:hover{transform:translate(-1px,-1px) !important;box-shadow:0 8px 18px rgba(0,0,0,.5) !important}
.rh4:hover{transform:translateY(-2px) !important}
.rh5:hover{background:rgba(99,83,221,.5) !important}
.rh6:hover{color:#ffc93d !important}

/* --- retheme of the legacy editorial vocabulary -----------------------------
   remedora.css is fully variable-driven, so the legacy pages adopt the new
   design's palette and type by overriding its tokens. Scene palettes map to
   the new system: light sections go lavender/white, dark sections go the two
   design navies, accents become the design purple/yellow. Loaded AFTER
   remedora.css. */
:root{
  --bone:#f1f0fb; --bone-2:#e9e6f8;
  --ink:#191830; --ink-2:#3a3757; --ink-3:#6f6c90;

  --s1-bg:#eae9fa; --s1-fg:#191830; --s1-accent:#6353dd;
  --s2-bg:#191830; --s2-fg:#e6e4f7; --s2-accent:#ffc93d;
  --s3-bg:#232248; --s3-fg:#e6e4f7; --s3-accent:#8a7bff;
  --s4-bg:#fdfdff; --s4-fg:#191830; --s4-accent:#6353dd;
  --s5-bg:#0b0d38; --s5-fg:#e6e4f7; --s5-accent:#ffc93d;
  --op-bg:#f6f5fd; --op-fg:#191830; --op-accent:#6353dd;

  --font-display:'Space Grotesk','Bricolage Grotesque',sans-serif;
  --font-sans:'Inter','Gantari',sans-serif;
}
/* The serif display face carried real italics; Space Grotesk and Inter have
   none, and the faux-oblique the browser synthesizes looks broken. The new
   type system uses no italics anywhere, and the slant comes from dozens of
   rules — 44 in remedora.css plus more in per-page embedded <style> blocks
   (chapter indexes, plate captions, ledger bars), so enumerating selectors is
   a losing game. Kill it globally; emphasis is carried by each scene's em
   color rule, which already resolves to the rethemed scene accent (yellow on
   dark scenes, purple on light ones). */
body *,body *::before,body *::after{font-style:normal !important}
/* Weight normalization (owner report, 2026-08-27): the serif display face
   was set at 300-400 weights across the legacy scenes; Space Grotesk at
   those weights reads skeletal next to the homepage's 700-800 headings.
   Pull display type up to the homepage weight vocabulary, and clear the
   Fraunces-specific variation axes (opsz/SOFT) some scenes still declare.
   !important because per-page embedded <style> blocks come after this
   sheet in the head and would win at equal specificity. */
h1,h2{font-weight:700 !important;font-variation-settings:normal !important}
h1 em,h2 em,h3 em{font-weight:inherit !important}
.lede,.deck{font-weight:500 !important}
/* Design-language buttons: filled pills with the design's shadow. */
.btn{background:#6353dd;color:#fff;box-shadow:0 10px 22px rgba(99,83,221,.35)}
.btn.ghost{background:#fff;color:#191830;border:1.5px solid #d5cff2;box-shadow:0 8px 20px rgba(25,24,48,.08)}

/* --- vertical rhythm compression (owner report, 2026-07-31) ----------------
   The editorial design stacked section padding (clamp 80-140px) on top of
   .scene-inner padding (clamp 120-200px) — up to ~680px between adjacent
   sections' content. That read as intentional air when the bands had
   contrasting backgrounds, but the retheme made --bone match the body
   background, so the bands merged and the doubled padding became giant blank
   voids mid-page. Two changes together fix it:
   1. compress the stacked paddings to the design system's rhythm (~190px
      content-to-content, comparable to the design pages' 84px sections), and
   2. give .scene-light a white band against the lavender body — the same
      alternation the design pages use — so the remaining air reads as
      structure again. */
.scene-light{background:#fdfdff;padding-block:clamp(28px,3.5vw,44px)}
.scene-inner{padding-block:clamp(36px,4.5vw,56px)}
.page-hero{padding-top:110px;padding-bottom:clamp(48px,6vw,80px)}
.page-cta{padding-block:clamp(64px,8vw,104px)}
/* Phones: drop the nav "Start building" pill (owner review, 2026-07-30) —
   same rule and breakpoint as the design pages; page heroes carry their own
   CTAs. */
@media (max-width:767px){
  .rmd-nav a[data-rmd-cta="nav"]{display:none !important}
}