/* Goodwin Local: tokens and base. See DESIGN.md. */
:root{
  --blue:#0F5F8F; --deep:#0A2233; --orange:#FB6D37;
  --ink:#0B1A24; --ink-2:#2A3D4A; --muted:#4A5E6B;
  --line:#D5E0E7; --surface:#F4F7F9; --white:#fff;
  --display:"Bricolage Grotesque",Georgia,serif;
  --body:"Archivo",system-ui,-apple-system,sans-serif;
  --wrap:1120px;
  --z-base:0; --z-raised:10; --z-sticky:100; --z-overlay:1000;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--white); color:var(--ink);
  font-family:var(--body); font-size:clamp(1rem,.96rem + .2vw,1.075rem);
  line-height:1.62; font-weight:400;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:var(--display); font-weight:700; line-height:1.06; letter-spacing:-.02em; margin:0}
h1{font-size:clamp(2.4rem,1.6rem + 3.6vw,4.2rem)}
h2{font-size:clamp(1.75rem,1.3rem + 2vw,2.7rem); letter-spacing:-.018em}
h3{font-size:clamp(1.12rem,1.03rem + .4vw,1.35rem); letter-spacing:-.01em}
p{margin:0 0 1.05em}
a{color:var(--blue); text-underline-offset:.18em; text-decoration-thickness:.07em}
a:hover{color:var(--orange)}
strong{font-weight:600; color:var(--ink)}
.wrap{max-width:var(--wrap); margin-inline:auto; padding-inline:clamp(1.15rem,4vw,2.5rem)}
.prose{max-width:68ch}
.muted{color:var(--muted)}

/* buttons: orange takes INK text, never white (2.86:1 fails) */
.btn{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--body); font-weight:600; font-size:1.02rem;
  padding:.92rem 1.5rem; border-radius:7px; border:1px solid transparent;
  text-decoration:none; cursor:pointer; transition:transform .15s ease-out,background .15s ease-out,border-color .15s ease-out;
}
.btn-primary{background:var(--orange); color:var(--ink); border-color:#e05a26}
.btn-primary:hover{background:#ff7d4c; color:var(--ink); transform:translateY(-1px)}
.btn-ghost{background:transparent; color:var(--blue); border-color:var(--line)}
.btn-ghost:hover{border-color:var(--blue); color:var(--blue)}
.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible{
  outline:3px solid var(--orange); outline-offset:2px
}

/* header */
.site-head{border-bottom:1px solid var(--line); background:var(--white)}
.site-head .bar{display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding-block:1.05rem}
.site-head img{height:38px; width:auto; display:block}
.site-head nav{display:flex; align-items:center; gap:clamp(1rem,2.4vw,2rem); font-size:.95rem; font-weight:500}
.site-head nav a{color:var(--ink-2); text-decoration:none}
.site-head nav a:hover{color:var(--orange)}
@media(max-width:640px){.site-head nav a.hide-sm{display:none}}

/* sections */
section{padding-block:clamp(3.2rem,7vw,6rem)}
.alt{background:var(--surface); border-block:1px solid var(--line)}
.dark{background:var(--deep); color:#E3ECF2}
.dark h2,.dark h3{color:#fff}
.dark .muted{color:#9FB4C2}
.dark a:not(.btn){color:var(--orange)}
.dark .btn-primary{color:var(--ink)}
.dark .btn-ghost{color:#DCE8F0; border-color:#2B4A61}
.dark .btn-ghost:hover{color:#fff; border-color:var(--orange)}

/* rule-based lists: deliberately not cards */
.rules{border-top:1px solid var(--line); margin:2.2rem 0 0; padding:0; list-style:none}
.rules li{border-bottom:1px solid var(--line); padding:1.45rem 0; display:grid; grid-template-columns:minmax(0,15rem) minmax(0,1fr); gap:.4rem 2.5rem}
.rules li > :is(h3,strong):first-child{margin:0}
.rules li p{margin:0; color:var(--ink-2)}
@media(max-width:720px){.rules li{grid-template-columns:1fr; gap:.4rem}}
.dark .rules{border-color:#1E3A4E}
.dark .rules li{border-color:#1E3A4E}
.dark .rules li p{color:#B9CCD8}

footer.site-foot{background:var(--deep); color:#9FB4C2; padding-block:2.6rem; font-size:.92rem}
footer.site-foot a{color:#CFE0EB; text-decoration:none}
footer.site-foot a:hover{color:var(--orange)}
footer.site-foot .row{display:flex; flex-wrap:wrap; gap:.9rem 1.8rem; align-items:center; justify-content:space-between}

@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important}
  .btn:hover{transform:none}
}
