/* Layout: a legal brief on white — one reading column, case "captions", exhibits for pull-quotes. Single light theme by brand rule (white always). */
:root{
  --paper:#FFFFFF;      /* the ground, always white */
  --ink:#1C1C1E;        /* charcoal: headings, logo */
  --wine:#78122E;       /* burgundy: accents only */
  --muted:#5D5A60;      /* body grey, faint wine bias */
  --rule:#E7E2E4;       /* hairlines */
  --tint:#FAF7F8;       /* faint panel, barely off white */
  --display:"Libre Caslon Display","Libre Caslon Text",Georgia,"Times New Roman",serif;
  --serif:"Libre Caslon Text",Georgia,"Times New Roman",serif;
  --sans:"Public Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 var(--sans)}
.wrap{max-width:1120px;margin:0 auto;padding-inline:clamp(16px,4vw,40px);padding-block:0}
a{color:var(--wine)}
a:focus-visible,.btn:focus-visible{outline:2px solid var(--wine);outline-offset:3px}

/* nav */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--paper);display:flex;align-items:center;gap:20px;flex-wrap:wrap;padding-block:16px;border-bottom:1px solid var(--rule)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.mark{width:40px;height:40px;flex:none}
.word{font:700 15px/1 var(--sans);letter-spacing:.18em;color:var(--ink)}
.word b{color:var(--wine);font-weight:800}
.navlinks{display:flex;gap:22px;margin-left:auto;overflow-x:auto;scrollbar-width:none}
.navlinks::-webkit-scrollbar{display:none}
.navlinks a{color:var(--ink);text-decoration:none;font-size:14px;font-weight:500;white-space:nowrap;padding-block:4px;border-bottom:1.5px solid transparent}
.navlinks a:hover,.navlinks a[aria-current]{border-bottom-color:var(--wine)}
@media (max-width:820px){.navlinks{order:3;width:100%;margin-left:0;gap:18px}.top .btn.sm{margin-left:auto}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 22px;border-radius:2px;background:var(--wine);color:var(--paper);text-decoration:none;font:600 15px/1 var(--sans);letter-spacing:.01em;border:1.5px solid var(--wine);transition:background .15s,color .15s}
.btn:hover{background:var(--ink);border-color:var(--ink)}
.btn.sm{min-height:38px;padding:0 16px;font-size:14px}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:var(--paper)}
.btn.light{background:var(--paper);color:var(--wine);border-color:var(--paper)}
.btn.light:hover{background:transparent;color:var(--paper)}
.text{font-weight:600;text-decoration:none;border-bottom:1px solid currentColor}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}

/* hero */
.hero{display:grid;gap:48px;padding-block:72px 56px}
.hero.has-side{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:center}
@media (max-width:860px){.hero.has-side{grid-template-columns:1fr}}
.hero-main{min-width:0}
.kicker,.eyebrow,.tag,.ex-label,.caption{font:700 12px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase}
.kicker,.eyebrow{color:var(--wine);margin:0 0 14px}
.caption{color:var(--muted);margin:0 0 22px;padding-block:10px;border-top:3px double var(--ink);border-bottom:1px solid var(--rule)}
h1{font:400 clamp(36px,5.6vw,64px)/1.06 var(--display);letter-spacing:-.01em;margin:0;text-wrap:balance;color:var(--ink)}
.lede{font:400 clamp(17px,1.6vw,20px)/1.6 var(--serif);color:var(--muted);max-width:60ch;margin:24px 0 0}

/* photo placeholder */
.photo{aspect-ratio:4/5;max-width:100%;background:var(--tint);border:1px solid var(--rule);display:flex;flex-direction:column;justify-content:flex-end;padding:22px;gap:4px;position:relative}
.photo span{position:absolute;top:18px;left:22px;font:600 11px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.photo b{font:400 26px/1.1 var(--display)}
.photo em{font:italic 15px var(--serif);color:var(--wine)}

/* sections */
.sec{padding-block:56px;border-top:1px solid var(--rule)}
h2{font:400 clamp(28px,3.4vw,42px)/1.12 var(--display);margin:0 0 22px;text-wrap:balance;max-width:24ch}
h3{font:700 18px/1.3 var(--sans);margin:0 0 8px;color:var(--ink)}
.sec>p{max-width:65ch;color:var(--muted);font-size:17px}
.sec>p+p{margin-top:0}
.more-link{margin-top:24px}

/* stats ledger */
.ledger{border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);padding-block:28px;margin-block:8px}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:24px}
.stat{min-width:0;display:flex;flex-direction:column;gap:6px}
.stat strong{font:400 clamp(30px,3.6vw,44px)/1 var(--display);color:var(--wine);font-variant-numeric:tabular-nums}
.stat span{font-size:14px;color:var(--muted);line-height:1.4}
.note{font-size:13px;color:var(--muted);margin:18px 0 0;max-width:65ch}

/* cards */
.cards{display:grid;gap:20px}
.cards.c3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{min-width:0;padding:26px;border:1px solid var(--rule);background:var(--paper);display:flex;flex-direction:column;gap:6px}
.card p{margin:0;color:var(--muted);font-size:15.5px}
.card.link{text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}
.card.link:hover{border-color:var(--wine);transform:translateY(-2px)}
.card.link h3{font:400 23px/1.2 var(--display)}
.card .tag{color:var(--wine);margin-bottom:6px}
.card .more{margin-top:auto;padding-top:14px;font-weight:600;font-size:14px;color:var(--wine)}

/* steps (a real sequence) */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:0;counter-reset:s}
.steps li{display:grid;grid-template-columns:56px minmax(0,1fr);gap:20px;padding-block:22px;border-top:1px solid var(--rule)}
.steps li:first-child{border-top:0;padding-top:0}
.steps .n{font:400 40px/1 var(--display);color:var(--wine)}
.steps p{margin:0;color:var(--muted);max-width:62ch}

/* exhibit pull-quote */
.exhibit{margin:24px 0 56px;padding:40px clamp(20px,5vw,64px);background:var(--tint);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);position:relative}
.ex-label{color:var(--wine);display:block;margin-bottom:14px}
.exhibit blockquote{margin:0;font:italic 400 clamp(22px,2.8vw,32px)/1.35 var(--serif);color:var(--ink);max-width:34ch;text-wrap:balance}
.exhibit cite{display:block;margin-top:16px;font:600 13px var(--sans);letter-spacing:.06em;color:var(--muted);font-style:normal}
.exhibit cite::before{content:"— "}

/* compare */
.compare{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:0;border:1px solid var(--rule)}
.compare .col{padding:26px;min-width:0}
.compare .us{background:var(--tint);border-left:1px solid var(--rule)}
@media (max-width:600px){.compare .us{border-left:0;border-top:1px solid var(--rule)}}
.compare ul{margin:0;padding-left:18px;color:var(--muted)}
.compare li{margin-bottom:6px}
.compare .us h3{color:var(--wine)}
.compare+p{margin-top:24px}

/* example math */
.mathbox{border:1px solid var(--ink);padding:28px;position:relative}
.example{position:absolute;top:-11px;left:20px;background:var(--paper);padding-inline:8px;font:800 12px/22px var(--sans);letter-spacing:.2em;color:var(--wine)}

/* practice areas */
.areas{display:grid;gap:0}
.area{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:28px;padding-block:24px;border-top:1px solid var(--rule)}
.area:first-child{border-top:0;padding-top:0}
.area .tag{color:var(--wine);display:block;margin-bottom:8px}
.area h3{font:400 24px/1.2 var(--display)}
.area p{margin:0;color:var(--muted)}
@media (max-width:700px){.area{grid-template-columns:1fr;gap:8px}}

/* timeline */
.timeline{list-style:none;margin:0;padding:0;display:grid;gap:0}
.timeline li{display:grid;grid-template-columns:100px minmax(0,1fr);gap:20px;padding-block:16px;border-top:1px solid var(--rule)}
.timeline b{font:400 26px/1 var(--display);color:var(--wine)}
.timeline span{color:var(--muted)}

/* closer */
.closer{margin-block:24px 64px;padding:56px clamp(20px,5vw,64px);background:var(--ink);color:var(--paper)}
.closer h2{color:var(--paper);max-width:20ch}
.closer p{color:#CFCBCF;max-width:60ch;margin:0}
.closer .small{margin-top:18px;font:italic 15px var(--serif);color:#CFCBCF}
.casenav{padding-block:8px 24px}

/* footer */
.foot{border-top:3px double var(--ink);padding-block:40px 48px;display:grid;gap:14px}
.foot p{margin:0;color:var(--muted);font-size:14px;max-width:60ch}
.footlinks{display:flex;flex-wrap:wrap;gap:8px 22px}
.footlinks a{color:var(--ink);text-decoration:none;font-size:14px;font-weight:500}
.footlinks a:hover{color:var(--wine)}
.fine{font-size:12px!important}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Hero headshot (replaces 'Photo to come' placeholder) */
.photo.has-img{aspect-ratio:auto;padding:0 0 20px;justify-content:flex-start}
.photo.has-img img{display:block;width:100%;height:auto;margin-bottom:14px}
.photo.has-img b,.photo.has-img em{padding:0 22px}