
:root{--ink:#2a1f1a;--soft:#5e4c42;--muted:#8a7668;--paper:#fbf6ee;--cream:#f3e9da;--card:#fff;--accent:#b4441f;--accent2:#7a2a12;--gold:#c99a3b;--sage:#56704a;--line:#e7dccb;--r:14px;--sh:0 1px 2px rgba(60,30,10,.06),0 8px 24px rgba(60,30,10,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font:17px/1.65 'Inter',system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}
h1,h2,h3,.serif{font-family:'Fraunces',Georgia,serif;font-optical-sizing:auto;line-height:1.12;letter-spacing:-.01em}
a{color:var(--accent)}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.skip{position:absolute;left:-999px}.skip:focus{left:1em;top:1em;z-index:99;background:#fff;padding:.5em 1em}
.nav{position:sticky;top:0;z-index:50;background:rgba(251,246,238,.92);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.nav .in{max-width:1180px;margin:auto;display:flex;align-items:center;gap:1rem;padding:.55rem 1.2rem}
.brand{font-family:'Fraunces',serif;font-weight:700;font-size:1.15rem;color:var(--ink);text-decoration:none;white-space:nowrap}
.brand b{color:var(--accent)}
.sbox{flex:1;position:relative;max-width:460px;margin-left:auto}
.sbox input{width:100%;font:inherit;font-size:.95rem;padding:.55rem 1rem .55rem 2.3rem;border:1.5px solid var(--line);border-radius:99px;background:#fff;transition:border .2s,box-shadow .2s}
.sbox input:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(180,68,31,.12);outline:none}
.sbox svg{position:absolute;left:.8rem;top:50%;transform:translateY(-50%);width:16px;opacity:.5}
.drop{position:absolute;top:110%;left:0;right:0;background:#fff;border-radius:12px;box-shadow:var(--sh);max-height:60vh;overflow:auto;display:none;padding:.4rem}
.drop a{display:flex;justify-content:space-between;gap:1rem;padding:.55rem .8rem;border-radius:8px;text-decoration:none;color:var(--ink)}
.drop a:hover,.drop a.on{background:var(--cream)}.drop small{color:var(--muted)}
.navlinks a{color:var(--soft);text-decoration:none;font-weight:600;font-size:.9rem;margin-left:.9rem}.navlinks a:hover{color:var(--accent)}
.hero{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 15% 10%,#d86a3a 0,#a83a1a 40%,#5c1d0c 100%);color:#fff8ef;text-align:center;padding:clamp(4rem,10vw,8rem) 1.2rem clamp(3.5rem,8vw,6rem)}
.hero:before{content:"";position:absolute;inset:0;background:url(/art/hero.svg) center/cover;opacity:.18}
.hero .kick{position:relative;letter-spacing:.32em;text-transform:uppercase;font-size:.78rem;font-weight:600;opacity:.9}
.hero h1{position:relative;font-size:clamp(2.6rem,7vw,5.4rem);font-weight:600;margin:.35em auto .2em;max-width:14ch}
.hero h1 em{font-style:italic;font-weight:400;color:#ffd9a8}
.hero p.tag{position:relative;font-family:'Fraunces',serif;font-style:italic;font-size:clamp(1.2rem,2.6vw,1.6rem);margin:0;opacity:.95}
.hero .rule{position:relative;width:70px;height:2px;background:#ffd9a8;margin:1.6rem auto}
.cta{position:relative;display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:.5em;font:600 .95rem 'Inter',sans-serif;padding:.8em 1.4em;border-radius:99px;text-decoration:none;border:0;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.18)}
.btn.light{background:#fff8ef;color:var(--accent2)}.btn.ghost{background:transparent;color:#fff8ef;box-shadow:inset 0 0 0 1.5px rgba(255,248,239,.6)}
.btn.solid{background:var(--accent);color:#fff}.btn.out{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.stats{position:relative;display:flex;gap:2.5rem;justify-content:center;margin-top:2.4rem;font-size:.85rem;opacity:.9}.stats b{display:block;font-family:'Fraunces',serif;font-size:1.8rem}
.wrap{max-width:1180px;margin:auto;padding:0 1.2rem}
.sec{padding:clamp(2.5rem,6vw,4.5rem) 0}.sec h2{font-size:clamp(1.8rem,3.6vw,2.6rem);margin:0 0 .3em}
.eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.2em;font-size:.74rem;font-weight:700}
.lede{color:var(--soft);max-width:60ch;margin:0 0 2rem}
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1.3rem}
.ccard{position:relative;display:block;border-radius:var(--r);overflow:hidden;background:var(--card);box-shadow:var(--sh);text-decoration:none;color:var(--ink);transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s}
.ccard:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(60,30,10,.16)}
.ccard img{display:block;width:100%;aspect-ratio:400/260;object-fit:cover;transition:transform .6s}.ccard:hover img{transform:scale(1.05)}
.ccard .t{padding:1rem 1.2rem 1.2rem}.ccard h3{margin:0;font-size:1.3rem}.ccard p{margin:.25rem 0 0;color:var(--muted);font-size:.9rem}
.ccard .n{position:absolute;top:.8rem;right:.8rem;background:rgba(255,255,255,.92);border-radius:99px;padding:.15rem .7rem;font-size:.78rem;font-weight:700;color:var(--accent2)}
.cooks{background:var(--cream)}
.cookgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.3rem}
.cook{background:#fff;border-radius:var(--r);padding:1.6rem;box-shadow:var(--sh);border-top:5px solid var(--gold);text-decoration:none;color:var(--ink);transition:transform .3s}.cook:hover{transform:translateY(-3px)}
.cook.kirk{border-color:var(--accent)}.cook.guest{border-color:var(--sage)}
.cook h3{margin:.3rem 0;font-size:1.45rem}.cook p{margin:0;color:var(--soft);font-size:.92rem}
.seal{align-self:flex-start;display:inline-flex;align-items:center;gap:.45em;font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:.3em .8em;border-radius:99px;background:#f7ecd5;color:#7a5410}
.seal.kirk{background:#f9e1d6;color:var(--accent2)}.seal.guest{background:#e3ecdc;color:#2f4627}
.rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.1rem}
.rcard{display:flex;flex-direction:column;background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);text-decoration:none;color:var(--ink);transition:transform .25s,box-shadow .25s}
.rcard:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(60,30,10,.14)}
.rcard .im{aspect-ratio:16/10;background-size:cover;background-position:center;position:relative}
.rcard .im span{position:absolute;inset:auto 0 0 0;padding:.4rem .8rem;font-family:'Fraunces',serif;font-style:italic;color:#fff;font-size:.85rem;background:linear-gradient(transparent,rgba(0,0,0,.35))}
.rcard .b{padding:.9rem 1rem 1.1rem;display:flex;flex-direction:column;gap:.5rem;flex:1}.rcard h3{margin:0;font-size:1.15rem}
.rcard .m{color:var(--muted);font-size:.8rem;margin-top:auto}
.chead{background:var(--cream);border-bottom:1px solid var(--line)}
.chead .in{padding-left:1.2rem!important;padding-right:1.2rem!important;display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;align-items:center;padding:2.5rem 0}
.chead img{width:100%;border-radius:var(--r);box-shadow:var(--sh)}
.chead h1{font-size:clamp(2.2rem,5vw,3.6rem);margin:.3rem 0}
.crumbs{font-size:.85rem;color:var(--muted)}.crumbs a{color:var(--soft)}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.chips a{font-size:.85rem;text-decoration:none;color:var(--soft);background:#fff;border:1px solid var(--line);padding:.35em .9em;border-radius:99px;transition:all .2s}.chips a:hover,.chips a[aria-current]{background:var(--accent);color:#fff;border-color:var(--accent)}
/* recipe */
.rhero{background:linear-gradient(180deg,var(--cream),var(--paper));padding:2.2rem 0 1.4rem}
.rhero h1{font-size:clamp(2.2rem,5.5vw,3.8rem);margin:.5rem 0 .8rem;max-width:20ch}
.byline{display:flex;align-items:center;gap:.9rem;margin:.8rem 0 1.2rem}
.mono{flex:none;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-family:'Fraunces',serif;font-weight:700;font-size:1.2rem;color:#fff;background:var(--gold)}
.mono.kirk{background:var(--accent)}.mono.guest{background:var(--sage)}
.byline .w{font-family:'Fraunces',serif;font-size:1.15rem;font-weight:600}.byline .s{color:var(--muted);font-size:.85rem;font-style:italic}
.facts{display:flex;flex-wrap:wrap;gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:1.2rem 0}
.facts div{padding:.7rem 1.4rem .7rem 0;margin-right:1.4rem;border-right:1px solid var(--line)}.facts div:last-child{border:0}
.facts small{display:block;text-transform:uppercase;letter-spacing:.14em;font-size:.68rem;color:var(--muted);font-weight:700}.facts b{font-family:'Fraunces',serif;font-size:1.15rem;font-weight:600}
.tools{display:flex;flex-wrap:wrap;gap:.6rem}
.tools .btn{font-size:.88rem;padding:.6em 1.1em}
.btn[aria-pressed=true]{background:var(--sage);color:#fff;box-shadow:none}
.rbody{display:grid;grid-template-columns:minmax(260px,1fr) 1.7fr;gap:3rem;padding:2rem 0 4rem;align-items:start}
.ing{position:sticky;top:76px;background:#fff;border-radius:var(--r);padding:1.5rem 1.5rem 1.2rem;box-shadow:var(--sh)}
.ing h2,.dir h2{font-size:1.6rem;margin:0 0 .6rem}
.scale{display:flex;gap:.3rem;align-items:center;margin:0 0 1rem;font-size:.82rem;color:var(--muted)}
.scale button{font:600 .82rem Inter,sans-serif;border:1.5px solid var(--line);background:#fff;border-radius:99px;padding:.25em .75em;cursor:pointer;color:var(--soft)}
.scale button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.ing h4{font-family:'Fraunces',serif;font-size:1.05rem;margin:1rem 0 .3rem;color:var(--accent2)}
.ing ul{list-style:none;padding:0;margin:0}
.ing li label{display:flex;gap:.7rem;padding:.5rem 0;border-bottom:1px dashed var(--line);cursor:pointer;transition:opacity .2s}
.ing input{appearance:none;flex:none;width:20px;height:20px;margin-top:.2rem;border:2px solid #c9b8a5;border-radius:6px;display:grid;place-items:center;transition:all .2s;cursor:pointer}
.ing input:checked{background:var(--sage);border-color:var(--sage)}.ing input:checked:after{content:"";width:5px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-1px)}
.ing input:checked+span{text-decoration:line-through;opacity:.45}
.ing em,.dir em{color:var(--muted)}
.dir ol{list-style:none;counter-reset:s;padding:0;margin:0}
.dir>ol>li{counter-increment:s;position:relative;padding:0 0 1.4rem 3.4rem;font-size:1.05rem}
.dir>ol>li:before{content:counter(s);position:absolute;left:0;top:-.1rem;width:2.3rem;height:2.3rem;border-radius:50%;background:var(--cream);color:var(--accent2);font:700 1.05rem 'Fraunces',serif;display:grid;place-items:center}
.dir ol ol{list-style:lower-alpha;padding-left:1.2rem;margin-top:.4rem}
.dir li.done{opacity:.45}.dir>ol>li{cursor:pointer}
.dir h4{font-family:'Fraunces',serif;font-size:1.15rem;color:var(--accent2);margin:1.2rem 0 .8rem}
.note{background:#fff7e6;border-left:4px solid var(--gold);padding:1rem 1.2rem;margin:1.2rem 0;border-radius:0 10px 10px 0;color:var(--soft)}
.note b{color:var(--ink)}
figure{margin:1.5rem 0}figure img{max-width:100%;border-radius:var(--r);box-shadow:var(--sh)}figcaption{font-size:.85rem;color:var(--muted);font-style:italic;margin-top:.5rem}
.more{border-top:1px solid var(--line);padding:2.5rem 0 4rem}
footer{background:#2a1a12;color:#e9d9c6;padding:3rem 1.2rem;text-align:center;font-size:.9rem}footer a{color:#ffd9a8}footer .serif{font-size:1.6rem;color:#fff}
body.cook-on .ing li label{font-size:1.15rem}body.cook-on .dir>ol>li{font-size:1.25rem}
.toast{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%) translateY(150%);background:var(--ink);color:#fff;padding:.6rem 1.2rem;border-radius:99px;font-size:.9rem;transition:transform .3s;z-index:60}.toast.show{transform:translateX(-50%)}
@media (max-width:820px){.rbody{grid-template-columns:1fr;gap:1.5rem}.ing{position:static}.chead .in{grid-template-columns:1fr}.chead img{order:-1;max-height:200px;object-fit:cover}.navlinks{display:none}.brand span{display:none}.stats{gap:1.4rem}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media print{.nav,.tools,.scale,.more,footer,.skip,.noprint,.toast{display:none!important}body{background:#fff;font:11pt/1.45 Georgia,serif}
.rhero{background:none;padding:0}.rhero h1{font-size:24pt}.rbody{grid-template-columns:1fr 1.8fr;gap:1.5rem;padding:0}.ing{box-shadow:none;padding:0;position:static}.ing input{width:12px;height:12px}
.dir>ol>li{padding-left:2rem;break-inside:avoid}.dir>ol>li:before{width:1.5rem;height:1.5rem;font-size:10pt}.wrap{max-width:none;padding:0}a{color:inherit;text-decoration:none}}
