/* Premium layout: editorial, restrained. Self-hosted fonts, one reading column (720px) inside a wider frame (1120px),
   8px spacing grid, hairline rules instead of boxes, one accent per view. Same palette as STIL.md. */
@font-face{font-family:"Young Serif";src:url(/assets/fonts/young-serif-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Figtree";src:url(/assets/fonts/figtree-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Figtree";src:url(/assets/fonts/figtree-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
:root{
  --bg:#f7f8f3; --surface:#fdfdfa; --fg:#2a2226; --muted:#6b6165; --line:#dfe2d6;
  --accent:#d0661f; --accent-ink:#a24d14; --soft:#eef1e4; --leaf:#5f7a3a; --plum:#2a2226; --on-plum:#e9e6dc;
  --display:"Young Serif",Georgia,"Times New Roman",serif;
  --body:"Figtree",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --s1:8px; --s2:16px; --s3:24px; --s4:40px; --s5:64px; --s6:104px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#18171a; --surface:#1f1e21; --fg:#efe9ea; --muted:#b3a9ad; --line:#353238;
  --accent:#f08a43; --accent-ink:#f5a56c; --soft:#25281f; --leaf:#a9c47f; --plum:#111013; --on-plum:#d9d4d6; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#18171a; --surface:#1f1e21; --fg:#efe9ea; --muted:#b3a9ad; --line:#353238;
  --accent:#f08a43; --accent-ink:#f5a56c; --soft:#25281f; --leaf:#a9c47f; --plum:#111013; --on-plum:#d9d4d6; color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:400 17px/1.65 var(--body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
@media(min-width:900px){body{font-size:18px}}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent-ink);text-underline-offset:.18em;text-decoration-thickness:1px}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
::selection{background:#f3d9c6;color:#2a2226}
.wrap{max-width:1120px;margin:0 auto;padding-inline:var(--s2)}
@media(min-width:700px){.wrap{padding-inline:var(--s4)}}
.read{max-width:720px}
.sr{position:absolute;left:-9999px}

/* Type scale: 5 steps only */
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.12;letter-spacing:-.01em;text-wrap:balance;margin:0}
h1{font-size:clamp(2.1rem,6vw,3.6rem)}
h2{font-size:clamp(1.45rem,3vw,1.9rem)}
h3{font-size:1.3rem}
.eyebrow{font:600 .72rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--leaf);margin:0 0 var(--s2)}
.lede{font-size:1.12rem;line-height:1.6;color:var(--muted);max-width:58ch;margin:var(--s3) 0 0}
.accent{color:var(--accent)}

/* Header: centred wordmark, quiet nav */
.top{border-bottom:1px solid var(--line);background:var(--bg)}
.top-inner{display:flex;flex-direction:column;align-items:center;gap:var(--s1);padding-block:var(--s3) var(--s2)}
.brand{font:400 1.5rem/1 var(--display);color:var(--fg);text-decoration:none;letter-spacing:-.01em}
.brand span{color:var(--leaf)}
nav{display:flex;gap:var(--s3);overflow-x:auto;max-width:100%;scrollbar-width:none;padding:var(--s1) 2px;-webkit-mask-image:linear-gradient(90deg,#000 90%,transparent)}
@media(min-width:900px){nav{-webkit-mask-image:none}}
nav::-webkit-scrollbar{display:none}
nav a{flex:none;font:600 .72rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-decoration:none;padding-block:4px;border-bottom:1px solid transparent}
nav a:hover,nav a[aria-current]{color:var(--fg);border-bottom-color:var(--accent)}

/* Home */
.hero{padding-block:var(--s5) var(--s4);text-align:center}
@media(min-width:900px){.hero{padding-block:var(--s6) var(--s5)}}
.hero h1{max-width:16ch;margin-inline:auto}
.hero .lede{margin-inline:auto}
.hero .cta{margin-top:var(--s4)}
.collections{display:grid;gap:var(--s4) var(--s3);grid-template-columns:1fr;padding-block:var(--s4) var(--s5);border-top:1px solid var(--line)}
@media(min-width:640px){.collections{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.collections{grid-template-columns:repeat(3,1fr)}}
.coll{display:block;text-decoration:none;color:var(--fg)}
.coll-img{aspect-ratio:4/5;object-fit:cover;width:100%;border-radius:2px;margin-bottom:var(--s2);background:var(--soft)}
.coll .count{font:400 .95rem var(--display);color:var(--accent)}
.coll h2{font-size:1.5rem;margin:var(--s1) 0}
.coll p{margin:0 0 var(--s2);color:var(--muted);font-size:.95rem}
.coll .more{font:600 .72rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--fg);border-bottom:1px solid var(--accent);padding-bottom:3px}
.coll:hover h2{color:var(--accent-ink)}
.coll.text{padding-top:var(--s3);border-top:2px solid var(--fg)}
.meet{display:grid;gap:var(--s3);padding-block:var(--s5);border-top:1px solid var(--line)}
@media(min-width:800px){.meet{grid-template-columns:220px 1fr;gap:var(--s5)}}
.meet p{margin:0 0 var(--s2);max-width:60ch}
.meet-img{width:100%;max-width:220px;aspect-ratio:4/5;object-fit:cover;border-radius:2px}
.meet .sig{font:400 1.4rem var(--display);color:var(--leaf)}

/* Buttons: one solid style, used once per view */
.btn,button{display:inline-block;background:var(--fg);color:var(--bg);border:1px solid var(--fg);border-radius:2px;padding:14px 26px;font:600 .78rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .2s,color .2s}
.btn:hover,button:hover{background:var(--accent-ink);border-color:var(--accent-ink);color:#fff}
button.ghost{background:transparent;color:var(--fg)}
button.ghost:hover{background:var(--fg);color:var(--bg);border-color:var(--fg)}
button.linklike{background:none;border:0;color:inherit;padding:0;font:inherit;letter-spacing:0;text-transform:none;text-decoration:underline;text-underline-offset:.18em}
button:disabled{opacity:.5;cursor:default}
.link{font:600 .78rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--fg);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:4px;white-space:nowrap}
.link:hover{color:var(--accent-ink)}

/* Roundup */
.page-head{padding-block:var(--s5) var(--s4);text-align:center}
.page-head h1{max-width:20ch;margin-inline:auto}
.page-head .lede{margin-inline:auto}
.byline{margin:var(--s3) 0 0;font-size:.85rem;color:var(--muted)}
.hero-img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:2px;margin:0 auto var(--s4);max-width:1120px}
.ai-label{font-size:.75rem;color:var(--muted);text-align:right;margin:calc(var(--s4) * -1 + 6px) 0 var(--s4)}
.cards{list-style:none;padding:0;margin:0 auto;max-width:880px;counter-reset:n}
.card{display:grid;grid-template-columns:56px 1fr;gap:var(--s2);padding-block:var(--s4);border-top:1px solid var(--line)}
@media(min-width:700px){.card{grid-template-columns:96px 1fr;gap:var(--s3)}}
.card.has-img{grid-template-columns:1fr}
@media(min-width:700px){.card.has-img{grid-template-columns:96px 240px 1fr}}
.card-num{font:400 2.4rem/1 var(--display);color:var(--accent)}
@media(min-width:700px){.card-num{font-size:3.4rem}}
.card-img img{aspect-ratio:4/5;object-fit:cover;width:100%;border-radius:2px}
.card-body{min-width:0}
.card-body h2{font-size:clamp(1.35rem,2.6vw,1.75rem);margin:0 0 var(--s1)}
.card-body h2 a{color:var(--fg);text-decoration:none}
.card-body h2 a:hover{color:var(--accent-ink)}
.by{margin:0 0 var(--s2);font-size:.85rem;color:var(--muted);letter-spacing:.02em}
.by strong{color:var(--fg);font-weight:600}
.protein{display:inline-block;font:400 1rem/1 var(--display);color:var(--leaf);margin:0 0 var(--s2)}
.protein b{font-weight:400;font-size:1.5rem;color:var(--fg)}
.card-body p.desc{margin:0 0 var(--s2);max-width:56ch}
.tags{display:flex;flex-wrap:wrap;margin:0 0 var(--s3);font:600 .68rem/1.8 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--leaf)}
.tags span{white-space:nowrap}
.tags span+span::before{content:"·";margin:0 .6em;color:var(--line)}
.faq{max-width:880px;margin:0 auto;padding-block:var(--s4) var(--s3);border-top:1px solid var(--line)}
.faq h2{font-size:clamp(1.5rem,3vw,2rem);margin-bottom:var(--s2)}
.faq h3{font-size:1.15rem;margin:var(--s3) 0 var(--s1)}
.faq p{margin:0;max-width:68ch}
.credit{max-width:880px;margin:0 auto;padding-block:var(--s4) var(--s5);border-top:1px solid var(--line);font-size:.85rem;color:var(--muted)}

/* Sign-up: product + promise */
.signup{background:var(--soft);padding-block:var(--s5)}
.signup-inner{display:grid;gap:var(--s4);align-items:center}
@media(min-width:800px){.signup-inner{grid-template-columns:1fr 300px;gap:var(--s5)}}
.signup h2{margin:0 0 var(--s2)}
.signup p{margin:0;max-width:52ch}
.signup-img{width:100%;max-width:300px;margin:0 auto;transform:rotate(2deg);box-shadow:0 1px 2px rgba(42,34,38,.08),0 18px 40px -12px rgba(42,34,38,.28);border-radius:2px}
.signup-form{display:flex;flex-wrap:wrap;gap:var(--s1);margin:var(--s3) 0 var(--s1)}
.signup-form input{flex:1 1 220px;min-width:0;padding:13px 16px;border:1px solid var(--line);border-radius:2px;font:inherit;font-size:1rem;background:var(--surface);color:var(--fg)}
.small{font-size:.8rem;color:var(--muted)}

/* Footer */
.foot{background:var(--plum);color:var(--on-plum);padding-block:var(--s5) var(--s4);font-size:.88rem}
.foot a,.foot button.linklike{color:var(--on-plum);text-decoration:none}
.foot a:hover,.foot button.linklike:hover{text-decoration:underline}
.foot .brand{color:#fff;font-size:1.3rem}
.foot .brand span{color:#b9cf93}
.foot-grid{display:grid;gap:var(--s3)}
@media(min-width:800px){.foot-grid{grid-template-columns:2fr 1fr 1fr}}
.foot h3{font:600 .7rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;margin:0 0 var(--s2);color:#b9cf93}
.foot ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.foot p{margin:var(--s2) 0 0;max-width:46ch;opacity:.85}
.foot .legal{border-top:1px solid rgba(255,255,255,.12);margin-top:var(--s4);padding-top:var(--s2);opacity:.7;font-size:.78rem}

/* Prose pages */
.prose{padding-block:var(--s5)}
.prose h1{margin-bottom:var(--s3)}
.prose h2{margin:var(--s4) 0 var(--s2)}

/* Consent: compact, equal-weight choices */
.consent{position:fixed;left:var(--s2);right:var(--s2);bottom:var(--s2);max-width:400px;background:var(--surface);border:1px solid var(--line);border-radius:2px;padding:var(--s2) var(--s3);box-shadow:0 12px 32px -8px rgba(42,34,38,.25);z-index:10;font-size:.88rem}
.consent p{margin:0 0 var(--s2)}
.consent .btn-row{display:flex;gap:var(--s1)}
.consent button{padding:11px 18px;flex:1}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.about{display:grid;gap:var(--s4);max-width:1120px}
@media(min-width:800px){.about{grid-template-columns:260px 1fr;gap:var(--s5);align-items:start}}
.about-img{width:100%;max-width:260px;aspect-ratio:4/5;object-fit:cover;border-radius:2px}
.about .prose,.about div{max-width:68ch}

/* ===== Direction 2: Fresh Market — bright, rounded, friendly, Bricolage Grotesque ===== */
@font-face{font-family:"Bricolage";src:url(/assets/fonts/bricolage-grotesque-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Bricolage";src:url(/assets/fonts/bricolage-grotesque-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:swap}
:root,:root[data-theme]{
  --bg:#fbfaf5; --surface:#ffffff; --fg:#1d2b22; --muted:#5b685f; --line:#e5e9dd;
  --accent:#ec6a2c; --accent-ink:#c24f17; --soft:#e4f0dc; --leaf:#2f7a4a; --plum:#173323; --on-plum:#e3eedc;
  --butter:#fff0c2; --blush:#fde2d4; --mint:#dcefe3;
  --display:"Bricolage","Figtree",sans-serif; color-scheme:light}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#fbfaf5; --surface:#ffffff; --fg:#1d2b22; --muted:#5b685f; --line:#e5e9dd;
  --accent:#ec6a2c; --accent-ink:#c24f17; --soft:#e4f0dc; --leaf:#2f7a4a; --plum:#173323; --on-plum:#e3eedc; color-scheme:light}}
h1,h2,h3{font-weight:800;letter-spacing:-.035em;line-height:1.02}
h2,h3{font-weight:800;letter-spacing:-.025em}
.accent,h1 em{font-style:normal;color:var(--accent);position:relative;white-space:nowrap}
h1 em{background:linear-gradient(transparent 62%,var(--butter) 62%,var(--butter) 92%,transparent 92%)}
.eyebrow{display:inline-block;background:var(--mint);color:var(--leaf);border-radius:999px;padding:8px 14px;letter-spacing:.06em;font-size:.74rem}
.top{position:sticky;top:0;z-index:5;background:rgba(251,250,245,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top-inner{flex-direction:row;justify-content:space-between;align-items:center;gap:var(--s3);padding-block:14px}
@media(max-width:899px){.top-inner{flex-direction:column;align-items:flex-start;gap:10px}}
.brand{font:800 1.35rem/1 var(--display);letter-spacing:-.03em;white-space:nowrap;display:inline-flex;align-items:center;gap:10px}
.brand::before{content:"A";display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:var(--leaf);color:#fff;font:800 1.1rem/1 var(--display)}
.brand span{color:var(--accent)}
nav{gap:6px;-webkit-mask-image:none}
nav a{font:600 .82rem/1 var(--body);letter-spacing:0;text-transform:none;color:var(--fg);background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:9px 14px}
nav a:hover,nav a[aria-current]{background:var(--fg);color:#fff;border-color:var(--fg)}
.btn,button{border-radius:999px;background:var(--accent);border-color:var(--accent);color:#fff;letter-spacing:0;text-transform:none;font:600 1rem/1 var(--body);padding:16px 26px;box-shadow:0 8px 20px -8px rgba(236,106,44,.7)}
.btn:hover,button:hover{background:var(--accent-ink);border-color:var(--accent-ink)}
button.ghost{box-shadow:none}
.link{letter-spacing:0;text-transform:none;font:600 .95rem/1 var(--body);border:0;background:var(--soft);color:var(--leaf);border-radius:999px;padding:10px 16px}
/* hero with tile collage */
.hero{padding-block:var(--s5) var(--s4)}
.hero h1{font-size:clamp(2.5rem,7vw,5rem);max-width:15ch}
.collage{display:flex;justify-content:center;gap:14px;margin-top:var(--s5);padding-inline:var(--s2);overflow:hidden}
.collage img{width:clamp(110px,17vw,230px);aspect-ratio:4/5;object-fit:cover;border-radius:28px;flex:none;box-shadow:0 18px 40px -18px rgba(29,43,34,.45)}
.collage img:nth-child(odd){transform:translateY(26px) rotate(-3deg)}.collage img:nth-child(even){transform:rotate(3deg)}
.collage-note{text-align:center;font-size:.75rem;color:var(--muted);margin:var(--s4) 0 0}
.collections{border-top:0;gap:var(--s3)}
.coll{background:var(--surface);border-radius:28px;padding:12px 12px var(--s3);box-shadow:0 1px 0 var(--line),0 16px 36px -24px rgba(29,43,34,.35);transition:transform .2s}
.coll:hover{transform:translateY(-4px)}
.coll-img{border-radius:20px;aspect-ratio:1;margin-bottom:var(--s2)}
.coll>*:not(img){margin-inline:10px}
.coll .count{display:inline-block;font:600 .78rem/1 var(--body);color:var(--accent-ink);background:var(--blush);border-radius:999px;padding:7px 12px}
.coll h2{font-size:1.45rem;margin:12px 10px 6px}
.coll .more{border:0;letter-spacing:0;text-transform:none;font:600 .9rem var(--body);color:var(--leaf)}
.coll .more::after{content:" →"}
.coll:nth-child(3n+2) .count{background:var(--butter);color:#7a5b00}.coll:nth-child(3n) .count{background:var(--mint);color:var(--leaf)}
.meet{border-top:0;background:var(--butter);border-radius:32px;padding:var(--s4);margin-block:var(--s4) var(--s5)}
.meet-img{border-radius:50%;aspect-ratio:1;object-position:50% 18%;max-width:180px;border:6px solid #fff}
.meet .sig{font:800 2rem/1.1 var(--display);color:var(--fg);letter-spacing:-.03em}
/* roundup */
.page-head h1{font-size:clamp(2.3rem,6vw,4.2rem);max-width:17ch}
.hero-img{border-radius:32px;aspect-ratio:2/1}
.cards{max-width:1040px;display:grid;gap:var(--s3)}
@media(min-width:800px){.cards{grid-template-columns:1fr 1fr}}
.card{background:var(--surface);border:0;border-radius:28px;padding:var(--s3);grid-template-columns:1fr!important;gap:var(--s1);box-shadow:0 1px 0 var(--line),0 16px 36px -26px rgba(29,43,34,.35);position:relative}
.card-num{position:absolute;top:var(--s3);right:var(--s3);font:800 .9rem/1 var(--display);color:var(--muted);background:var(--bg);border-radius:999px;padding:8px 11px}
.card-body h2{font-size:1.45rem;padding-right:56px}
.protein{display:inline-flex;align-items:baseline;gap:6px;background:var(--mint);border-radius:16px;padding:10px 16px;font:600 .85rem/1 var(--body);color:var(--leaf)}
.protein b{font:800 1.6rem/1 var(--display);color:var(--leaf)}
.tags span{background:var(--bg);border-radius:999px;padding:2px 10px;margin:0 6px 6px 0;letter-spacing:.04em;text-transform:none;font-size:.78rem;color:var(--muted)}
.tags span+span::before{content:none}
.credit{border-top:0;max-width:1040px}
.faq{max-width:1040px;margin-top:var(--s4);background:var(--surface);border:0;border-radius:28px;padding:var(--s4) var(--s3);box-shadow:0 1px 0 var(--line),0 16px 36px -26px rgba(29,43,34,.35)}
@media(min-width:700px){.faq{padding:var(--s4)}}
.signup{background:var(--leaf);color:#fff;border-radius:40px;margin:0 var(--s2) var(--s3)}
@media(min-width:1200px){.signup{max-width:1160px;margin-inline:auto}}
.signup .eyebrow{background:rgba(255,255,255,.16);color:#fff}
.signup .accent{color:var(--butter)}
.signup .small,.signup .small a{color:#d6e8d9}
.signup-img{border-radius:16px;transform:rotate(4deg)}
.signup-form input{border-radius:999px;border:0;padding:15px 20px}
.foot{background:var(--plum)}
.foot .brand{color:#fff}.foot .brand span{color:#ffb489}.foot h3{color:#9fd3a9}
.collage{padding-bottom:48px;padding-top:8px}
@media(min-width:900px){.top-inner{flex-wrap:wrap;row-gap:12px}.top-inner nav{flex-basis:100%;flex-wrap:wrap}}
/* --- polish pass --- */
button.linklike,.foot button.linklike{box-shadow:none;background:none;border-radius:0;padding:0;font:inherit;color:var(--on-plum)}
.collage{padding-bottom:40px;gap:12px}
.collage img{width:clamp(96px,13.5vw,196px)}
@media(max-width:899px){nav{-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent)}}
.hero .cta{display:flex;gap:var(--s2);justify-content:center;align-items:center;flex-wrap:wrap}
.hero .cta .link{background:none;color:var(--fg);padding:0;border-bottom:2px solid var(--accent);border-radius:0;padding-bottom:2px}
.proof{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:var(--s4) auto 0;padding:0;list-style:none}
.proof li{display:inline-flex;align-items:center;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:9px 16px;font:600 .82rem/1 var(--body);color:var(--muted)}
.proof li b{font:800 1.05rem/1 var(--display);color:var(--fg);letter-spacing:-.02em}
.proof li i{width:8px;height:8px;border-radius:50%;background:var(--leaf);display:inline-block}
.proof li:nth-child(2) i{background:var(--accent)}.proof li:nth-child(3) i{background:#e8b84a}
.meet .sig{font-size:1.9rem}
.about-img{border-radius:28px}
@media(max-width:699px){.hero-img{aspect-ratio:4/3}}
.ai-label{margin-top:-28px;margin-bottom:var(--s3)}
.consent{border-radius:20px;box-shadow:0 20px 50px -20px rgba(29,43,34,.4)}
.consent button{border-radius:999px;box-shadow:none}
.credit{font-size:.85rem}
.page-head{padding-bottom:var(--s3)}
.page-head .eyebrow{letter-spacing:.04em}
.byline{margin-top:var(--s2)}
/* Wide front-page band: one big 16:9 image plus two stacked, replaces the collage when the files exist */
.wide-band{display:grid;gap:12px;margin-top:var(--s5);grid-template-columns:1fr}
.wide-band img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:28px;box-shadow:0 18px 40px -22px rgba(29,43,34,.45)}
@media(min-width:800px){.wide-band{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr}.wide-band img:first-child{grid-row:1/3;aspect-ratio:auto;height:100%}.wide-band img:not(:first-child){aspect-ratio:16/9}}

/* Seasonal accent for one collection (site.json "theme"); same fonts and layout as the rest of the site */
.theme-halloween .page-head{background:#2b1f33;color:#fbf1e6;border-radius:28px;margin:var(--s3) auto var(--s4);padding-inline:var(--s3);width:calc(100% - 2*var(--s2));max-width:calc(1120px - 2*var(--s4));box-sizing:border-box;background-image:radial-gradient(circle at 12% 18%,rgba(236,106,44,.28),transparent 42%),radial-gradient(circle at 88% 82%,rgba(236,106,44,.18),transparent 38%)}
.theme-halloween .page-head h1{color:#fbf1e6}
.theme-halloween .page-head .lede,.theme-halloween .page-head .byline{color:#d9cbd9}
.theme-halloween .page-head .eyebrow{color:#ffb27d;background:rgba(255,255,255,.08)}
.season-tag{display:inline-block;margin:0 0 var(--s2);padding:6px 14px;border-radius:999px;background:#ec6a2c;color:#fff;font:700 .78rem/1 var(--body);letter-spacing:.08em;text-transform:uppercase}
.theme-halloween .protein{background:#fde6d6;color:#9a3d10}
.theme-halloween .protein b{color:#b8481a}
@media(min-width:700px){.theme-halloween .page-head{width:calc(100% - 2*var(--s4))}}
.theme-halloween .card-num{background:#2b1f33;color:#ffb27d}

/* ===== Mobile polish (2026-10-07): most visitors arrive from Pinterest on a phone ===== */
/* Header: a little tighter, chips big enough to tap */
nav a{padding:12px 15px}
@media(max-width:899px){.top-inner{padding-block:10px 8px;gap:8px}.brand{font-size:1.2rem}.brand::before{width:30px;height:30px;border-radius:10px;font-size:1rem}}
/* Collection pages: picture and first recipe come into view sooner on a phone */
@media(max-width:699px){
  .page-head{padding-block:var(--s3) var(--s2)}
  .page-head .eyebrow{margin-bottom:12px}
  .page-head h1{font-size:clamp(1.95rem,8.6vw,2.4rem)}
  .page-head .lede{font-size:1rem;line-height:1.55;margin-top:12px}
  .byline{font-size:.8rem;margin-top:10px}
  .hero-img{border-radius:24px;margin-bottom:var(--s3)}
  .ai-label{margin-top:-20px;margin-bottom:var(--s2)}
  .card{padding:20px;border-radius:24px}
  .card-num{top:20px;right:20px}
  .cards{gap:14px}
  .theme-halloween .page-head{padding-block:var(--s3);margin-top:var(--s2)}
}
/* The whole recipe card opens the recipe, not only the small button */
.card-body h2 a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.card .link{position:relative}
.card:has(a:hover){transform:translateY(-2px)}
.card{transition:transform .2s}
.card:focus-within{outline:2px solid var(--accent);outline-offset:3px}
.card-body h2 a:focus-visible{outline:none}
/* Front page on a phone: compact rows instead of eleven full-screen cards */
@media(max-width:639px){
  .hero{padding-block:var(--s4) var(--s3)}
  .hero h1{font-size:clamp(2.2rem,10.5vw,2.8rem)}
  .hero .lede{font-size:1.02rem;margin-top:var(--s2)}
  .hero .cta{margin-top:var(--s3)}
  .proof{margin-top:var(--s3);gap:8px}
  .proof li{padding:8px 13px;font-size:.78rem}
  .wide-band{margin-top:var(--s4)}
  .wide-band img{border-radius:22px}
  .wide-band img:not(:first-child){display:none}
  .collections{gap:12px;padding-top:var(--s3)}
  .coll{display:grid;grid-template-columns:104px 1fr;grid-template-rows:auto auto 1fr;column-gap:14px;align-items:start;padding:10px;border-radius:22px}
  .coll:hover{transform:none}
  .coll-img{grid-row:1/4;width:104px;aspect-ratio:1;margin:0;border-radius:16px}
  .coll>*:not(img){margin-inline:0}
  .coll .count{justify-self:start;margin-top:4px;padding:5px 10px;font-size:.72rem}
  .coll h2{font-size:1.15rem;line-height:1.1;margin:8px 0 4px}
  .coll p{display:none}
  .coll .more{font-size:.85rem;align-self:end;margin-bottom:4px}
  .meet{padding:var(--s3);border-radius:26px}
}
/* Cookie question: smaller on a phone so it doesn't hide the page; both choices stay equal */
@media(max-width:699px){
  .consent{left:10px;right:10px;bottom:10px;max-width:none;padding:14px 16px;font-size:.84rem;border-radius:18px}
  .consent p{margin-bottom:10px;line-height:1.4}
  .consent button{padding:12px 14px;font-size:.92rem}
}
/* Footer links: easier to tap */
.foot ul{gap:4px}
.foot ul a{display:inline-block;padding-block:6px}
/* Email sign-up placements: offer under the page head, a box after the fourth recipe, and the landing page */
.head-offer{margin:var(--s2) 0 0}
.head-offer a{display:inline-flex;align-items:center;gap:8px;background:var(--butter);color:var(--fg);border-radius:999px;padding:9px 16px;font:600 .9rem/1.2 var(--body);text-decoration:none}
.head-offer a::after{content:"→"}
.head-offer a:hover{background:var(--blush)}
.inline-signup{display:grid;gap:var(--s3);align-items:center;max-width:880px;margin:0 auto;padding:var(--s4) var(--s3);background:var(--mint);border-radius:28px}
@media(min-width:700px){.inline-signup{grid-template-columns:150px 1fr;padding:var(--s4)}}
.inline-signup img{width:110px;margin:0 auto;border-radius:10px;transform:rotate(-3deg);box-shadow:0 14px 30px -14px rgba(29,43,34,.45)}
@media(min-width:700px){.inline-signup img{width:100%}}
.inline-signup h2{margin:0 0 var(--s1);font-size:clamp(1.3rem,3vw,1.7rem)}
.inline-signup h2 .accent{color:var(--accent-ink)}
.inline-signup p{margin:0}
.inline-signup .signup-form{margin-top:var(--s2)}
.inline-signup .signup-form input{border:1px solid var(--line)}
.inline-signup + .cards .card:first-child{border-top:0}
.landing{display:grid;gap:var(--s4);align-items:center;padding-block:var(--s5)}
@media(min-width:800px){.landing{grid-template-columns:1fr 340px;gap:var(--s5)}}
.landing h1{margin:0}
.landing-list{margin:var(--s3) 0 0;padding-left:1.2em;display:grid;gap:6px}
.landing .signup-form input{border:1px solid var(--line);border-radius:999px;padding:15px 20px}
.landing-img{width:100%;max-width:340px;margin:0 auto;border-radius:16px;transform:rotate(3deg);box-shadow:0 18px 40px -16px rgba(29,43,34,.45)}
.landing-next{padding-bottom:var(--s5)}
.landing-next ul{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:var(--s2) 0 0}
.landing-next a{display:inline-block;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:9px 16px;text-decoration:none;color:var(--fg);font-weight:600}
