/* ============================================================
   OBSIDIAN SKIN for the pages.css component set.
   Loads after pages.css and obsidian.css. Re-points the light
   tokens at the Obsidian palette and restyles the components
   the inner pages actually use.
   ============================================================ */
:root{
  --bg:#08080a; --bg-alt:#101014; --bg-white:#101014;
  --dark:#08080a; --dark-2:#101014; --dark-navy:#16161b;
  --ink:#f7f7f8; --body:#96969f; --muted:#82828c; --faint:#82828c;
  --inverse:#f7f7f8; --inverse-body:#96969f; --inverse-muted:#82828c;
  --bronze:#c44e1c; --bronze-light:rgba(196,78,28,.1); --bronze-border:rgba(196,78,28,.3);
  --border:rgba(255,255,255,.08); --border-dark:rgba(255,255,255,.08);
}
body{background:var(--void);color:var(--body);font:400 17px/1.65 'Inter',system-ui,sans-serif}
.container,.container-narrow{padding:0 40px}
.container{max-width:1240px}
.container-narrow{max-width:900px}

/* the old nav + footer are replaced by the Obsidian ones */
.nav,.mob-menu,.mobile-btn,.footer{display:none !important}

h1,h2,h3,h4{font-family:'Inter Tight','Inter',sans-serif;color:var(--ink);
  font-weight:500;letter-spacing:-.03em;line-height:1.08}
.label{font:600 11px/1 'Inter',sans-serif;letter-spacing:.24em;
  text-transform:uppercase;color:var(--bronze-warm);display:block}

/* page hero */
.page-hero{padding:clamp(150px,17vw,210px) 0 clamp(58px,7vw,84px);
  background:var(--void);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.page-hero::before{content:"";position:absolute;width:760px;height:760px;right:-220px;top:-300px;
  pointer-events:none;background:radial-gradient(circle,rgba(196,78,28,.1),transparent 64%);filter:blur(50px)}
.page-hero .container,.page-hero .container-narrow{position:relative;z-index:2}
.page-hero .label{margin-bottom:22px}
.page-hero h1{font-size:clamp(34px,5vw,60px);font-weight:400;letter-spacing:-.035em;max-width:19ch}
.page-hero h1 strong{font-weight:600}
.page-hero p{margin-top:24px;font-size:18px;color:#b6b6bd;max-width:56ch}

/* long-form body */
.page-body{padding:clamp(70px,9vw,112px) 0;background:var(--surface);border-bottom:1px solid var(--line)}
.page-body h2{font-size:clamp(24px,2.6vw,32px);font-weight:600;letter-spacing:-.025em;
  margin:56px 0 18px;padding-top:34px;border-top:1px solid var(--line);color:var(--ink)}
.page-body h2:first-child{margin-top:0;padding-top:0;border-top:0}
.page-body h3{font-size:19px;font-weight:600;letter-spacing:-.018em;margin:32px 0 12px;color:var(--ink)}
.page-body p{margin-bottom:18px;font-size:16.5px;line-height:1.72;color:var(--dim)}
.page-body ul,.page-body ol{margin:0 0 22px 0;padding-left:0;list-style:none}
.page-body li{position:relative;padding-left:26px;margin-bottom:12px;
  font-size:16.5px;line-height:1.7;color:var(--dim)}
.page-body li::before{content:"";position:absolute;left:0;top:11px;
  width:8px;height:1.5px;background:var(--bronze)}
.page-body ol{counter-reset:n}
.page-body ol li{counter-increment:n}
.page-body ol li::before{content:counter(n);background:none;top:0;left:0;width:auto;height:auto;
  font:500 13px 'Inter Tight',sans-serif;color:var(--bronze)}
.page-body strong{color:var(--ink);font-weight:600}
.page-body a{color:var(--bronze-warm);border-bottom:1px solid rgba(196,78,28,.4)}
.page-body a:hover{color:var(--ink);border-bottom-color:var(--ink)}
.page-body .card{background:var(--void);border:1px solid var(--line);
  border-left:2px solid var(--bronze);padding:30px 32px;margin:32px 0}
.page-body .card .card-label{font:600 11px 'Inter',sans-serif;letter-spacing:.22em;
  text-transform:uppercase;color:var(--bronze-warm);display:block;margin-bottom:14px}
.page-body .card h3{margin-top:0}
.page-body .card p:last-child{margin-bottom:0}
.page-body .last-updated{margin-top:52px;padding-top:26px;border-top:1px solid var(--line);
  font-size:13.5px;color:var(--dim)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:12px;border-radius:0;
  font:600 15px 'Inter',sans-serif;padding:16px 28px;transition:all .3s var(--ease)}
.btn-bronze{background:var(--bronze);color:#fff;border:1px solid var(--bronze)}
.btn-bronze:hover{background:var(--bronze-warm);border-color:var(--bronze-warm);
  transform:translateY(-2px);box-shadow:0 14px 40px rgba(196,78,28,.3)}
.btn-outline,.btn-outline-light{background:none;color:var(--ink);border:1px solid var(--line-strong)}
.btn-outline:hover,.btn-outline-light:hover{background:var(--ink);color:var(--void);border-color:var(--ink)}
.ml{margin-left:14px}

/* closing band */
.cta-band{padding:clamp(84px,11vw,132px) 0;text-align:center;background:var(--void);
  border-top:1px solid var(--line);
  background-image:radial-gradient(80% 120% at 50% 118%,rgba(196,78,28,.2),transparent 66%)}
.cta-band h2{font-size:clamp(30px,4vw,52px);font-weight:400;letter-spacing:-.035em;
  max-width:19ch;margin:0 auto}
.cta-band h2 strong{font-weight:600}
.cta-band p{margin:22px auto 34px;max-width:46ch;font-size:18px;color:var(--body)}

/* sections used by the resources hub */
.sec{padding:clamp(84px,11vw,140px) 0}
.sec-white,.sec-alt{background:var(--surface);border-top:1px solid var(--line)}
.sec-dark{background:var(--void);border-top:1px solid var(--line)}

@media (max-width:900px){
  .container,.container-narrow{padding:0 22px}
  .page-hero{padding-top:130px}
  .ml{margin-left:0;margin-top:12px}
}

/* failsafe: never leave page content invisible if JS does not run */
html:not(.js) .fu{opacity:1 !important;transform:none !important}