:root{--bg:#0f0d0b;--bg2:#171310;--card:#1c1814;--ink:#f4ede1;--mute:#a69b8c;--acc:#e9a23b;--acc2:#c4572f;--line:#2e2822;--serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;--mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(900px 500px at 85% -10%,#3a2412 0,transparent 60%),var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--acc)}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
nav{display:flex;justify-content:space-between;align-items:center;padding:20px 0}
.logo{font-family:var(--serif);font-size:1.3rem;font-weight:700;letter-spacing:.01em}.logo i{color:var(--acc);font-style:normal}
nav a{color:var(--mute);text-decoration:none;margin-left:18px;font-size:.92rem}nav a:hover{color:var(--ink)}
.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:36px;align-items:start;padding:28px 0 54px}
h1{font-family:var(--serif);font-weight:700;font-size:clamp(2.2rem,5.5vw,3.9rem);line-height:1.04;margin:.1em 0 .35em;letter-spacing:-.01em}
h1 em{color:var(--acc);font-style:italic}
h2{font-family:var(--serif);font-size:1.8rem;margin:0 0 .3em}h3{margin:.2em 0 .5em;font-size:1rem}
.sub{color:var(--mute);max-width:560px}.kicker{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--acc);font-weight:700}
.stats{display:flex;gap:26px;margin-top:26px;color:var(--mute);font-size:.9rem}.stats b{display:block;font-family:var(--serif);font-size:1.7rem;color:var(--ink)}
.panel{background:linear-gradient(180deg,#201a15,#181410);border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:0 20px 50px #0008}
.seg{display:inline-flex;background:#0f0d0b;border:1px solid var(--line);border-radius:99px;padding:3px}
.seg button{background:transparent;color:var(--mute);border:0;border-radius:99px;padding:7px 16px;font-weight:600;cursor:pointer}.seg button.on{background:var(--acc);color:#1a1006}
.big{font-family:var(--serif);font-size:3.4rem;line-height:1;margin:.5em 0 .1em}.big small{font-size:1.2rem;color:var(--mute)}
input[type=range]{width:100%;accent-color:var(--acc);height:28px}
.receipt{margin-top:16px;background:#f1e8d8;color:#2a2118;border-radius:6px;padding:16px 16px 12px;font-family:var(--mono);font-size:.84rem;position:relative}
.receipt h3{font-family:var(--mono);text-transform:uppercase;letter-spacing:.12em;font-size:.76rem;text-align:center;border-bottom:1px dashed #2a211866;padding-bottom:8px}
.receipt ul{list-style:none;margin:0;padding:0}.receipt li{display:flex;justify-content:space-between;gap:8px;padding:3px 0}
.receipt a{color:#9c3a14;font-size:.72rem;margin-left:6px}.receipt .tot{border-top:1px dashed #2a211866;margin-top:8px;padding-top:8px;font-weight:700}
.chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.chip{font-size:.8rem;border:1px solid #4a3a2a;border-radius:99px;padding:3px 11px;background:#251d16}
section{padding:46px 0;border-top:1px solid var(--line)}
.bar{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}
input[type=search]{background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:99px;padding:9px 16px;flex:1;min-width:200px;font:inherit}
.f{background:transparent;color:var(--mute);border:1px solid var(--line);border-radius:99px;padding:8px 16px;cursor:pointer;font:inherit}.f.on{color:#1a1006;background:var(--acc);border-color:var(--acc)}
.grid{align-items:start;display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px}
details.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;transition:border-color .2s}details.card[open]{border-color:var(--acc)}
summary{cursor:pointer;font-family:var(--serif);font-size:1.12rem;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:8px;align-items:center}summary::-webkit-details-marker{display:none}
.tag{font-family:system-ui;font-size:.7rem;font-weight:600;border-radius:99px;padding:2px 9px;background:#2a2119;color:var(--acc);white-space:nowrap}.tag.z{color:#8ec5a0;background:#16241b}
.glass{color:var(--mute);font-size:.85rem;margin:.6em 0}
.ing{margin:.4em 0}.ing div{display:grid;grid-template-columns:1fr auto;font-size:.88rem;padding-top:5px}.ing i{display:block;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--acc),var(--acc2));grid-column:1/-1;margin-top:3px}
.meth{color:var(--mute);font-size:.9rem;margin:.7em 0 0}
.gcard{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px}.gcard ul{list-style:none;margin:10px 0 0;padding:0}.gcard li{display:flex;justify-content:space-between;gap:8px;padding:8px 0;border-top:1px solid var(--line);font-size:.92rem}
.ad{font-size:.7rem;color:var(--mute);text-transform:uppercase;letter-spacing:.1em}
button.cta,.btn{background:var(--acc);color:#1a1006;border:0;border-radius:99px;padding:10px 20px;font-weight:700;cursor:pointer;font:inherit;font-weight:700}button.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
#gate{position:fixed;inset:0;background:#0009;backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:9;padding:18px}#gate .panel{max-width:420px;text-align:center}
.row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
footer{border-top:1px solid var(--line);padding:26px 0 40px;color:var(--mute);font-size:.84rem}
@media(max-width:820px){.hero{grid-template-columns:1fr}.big{font-size:2.8rem}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
