/* Brasskey · shared shell for the written pages (guides, areas, terms-adjacent).
   The home page carries its own inline styles; this is the lighter typographic
   shell everything else uses, on the same tokens. */

:root{
  --serif:"Hoefler Text","Iowan Old Style","Palatino Linotype",Palatino,"Times New Roman",Georgia,serif;
  --sans:"Helvetica Neue","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --ground:#F1EEE2; --ground-raise:#E9E4D4; --card:#F7F4EA;
  --ink:#1A2B21; --ink-soft:#5B6258; --ink-faint:#8A9084;
  --line:#DAD4C2; --line-strong:#C6BFA9;
  --forest:#16281F; --forest-2:#1D3427; --forest-ink:#ECE8DA; --forest-soft:#A7AF9F; --forest-line:#33453A;
  --brass:#AC8836; --brass-2:#93712B;
  --shadow:0 1px 2px rgba(20,30,24,.05),0 12px 40px -18px rgba(20,30,24,.22);
  --maxw:1140px; --prosew:720px;
}
@media (prefers-color-scheme:dark){
  :root{
    --ground:#12201A; --ground-raise:#182b22; --card:#1a2c23;
    --ink:#ECE8DA; --ink-soft:#A9B0A2; --ink-faint:#79806f;
    --line:#2A392F; --line-strong:#35473b;
    --forest:#0E1A14; --forest-2:#152219; --forest-soft:#9aa192; --forest-line:#2a382f;
    --brass:#C7A24E; --brass-2:#C7A24E;
    --shadow:0 1px 2px rgba(0,0,0,.3),0 18px 50px -20px rgba(0,0,0,.6);
  }
}
:root[data-theme="light"]{
  --ground:#F1EEE2; --ground-raise:#E9E4D4; --card:#F7F4EA;
  --ink:#1A2B21; --ink-soft:#5B6258; --ink-faint:#8A9084;
  --line:#DAD4C2; --line-strong:#C6BFA9;
  --brass:#AC8836; --brass-2:#93712B;
}
:root[data-theme="dark"]{
  --ground:#12201A; --ground-raise:#182b22; --card:#1a2c23;
  --ink:#ECE8DA; --ink-soft:#A9B0A2; --ink-faint:#79806f;
  --line:#2A392F; --line-strong:#35473b;
  --forest:#0E1A14; --forest-line:#2a382f;
  --brass:#C7A24E; --brass-2:#C7A24E;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{background:var(--ground);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.68;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;}
h1,h2,h3,h4{font-family:var(--serif);font-weight:400;letter-spacing:-.012em;text-wrap:balance;}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px;border-radius:2px;}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,40px);}
/* A measure-limited column that still starts on the same left edge as the page
   head, rather than re-centring itself and stepping in by 130px. Cap the
   children, not the wrapper. */
.wrap.prose{max-width:var(--maxw);}
.wrap.prose > *{max-width:var(--prosew);}
.wrap.prose > .tbl-scroll,.wrap.prose > .cards{max-width:min(920px,100%);}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--brass-2);}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--ground) 88%,transparent);
  backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid var(--line);}
.nav-in{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,40px);height:68px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;}
.mark{font-family:var(--serif);font-size:22px;letter-spacing:.04em;display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);}
.mark svg{width:30px;height:18px;flex:0 0 auto;}
.mark path,.mark circle{fill:none;stroke:var(--brass);stroke-width:2;stroke-linecap:round;}
.nav-links{display:flex;align-items:center;gap:26px;}
.nav-links a{font-size:14px;color:var(--ink-soft);text-decoration:none;transition:color .2s;}
.nav-links a:hover{color:var(--brass-2);}
@media(max-width:820px){.nav-links a.hide-sm{display:none;}}

.btn{display:inline-block;font-family:var(--sans);font-size:14px;font-weight:600;letter-spacing:.02em;
  padding:12px 22px;border-radius:2px;border:1px solid var(--brass);background:var(--brass);color:#1a1408;
  text-decoration:none;cursor:pointer;transition:background .22s,color .22s;}
.btn:hover{background:transparent;color:var(--brass-2);}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line-strong);}
.btn.ghost:hover{border-color:var(--brass);color:var(--brass-2);}
.btn.sm{padding:9px 16px;font-size:13px;}

/* page head */
.phead{padding:clamp(52px,8vw,96px) 0 clamp(30px,4vw,44px);border-bottom:1px solid var(--line);}
.phead h1{font-size:clamp(32px,5.2vw,54px);line-height:1.06;margin-top:16px;}
.phead .lede{font-size:clamp(18px,2vw,21px);line-height:1.6;color:var(--ink-soft);margin-top:22px;max-width:34em;}
.phead .meta{margin-top:26px;font-size:13px;color:var(--ink-faint);letter-spacing:.02em;}
.crumbs{font-size:13px;color:var(--ink-faint);}
.crumbs a{color:var(--ink-faint);text-decoration:none;border-bottom:1px solid transparent;}
.crumbs a:hover{color:var(--brass-2);border-bottom-color:var(--line-strong);}

/* body copy */
.body{padding:clamp(38px,6vw,68px) 0 clamp(48px,7vw,84px);}
.body h2{font-size:clamp(24px,3.2vw,34px);line-height:1.18;margin:clamp(38px,5vw,60px) 0 0;}
.body h2:first-child{margin-top:0;}
.body h3{font-size:clamp(19px,2.2vw,23px);margin:34px 0 0;}
.body p{margin-top:18px;color:var(--ink-soft);}
.body p strong,.body li strong{color:var(--ink);font-weight:600;}
.body ul,.body ol{margin:18px 0 0 0;padding-left:0;list-style:none;}
.body ol{counter-reset:n;}
.body ul li{position:relative;padding-left:22px;margin-top:12px;color:var(--ink-soft);}
.body ul li:before{content:"";position:absolute;left:0;top:13px;width:9px;height:1px;background:var(--brass);}
.body ol li{counter-increment:n;position:relative;padding-left:34px;margin-top:14px;color:var(--ink-soft);}
.body ol li:before{content:counter(n);position:absolute;left:0;top:0;font-family:var(--serif);font-size:16px;color:var(--brass-2);}
.body a{color:var(--brass-2);text-decoration:none;border-bottom:1px solid var(--line-strong);}
.body a:hover{border-bottom-color:var(--brass);}
.hairline{width:80px;height:1px;background:var(--brass);margin-bottom:22px;}

.pull{margin:34px 0 0;padding:22px 0 22px 26px;border-left:2px solid var(--brass);
  font-family:var(--serif);font-style:italic;font-size:clamp(19px,2.3vw,24px);line-height:1.45;color:var(--ink);}

.note{margin-top:28px;background:var(--card);border:1px solid var(--line);border-radius:4px;padding:22px 24px;
  font-size:14.5px;line-height:1.62;color:var(--ink-soft);}
.note b{color:var(--ink);}

/* tables */
.tbl-scroll{overflow-x:auto;margin-top:26px;border:1px solid var(--line);border-radius:4px;background:var(--card);}
table.data{width:100%;border-collapse:collapse;min-width:640px;font-size:14.5px;}
table.data caption{caption-side:bottom;text-align:left;padding:14px 18px;font-size:12.5px;color:var(--ink-faint);line-height:1.55;border-top:1px solid var(--line);}
table.data th{text-align:left;font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ink-faint);padding:14px 18px;border-bottom:1px solid var(--line-strong);white-space:nowrap;}
table.data td{padding:14px 18px;border-top:1px solid var(--line);color:var(--ink-soft);vertical-align:top;}
table.data td:first-child{color:var(--ink);font-weight:600;white-space:nowrap;}
table.data td.num{font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--brass-2);font-family:var(--serif);font-size:17px;}

/* card grids */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:28px;}
.card{background:var(--card);border:1px solid var(--line);border-radius:4px;padding:26px 24px;}
.card h3{font-size:20px;margin:0;}
.card p{font-size:14.5px;margin-top:12px;}
.card .k{font-family:var(--serif);font-size:30px;color:var(--brass-2);font-variant-numeric:tabular-nums;}

/* faq */
.faq-list{margin-top:30px;border-top:1px solid var(--line);}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:20px;text-align:left;
  background:none;border:0;cursor:pointer;padding:22px 0;font-family:var(--serif);font-size:clamp(17px,2vw,20px);
  color:var(--ink);line-height:1.35;}
.faq-q .plus{font-family:var(--sans);font-size:20px;color:var(--brass);flex:0 0 auto;line-height:1;transition:transform .3s;}
.faq-item.open .faq-q .plus{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .38s cubic-bezier(.2,.7,.2,1);}
.faq-a p{padding-bottom:22px;margin-top:0;font-size:15.5px;}

/* closing cta */
.cta{background:var(--forest);color:var(--forest-ink);padding:clamp(48px,7vw,84px) 0;}
.cta h2{color:#F4F0E4;font-size:clamp(26px,3.6vw,40px);line-height:1.12;}
.cta p{color:var(--forest-soft);margin-top:18px;max-width:38em;}
.cta .row{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px;}
.cta .eyebrow{color:var(--brass);}
.cta .btn.ghost{color:var(--forest-ink);border-color:var(--forest-line);}
.cta .btn.ghost:hover{border-color:var(--brass);color:var(--brass);}

/* footer */
.ft{background:var(--ground-raise);border-top:1px solid var(--line);padding:52px 0 40px;font-size:14px;}
.ft .grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:40px;}
.ft h4{font-family:var(--sans);font-size:11.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);}
.ft ul{list-style:none;margin-top:14px;}
.ft li{margin-top:9px;}
.ft a{color:var(--ink-soft);text-decoration:none;}
.ft a:hover{color:var(--brass-2);}
.ft .about{color:var(--ink-soft);font-size:14px;margin-top:16px;max-width:34em;line-height:1.62;}
.ft .legal{margin-top:38px;padding-top:22px;border-top:1px solid var(--line);display:grid;gap:10px;font-size:12.5px;color:var(--ink-faint);line-height:1.6;}
@media(max-width:820px){.ft .grid{grid-template-columns:1fr;gap:28px;}}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;}html{scroll-behavior:auto;}}

/* The nav CTA is a full sentence on desktop and a word on a phone, so the
   header never grows a second line and pushes the brand out of alignment. */
.narrow-only{display:none;}
.nav-in{min-height:68px;height:auto;padding-top:8px;padding-bottom:8px;}
@media(max-width:640px){
  .wide-only{display:none;}
  .narrow-only{display:inline;}
  .nav-links{gap:14px;}
  .btn.sm{padding:9px 14px;}
}
