/* ============================================================
   Precious — shared site system (Fauna identity)
   Used by all pages except the homepage hero machinery.
   Tokens mirror index.html exactly. Do not fork colours.
   ============================================================ */
@font-face{font-family:Matter;src:url(matter-regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Matter;src:url(matter-medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Matter;src:url(matter-semibold.woff2) format("woff2");font-weight:600;font-display:swap}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;overflow-x:clip}
::selection{background:var(--accent);color:var(--bg)}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
.wrap{max-width:1460px;margin:0 auto;padding:0 40px}
.kicker{font-size:13px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--accent)}
h1,h2,h3{font-weight:500;letter-spacing:-.022em;line-height:1.04}
.body-l{font-size:clamp(18px,1.6vw,22px);line-height:1.55;color:var(--ink-dim)}

/* scroll progress */
#progress{position:fixed;left:0;top:0;height:2px;width:100%;transform-origin:0 0;transform:scaleX(0);background:var(--accent);z-index:98}

/* ---------- nav (benchmark shape pair) ---------- */
nav{position:fixed;top:0;left:0;right:0;z-index:90;display:flex;align-items:center;justify-content:space-between;
  padding:32px;transition:padding .5s var(--ease),background .5s var(--ease)}
nav.scrolled{padding:12px 32px}
.logo{display:flex;align-items:center}
.nav-right{display:flex;gap:2px;align-items:center}
.menu{display:flex;align-items:center;gap:30px;height:60px;background:var(--tan);border-radius:8px 32px 32px 8px;padding:0 28px 0 24px}
.menu a{font-size:16px;line-height:16px;font-weight:500;position:relative;top:1px;transition:color .3s}
.menu a:hover,.menu a.active{color:var(--accent)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:60px;padding:0 26px;
  background:var(--accent);border:1px solid var(--accent);border-radius:32px 8px 8px 32px;color:var(--bg);
  font-size:16px;line-height:16px;font-weight:500;cursor:pointer;transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease)}
.btn:hover{background:var(--accent-deep);border-color:var(--accent-deep)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--accent);color:var(--accent);background:transparent}
.btn.pair-l{border-radius:8px 32px 32px 8px}
.btn.sm{height:48px;padding:0 22px;font-size:15px}
@media(max-width:820px){.menu{display:none}nav{padding:20px}}

/* ---------- generic page header ---------- */
.phead{padding:180px 40px 40px}
.phead .kicker{margin-bottom:20px}
.phead h1{font-size:clamp(44px,7vw,104px);max-width:15ch}
.phead .body-l{margin-top:26px;max-width:60ch}

/* ---------- CTA band ---------- */
.ctaband{background:var(--dark);color:var(--bg);border-radius:var(--r-panel);padding:clamp(56px,8vw,120px) 8%;margin:80px 0;text-align:center}
.ctaband h2{font-size:clamp(34px,5vw,68px);max-width:20ch;margin:0 auto}
.ctaband p{margin:22px auto 0;max-width:52ch;color:rgba(248,240,227,.6);font-size:clamp(16px,1.5vw,20px);line-height:1.55}
.ctaband .cta-row{display:flex;gap:14px;justify-content:center;margin-top:38px;flex-wrap:wrap}
.ctaband .btn.ghost{color:var(--bg);border-color:rgba(248,240,227,.28)}
.ctaband .btn.ghost:hover{color:var(--accent);border-color:var(--accent)}

/* ---------- footer ---------- */

/* ---------- reveal ----------
   Transform-only: opacity is NEVER touched, so content can never be stuck hidden
   (throttled renderers can freeze transitions; a frozen rise is just a few px off, still legible). */
.rise{transform:none}
.rise.armed{transform:translateY(20px)}
.rise.in{transform:none;transition:transform .7s var(--ease)}
@media (prefers-reduced-motion:reduce){.rise.armed{transform:none}}
