/* Aimosti redesign — site chrome (header, footer, helix decoration).
   Loaded on every page that uses redesign/base.html. */

/* ── pre-launch "opening soon" bar (soft-lock; hidden once SALES_OPEN=true) ── */
.prelaunch-bar{display:flex;flex-wrap:wrap;gap:.3rem 1rem;align-items:center;justify-content:center;
  background:var(--primary);color:var(--bg);padding:.5rem 1rem;font-size:.9rem;line-height:1.3;text-align:center}
.prelaunch-bar a{color:var(--bg);font-weight:700;text-decoration:underline;white-space:nowrap}

/* ── header ───────────────────────────────────────────── */
.hd{position:sticky;top:0;z-index:var(--z-header);background:color-mix(in oklab,var(--bg) 86%,transparent);
  backdrop-filter:saturate(1.4) blur(8px);border-bottom:var(--rule)}
.hd__in{display:flex;align-items:center;justify-content:space-between;height:64px;gap:1rem}
.brand{display:flex;align-items:center;gap:.6ch;text-decoration:none;color:var(--ink);font-weight:800;letter-spacing:-.03em;font-size:1.15rem}
.brand:hover{color:var(--ink)}
.mark{width:22px;height:22px;display:block;flex:none}
.nav{display:flex;align-items:center;gap:clamp(.7rem,1.8vw,1.6rem)}
.nav__links{display:flex;align-items:center;gap:clamp(.7rem,1.8vw,1.6rem);font-size:.92rem}
.nav a{text-decoration:none;color:var(--ink-soft);font-weight:500}
.nav a:hover{color:var(--ink)}
.nav .cta{padding:.45em 1em;border:1.5px solid var(--ink);border-radius:3px;color:var(--ink);font-weight:600}
.nav .cta:hover{background:var(--ink);color:var(--bg)}
.nav .who{font-family:var(--font-mono);font-size:.8rem;color:var(--ink-faint)}
.nav form.inline{margin:0}
.nav .linkish{background:none;border:0;font:inherit;color:var(--ink-soft);cursor:pointer;font-weight:500}
.nav .linkish:hover{color:var(--ink)}

/* mobile nav — real <button> burger toggled by redesign.js (keyboard-operable, WCAG 2.1.1) */
.nav-burger{display:none;width:42px;height:42px;border:1.5px solid var(--line);border-radius:6px;cursor:pointer;
  background:none;font:inherit;align-items:center;justify-content:center;color:var(--ink)}
.nav-burger span,.nav-burger span::before,.nav-burger span::after{content:"";display:block;width:18px;height:2px;background:currentColor;border-radius:2px;position:relative}
.nav-burger span::before{position:absolute;top:-6px}
.nav-burger span::after{position:absolute;top:6px}
@media(max-width:820px){
  .nav-burger{display:inline-flex}
  /* Closed menu: visibility:hidden so the off-screen panel can't paint a sliver over
     the top of the page (the .hd backdrop-filter makes the header the containing block,
     so translateY alone doesn't clear the prelaunch bar's offset) and its links leave
     the tab order. Delay the visibility flip on close so the slide-up still animates. */
  .nav{position:fixed;inset:64px 0 auto 0;background:var(--bg);border-bottom:var(--rule);
    flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1rem 1rem;visibility:hidden;
    transform:translateY(-130%);transition:transform .3s cubic-bezier(.2,.7,.2,1),visibility 0s .3s;box-shadow:0 20px 40px -28px var(--ink)}
  .nav__links{flex-direction:column;align-items:stretch;gap:0;font-size:1rem}
  .nav__links>*{padding:.7rem .2rem;border-bottom:var(--rule)}
  .nav-burger[aria-expanded="true"] ~ .nav{transform:translateY(0);visibility:visible;transition:transform .3s cubic-bezier(.2,.7,.2,1),visibility 0s 0s}
  .nav .cta{text-align:center;margin-top:.6rem}
}

/* ── footer (light colophon — no black field) ────────── */
.ft{background:var(--tint);border-top:2.5px solid var(--ink);position:relative;overflow:hidden}
.ft .helix-bg{opacity:.4;right:-8%;top:auto;bottom:-40%;transform:none;height:150%}
.ft__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2rem;padding-block:var(--space) 2rem;position:relative;z-index:1}
@media(max-width:760px){.ft__grid{grid-template-columns:1fr 1fr}}
.ft a{color:var(--ink-soft);text-decoration:none;display:block;margin:.35rem 0;font-size:.92rem}
.ft a:hover{color:var(--ink)}
.ft h2{color:var(--ink);font:600 .72rem var(--font-mono);letter-spacing:.06em;text-transform:uppercase;margin:0 0 .6rem}
.ft__brand p{max-width:34ch;font-size:.9rem;margin-top:.8rem;color:var(--ink-soft)}
.ft__base{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;padding:1.3rem 0;border-top:var(--rule);
  font:500 .8rem var(--font-mono);color:var(--ink-faint);position:relative;z-index:1}
.ft__base--meta{border-top:0;color:var(--ink-faint)}
.medical-disclaimer,.disclaimer{margin-top:1rem;font-size:.78rem;color:var(--ink-faint);max-width:46ch;line-height:1.5}

/* ── helix decoration (faint background graphic) ─────── */
.helix-bg{position:absolute;top:50%;right:max(-6rem,-6vw);transform:translateY(-50%);height:135%;width:auto;
  opacity:.5;pointer-events:none;z-index:0}
@media(max-width:900px){section.hero .helix-bg{right:-30%;opacity:.32}}

/* ── cookie-consent banner (slim, bottom-pinned, non-blocking) ───────── */
.cc-bar{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-overlay);display:flex;gap:1rem;
  align-items:center;justify-content:space-between;flex-wrap:wrap;
  padding:.7rem 1.2rem;background:var(--panel);border-top:var(--rule);
  font-size:.85rem;color:var(--ink-soft);box-shadow:0 -8px 24px -18px var(--ink)}
.cc-bar a{color:var(--ink)}
.cc-text{margin:0;max-width:56ch}
.cc-actions{display:flex;gap:.5rem;flex:none}
.cc-btn{padding:.4rem 1rem;border:1.5px solid var(--line-2);border-radius:var(--radius);
  background:transparent;color:var(--ink);cursor:pointer;font:inherit}
.cc-btn:hover{border-color:var(--ink)}
.cc-btn--primary{background:var(--primary);color:var(--on-primary);border-color:transparent}
.cc-btn--primary:hover{background:var(--primary-press)}
@media(max-width:560px){.cc-bar{font-size:.8rem;padding:.6rem .9rem}}

/* ── /cookies "Manage" panel (same button styling as the banner) ─────── */
.cc-manage{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin:1rem 0}
.cc-manage label{display:flex;align-items:center;gap:.5rem;color:var(--ink)}
.cc-manage #cc-saved{color:var(--ok);font-size:.85rem}