:root{
  --palette-slope-orange: #F44320;
  --palette-deep-navy: #07101A;
  --palette-near-black: #03070C;
  --palette-white: #F5F7FA;
  --palette-electric-blue: #3880FF;
  --palette-performance-green: #41C882;
  --palette-purple: #A069FF;
  --background-page: #03070C;
  --background-subtle: rgba(245, 247, 250, 0.08);
  --text-primary: #F5F7FA;
  --text-secondary: rgba(245, 247, 250, 0.72);
  --text-muted: rgba(245, 247, 250, 0.64);
  --text-accent: #F44320;
  --icon-accent: #F44320;
  --icon-default: rgba(245, 247, 250, 0.72);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--background-page);
  color:var(--text-primary);
  font-family:"Inter", system-ui, sans-serif;
  font-size:16px;
  line-height:24px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
ul{margin:0;padding:0;list-style:none}
/* Figma draws a form field as a box plus a placeholder text layer, so the
   control itself is chromeless: the box next to it paints fill and stroke. */
input,textarea,select{font:inherit;color:var(--text-primary);background:none;border:0;padding:0;appearance:none;-webkit-appearance:none}
textarea{resize:none;display:block}
input::placeholder,textarea::placeholder{color:var(--text-secondary);opacity:1}
/* The chevron is its own Figma atom, so the native one stays off; the option
   list is drawn by the browser, hence the explicit dark palette. */
select{cursor:pointer}
select option{background:var(--background-page);color:var(--text-primary)}
/* Honeypot from `docs/slopelab-contact-form.md`: a real focusable text input
   that no human sees. Never `display:none` — simple bots skip hidden inputs. */
.contact-honeypot{position:absolute;left:-9999px;top:0;width:1px;height:1px;overflow:hidden}
:focus-visible{outline:2px solid var(--icon-accent);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
[hidden]{display:none !important}

/* Accent run inside a Figma text layer with per-character fills. */
.accent{color:var(--text-accent)}

/* --- Language switcher ---
   The frozen header draws the closed control only, so the open state is a
   JS-free `<details>` disclosure: the summary fills the frozen 86x44 box and
   the option panel is hidden until the control is open. */
.hd-locale > summary{list-style:none}
.hd-locale > summary::-webkit-details-marker{display:none}
.hd-locale > summary::marker{content:""}
.hd-locale:not([open]) > .hd-locale-panel{display:none}

/* --- Fixed-width stage: one Figma frame per breakpoint --- */
.stage{position:relative;width:1200px;margin:0 auto;overflow:hidden}
.stage > *{position:absolute}
.stage-section{position:absolute;overflow:visible}
.stage-section > *{position:absolute}
.atom{position:absolute;margin:0}
/* Stage atoms carry their exact Figma width; never clamp to the parent box. */
.stage img{max-width:none}
.atom-text{white-space:pre-wrap}
@media (min-width:1024px) and (max-width:1199px){.stage{zoom:calc(100vw / 1200)}}
@media (max-width:1023px){.stage{width:768px}}
@media (max-width:767px){.stage{width:390px}}
@media (max-width:389px){.stage{zoom:calc(100vw / 390)}}

/* --- Figma text styles --- */
.t-display-h1{font-family:"Rajdhani", system-ui, sans-serif;font-weight:700;font-size:64px;line-height:72px;}
.t-display-home-hero{font-family:"Rajdhani", system-ui, sans-serif;font-weight:700;font-size:64px;line-height:68px;letter-spacing:-0.075em;}
.t-display-eyebrow{font-family:"Rajdhani", system-ui, sans-serif;font-weight:600;font-size:16px;line-height:20px;}
.t-display-eyebrow-wide{font-family:"Rajdhani", system-ui, sans-serif;font-weight:600;font-size:14px;line-height:20px;letter-spacing:0.52em;}
.t-heading-h2{font-family:"Rajdhani", system-ui, sans-serif;font-weight:700;font-size:40px;line-height:48px;}
.t-heading-h2-compact{font-family:"Rajdhani", system-ui, sans-serif;font-weight:600;font-size:32px;line-height:40px;}
.t-heading-h3{font-family:"Rajdhani", system-ui, sans-serif;font-weight:600;font-size:24px;line-height:32px;}
.t-heading-h4{font-family:"Rajdhani", system-ui, sans-serif;font-weight:600;font-size:20px;line-height:28px;}
.t-heading-card{font-family:"Rajdhani", system-ui, sans-serif;font-weight:600;font-size:28px;line-height:32px;}
.t-heading-card-accent{font-family:"Rajdhani", system-ui, sans-serif;font-weight:600;font-size:17px;line-height:22px;}
.t-heading-journey{font-family:"Rajdhani", system-ui, sans-serif;font-weight:600;font-size:20px;line-height:28px;}
.t-heading-cta{font-family:"Rajdhani", system-ui, sans-serif;font-weight:700;font-size:36px;line-height:38px;}
.t-body-lead{font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:18px;line-height:28px;}
.t-body-default{font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:16px;line-height:24px;}
.t-body-small{font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:14px;line-height:20px;}
.t-body-home-hero{font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:15px;line-height:25.5px;}
.t-body-compact{font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:12px;line-height:18px;}
.t-body-cta{font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:15px;line-height:22px;}
.t-caption{font-family:"Inter", system-ui, sans-serif;font-weight:500;font-size:12px;line-height:16px;}
.t-caption-legal{font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:11px;line-height:16px;}
.t-label-large{font-family:"Inter", system-ui, sans-serif;font-weight:600;font-size:16px;line-height:20px;}
.t-label-default{font-family:"Inter", system-ui, sans-serif;font-weight:600;font-size:14px;line-height:20px;}
.t-label-footer{font-family:"Inter", system-ui, sans-serif;font-weight:500;font-size:13px;line-height:18px;}
.t-label-control{font-family:"Inter", system-ui, sans-serif;font-weight:600;font-size:14px;line-height:20px;}
.t-label-card-link{font-family:"Inter", system-ui, sans-serif;font-weight:600;font-size:14px;line-height:20px;}
.t-button{font-family:"Inter", system-ui, sans-serif;font-weight:600;font-size:14px;line-height:20px;}
.t-data-default{font-family:"Inter", system-ui, sans-serif;font-weight:500;font-size:16px;line-height:20px;}
.t-data-metric{font-family:"Inter", system-ui, sans-serif;font-weight:600;font-size:19px;line-height:26px;}
.t-data-caption{font-family:"Inter", system-ui, sans-serif;font-weight:400;font-size:9px;line-height:13px;}