@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:wght@600;700&display=swap');

:root { --ink:#231b16; --muted:#756a62; --cream:#fffaf2; --paper:#fffdf9; --line:#eadfd3; --terracotta:#c85c3d; --green:#265f47; --gold:#e8b765; --shadow:0 18px 50px #4c291415; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:'DM Sans',system-ui,sans-serif; }
a { color:inherit; text-decoration:none; }
button, input, select, textarea { font:inherit; }
button { cursor:pointer; }
.site-header { align-items:center; background:#fffaf2e8; border-bottom:1px solid var(--line); display:flex; gap:32px; justify-content:space-between; padding:18px clamp(20px,5vw,72px); position:sticky; top:0; z-index:10; backdrop-filter:blur(16px); }
.brand { align-items:center; display:flex; font-family:'Playfair Display',serif; font-size:24px; font-weight:700; gap:8px; white-space:nowrap; }
.brand em { color:var(--terracotta); font-style:normal; }.brand-mark { color:var(--gold); font-size:20px; }
.nav-links { display:flex; gap:28px; margin-left:auto; }.nav-links a { color:var(--muted); font-size:14px; font-weight:600; }.nav-links a:hover { color:var(--terracotta); }.nav-whatsapp { color:var(--green)!important; }
.cart-button,.icon-button { border:1px solid var(--line); background:var(--paper); border-radius:999px; color:var(--ink); font-weight:700; padding:11px 15px; }.cart-button span { background:var(--terracotta); border-radius:50%; color:white; display:inline-grid; height:21px; margin-left:5px; place-items:center; width:21px; }
.section-shell { margin:auto; max-width:1240px; padding-left:clamp(20px,5vw,72px); padding-right:clamp(20px,5vw,72px); }
.hero { display:grid; gap:48px; grid-template-columns:1fr .9fr; min-height:600px; padding-bottom:72px; padding-top:82px; }.hero-copy { align-self:center; max-width:600px; }.eyebrow { color:var(--terracotta); font-size:11px; font-weight:700; letter-spacing:.15em; margin:0 0 12px; text-transform:uppercase; }.hero h1,h2 { font-family:'Playfair Display',serif; letter-spacing:-.04em; margin:0; }.hero h1 { font-size:clamp(46px,6vw,78px); line-height:.98; }.hero-text { color:var(--muted); font-size:18px; line-height:1.6; margin:24px 0; max-width:500px; }.hero-actions { align-items:center; display:flex; gap:14px; }.button { align-items:center; border:0; border-radius:999px; display:inline-flex; font-weight:700; gap:14px; justify-content:center; padding:15px 20px; }.button-primary { background:var(--terracotta); box-shadow:0 10px 22px #c85c3d33; color:white; }.button-primary:hover { background:#aa4931; }.button-quiet { color:var(--green); padding-left:5px; }.trust-row { color:var(--muted); display:flex; flex-wrap:wrap; font-size:12px; gap:18px; margin-top:34px; }.hero-art { background:linear-gradient(180deg,#c99d6222,#1e4b35a8),url('Clay&Curry-Menu.png') center 12%/cover; border-radius:190px 190px 24px 24px; box-shadow:var(--shadow); min-height:500px; position:relative; }.hero-art-overlay { background:#fffaf2e8; bottom:22px; left:22px; padding:16px 20px; position:absolute; right:22px; }.hero-art-overlay span { color:var(--terracotta); display:block; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }.hero-art-overlay strong { font-family:'Playfair Display',serif; font-size:24px; }
.meal-strip { align-items:end; border-bottom:1px solid var(--line); border-top:1px solid var(--line); display:flex; gap:24px; justify-content:space-between; padding-bottom:30px; padding-top:30px; }.meal-strip h2,.menu-section h2,.how-section h2 { font-size:clamp(32px,4vw,48px); }.meal-tabs,.category-tabs { display:flex; flex-wrap:wrap; gap:8px; }.meal-tab,.category-tabs button { background:transparent; border:1px solid var(--line); border-radius:999px; color:var(--muted); padding:10px 15px; }.meal-tab.active,.category-tabs button.active { background:var(--green); border-color:var(--green); color:#fff; }
.menu-section { padding-bottom:100px; padding-top:88px; }.section-heading { align-items:end; display:flex; justify-content:space-between; }.menu-note { color:var(--muted); font-size:13px; }.category-tabs { margin:30px 0; }.menu-grid { display:grid; gap:16px; grid-template-columns:repeat(4,1fr); }.menu-card { background:var(--paper); border:1px solid var(--line); border-radius:18px; display:flex; flex-direction:column; min-height:190px; padding:18px; transition:transform .2s,box-shadow .2s; }.menu-card:hover { box-shadow:var(--shadow); transform:translateY(-3px); }.menu-card-top { align-items:center; display:flex; justify-content:space-between; }.dish-category { color:var(--terracotta); font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }.dish-icon { align-items:center; background:#f8eddf; border-radius:50%; display:grid; font-size:24px; height:48px; place-items:center; width:48px; }.menu-card h3 { font-family:'Playfair Display',serif; font-size:20px; margin:22px 0 6px; }.dish-meta { color:var(--muted); font-size:13px; margin:0 0 16px; }.menu-card-footer { align-items:center; display:flex; justify-content:space-between; margin-top:auto; }.price { font-weight:700; }.add-button { background:var(--green); border:0; border-radius:999px; color:#fff; font-size:13px; font-weight:700; padding:9px 13px; }.loading,.empty-state { color:var(--muted); grid-column:1/-1; padding:32px 0; }
.how-section { border-top:1px solid var(--line); padding-bottom:110px; padding-top:82px; }.steps-grid { display:grid; gap:16px; grid-template-columns:repeat(3,1fr); margin-top:34px; }.steps-grid article { background:#f6ecdf; border-radius:20px; padding:25px; }.steps-grid span { color:var(--terracotta); font-weight:700; }.steps-grid h3 { font-family:'Playfair Display',serif; font-size:24px; margin:40px 0 8px; }.steps-grid p { color:var(--muted); line-height:1.5; margin:0; }
.cart-panel { background:var(--paper); bottom:0; box-shadow:-18px 0 60px #4c291426; max-width:460px; overflow:auto; padding:28px; position:fixed; right:0; top:0; transform:translateX(105%); transition:transform .3s ease; width:100%; z-index:30; }.cart-panel.open { transform:translateX(0); }.cart-header { align-items:start; display:flex; justify-content:space-between; }.cart-header h2 { font-size:34px; }.icon-button { border:0; font-size:28px; line-height:1; padding:3px 10px; }.cart-items { border-bottom:1px solid var(--line); margin:26px 0 18px; padding-bottom:12px; }.cart-line { align-items:center; display:flex; gap:12px; justify-content:space-between; padding:10px 0; }.cart-line-name { font-weight:600; }.cart-line small { color:var(--muted); display:block; font-weight:400; margin-top:3px; }.remove-item { background:none; border:0; color:var(--terracotta); font-size:12px; }.cart-total { display:flex; font-size:18px; justify-content:space-between; margin-bottom:22px; }.booking-form { display:grid; gap:14px; }.booking-form label { color:var(--muted); display:grid; font-size:12px; font-weight:700; gap:6px; }.booking-form input,.booking-form select,.booking-form textarea { background:#fffaf5; border:1px solid var(--line); border-radius:10px; color:var(--ink); outline:0; padding:12px; resize:vertical; }.booking-form input:focus,.booking-form select:focus,.booking-form textarea:focus { border-color:var(--terracotta); }.full-width { width:100%; }.form-note { color:var(--muted); font-size:11px; line-height:1.4; margin:0; text-align:center; }.is-hidden { display:none!important; }.scrim { background:#231b1666; inset:0; position:fixed; z-index:20; }.toast { background:var(--green); border-radius:10px; bottom:24px; box-shadow:var(--shadow); color:white; left:50%; opacity:0; padding:14px 18px; pointer-events:none; position:fixed; transform:translate(-50%,20px); transition:all .25s; z-index:40; }.toast.show { opacity:1; transform:translate(-50%,0); }
@media (max-width:900px) { .hero { grid-template-columns:1fr; padding-top:52px; }.hero-art { min-height:380px; }.menu-grid { grid-template-columns:repeat(2,1fr); }.nav-links { display:none; } }
@media (max-width:560px) { .site-header { padding:14px 18px; }.brand { font-size:20px; }.cart-button { font-size:12px; padding:9px 11px; }.hero { padding-bottom:48px; }.hero h1 { font-size:48px; }.hero-art { min-height:330px; }.hero-actions { align-items:stretch; flex-direction:column; }.meal-strip,.section-heading { align-items:start; flex-direction:column; }.menu-grid,.steps-grid { grid-template-columns:1fr; }.menu-section { padding-bottom:70px; padding-top:60px; }.how-section { padding-bottom:70px; padding-top:60px; }.cart-panel { padding:22px; } }

/* Patty-inspired visual pass: bold contrast, compact pills, image-led hero. */
:root { --ink:#000; --muted:#5f5f5f; --cream:#fffffc; --paper:#fff; --line:#deded9; --terracotta:#f15b3a; --green:#141414; --gold:#f2a56f; --lime:#f3ffcf; --shadow:0 18px 50px #17171716; }
.site-header { background:#fffffcb8; border:0; border-bottom:1px solid #e8f5c6; box-shadow:0 8px 30px #1720000c; position:fixed; transform:none; width:100%; backdrop-filter:blur(18px) saturate(1.3); }
.brand { font-family:'DM Sans',system-ui,sans-serif; font-size:18px; letter-spacing:-.04em; text-transform:uppercase; }
.cart-button,.icon-button { background:var(--ink); border-color:var(--ink); color:#fff; }
.section-shell { max-width:1440px; }
.hero { gap:34px; grid-template-columns:1fr 1fr; min-height:675px; padding-bottom:0; padding-top:120px; }
.hero-copy { max-width:none; }
.hero .eyebrow { background:var(--lime); border-radius:999px; color:var(--ink); display:inline-block; font-size:14px; letter-spacing:0; padding:16px 24px; text-transform:none; }
.hero h1 { font-size:54px; line-height:1.2; }
.hero-text { color:var(--ink); font-size:18px; font-weight:500; margin:16px 0 26px; max-width:none; }
.hero-actions { gap:12px; }
.hero-actions .button { min-height:55px; padding:16px 32px; }
.button-primary { background:var(--ink); box-shadow:0 10px 22px #17171722; }
.button-primary:hover { background:var(--terracotta); }
.button-quiet { border:2px solid var(--ink); color:var(--ink); padding:14px 30px; }
.trust-row { display:none; }
.hero-art { background:url('photos/thali.jpg') center/cover; border-radius:32px; box-shadow:none; min-height:675px; position:relative; }
.hero-art::before { background:var(--lime); border-radius:32px 0 0 32px; bottom:24px; content:''; left:-24px; position:absolute; top:-24px; width:48px; z-index:-1; }
.meal-strip { border:0; padding-bottom:0; padding-top:80px; }
.meal-strip .eyebrow { display:none; }
.meal-strip h2 { font-size:42px; }
.meal-tab,.category-tabs button { border-color:#d8d8d2; font-size:15px; padding:12px 18px; }
.meal-tab.active,.category-tabs button.active { background:var(--ink); border-color:var(--ink); }
.menu-card { border-radius:10px; }
.add-button { background:var(--ink); }
.add-button:hover { background:var(--terracotta); }
.hero h1,.meal-strip h2,.menu-section h2,.how-section h2,.visit-section h2 { font-family:'DM Sans',system-ui,sans-serif; font-weight:700; }
.menu-section { padding-bottom:80px; padding-top:24px; }
.menu-section .section-heading { display:none; }
.category-tabs { margin:0 0 40px; }
.menu-grid { display:flex; flex-direction:column; gap:104px; }
.menu-category { display:flex; flex-direction:column; gap:104px; }
.menu-category-stack { display:grid; position:relative; }
.menu-category-stack .menu-feature { grid-area:1/1; pointer-events:none; transform:translateY(calc(var(--deck-position) * 14px)) scale(calc(1 - var(--deck-position) * .02)); transform-origin:center top; transition:transform .45s cubic-bezier(.2,.8,.2,1); z-index:calc(4 - var(--deck-position)); }
.menu-category-stack .menu-feature.is-active { pointer-events:auto; }
.menu-category-stack .menu-list { min-height:641.6px; }
.menu-stack-nav { align-self:start; background:#fff; border-radius:999px; display:flex; gap:4px; grid-area:1/1; justify-self:end; margin:40px; padding:5px; position:relative; z-index:8; }
.menu-stack-nav button { background:transparent; border:0; border-radius:999px; color:#777; font-size:12px; font-weight:700; height:34px; padding:0; width:38px; }
.menu-stack-nav button.active { background:var(--ink); color:#fff; }
.menu-feature { align-items:start; display:grid; grid-template-columns:40% 62.5%; }
.menu-feature.reverse { grid-template-columns:62.5% 40%; }
.menu-feature.reverse .menu-photo { order:2; }
.menu-photo { aspect-ratio:14/15; border-radius:32px; justify-self:start; min-height:0; overflow:hidden; position:relative; transform:translateY(-24px); width:100%; z-index:1; }
.menu-photo img { height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.2,.8,.2,1); width:100%; }
.menu-list { background:var(--lime); border-radius:32px; display:flex; flex-direction:column; gap:24px; justify-self:start; margin-left:-32px; padding:40px; position:relative; width:100%; z-index:2; }
.menu-feature.reverse .menu-photo { margin-left:-32px; }
.menu-feature.reverse .menu-list { margin-left:0; padding:40px; }
.menu-list > h3 { align-items:flex-end; display:flex; font-size:24px; height:49.6px; line-height:1.4; margin:0 0 16px; }
.menu-row { align-items:center; display:grid; gap:40px; grid-template-columns:100px 1fr; height:100px; padding:0; position:relative; }
.menu-row > img { background:#fff9e8; border-radius:50%; box-sizing:border-box; height:100px; object-fit:contain; padding:14px; width:100px; }
.menu-row-copy strong { display:block; font-size:18px; line-height:1.3; margin-bottom:10px; }
.menu-row-copy h4 { font-size:18px; line-height:1.3; margin:0 0 8px; }
.menu-row-copy p { color:var(--ink); font-size:16px; font-weight:500; line-height:1.3; margin:0; }
.menu-row .add-button { font-size:11px; opacity:0; padding:8px 11px; position:absolute; right:0; transform:translateX(8px); transition:opacity .2s,transform .2s; }
.menu-row { border-radius:16px; margin:0; transition:background .25s ease, transform .35s cubic-bezier(.2,.8,.2,1); }
.menu-row:hover { background:#e4f6b8; transform:translateX(8px); }
.menu-row:hover .add-button,.menu-row .add-button:focus-visible { opacity:1; transform:translateX(0); }
.menu-row:hover > img { transform:scale(1.12) rotate(2deg); }
.menu-row > img { transition:transform .35s cubic-bezier(.2,.8,.2,1); }
.menu-feature:has(.menu-row:hover) .menu-photo img { transform:scale(1.035); }
.menu-row:hover .menu-row-copy strong { color:var(--terracotta); }
.how-section { border:0; padding-bottom:80px; padding-top:80px; }
.how-section > .eyebrow,.visit-section > .eyebrow { display:none; }
.how-section h2 { font-size:42px; }
.steps-grid { gap:24px; margin-top:64px; }
.steps-grid article { background:var(--lime); border-radius:32px; min-height:240px; padding:32px; }
.steps-grid span { color:var(--ink); font-size:18px; }
.steps-grid h3 { font-family:'DM Sans',system-ui,sans-serif; font-size:24px; margin:72px 0 8px; }
.visit-section { padding-bottom:120px; padding-top:80px; }
.visit-section > h2 { font-size:42px; margin-bottom:80px; }
.visit-grid { align-items:stretch; display:grid; grid-template-columns:37.5% 62.5%; }
.visit-map { align-items:end; background:linear-gradient(135deg,#a9c0cb,#e5e3d7 48%,#d2b98b); border-radius:32px; display:flex; min-height:608px; overflow:hidden; padding:24px; position:relative; }
.visit-map::after { background:repeating-linear-gradient(35deg,#ffffff50 0 2px,transparent 2px 38px); content:''; inset:0; position:absolute; }
.visit-map span { background:#fff; border-radius:999px; font-weight:700; padding:12px 16px; position:relative; z-index:1; }
.visit-copy { background:var(--lime); border-radius:32px; padding:40px; }
.visit-brand { margin-bottom:64px; }
.visit-copy h3 { font-size:28px; margin:0 0 18px; }.visit-copy p { color:#42453b; line-height:1.55; max-width:550px; }.visit-details { margin:30px 0; }
.site-footer { background:var(--lime); border-radius:72px 72px 0 0; display:grid; grid-template-columns:1fr 1fr; min-height:620px; padding-bottom:32px; padding-top:96px; position:relative; }
.footer-intro { border-right:2px solid var(--ink); display:flex; flex-direction:column; gap:36px; padding-right:40px; }
.footer-intro h2 { font-family:'DM Sans',system-ui,sans-serif; font-size:42px; margin:0; }
.footer-intro a { font-weight:700; margin-bottom:44px; margin-top:auto; }
.footer-details { display:flex; flex-direction:column; gap:24px; padding-left:40px; }
.footer-details p { line-height:1.6; margin:0; }
.site-footer small { bottom:28px; left:72px; position:absolute; }
@media (max-width:900px) { .hero { grid-template-columns:1fr; }.hero-art { min-height:560px; }.menu-grid,.menu-category { gap:60px; }.menu-stack-nav { margin:350px 24px 0 0; }.menu-feature,.menu-feature.reverse { grid-template-columns:1fr; }.menu-feature.reverse .menu-photo { margin-left:0; order:0; }.menu-photo { aspect-ratio:16/10; border-radius:28px 28px 0 0; min-height:330px; transform:none; }.menu-list,.menu-feature.reverse .menu-list { border-radius:0 0 28px 28px; margin-left:0; padding:34px 28px; }.visit-grid { grid-template-columns:1fr; }.visit-map { border-radius:28px; min-height:380px; }.visit-copy { border-radius:28px; padding:34px 28px; }.visit-brand { margin-bottom:48px; }.site-footer { grid-template-columns:1fr; }.footer-intro { border-bottom:2px solid var(--ink); border-right:0; padding-bottom:40px; padding-right:0; }.footer-details { padding:40px 0 80px; } }
@media (prefers-reduced-motion:reduce) { .menu-category-stack .menu-feature { transition:none; } }
@media (max-width:560px) { .hero { padding-top:80px; }.hero h1 { font-size:44px; }.hero-art { min-height:440px; }.menu-grid { gap:44px; }.menu-row { gap:12px; grid-template-columns:64px 1fr auto; height:94px; }.menu-row > img { height:64px; width:64px; }.menu-row-copy strong { font-size:16px; margin-bottom:4px; }.menu-row-copy h4 { font-size:15px; margin-bottom:4px; }.menu-row-copy p { font-size:11px; }.menu-row .add-button { opacity:1; position:static; transform:none; }.menu-list > h3 { font-size:24px; }.steps-grid { grid-template-columns:1fr; }.visit-section > h2,.how-section h2,.footer-intro h2 { font-size:36px; }.site-footer { border-radius:40px 40px 0 0; min-height:700px; padding-top:64px; }.site-footer small { left:20px; } }