:root { --ink:#241812; --cream:#f3eadc; --paper:#fbf6ed; --ember:#d84b1f; --gold:#e99b43; --muted:#77675c; font-family:"DM Sans",sans-serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:300px; background:var(--paper); }
a { color:inherit; }
.site-header { height:86px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(22px,5vw,76px); border-bottom:1px solid #39271d18; background:#fbf6edeb; backdrop-filter:blur(12px); position:relative; z-index:10; }
.logo { display:flex; align-items:center; gap:11px; color:var(--ink); text-decoration:none; font-size:11px; line-height:1.05; text-transform:uppercase; letter-spacing:.08em; }
.logo b { display:block; font:700 21px/1 "Fraunces",serif; text-transform:none; letter-spacing:0; }
.logo-fire { width:42px; height:42px; display:grid; place-items:center; border-radius:50% 50% 48% 52% / 62% 62% 38% 38%; color:white; background:var(--ember); font:700 22px "Fraunces",serif; transform:rotate(-4deg); }
.site-header nav { display:flex; align-items:center; gap:30px; font-size:13px; font-weight:600; }
.site-header nav a { text-decoration:none; }
.nav-admin { padding:11px 16px; border:1px solid #37251b; border-radius:99px; }
.hero { min-height:calc(100vh - 86px); display:grid; grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr); overflow:hidden; }
.hero-copy { display:flex; flex-direction:column; justify-content:center; padding:80px clamp(28px,7vw,112px); }
.eyebrow { color:var(--ember); font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
h1,h2,h3 { font-family:"Fraunces",serif; }
.hero h1 { max-width:740px; margin:18px 0 24px; font-size:clamp(52px,6.3vw,96px); line-height:.94; letter-spacing:-.045em; }
.hero h1 em { color:var(--ember); font-weight:600; }
.hero-copy > p { max-width:570px; margin:0; color:var(--muted); font-size:17px; line-height:1.7; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }
.button { padding:14px 20px; border-radius:4px; text-decoration:none; font-size:13px; font-weight:700; }
.button.primary { color:white; background:var(--ember); }
.button.secondary { border:1px solid #3b2a20; }
.grill-scene { position:relative; isolation:isolate; min-height:610px; display:grid; place-items:center; overflow:hidden; color:white; background:#20130e; }
.grill-scene::before { content:""; position:absolute; inset:0; z-index:-2; opacity:.24; background:radial-gradient(circle at 20% 35%,#f18a3b 0 1px,transparent 2px),radial-gradient(circle at 70% 70%,#f18a3b 0 1px,transparent 2px); background-size:31px 31px,43px 43px; }
.sun { position:absolute; width:min(35vw,450px); aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,#ef9b3f 0 22%,#df5b27 23% 48%,#702716 49% 63%,transparent 64%); opacity:.82; }
.grill { position:relative; z-index:2; width:min(31vw,400px); height:250px; border:13px solid #130b08; border-radius:50%; transform:rotate(-8deg); background:#39241b; box-shadow:0 30px 80px #000b,inset 0 0 50px #000; overflow:hidden; }
.grill > span { position:relative; z-index:1; display:block; height:9px; margin:25px -20px; background:#a49184; transform:rotate(8deg); box-shadow:0 3px #2b1b15; }
.steak { position:absolute; z-index:3; width:110px; height:70px; border:7px solid #6f2415; border-radius:60% 42% 55% 40%; background:repeating-linear-gradient(35deg,#ad4125 0 12px,#d86b36 13px 17px); box-shadow:0 7px 15px #0009; }
.steak-one { left:65px; top:60px; transform:rotate(18deg); }.steak-two { right:40px; bottom:44px; transform:rotate(-13deg) scale(.85); }
.smoke { position:absolute; width:70px; height:210px; border-radius:50%; border-left:22px solid #f2ddca18; filter:blur(5px); transform:rotate(12deg); }.smoke-one { margin:-440px 0 0 -170px; }.smoke-two { margin:-410px -180px 0 0; transform:rotate(-9deg); }
.embers { position:absolute; bottom:12%; width:70%; height:60px; background:radial-gradient(circle,#ffad47 0 2px,transparent 3px); background-size:23px 19px; filter:drop-shadow(0 0 8px #ef531f); opacity:.7; }
.grill-scene p { position:absolute; z-index:4; bottom:7%; left:8%; margin:0; font-size:12px; letter-spacing:.13em; text-transform:uppercase; }.grill-scene p strong { display:block; color:var(--gold); font:600 24px "Fraunces",serif; letter-spacing:0; text-transform:none; }
.manifesto { display:grid; grid-template-columns:70px minmax(260px,.8fr) minmax(320px,1.2fr); gap:clamp(28px,5vw,86px); align-items:start; padding:110px clamp(28px,8vw,130px); background:var(--cream); }
.section-number { color:var(--ember); font:600 14px "Fraunces",serif; border-top:2px solid var(--ember); padding-top:8px; }
.manifesto h2,.section-heading h2,.closing h2 { margin:10px 0 0; font-size:clamp(38px,4vw,62px); line-height:1; letter-spacing:-.035em; }
.manifesto > p { margin:3px 0 0; color:var(--muted); font-size:17px; line-height:1.8; }
.flavors { padding:110px clamp(28px,8vw,130px) 130px; }
.section-heading { max-width:720px; margin-bottom:45px; }
.flavor-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.flavor-grid article { min-height:360px; display:flex; flex-direction:column; padding:28px; border:1px solid #3c291e24; background:#f7f0e5; }
.flavor-grid article.featured { color:white; background:var(--ember); transform:translateY(24px); }
.flavor-grid article > span { font-size:10px; letter-spacing:.15em; opacity:.65; }
.food-mark { width:110px; height:110px; display:grid; place-items:center; margin:auto; border-radius:50%; color:var(--ember); border:1px solid currentColor; font:600 58px "Fraunces",serif; }
.featured .food-mark { color:white; }
.flavor-grid h3 { margin:0 0 7px; font-size:28px; }.flavor-grid p { margin:0; color:var(--muted); line-height:1.6; }.featured p { color:#ffe5d7; }
.closing { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:end; padding:100px clamp(28px,8vw,130px); color:white; background:#21150f; }.closing p { max-width:440px; margin:0; color:#cbb9ac; font-size:18px; line-height:1.7; }
footer { min-height:110px; display:flex; align-items:center; justify-content:space-between; gap:25px; padding:25px clamp(28px,5vw,76px); color:#d8c9be; background:#160d09; font-size:12px; } footer .logo { color:white; } footer > a:last-child { color:var(--gold); }
.admin-body { min-height:100vh; background:#21150f; color:white; }.admin-body .site-header { background:#21150f; border-color:#ffffff18; }.admin-body .logo { color:white; }.back-site { color:#d8c9be; font-size:13px; text-decoration:none; }
.access-main { min-height:calc(100vh - 86px); display:grid; place-content:center; padding:60px 24px 90px; background:radial-gradient(circle at 50% 15%,#5b251a55,transparent 37%); }
.access-intro { text-align:center; margin-bottom:34px; }.access-intro h1 { margin:12px 0 10px; font-size:clamp(38px,5vw,64px); }.access-intro p { margin:0; color:#c7b7ac; }
.access-grid { width:min(900px,92vw); display:grid; grid-template-columns:1fr 1fr; gap:16px; }.access-card { min-height:300px; display:grid; grid-template-columns:auto 1fr; gap:24px; padding:32px; color:var(--ink); background:var(--paper); text-decoration:none; transition:transform .2s,background .2s; }.access-card:hover { transform:translateY(-5px); background:white; }.access-icon { width:60px; height:60px; display:grid; place-items:center; border-radius:50%; color:white; background:var(--ember); font:700 25px "Fraunces",serif; }.access-card small { color:var(--ember); font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.13em; }.access-card h2 { margin:7px 0 10px; font-size:36px; }.access-card p { margin:0; color:var(--muted); line-height:1.6; }.access-card > b { grid-column:1/-1; align-self:end; display:flex; justify-content:space-between; padding-top:18px; border-top:1px solid #39271d2b; font-size:13px; }.access-card > b span { color:var(--ember); font-size:20px; }.access-note { text-align:center; margin:28px 0 0; color:#a9978a; font-size:12px; }
.login-layout { width:min(1040px,94vw); display:grid; grid-template-columns:minmax(300px,.9fr) minmax(380px,1.1fr); gap:clamp(35px,7vw,95px); align-items:center; }
.login-intro h1 { margin:14px 0 18px; font-size:clamp(48px,6vw,76px); line-height:.93; letter-spacing:-.04em; }.login-intro > p { max-width:470px; margin:0 0 34px; color:#c7b7ac; line-height:1.7; }.login-detail { display:grid; grid-template-columns:75px 1fr; gap:12px; max-width:480px; padding:13px 0; border-top:1px solid #ffffff18; }.login-detail > span { color:var(--gold); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }.login-detail p { margin:0; color:#a9978a; font-size:12px; line-height:1.5; }
.login-card { display:grid; gap:20px; padding:clamp(26px,4vw,44px); color:var(--ink); background:var(--paper); box-shadow:0 30px 90px #0005; }.login-card h2 { margin:7px 0 0; font-size:38px; }.login-card fieldset { margin:0; padding:0; border:0; }.login-card legend,.login-field > span { margin-bottom:8px; color:#74645a; font-size:10px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.profile-options { display:grid; grid-template-columns:1fr 1fr; gap:9px; }.profile-options label { position:relative; cursor:pointer; }.profile-options input { position:absolute; opacity:0; pointer-events:none; }.profile-options label > span { min-height:70px; display:grid; align-content:center; gap:3px; padding:12px 14px; border:1px solid #dacfc4; background:#fff; transition:border-color .15s,background .15s; }.profile-options b { font-size:14px; }.profile-options small { color:var(--muted); font-size:10px; }.profile-options input:checked + span { border-color:var(--ember); background:#fff1e9; box-shadow:0 0 0 2px #d84b1f18; }.profile-options input:checked + span b { color:var(--ember); }
.login-field { display:grid; }.login-field input { width:100%; min-height:49px; border:1px solid #d8cdc2; border-radius:3px; padding:0 13px; background:#fff; color:var(--ink); font:inherit; outline:none; }.login-field input:focus { border-color:var(--ember); box-shadow:0 0 0 3px #d84b1f18; }.login-submit { min-height:52px; display:flex; align-items:center; justify-content:space-between; border:0; border-radius:3px; padding:0 18px; background:var(--ember); color:white; font:700 13px "DM Sans",sans-serif; cursor:pointer; }.login-submit span { font-size:20px; }.login-submit:disabled { opacity:.6; cursor:wait; }.login-error { margin:0; padding:10px 12px; border:1px solid #e8b5aa; background:#fff0ed; color:#a43827; font-size:12px; font-weight:700; }
@media (max-width:800px) { .site-header nav > a:not(.nav-admin) { display:none; }.site-header nav { gap:0; }.hero { grid-template-columns:1fr; }.hero-copy { min-height:650px; padding-top:70px; }.grill-scene { min-height:540px; }.grill { width:min(78vw,400px); }.manifesto { grid-template-columns:40px 1fr; }.manifesto > p { grid-column:2; }.flavor-grid { grid-template-columns:1fr; }.flavor-grid article.featured { transform:none; }.closing { grid-template-columns:1fr; }.access-grid,.login-layout { grid-template-columns:1fr; }.access-card { min-height:260px; }.login-intro { display:none; } footer { flex-direction:column; align-items:flex-start; } }
@media (max-width:520px) { .site-header { height:76px; padding:0 18px; }.logo-fire { width:36px; height:36px; }.logo b { font-size:18px; }.nav-admin { padding:9px 11px; font-size:11px; }.hero-copy { min-height:590px; padding:55px 22px; }.hero h1 { font-size:48px; }.manifesto,.flavors,.closing { padding-left:22px; padding-right:22px; }.manifesto { grid-template-columns:1fr; }.manifesto > p { grid-column:1; }.section-number { width:35px; }.access-main { padding-left:15px; padding-right:15px; }.access-card { grid-template-columns:1fr; }.access-icon { width:48px; height:48px; }.access-card > b { grid-column:1; } }