:root{
  --bg:#fffaf4; --paper:#fff; --ink:#24170e; --muted:#7d6d61;
  --saffron:#e86916; --deep:#8f2f0a; --line:#eadfd5; --green:#416a43;
  --shadow:0 18px 45px rgba(91,50,22,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--ink)}
button,input,select{font:inherit}
button,a{cursor:pointer}
a{color:inherit;text-decoration:none}
.topbar{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:16px 5vw;background:rgba(255,250,244,.92);backdrop-filter:blur(15px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:var(--deep);color:#fff;font-weight:900}
.brand strong,.brand small{display:block}.brand small{color:var(--muted);margin-top:2px}
nav{display:flex;align-items:center;gap:22px;color:#5f4c3e;font-weight:700}
.ghost,.secondary{border:1px solid var(--line);background:#fff;border-radius:999px;padding:11px 16px;color:var(--ink)}
.hero{min-height:680px;display:grid;grid-template-columns:1.2fr .8fr;gap:56px;align-items:center;padding:70px 7vw;background:
radial-gradient(circle at 15% 30%,rgba(232,105,22,.14),transparent 28%),
radial-gradient(circle at 85% 15%,rgba(65,106,67,.12),transparent 26%)}
.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:900;color:var(--deep)}
.hero h1{font-family:Georgia,serif;font-size:clamp(48px,7vw,96px);line-height:.94;margin:18px 0 22px;max-width:900px}
.hero h1 em{color:var(--saffron);font-weight:500}
.hero-copy>p{font-size:19px;line-height:1.7;color:var(--muted);max-width:720px}
.hero-actions{display:flex;gap:12px;margin:30px 0}
.primary{border:0;background:var(--deep);color:#fff;border-radius:999px;padding:14px 20px;font-weight:900}
.stats{display:flex;gap:34px;margin-top:40px}
.stats div{display:grid;gap:4px}.stats strong{font-size:28px}.stats span{font-size:13px;color:var(--muted)}
.hero-card{background:var(--paper);padding:18px;border:1px solid var(--line);border-radius:30px;box-shadow:var(--shadow)}
.hero-card>span{display:inline-block;background:#fff0e4;color:var(--deep);padding:8px 11px;border-radius:999px;font-size:12px;font-weight:900;margin:4px 0 14px}
.hero-card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:20px;background:#eadfd5}
.hero-card h2{font-family:Georgia,serif;font-size:32px;margin:18px 0 6px}.hero-card p{color:var(--muted)}
.region-strip{display:flex;gap:10px;overflow:auto;padding:22px 5vw;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff}
.chip{white-space:nowrap;border:1px solid var(--line);background:#fff;border-radius:999px;padding:10px 15px;font-weight:800}
.chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.recipes-section{padding:70px 5vw 90px}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px}
.section-heading h2{font-family:Georgia,serif;font-size:44px;margin:8px 0}
.count{color:var(--muted);font-weight:800}
.controls{display:grid;grid-template-columns:1fr 170px 190px 170px;gap:10px;margin:28px 0 30px}
.searchbox{display:flex;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:0 14px}
.searchbox input{width:100%;border:0;outline:0;padding:13px;background:transparent}
select{border:1px solid var(--line);background:#fff;border-radius:14px;padding:13px;color:var(--ink)}
.recipe-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.card{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;transition:.2s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.card-image{position:relative}.card-image img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block}
.fav{position:absolute;right:12px;top:12px;width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.94);font-size:20px}
.card-body{padding:17px;display:flex;flex-direction:column;gap:9px;flex:1}
.tags{display:flex;gap:7px;flex-wrap:wrap}.tag{font-size:11px;font-weight:900;padding:6px 8px;border-radius:999px;background:#fff3e9;color:var(--deep)}
.card h3{font-family:Georgia,serif;font-size:23px;margin:0}
.card p{color:var(--muted);line-height:1.5;font-size:14px;margin:0}
.meta{display:flex;justify-content:space-between;margin-top:auto;padding-top:8px;color:#6f5c4e;font-size:13px;font-weight:800}
.card button.open{margin-top:7px;border:0;background:#24170e;color:#fff;padding:11px;border-radius:12px;font-weight:800}
.pagination{display:flex;justify-content:center;gap:8px;margin-top:42px;flex-wrap:wrap}
.page-btn{border:1px solid var(--line);background:#fff;border-radius:10px;padding:10px 13px;font-weight:800}.page-btn.active{background:var(--deep);color:#fff}
footer{display:flex;justify-content:space-between;gap:30px;padding:50px 5vw;background:#20140e;color:#fff}
footer p{color:#c9b8ad}
dialog{width:min(920px,94vw);max-height:90vh;border:0;border-radius:26px;padding:0;box-shadow:0 30px 90px rgba(0,0,0,.35);overflow-y:auto}
dialog::backdrop{background:rgba(35,18,10,.62);backdrop-filter:blur(4px)}
.dialog-close{position:sticky;float:right;top:16px;right:16px;z-index:3;width:42px;height:42px;border:0;border-radius:50%;background:#fff;box-shadow:0 5px 20px rgba(0,0,0,.14);font-size:24px;cursor:pointer}
.recipe-detail img{width:100%;height:360px;object-fit:cover;display:block}
.detail-body{padding:28px 34px 40px}.detail-body h2{font-family:Georgia,serif;font-size:42px;margin:8px 0}.detail-meta{color:var(--muted);font-weight:800}
.recipe-columns{display:grid;grid-template-columns:.85fr 1.15fr;gap:34px;margin-top:28px}
.recipe-columns h3{font-size:20px}.ingredients,.steps{padding-left:22px;line-height:1.65}.ingredients li,.steps li{margin:8px 0}
.notice{background:#fff6df;border:1px solid #f0d89c;border-radius:14px;padding:13px 15px;color:#6c4c0a;font-size:13px;line-height:1.5;margin-top:24px}
@media(max-width:1000px){.recipe-grid{grid-template-columns:repeat(2,1fr)}.controls{grid-template-columns:1fr 1fr}.hero{grid-template-columns:1fr}.hero-card{max-width:620px}.hero{padding-top:45px}}
@media(max-width:650px){nav a{display:none}.recipe-grid{grid-template-columns:1fr}.controls{grid-template-columns:1fr}.section-heading{align-items:start;flex-direction:column}.hero{padding:45px 5vw}.hero h1{font-size:54px}.stats{gap:18px}.recipe-columns{grid-template-columns:1fr}.detail-body{padding:24px 20px}.detail-body h2{font-size:34px}footer{flex-direction:column}}
.region-strip::-webkit-scrollbar{height:4px}.region-strip::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px}