@font-face{font-family:"Fraunces";src:url(/assets/fonts/fraunces.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Fraunces";src:url(/assets/fonts/fraunces-italic.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:"Karla";src:url(/assets/fonts/karla.woff2) format("woff2");font-weight:200 800;font-display:swap}
:root{--sand:#f3e9db;--sand-2:#eadcc7;--clay:#a64b2a;--clay-dk:#843a1f;--olive:#5f6136;--ochre:#d29a3a;--ink:#3a2a20;--ink-2:#5b4637;--line:#dcc8ac;
--display:"Fraunces",Georgia,serif;--text:"Karla",system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--sand);color:var(--ink);font-family:var(--text);font-size:1.125rem;line-height:1.75}
img{max-width:100%;height:auto;display:block}
a{color:var(--clay-dk);text-decoration-thickness:2px;text-decoration-color:rgba(166,75,42,.35);text-underline-offset:.22em}
a:hover{text-decoration-color:var(--clay)}
:focus-visible{outline:3px dashed var(--olive);outline-offset:3px}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.4rem .8rem;z-index:9}
.wrap{width:min(100% - 2.6rem,70rem);margin-inline:auto}
h1,h2,h3{font-family:var(--display);font-variation-settings:"SOFT" 100,"WONK" 0;font-weight:500;line-height:1.08;color:var(--ink);margin:0 0 .6em}
h2{font-size:clamp(2rem,4.5vw,2.9rem)}
h3{font-size:1.45rem}
.top{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.4rem 0}
.word{font-family:var(--display);font-style:italic;font-size:1.7rem;color:var(--clay);text-decoration:none;font-variation-settings:"SOFT" 100,"WONK" 1}
.top ul{list-style:none;display:flex;gap:1.4rem;margin:0;padding:0;font-weight:600;font-size:1rem}
.top a{text-decoration:none;color:var(--ink-2)}.top a[aria-current]{color:var(--clay);border-bottom:2px solid var(--ochre)}
.hero{display:grid;grid-template-columns:1.25fr .9fr;gap:3rem;align-items:center;padding:3rem 0 4.5rem}
.hero h1{font-size:clamp(4rem,13vw,9rem);font-style:italic;color:var(--clay);font-variation-settings:"SOFT" 100,"WONK" 1;letter-spacing:-.02em;margin:0 0 .2em}
.hero .sub{font-size:clamp(1.25rem,2.6vw,1.6rem);font-family:var(--display);font-weight:400;color:var(--ink-2);max-width:30rem;line-height:1.35}
.hero .say{margin-top:1.6rem;max-width:32rem}
.arch{position:relative;justify-self:center;width:min(100%,360px)}
.arch img{border-radius:999px 999px 18px 18px;width:100%;aspect-ratio:440/550;object-fit:cover;box-shadow:14px 14px 0 var(--sand-2)}
.arch::before{content:"";position:absolute;inset:-22px auto auto -22px;width:110px;height:110px;border-radius:50%;background:var(--ochre);opacity:.35;z-index:-1}
.arch figcaption{font-size:.9rem;color:var(--ink-2);margin-top:1.1rem;text-align:center;font-style:italic}
.band{background:#fbf5ec;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:4.5rem 0}
.split{display:grid;grid-template-columns:.8fr 1.2fr;gap:3rem}
.kicker{font-weight:700;font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:var(--olive);margin:0 0 .6rem}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem;margin-top:2rem}
.card{background:var(--sand);border-radius:22px;padding:1.6rem 1.6rem 1.4rem;border:1px solid var(--line);display:flex;flex-direction:column}
.card.book{background:var(--olive);color:#f6efe2;border-color:var(--olive)}
.card.book h3,.card.book a{color:#fff}.card.book .kicker{color:#e8d3a2}
.card p{margin:0 0 1rem;font-size:1.02rem}
.card .go{margin-top:auto;font-weight:700}
section.plain{padding:4.5rem 0}
.name-note{max-width:40rem}
.name-note p:first-of-type{font-family:var(--display);font-size:1.45rem;line-height:1.45;color:var(--ink)}
.links{list-style:none;padding:0;margin:1.4rem 0 0;display:flex;flex-wrap:wrap;gap:.8rem}
.links a{display:inline-block;padding:.55rem 1.1rem;border-radius:999px;background:#fbf5ec;border:1px solid var(--line);text-decoration:none;font-weight:600;color:var(--ink)}
.links a:hover{border-color:var(--clay);color:var(--clay)}
/* book page */
.bookhero{display:grid;grid-template-columns:auto 1fr;gap:4rem;align-items:center;padding:3rem 0 4rem}
.cover{width:250px;aspect-ratio:2/3;border-radius:4px 12px 12px 4px;background:linear-gradient(160deg,#5f6136,#3f4123);color:#f3e9db;padding:2rem 1.6rem;display:flex;flex-direction:column;
box-shadow:inset 10px 0 0 rgba(0,0,0,.18),18px 22px 0 var(--sand-2);position:relative}
.cover .t{font-family:var(--display);font-size:2.25rem;line-height:1;font-style:italic;font-variation-settings:"SOFT" 100,"WONK" 1}
.cover .rule{width:52px;height:3px;background:var(--ochre);margin:1.2rem 0}
.cover .a{margin-top:auto;font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.78rem}
.cover .wt{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#e8d3a2}
.status{display:inline-block;background:var(--ochre);color:#2b1d12;font-weight:700;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:.3rem .9rem}
.bookhero h1{font-size:clamp(2.6rem,7vw,4.6rem);font-style:italic;font-variation-settings:"SOFT" 100,"WONK" 1;margin:.8rem 0 .6rem}
.prose{max-width:40rem}
.prose ul{padding-left:1.2rem}.prose li{margin:.3rem 0}
.note{font-size:.95rem;color:var(--ink-2);border-left:4px solid var(--ochre);padding:.2rem 0 .2rem 1rem;margin-top:2.4rem}
footer{background:var(--ink);color:#e9dccb;padding:3rem 0 2.6rem;margin-top:2rem;font-size:.98rem}
footer a{color:#f3c98d}
footer .word{color:#f3c98d}
footer .disc{color:#cdbca6;font-size:.92rem;border-top:1px solid #5b4637;padding-top:1.2rem;margin-top:1.4rem}
/* family story */
.storyhero{padding:2.5rem 0 3.5rem}.storyhero>*{max-width:46rem}
.storyhero h1{font-size:clamp(3rem,9vw,5.6rem);font-style:italic;color:var(--clay);font-variation-settings:"SOFT" 100,"WONK" 1;margin:.2rem 0 .3em}
.storyhero .sub{font-family:var(--display);font-size:clamp(1.2rem,2.4vw,1.5rem);color:var(--ink-2);line-height:1.4;margin:0}
.chapter{padding:4rem 0}
.chapter h2{font-size:clamp(1.9rem,4vw,2.6rem)}
.chapter-photo{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:4rem;align-items:start}
.story-note{padding:2.5rem 0 1rem;border-top:1px solid var(--line)}.story-note .note{margin-top:0}
.river{margin:0;position:relative}
.river img{border-radius:18px;width:100%;aspect-ratio:1650/2330;object-fit:cover;box-shadow:14px 14px 0 var(--sand-2)}
.river figcaption{font-size:.95rem;color:var(--ink-2);margin-top:1.1rem;font-style:italic;text-align:center}
.teaser{border-top:1px solid var(--line)}.teaser .go{font-weight:700}
@media (max-width:820px){.hero,.split,.bookhero,.chapter-photo{grid-template-columns:1fr;gap:2rem}.cards{grid-template-columns:1fr}.hero{padding-top:1rem}.arch{width:min(80%,320px)}.cover{width:200px}.river{max-width:420px}.chapter{padding:3rem 0}.top{flex-wrap:wrap;gap:.2rem 1rem}.top ul{gap:1rem}}
