:root{
  --ground:#FBF8F3;--surface:#FFFFFF;--forest:#063627;--forest-deep:#042419;
  --sand:#DDCCB8;--sand-soft:#EFE6DA;--saffron:#B07C24;--ink:#1C211D;
  --muted:#6B7169;--rule:#E2DACD;--on-forest:#F3EFE7;
  --shadow:0 1px 2px rgba(6,54,39,.06), 0 8px 22px rgba(6,54,39,.07);--maxw:1060px;
}
:root:not([data-theme="light"]){
  @media (prefers-color-scheme: dark){
    --ground:#0A1310;--surface:#0F1C17;--forest:#0E2B21;--forest-deep:#081310;
    --sand:#B8A68F;--sand-soft:#1A2A23;--saffron:#D9A445;--ink:#E9E5DB;
    --muted:#9AA398;--rule:#20322A;--on-forest:#EFEAE0;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 22px rgba(0,0,0,.35);
  }
}
:root[data-theme="dark"]{
  --ground:#0A1310;--surface:#0F1C17;--forest:#0E2B21;--forest-deep:#081310;
  --sand:#B8A68F;--sand-soft:#1A2A23;--saffron:#D9A445;--ink:#E9E5DB;
  --muted:#9AA398;--rule:#20322A;--on-forest:#EFEAE0;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 22px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font-family:"Karla","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:16px;line-height:1.52;-webkit-font-smoothing:antialiased}
img{max-width:100%}
a{color:inherit}
p{margin:0}
:focus-visible{outline:2px solid var(--saffron);outline-offset:3px;border-radius:2px}
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:20px}

.masthead{background:var(--forest);color:var(--on-forest)}
.langbar{border-bottom:1px solid rgba(221,204,184,.16)}
.langbar .wrap{padding-block:7px;display:flex;justify-content:flex-end;gap:2px}
.langbar button{font:inherit;font-size:11px;letter-spacing:.14em;font-weight:600;background:none;border:0;color:rgba(221,204,184,.62);cursor:pointer;padding:4px 9px;border-radius:2px}
.langbar button:hover{color:var(--on-forest)}
.langbar button[aria-pressed="true"]{color:var(--forest);background:var(--sand)}
.masthead .top{padding-block:20px 14px}
.brandrow{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.mark{width:76px;height:76px;flex:none;border-radius:50%;object-fit:cover;display:block;background:#FBF8F3;border:1px solid rgba(221,204,184,.4)}
.wordmark{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:clamp(28px,5.6vw,42px);line-height:1.03;margin:0;text-wrap:balance}
.tagline{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:clamp(14px,2.2vw,18px);color:var(--sand);margin-top:2px;max-width:26ch}
nav{margin-top:14px;border-top:1px solid rgba(221,204,184,.2);padding-top:9px}
nav ul{list-style:none;display:flex;gap:24px;margin:0;padding:0;flex-wrap:wrap}
nav a{text-decoration:none;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--sand);padding-block:5px;border-bottom:1px solid transparent;cursor:pointer}
nav a:hover,nav a[aria-current]{color:var(--on-forest);border-bottom-color:var(--saffron)}

.eyebrow{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--saffron);font-weight:600}
.origin{font-size:10px;letter-spacing:.15em;text-transform:uppercase;font-weight:600;color:var(--muted);display:inline-flex;align-items:center;gap:7px}
.origin::before{content:"";width:15px;height:1px;background:var(--saffron)}
.link{font-size:10px;letter-spacing:.15em;text-transform:uppercase;font-weight:600;color:var(--saffron);text-decoration:none;display:inline-flex;align-items:center;gap:7px;cursor:pointer;background:none;border:0;padding:0;font-family:inherit}
.link::before{content:"";width:15px;height:1px;background:var(--saffron)}
.dot{width:3px;height:3px;border-radius:50%;background:var(--rule);flex:none}
.page-head{padding-block:30px 0}
.page-head h2,.page-head h1{font-family:"Cormorant Garamond",Georgia,serif;font-weight:400;font-size:clamp(25px,4.4vw,35px);line-height:1.15;margin:8px 0 0;max-width:24ch;text-wrap:balance}
.page-head .sub{margin-top:9px;font-size:15.5px;color:var(--muted);max-width:58ch}

/* home hero */
.hero-inner{max-width:720px;padding-block:20px 4px}
.hero-inner h2,.hero-inner h1{font-size:clamp(31px,5.6vw,50px);max-width:16em}
.hero-inner .sub{max-width:46ch;margin-top:14px}
.hero-inner h2 em,.hero-inner h1 em{font-style:italic;color:var(--saffron)}

.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding-top:30px;border-bottom:1px solid var(--rule);padding-bottom:9px}
.sec-head h3,.sec-head h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:23px;margin:0}
.sec-head span{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.cards{list-style:none;margin:0;padding:20px 0 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(238px,1fr));gap:24px 22px}
.card{display:flex;flex-direction:column;gap:8px}
.card-img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;border-radius:2px}
.card h4,.card h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:20px;line-height:1.16;margin:0;text-wrap:balance}
.card h4 a,.card h3 a{text-decoration:none;cursor:pointer}
.card h4 a:hover,.card h3 a:hover{color:var(--saffron)}
.card .meta{font-size:11.5px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.more{padding-block:22px 34px}

/* about */
.about-grid{display:grid;grid-template-columns:minmax(0,300px) 1fr;gap:32px;align-items:start;padding-block:28px}
.about-img{width:100%;display:block;border-radius:2px;aspect-ratio:4/5;object-fit:cover;box-shadow:var(--shadow)}
.about-body h3,.about-body h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:22px;margin:0 0 6px}
.about-body h3.later,.about-body h2.later{margin-top:24px}
.about-body p{max-width:60ch;font-size:15.5px;line-height:1.55}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:22px;padding-top:20px;border-top:1px solid var(--rule)}
.pair h4,.pair h3{font-family:"Cormorant Garamond",Georgia,serif;font-size:18px;font-weight:600;margin:0 0 3px;color:var(--saffron)}
.pair p{font-size:14.5px;color:var(--muted)}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;padding-block:28px 40px;align-items:start}
.panel{background:var(--surface);border:1px solid var(--rule);padding:22px 24px}
.panel.sand{background:var(--sand-soft)}
.panel h3,.panel h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:21px;margin:0 0 5px}
.panel p{color:var(--muted);font-size:14.5px;max-width:44ch}
.panel form{display:flex;gap:9px;flex-wrap:wrap;margin-top:14px}
.panel input{font:inherit;font-size:14.5px;padding:10px 13px;border:1px solid var(--rule);background:var(--ground);color:var(--ink);min-width:190px;flex:1;border-radius:2px}
.btn{font:inherit;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;padding:11px 20px;border:0;border-radius:2px;background:var(--forest);color:var(--on-forest);cursor:pointer;transition:background .18s ease}
.btn:hover{background:var(--forest-deep)}
.chan{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column}
.chan li{padding:11px 0;border-bottom:1px solid var(--rule);display:flex;justify-content:space-between;gap:12px;align-items:baseline;flex-wrap:wrap}
.chan li:last-child{border-bottom:0}
.chan dt{font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);font-weight:600}
.chan a{font-size:15px;text-decoration:none;border-bottom:1px solid var(--saffron)}
.chan a:hover{color:var(--saffron)}

footer{background:var(--forest-deep);color:rgba(243,239,231,.72);font-size:12.5px;margin-top:10px}
footer .wrap{padding-block:22px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
footer a{color:var(--sand)}

/* recipe */
.back{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-decoration:none;margin-top:22px;cursor:pointer}
.back:hover{color:var(--saffron)}
.recipe-head{padding-block:14px 22px;border-bottom:1px solid var(--rule)}
.recipe-head h2,.recipe-head h1{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:clamp(30px,5.4vw,45px);line-height:1.06;margin:9px 0 10px;text-wrap:balance;max-width:19ch}
.standfirst{font-size:16.5px;max-width:62ch;line-height:1.5}
.byline{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:13px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.recipe-hero-img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;border-radius:2px;margin-top:20px}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);margin-top:20px}
.fact{background:var(--ground);padding:12px 10px;text-align:center}
.fact dt{font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);margin:0 0 3px}
.fact dd{margin:0;font-family:"Cormorant Garamond",Georgia,serif;font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.2}
.cook{display:grid;grid-template-columns:286px 1fr;gap:38px;padding-block:30px 6px;align-items:start}
.ingredients{background:var(--sand-soft);border:1px solid var(--rule);padding:20px;position:sticky;top:16px}
.ingredients h3,.ingredients h2{font-family:"Cormorant Garamond",Georgia,serif;font-size:21px;font-weight:600;margin:0 0 3px}
.ingredients ul{list-style:none;margin:12px 0 0;padding:0}
.ingredients li{padding:6px 0;border-bottom:1px solid var(--rule);font-size:14.5px;display:flex;gap:9px;line-height:1.4}
.ingredients li:last-child{border-bottom:0}
.qty{font-variant-numeric:tabular-nums;font-weight:600;color:var(--saffron);flex:none;min-width:62px}
.method h3,.method h2{font-family:"Cormorant Garamond",Georgia,serif;font-size:21px;font-weight:600;margin:0 0 7px}
.method h3.later,.method h2.later{margin-top:18px}
.method ol{margin:0;padding:0;list-style:none;counter-reset:step;display:flex;flex-direction:column;gap:3px}
.method li{counter-increment:step;display:grid;grid-template-columns:20px 1fr;gap:10px;max-width:64ch;line-height:1.42;padding-block:2px}
.method li::before{content:counter(step);font-family:"Cormorant Garamond",Georgia,serif;font-size:16px;font-weight:600;color:var(--saffron);line-height:1.5;font-variant-numeric:tabular-nums}
.story{background:var(--surface);border-left:3px solid var(--saffron);padding:18px 22px;margin-top:28px;max-width:64ch}
.story p{font-family:"Cormorant Garamond",Georgia,serif;font-size:18px;line-height:1.45;font-style:italic}
.closing{margin-top:18px;max-width:64ch;color:var(--muted);font-size:15px}
.watch{margin-top:28px;padding-block:22px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.watch-inner{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center}
.watch h3,.watch h2{font-family:"Cormorant Garamond",Georgia,serif;font-size:22px;font-weight:600;margin:0 0 2px}
.watch p{color:var(--muted);font-size:14.5px;max-width:42ch}
.cta{text-decoration:none;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;padding:11px 20px;background:var(--forest);color:var(--on-forest);border-radius:2px;white-space:nowrap}
.cta:hover{background:var(--forest-deep)}
.equip{margin-top:26px;padding-bottom:40px}
.equip h3,.equip h2{font-family:"Cormorant Garamond",Georgia,serif;font-size:21px;font-weight:600;margin:0 0 3px}
.equip p.note{margin-bottom:13px;color:var(--muted);font-size:13.5px;max-width:58ch}
.equip ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:11px}
.equip li{border:1px solid var(--rule);padding:12px 14px;background:var(--surface);display:flex;flex-direction:column;gap:1px}
.equip strong{font-weight:600;font-size:14.5px}
.equip small{color:var(--muted);font-size:12px;line-height:1.4}

[hidden]{display:none!important}
@media (max-width:860px){
  .about-grid{grid-template-columns:1fr;gap:20px}
  .about-img{max-width:260px}
  .pair,.contact-grid{grid-template-columns:1fr}
  .cook{grid-template-columns:1fr;gap:26px}
  .ingredients{position:static}
  .watch-inner{grid-template-columns:1fr}
}
@media (max-width:520px){.facts{grid-template-columns:1fr 1fr}.mark{width:58px;height:58px}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.card{position:relative}
.card-hit{display:block;text-decoration:none}
.card-hit:focus-visible{outline:2px solid var(--saffron);outline-offset:3px}
.ing-group{display:block!important;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--saffron);border:0!important;padding:14px 0 2px!important;font-weight:600}
.ing-group:first-child{padding-top:0!important}
.serve{margin-top:22px;padding-top:16px;border-top:1px solid var(--rule)}
.serve h3,.serve h2{margin:0 0 6px}
.serve ul{list-style:none;margin:0;padding:0}
.serve li{font-size:13.5px;color:var(--muted);padding:3px 0 3px 20px;position:relative;line-height:1.5}
.serve li::before{content:"—";position:absolute;left:0;color:var(--saffron)}
.method h3,.method h2{margin-top:26px}
.method h3:first-child,.method h2:first-child{margin-top:0}
.news-note{margin:10px 0 0;font-size:12.5px;color:var(--muted)}
.chan div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:11px 0;border-bottom:1px solid var(--rule)}
.chan div:last-child{border-bottom:0}
.chan dd{margin:0;text-align:right}

.ic{width:15px;height:15px;flex:0 0 auto;display:inline-block;vertical-align:-2px}
.chan div{gap:10px}
.chan dt{display:flex;align-items:center;gap:8px}
footer a{display:inline-flex;align-items:center;gap:6px}
.shop-panel{padding-bottom:26px}
.shop-panel #c-shop-p{max-width:64ch}
.shop-grid{list-style:none;margin:22px 0 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(216px,1fr));gap:18px}
.shop-grid.two{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));max-width:640px;margin-top:18px}
.p-card{display:flex;flex-direction:column;text-align:left;gap:0;padding:0;cursor:pointer;
  background:var(--surface);border:1px solid var(--rule);border-radius:3px;overflow:hidden;
  font:inherit;color:inherit;transition:border-color .15s,transform .15s}
.p-card:hover{border-color:var(--saffron);transform:translateY(-2px)}
.p-card:focus-visible{outline:2px solid var(--saffron);outline-offset:2px}
.p-art{display:block;width:100%;height:auto;aspect-ratio:4/3}
.p-body{padding:13px 14px 14px;display:flex;flex-direction:column;gap:5px;flex:1}
.p-name{font-family:"Cormorant Garamond",Georgia,serif;font-size:18px;font-weight:600;line-height:1.2;margin:0;text-wrap:balance}
.p-note{font-size:12.5px;color:var(--muted);line-height:1.45;margin:0;flex:1}
.p-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px}
.p-price{font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.p-cta{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--saffron);font-weight:600}
.p-card.on{border-color:var(--saffron)}
.p-card.on .p-cta{color:var(--forest);background:var(--saffron);padding:3px 7px;border-radius:2px}
:root[data-theme="dark"] .p-card.on .p-cta,:root:not([data-theme="light"]) .p-card.on .p-cta{color:#0A1310}
.tally{margin:18px 0 0;font-size:13px;color:var(--muted);display:flex;gap:10px;flex-wrap:wrap;align-items:baseline}
.tally a{color:var(--saffron)}
.stats{margin-top:20px;padding-top:16px;border-top:1px solid var(--rule)}
.stats h4{margin:0 0 8px;font-size:11.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--muted);font-weight:600}
.stats ul{list-style:none;margin:0;padding:0;font-size:13px}
.stats li{display:flex;justify-content:space-between;gap:12px;padding:4px 0;border-bottom:1px solid var(--rule)}
.stats li:last-child{border-bottom:0}
.stats b{font-variant-numeric:tabular-nums;font-weight:600}
.equip .sec-head{margin-bottom:0}
@media (prefers-reduced-motion:reduce){.p-card{transition:none}.p-card:hover{transform:none}}

.shop-grid li{display:flex;margin:0;padding:0;border:0;background:none;box-shadow:none;list-style:none}
.shop-grid li::before{content:none}
.p-card{width:100%}
.chan div{justify-content:flex-start}
.chan dd{margin-left:auto}
footer a{vertical-align:middle}

.stats-sub{margin:0 0 10px;font-size:12px;color:var(--muted)}
#f-copy{cursor:default;-webkit-user-select:none;user-select:none}

.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.browse{display:grid;grid-template-columns:214px minmax(0,1fr);gap:38px;align-items:start;padding-top:6px}
.side{position:sticky;top:18px}
.search{position:relative;display:flex;align-items:center;margin-bottom:22px}
.search .q-ic{position:absolute;left:10px;width:15px;height:15px;color:var(--muted);pointer-events:none}
.search input{width:100%;font:inherit;font-size:13.5px;padding:9px 30px 9px 31px;border:1px solid var(--rule);
  border-radius:2px;background:var(--surface);color:var(--ink);-webkit-appearance:none}
.search input::-webkit-search-cancel-button{display:none}
.search input:focus{outline:none;border-color:var(--saffron)}
.q-clear{position:absolute;right:4px;border:0;background:none;color:var(--muted);font-size:19px;
  line-height:1;cursor:pointer;padding:4px 7px}
.q-clear:hover{color:var(--ink)}
.cat-wrap summary{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);
  font-weight:600;cursor:pointer;padding-bottom:9px;border-bottom:1px solid var(--rule);list-style:none}
.cat-wrap summary::-webkit-details-marker{display:none}
.cat-wrap summary::after{content:"–";float:right;font-size:13px}
.cat-wrap:not([open]) summary::after{content:"+"}
.cat-list{list-style:none;margin:0;padding:8px 0 0}
.cat-list button{display:flex;width:100%;justify-content:space-between;align-items:baseline;gap:10px;
  font:inherit;font-size:13.5px;text-align:left;background:none;border:0;cursor:pointer;color:var(--ink);
  padding:5px 0;border-radius:2px}
.cat-list button:hover:not(:disabled){color:var(--saffron)}
.cat-list button:disabled{color:var(--muted);opacity:.45;cursor:default}
.cat-list button[aria-current="true"]{color:var(--saffron);font-weight:600}
.cat-list b{font-weight:400;font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.cat-list .all{border-bottom:1px solid var(--rule);padding-bottom:9px;margin-bottom:5px}
.results .sec-head:first-child{padding-top:0}
.no-hits{padding:34px 0;color:var(--muted);font-size:14px}
@media (max-width:760px){
  .browse{grid-template-columns:1fr;gap:8px}
  .side{position:static}
  .cat-list{columns:2;column-gap:22px}
  .cat-list button{padding:7px 0}
  .cat-list .all{columns:1;-webkit-column-span:all;column-span:all}
}
.prose p{margin:0 0 11px}
.prose p:last-child{margin-bottom:0}
.g-head{grid-column:1/-1;display:block;margin:14px 0 -4px}
.g-head:first-child{margin-top:0}
.g-head h4,.g-head h3{margin:0;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--saffron);font-weight:600;padding-bottom:7px;border-bottom:1px solid var(--rule)}

/* ---- static-site additions ------------------------------------------- */
.skip{position:absolute;left:-9999px;top:0;z-index:20;background:var(--forest);color:var(--on-forest);
  padding:10px 16px;font-size:13px;text-decoration:none}
.skip:focus{left:0}
.langbar a{display:inline-block;text-decoration:none;font-size:11px;letter-spacing:.14em;font-weight:600;
  color:rgba(221,204,184,.62);padding:4px 9px;border-radius:2px}
.langbar a:hover{color:var(--on-forest)}
.langbar a[aria-current="true"]{color:var(--forest);background:var(--sand)}
.mark-link{display:block;flex:none}
.wordmark a{color:inherit;text-decoration:none}
.wordmark a:hover{color:var(--sand)}
.wordmark{font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;
  font-size:clamp(28px,5.6vw,42px);line-height:1.03;margin:0;text-wrap:balance}
footer .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.social{margin:0;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.card-hit{display:block;text-decoration:none}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* width/height attributes are there to reserve space; CSS owns the real ratio */
.card-img,.about-img{height:auto}
img{max-width:100%}
