:root{
    --iron:#1E1815;
    --iron-2:#2A2320;
    --iron-3:#332B27;
    --ghee:#E8A33D;
    --ghee-light:#F3C878;
    --toast:#B5651D;
    --mint:#7A9A4D;
    --papad:#F5E6C8;
    --cream:#FBF6EC;
    --ink:#1E1815;
    --max:1120px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important;}
}
body{
    margin:0;
    background:var(--iron);
    color:var(--cream);
    font-family:'Karla',sans-serif;
    -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
    font-family:'Fraunces',serif;
    margin:0;
    font-weight:600;
}
a{color:inherit;}
.wrap{max-width:var(--max); margin:0 auto; padding:0 28px;}
.mono{font-family:'Space Mono',monospace;}

/* ---------- NAV ---------- */
header{
    position:sticky; top:0; z-index:50;
    background:rgba(30,24,21,0.9);
    backdrop-filter:blur(8px);
    border-bottom:1px solid rgba(232,163,61,0.18);
}
nav.wrap{
    display:flex; align-items:center; justify-content:space-between;
    height:76px;
}
.brand{display:flex; align-items:center; gap:12px; font-family:'Fraunces',serif; font-weight:700; font-size:1.25rem; letter-spacing:0.01em; text-decoration:none; color:var(--cream);}
.brand svg{width:34px; height:34px; flex-shrink:0;}
.navlinks{display:flex; gap:32px; font-size:0.95rem; font-weight:500;}
.navlinks a{text-decoration:none; color:var(--papad); opacity:0.85; position:relative; padding:6px 2px;}
.navlinks a:hover, .navlinks a:focus-visible{opacity:1; color:var(--ghee-light);}
.navlinks a:focus-visible{outline:2px solid var(--ghee); outline-offset:4px; border-radius:3px;}
.navlinks a.current{opacity:1; color:var(--ghee);}
.nav-cta{
    background:var(--ghee); color:var(--iron); font-weight:700; font-size:0.9rem;
    padding:10px 20px; border-radius:100px; text-decoration:none; border:none;
    transition:transform 0.15s ease, background 0.15s ease;
}
.nav-cta:hover{background:var(--ghee-light); transform:translateY(-1px);}
.nav-cta:focus-visible{outline:2px solid var(--cream); outline-offset:3px;}

/* ---------- HERO ---------- */
.hero{
    position:relative;
    padding:88px 0 64px;
    overflow:hidden;
    background:
      radial-gradient(ellipse 70% 60% at 78% 18%, rgba(232,163,61,0.16), transparent 60%),
      var(--iron);
}
.hero-grid{
    display:grid; grid-template-columns:1.05fr 0.95fr; gap:40px; align-items:center;
}
.eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-family:'Space Mono',monospace; font-size:0.78rem; letter-spacing:0.12em; text-transform:uppercase;
    color:var(--mint); margin-bottom:22px;
}
.eyebrow .dot{width:9px; height:9px; border-radius:50%; background:var(--mint); box-shadow:0 0 0 3px rgba(122,154,77,0.25);}
.hero h1{
    font-size:clamp(2.6rem, 6vw, 4.6rem);
    line-height:0.98;
    color:var(--cream);
    letter-spacing:-0.01em;
}
.hero h1 em{
    font-style:italic; color:var(--ghee);
}
.hero p.lede{
    margin-top:22px; font-size:1.15rem; line-height:1.55; color:var(--papad); max-width:460px; opacity:0.92;
}
.hero-ctas{display:flex; gap:16px; margin-top:34px; flex-wrap:wrap;}
.btn-primary{
    background:var(--ghee); color:var(--iron); font-weight:700; padding:15px 28px;
    border-radius:100px; text-decoration:none; font-size:0.98rem; display:inline-flex; align-items:center; gap:8px;
    transition:transform 0.15s ease, background 0.15s ease; border:none; cursor:pointer;
}
.btn-primary:hover{background:var(--ghee-light); transform:translateY(-2px);}
.btn-primary:focus-visible{outline:2px solid var(--cream); outline-offset:3px;}
.btn-primary:disabled{opacity:0.4; cursor:not-allowed; transform:none;}
.btn-ghost{
    background:transparent; color:var(--cream); font-weight:600; padding:15px 26px;
    border-radius:100px; text-decoration:none; font-size:0.98rem; border:1.5px solid rgba(245,246,236,0.3);
    transition:border-color 0.15s ease, background 0.15s ease;
}
.btn-ghost:hover{border-color:var(--ghee); background:rgba(232,163,61,0.08);}
.btn-ghost:focus-visible{outline:2px solid var(--ghee); outline-offset:3px;}

.hero-art{position:relative; display:flex; justify-content:center; align-items:center;}
.hero-art svg{width:min(100%, 420px); height:auto; filter:drop-shadow(0 30px 60px rgba(0,0,0,0.5));}
.steam{
    position:absolute; top:-10px; left:50%; transform:translateX(-50%);
    width:120px; height:140px; pointer-events:none;
}
.steam path{
    stroke:rgba(245,230,200,0.35); stroke-width:3; fill:none; stroke-linecap:round;
    animation:rise 4.5s ease-in-out infinite;
    transform-origin:bottom center;
}
.steam path:nth-child(2){animation-delay:0.8s;}
.steam path:nth-child(3){animation-delay:1.6s;}
@keyframes rise{
    0%{opacity:0; transform:translateY(0) scaleY(0.9);}
    25%{opacity:0.7;}
    100%{opacity:0; transform:translateY(-40px) scaleY(1.15);}
}

.stat-strip{
    display:flex; gap:44px; margin-top:56px; padding-top:32px; border-top:1px solid rgba(245,246,236,0.12);
    flex-wrap:wrap;
}
.stat-strip .stat{min-width:110px;}
.stat .num{font-family:'Fraunces',serif; font-size:2rem; color:var(--ghee); font-weight:700;}
.stat .label{font-size:0.82rem; color:var(--papad); opacity:0.8; margin-top:2px;}

/* ---------- section shared ---------- */
section{padding:96px 0;}
.section-head{max-width:640px; margin-bottom:56px;}
.kicker{
    font-family:'Space Mono',monospace; font-size:0.78rem; letter-spacing:0.14em; text-transform:uppercase;
    color:var(--ghee); display:flex; align-items:center; gap:10px; margin-bottom:16px;
}
.kicker svg{width:20px; height:20px;}
.section-head h2{font-size:clamp(1.9rem, 3.4vw, 2.7rem); color:var(--cream); line-height:1.1;}
.section-head p{color:var(--papad); opacity:0.85; margin-top:14px; font-size:1.05rem; line-height:1.55;}

/* ---------- STORY ---------- */
.story{background:var(--iron-2);}
.story-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:64px; align-items:center;}
.story-visual{position:relative; display:flex; justify-content:center;}
.story-visual svg{width:100%; max-width:340px;}
.story-copy p{font-size:1.08rem; line-height:1.7; color:var(--papad); opacity:0.92; margin-bottom:18px;}
.story-copy p:last-child{margin-bottom:0;}
.promise-row{display:flex; gap:28px; margin-top:32px; flex-wrap:wrap;}
.promise{display:flex; align-items:flex-start; gap:10px; max-width:180px;}
.promise svg{width:22px; height:22px; flex-shrink:0; margin-top:2px; color:var(--mint);}
.promise span{font-size:0.9rem; color:var(--cream); font-weight:600; line-height:1.35;}

/* ---------- MENU TEASER (index page) ---------- */
.menu-teaser{background:var(--papad); color:var(--ink);}
.teaser-inner{display:grid; grid-template-columns:1.1fr 0.9fr; gap:56px; align-items:center;}
.teaser-copy .kicker{color:var(--toast);}
.teaser-copy h2{color:var(--ink); font-size:clamp(1.7rem,3vw,2.3rem); line-height:1.15; margin-bottom:18px;}
.teaser-copy p{color:#5A4A38; font-size:1.02rem; line-height:1.6; margin-bottom:28px;}
.teaser-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.teaser-item{
    background:var(--cream); border-radius:14px; padding:20px 18px; border:1px solid rgba(30,24,21,0.08);
    display:flex; flex-direction:column; gap:10px;
}
.teaser-item .name{font-weight:700; font-size:0.98rem; color:var(--ink);}
.teaser-item .price{font-size:1.1rem; color:var(--toast); font-weight:700;}

/* ---------- MENU PAGE ---------- */
.menu-hero{
    background:var(--iron); padding:56px 0 40px; border-bottom:1px solid rgba(232,163,61,0.15);
}
.menu-hero .wrap{display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:24px;}
.menu-hero h1{font-size:clamp(2.2rem,4vw,3.1rem); color:var(--cream);}
.menu-hero .sub{color:var(--papad); opacity:0.85; margin-top:12px; max-width:480px; line-height:1.55;}
.menu-hero .badge{
    font-family:'Space Mono',monospace; font-size:0.78rem; letter-spacing:0.1em; text-transform:uppercase;
    background:var(--mint); color:var(--iron); padding:8px 16px; border-radius:100px; font-weight:700;
    display:inline-flex; align-items:center; gap:8px;
}
.menu-meta{
    display:flex; gap:28px; flex-wrap:wrap; margin-top:22px; font-size:0.9rem; color:var(--papad); opacity:0.85;
}
.menu-meta span{display:flex; align-items:center; gap:8px;}

.menu-body{background:var(--papad); color:var(--ink); padding-bottom:140px;}
.category-nav{
    display:flex; gap:10px; padding:22px 0; flex-wrap:wrap; position:sticky; top:76px; z-index:40;
    background:var(--papad); border-bottom:1px solid rgba(30,24,21,0.1);
}
.category-nav a{
    font-family:'Space Mono',monospace; font-size:0.82rem; padding:9px 18px; border-radius:100px;
    border:1.5px solid rgba(30,24,21,0.18); color:var(--ink); text-decoration:none;
    transition:all 0.15s ease;
}
.category-nav a:hover, .category-nav a:focus-visible{border-color:var(--toast); color:var(--toast);}

.menu-category{padding-top:44px;}
.menu-category h2{
    font-size:1.6rem; color:var(--ink); margin-bottom:6px;
}
.menu-category .cat-note{font-size:0.9rem; color:#6B5B47; margin-bottom:26px;}

.item-row{
    display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:18px;
    padding:18px 0; border-bottom:1px dashed rgba(30,24,21,0.18);
}
.item-row .item-info{display:flex; align-items:baseline; gap:10px; min-width:0;}
.item-row .veg{width:13px; height:13px; border:1.6px solid var(--mint); border-radius:3px; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;}
.item-row .veg::after{content:""; width:6px; height:6px; border-radius:50%; background:var(--mint);}
.item-row .name{font-weight:700; font-size:1.02rem;}
.item-row .price{
    font-family:'Space Mono',monospace; font-weight:700; font-size:0.98rem; color:var(--toast); white-space:nowrap;
}
.stepper{
    display:flex; align-items:center; gap:0; border:1.5px solid rgba(30,24,21,0.2); border-radius:100px; overflow:hidden;
}
.stepper button{
    width:34px; height:34px; border:none; background:var(--cream); color:var(--ink); font-size:1.1rem; font-weight:700;
    cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background 0.15s ease;
    font-family:'Karla',sans-serif; line-height:1;
}
.stepper button:hover{background:var(--ghee-light);}
.stepper button:focus-visible{outline:2px solid var(--toast); outline-offset:2px; position:relative; z-index:1;}
.stepper button.plus{color:var(--iron);}
.stepper .qty{
    width:32px; text-align:center; font-family:'Space Mono',monospace; font-weight:700; font-size:0.92rem; background:var(--cream);
    height:34px; display:flex; align-items:center; justify-content:center;
}

.menu-footnote{
    margin-top:40px; padding-top:24px; border-top:1px solid rgba(30,24,21,0.15);
    font-size:0.88rem; color:#6B5B47; line-height:1.7;
}

/* ---------- CART BAR ---------- */
.cart-bar{
    position:fixed; left:0; right:0; bottom:0; z-index:60;
    background:var(--iron); border-top:1px solid rgba(232,163,61,0.25);
    box-shadow:0 -12px 30px rgba(0,0,0,0.35);
    transform:translateY(100%); transition:transform 0.25s ease;
}
.cart-bar.visible{transform:translateY(0);}
.cart-bar .wrap{
    display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 28px; flex-wrap:wrap;
}
.cart-summary{display:flex; align-items:center; gap:18px;}
.cart-summary .count{
    background:var(--ghee); color:var(--iron); font-family:'Space Mono',monospace; font-weight:700;
    width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:0.95rem;
}
.cart-summary .total{color:var(--cream); font-size:1.05rem;}
.cart-summary .total .amount{font-family:'Space Mono',monospace; font-weight:700; color:var(--ghee-light);}
.cart-summary .note{color:var(--papad); opacity:0.6; font-size:0.78rem; display:block; margin-top:2px;}

/* ---------- SPECIALS / TESTIMONIALS / VISIT (shared with index) ---------- */
.specials{background:var(--iron);}
.special-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.special-card{
    background:var(--iron-2); border-radius:18px; padding:30px 26px; border:1px solid rgba(232,163,61,0.14);
    transition:transform 0.2s ease, border-color 0.2s ease;
}
.special-card:hover{transform:translateY(-4px); border-color:rgba(232,163,61,0.4);}
.special-card .ring-icon{width:46px; height:46px; margin-bottom:18px;}
.special-card h3{font-size:1.2rem; color:var(--cream); margin-bottom:10px;}
.special-card p{font-size:0.92rem; color:var(--papad); opacity:0.8; line-height:1.55; margin:0;}

.testimonials{background:var(--iron-2);}
.test-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.test-card{background:var(--iron); border-radius:16px; padding:28px; border:1px solid rgba(245,246,236,0.08);}
.stars{color:var(--ghee); font-size:0.95rem; letter-spacing:2px; margin-bottom:14px;}
.test-card p.quote{font-size:0.98rem; line-height:1.6; color:var(--papad); font-style:italic; margin:0 0 16px;}
.test-card .who{font-family:'Space Mono',monospace; font-size:0.8rem; color:var(--ghee-light); opacity:0.9;}

.visit{background:var(--iron);}
.visit-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px;}
.info-block{margin-bottom:30px;}
.info-block h4{font-size:0.82rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--ghee); font-family:'Space Mono',monospace; margin-bottom:10px;}
.info-block p{margin:0; font-size:1.05rem; color:var(--cream); line-height:1.6;}
.hours-table{width:100%; border-collapse:collapse; margin-top:6px;}
.hours-table td{padding:7px 0; font-size:0.95rem; color:var(--papad); border-bottom:1px solid rgba(245,246,236,0.08);}
.hours-table td:last-child{text-align:right; font-family:'Space Mono',monospace; color:var(--cream);}
.map-card{
    background:var(--iron-2); border-radius:20px; padding:36px; border:1px solid rgba(232,163,61,0.16);
    display:flex; flex-direction:column; justify-content:center; align-items:flex-start; min-height:280px;
    position:relative; overflow:hidden;
}
.map-card svg.bgring{position:absolute; right:-60px; bottom:-60px; width:260px; height:260px; opacity:0.08;}
.map-card h3{color:var(--cream); font-size:1.4rem; margin-bottom:10px;}
.map-card p{color:var(--papad); opacity:0.85; margin-bottom:22px; max-width:340px; line-height:1.5;}

/* ---------- FOOTER ---------- */
footer{background:var(--iron-2); padding:44px 0; border-top:1px solid rgba(245,246,236,0.08);}
.footer-grid{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px;}
.footer-brand{display:flex; align-items:center; gap:10px; font-family:'Fraunces',serif; font-weight:700;}
.footer-brand svg{width:26px; height:26px;}
footer .fine{font-size:0.82rem; color:var(--papad); opacity:0.55;}
.footer-links{display:flex; gap:22px; font-size:0.88rem;}
.footer-links a{text-decoration:none; color:var(--papad); opacity:0.75;}
.footer-links a:hover{opacity:1; color:var(--ghee-light);}

/*----------------QR------------*/
.footer-grid{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:20px;
}

.footer-qr{
    text-align:center;
}

.footer-qr p{
    margin-bottom:8px;
    font-size:14px;
    color:#ddd;
}

.footer-qr img{
    width:120px;
    height:120px;
    border-radius:10px;
    background:#fff;
    padding:5px;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:900px){
    .hero-grid, .story-grid, .visit-grid, .teaser-inner{grid-template-columns:1fr;}
    .hero-art{order:-1;}
    .story-visual{order:-1; margin-bottom:12px;}
    .special-grid, .test-grid{grid-template-columns:1fr;}
    .navlinks{display:none;}
    .stat-strip{gap:30px;}
    .teaser-grid{margin-top:8px;}
    .category-nav{top:0;}
}
@media (max-width:560px){
    .hero{padding:56px 0 40px;}
    section{padding:64px 0;}
    .hero-ctas{flex-direction:column; align-items:stretch;}
    .footer-grid{flex-direction:column; align-items:flex-start;}
    .item-row{grid-template-columns:1fr auto; row-gap:12px;}
    .item-row .price{grid-column:1; order:2; justify-self:start;}
    .item-row .stepper{grid-column:2; order:1;}
    .teaser-grid{grid-template-columns:1fr 1fr;}
    .cart-bar .wrap{padding:14px 20px;}
}