/* Shopfront Studio — shared styles for the secondary pages.
   The homepage keeps its own inline CSS so it stays a single file. */
:root{
  --ink:#1C3A5C; --ink:#242A33; --ember:#2E2418; --dusk:#262D3A;
  --paper:#F9F6F1; --paper-2:#F2EADE; --line:#E0D9CC;
  --slate:#4C5260; --brass:#DFA35E; --brass-lt:#F0C08A; --brass-deep:#7E5214;
  --rust:#B2672E; --rust-deep:#8A4A18; --peach:#EDB88E;
  --wrap:760px; --gut:22px;
  --f-display:"Bricolage Grotesque","Archivo","Helvetica Neue",Arial,sans-serif;
  --f-body:"Public Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; overflow-x:clip; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
body{ margin:0; background:var(--paper); color:var(--ink); font-family:var(--f-body); font-size:17px; line-height:1.68; -webkit-font-smoothing:antialiased; }
h1,h2,h3{ font-family:var(--f-display); font-weight:700; letter-spacing:-.025em; line-height:1.1; margin:0; }
h1{ font-size:clamp(2rem,5.5vw,3rem); font-weight:800; }
h2{ font-size:clamp(1.25rem,3vw,1.55rem); margin:2.6rem 0 .8rem; }
h3{ font-size:1.08rem; margin:1.8rem 0 .5rem; }
p,li{ max-width:68ch; }
p{ margin:0 0 1rem; }
ul{ padding-left:1.15rem; margin:0 0 1rem; }
li{ margin-bottom:.45rem; }
a{ color:var(--ink); text-decoration:underline; text-decoration-color:var(--brass); text-underline-offset:3px; }
a:hover{ text-decoration-color:var(--rust); }
:focus-visible{ outline:2px solid var(--brass); outline-offset:3px; border-radius:3px; }
.wrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding:0 var(--gut); }
.sr{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.skip{ position:absolute; left:1rem; top:-4rem; z-index:100; background:var(--brass); color:#1A1206; padding:.6rem 1rem; font-weight:700; border-radius:2px; text-decoration:none; transition:top .15s; }
.skip:focus{ top:1rem; }

.topbar{ background:linear-gradient(100deg, rgba(46,36,24,.97) 0%, rgba(36,42,51,.97) 52%, rgba(38,45,58,.97) 100%); border-bottom:1px solid rgba(223,163,94,.32); }
.topbar .wrap{ display:flex; align-items:center; gap:1rem; height:68px; max-width:1140px; }
.mark{ display:flex; align-items:center; gap:.7rem; text-decoration:none; color:#fff; margin-right:auto; }
.mark-badge{ width:31px; height:31px; display:grid; place-items:center; flex:none; border:1px solid var(--brass); border-radius:2px; }
.mark-badge svg{ width:16px; height:16px; color:var(--brass); }
.mark-name{ font-family:var(--f-display); font-weight:700; font-size:1.06rem; letter-spacing:-.02em; }
.mark-name span{ font-weight:500; color:#A8AEB8; }
.btn{ display:inline-flex; align-items:center; justify-content:center; font-size:.95rem; font-weight:600; padding:.65rem 1.2rem; border-radius:2px; border:1px solid var(--brass); background:var(--brass); color:#1A1206; text-decoration:none; min-height:42px; }
.btn:hover{ background:var(--brass-lt); border-color:var(--brass-lt); }

main{ padding:clamp(2.6rem,6vw,4.5rem) 0 clamp(3rem,7vw,5rem); }
.lede{ font-size:1.1rem; color:var(--slate); margin-top:1rem; }
.updated{ font-size:.9rem; color:var(--slate); border-left:2px solid var(--brass); padding-left:.9rem; margin:1.6rem 0 2.4rem; }
.hair{ height:1px; width:44px; background:var(--brass); margin-bottom:1.4rem; }
.note{ background:var(--paper-2); border:1px solid var(--line); padding:1.1rem 1.3rem; margin:1.6rem 0; }
.note p:last-child{ margin-bottom:0; }
.note strong{ font-weight:700; }
.fill{ background:#FBF2E2; border:1px solid #E6D7B4; color:#5E4715; font-weight:600; padding:.05rem .4rem; border-radius:2px; }
table{ width:100%; border-collapse:collapse; margin:1.2rem 0; font-size:.97rem; }
th,td{ text-align:left; padding:.7rem .8rem; border-bottom:1px solid var(--line); vertical-align:top; }
th{ font-weight:600; background:var(--paper-2); }
.toc{ background:var(--paper-2); border:1px solid var(--line); padding:1.2rem 1.4rem; margin:2rem 0; }
.toc h2{ margin:0 0 .6rem; font-size:1rem; }
.toc ol{ margin:0; padding-left:1.2rem; font-size:.96rem; }
.toc li{ margin-bottom:.3rem; }

footer.site{ background:linear-gradient(100deg, var(--ember) 0%, var(--ink) 55%, var(--dusk) 100%); color:#A8AEB8; padding:2.6rem 0; font-size:.92rem; border-top:1px solid rgba(223,163,94,.3); }
footer.site .wrap{ max-width:1140px; display:flex; flex-wrap:wrap; gap:.9rem 2.4rem; align-items:center; justify-content:space-between; }
footer.site a{ color:#D2D6DC; }
footer.site div{ flex:1 1 auto; }
.legal-line{ flex:1 1 100%; font-size:.86rem; color:#8E96A2; border-top:1px solid rgba(255,255,255,.14); padding-top:1rem; margin-top:.4rem; }

.err-num{ font-family:var(--f-display); font-weight:800; font-size:clamp(4rem,16vw,8rem); line-height:.9; letter-spacing:-.05em; color:var(--brass); margin-bottom:1rem; }
.err-links{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:2rem; }
.err-links a{ border:1px solid var(--line); padding:.7rem 1.1rem; text-decoration:none; background:#fff; font-weight:600; font-size:.96rem; }
.err-links a:hover{ border-color:var(--ink); }
@media (max-width:640px){ body{ font-size:16.5px; } .err-links a{ flex:1 1 100%; text-align:center; } }
