/* Rise Ultra — design tokens + reset. Shared by all three routes. */
:root{
  /* The site is light-only by design. Without this, a phone in dark mode still
     renders the PAGE correctly but draws the NATIVE controls dark: the panel
     that opens from a <select>, the tint Chrome and Safari paint over an
     autofilled field, and desktop scrollbars. That gives dark-grey UI against
     cream, and in the autofill case dark text on a dark tint. Declaring the
     scheme pins all of it to light. */
  color-scheme: light;
  --cream:#F5F1E8;
  --charcoal:#16130F;
  --ink:#211C16;
  --clay:#B5532E;
  --clay-dark:#9A4526;
  --light-clay:#E08A5C;
  --muted:#574E43;
  --border:#D8D0C0;
  --card:#FCFAF6;
  --display:'Archivo',system-ui,sans-serif;
  --body:'Hanken Grotesk',system-ui,sans-serif;
}
*{box-sizing:border-box}
/* No `scroll-behavior:smooth` here on purpose. In-page anchors are animated by
   app.js on a fixed 650ms ease-out curve; a native smooth scroll would fight
   that loop frame by frame. Anything that still wants the native animation
   asks for it explicitly with behavior:'smooth'. */
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
img{max-width:100%;display:block}
[hidden]{display:none!important}

/* Vidalytics embeds. The inline embed scripts set their own padding-top for
   aspect ratio; these wrappers only constrain width and centre them. */
.vid-vsl{border-radius:8px;overflow:hidden}
.vid-portrait{max-width:360px;margin-left:auto;margin-right:auto;border-radius:8px;overflow:hidden}

/* "Privacy policy" link in every page footer: takes the footer's own colour,
   always underlined so it reads as a link. */
.pp-link{color:inherit;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.pp-link:hover{text-decoration-thickness:2px}
.pp-link:focus-visible{outline:3px solid var(--clay);outline-offset:2px;border-radius:2px}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
