/* Layout: a printed Italian menu card on screen. Engraved caps titles,
   hairline gold rules, ivory paper bands alternating with parchment panels. */
:root{
  --paper:#F8F0E1;      /* page */
  --panel:#F0E3CB;      /* alternate band */
  --card:#FCF7EE;       /* raised surfaces */
  --ink:#3A2215;        /* espresso text */
  --ink-soft:#6B4A36;   /* secondary text */
  --gold:#A8783A;       /* accent */
  --gold-deep:#7F5524;
  --line:#DCC6A2;
  --veg:#3D7A3A; --nonveg:#A33A22; --adult:#6A2D52;
  --f-caps:"Cinzel","Trajan Pro",Georgia,serif;
  --f-display:"Cormorant Garamond","Garamond",Georgia,serif;
  --f-body:"Lora",Georgia,"Times New Roman",serif;
  --f-script:"Pinyon Script","Snell Roundhand",cursive;
  --step--1:.875rem; --step0:1.0625rem; --step1:1.3rem; --step2:1.7rem; --step3:2.3rem; --step4:clamp(2.2rem,4.6vw,3.6rem);
  --radius:6px;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--step0)/1.7 var(--f-body);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--gold-deep)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
h1,h2,h3,h4{text-wrap:balance;margin:0;color:var(--ink)}
p{margin:0}
.sr,.hp{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:.5rem 1rem;z-index:99}
.skip:focus{left:1rem}
.wrap{max-width:1180px;margin-inline:auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.narrow{max-width:760px}
.center{text-align:center}

/* type */
.eyebrow{font:500 var(--step--1)/1.4 var(--f-caps);letter-spacing:.22em;text-transform:uppercase;color:var(--gold-deep)}
.kicker{font:400 .8rem/1.4 var(--f-caps);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft)}
.title{font:600 var(--step3)/1.15 var(--f-display)}
.title-caps{font:500 var(--step2)/1.2 var(--f-caps);letter-spacing:.04em;text-transform:uppercase}
.script{font:400 1.9rem/1.2 var(--f-script);color:var(--gold-deep)}
.script.big{font-size:clamp(2rem,4.4vw,3rem);margin-block:1.2rem .4rem}
.lead{font-size:var(--step1);line-height:1.65;color:var(--ink-soft)}
.prose{display:grid;gap:1.1rem}
.prose.small{font-size:.97rem;gap:.8rem}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:46px;padding:.7rem 1.5rem;border:1px solid var(--ink);border-radius:999px;background:var(--ink);color:var(--paper);font:500 .82rem/1 var(--f-caps);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.btn:hover{background:var(--gold-deep);border-color:var(--gold-deep)}
.btn-ghost{background:transparent;color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn-small{min-height:38px;padding:.5rem 1.1rem;font-size:.74rem}
.actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.6rem}
.actions.center{justify-content:center}
.link-arrow{font:500 .82rem/1 var(--f-caps);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:.35rem;align-self:start}
.link-arrow::after{content:" →"}

/* header */
.announce{background:var(--ink);color:var(--paper);font:400 .74rem/1.4 var(--f-caps);letter-spacing:.16em;text-transform:uppercase;text-align:center}
.announce .wrap{padding-block:.55rem}
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.head-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block:.6rem}
.brand img{height:48px;width:auto}
.site-nav{display:flex;align-items:center;gap:1.6rem}
.site-nav a:not(.btn){font:500 .8rem/1 var(--f-caps);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);text-decoration:none;padding-block:.4rem;border-bottom:1px solid transparent}
.site-nav a:not(.btn):hover,.site-nav a[aria-current="page"]{border-bottom-color:var(--gold)}
.nav-toggle{display:none;background:none;border:0;padding:.6rem;cursor:pointer}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;transition:transform .2s,opacity .2s}

/* hero */
.hero{border-bottom:1px solid var(--line)}
.hero-art{width:100%;max-height:520px;object-fit:cover;object-position:center top}
.hero-copy{text-align:center;padding-block:2.6rem 3.4rem;max-width:880px}
.hero-copy h1{font:600 var(--step4)/1.08 var(--f-display);margin-block:.8rem 1.1rem}
.hero-copy .actions{justify-content:center}

/* offers */
.offers{background:var(--panel);border-bottom:1px solid var(--line)}
.offer-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:1rem;padding-block:1.4rem}
.offer{display:flex;gap:1rem;align-items:flex-start;padding:1.1rem 1.2rem;border:1px dashed var(--gold);border-radius:var(--radius);background:var(--card)}
.offer h2{font:600 1.35rem/1.2 var(--f-display);margin-bottom:.25rem}
.offer p{font-size:.95rem;color:var(--ink-soft)}
.badge{flex:none;font:600 .66rem/1 var(--f-caps);letter-spacing:.14em;text-transform:uppercase;background:var(--gold);color:var(--card);padding:.45rem .6rem;border-radius:3px;margin-top:.2rem}

/* bands */
.band{padding-block:clamp(3rem,7vw,5.5rem)}
.band-panel{background:var(--panel);border-block:1px solid var(--line)}
.section-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.6rem 1.4rem;margin-bottom:2rem}
.section-head::after{content:"";flex:1 1 120px;height:1px;background:var(--line);align-self:center}
.split{display:grid;grid-template-columns:minmax(0,1fr);gap:2rem}
.split-text{display:grid;gap:1rem;max-width:680px}
.scoop-strip{width:100%;max-height:420px;object-fit:cover;margin-top:2.4rem}

/* flavour cards */
.flavour-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:1.4rem}
.flavour{display:flex;flex-direction:column;gap:.4rem;text-align:center;padding-bottom:.4rem;border-bottom:1px solid var(--line)}
.flavour img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);mix-blend-mode:multiply;transition:transform .35s ease}
.flavour:hover img{transform:translateY(-4px) scale(1.02)}
.flavour h3,.flavour h4{font:500 1rem/1.3 var(--f-caps);letter-spacing:.06em;text-transform:uppercase;margin-top:.4rem}
.flavour p{font-size:.92rem;color:var(--ink-soft);line-height:1.5}
.flavour-foot{display:flex;justify-content:center;align-items:center;gap:1rem;margin-top:auto;padding-top:.5rem}
.price{font:600 1.15rem/1 var(--f-display);font-variant-numeric:tabular-nums}
.wa-link{font:500 .7rem/1 var(--f-caps);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--gold-deep);padding:.45rem .2rem;border-bottom:1px solid var(--gold)}
.tags{display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem}
.tag{display:inline-block;font:500 .64rem/1 var(--f-caps);letter-spacing:.1em;text-transform:uppercase;padding:.3rem .45rem;border:1px solid var(--line);border-radius:3px;color:var(--ink-soft);vertical-align:middle}
.tag-veg{border-color:var(--veg);color:var(--veg)}
.tag-nonveg{border-color:var(--nonveg);color:var(--nonveg)}
.tag-adult{border-color:var(--adult);color:var(--adult)}

/* cravings */
.craving-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:0;border-top:1px solid var(--line)}
.craving{display:grid;gap:.5rem;align-content:start;padding:1.4rem 1.2rem 1.6rem;text-decoration:none;color:var(--ink);border-bottom:1px solid var(--line);border-right:1px solid var(--line);transition:background .2s}
.craving:hover{background:var(--card)}
.craving h3{font:600 1.35rem/1.2 var(--f-display)}
.craving p{font-size:.93rem;color:var(--ink-soft);line-height:1.55}

/* play */
.play .split{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center}
.play-list{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.play-list li{display:grid;grid-template-columns:56px 1fr;grid-template-rows:auto auto;column-gap:1rem;align-items:center;padding:1rem 1.2rem;background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
.play-list svg{grid-row:1/3;width:48px;height:48px;color:var(--gold-deep)}
.play-list b{font:600 1.3rem/1.2 var(--f-display)}
.play-list span{font-size:.92rem;color:var(--ink-soft)}

/* gallery */
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,170px),1fr));gap:.8rem}
.gallery figure{margin:0;position:relative;overflow:hidden;border-radius:var(--radius)}
.gallery img{width:100%;aspect-ratio:1;object-fit:cover;transition:transform .4s}
.gallery figure:hover img{transform:scale(1.06)}
.gallery figcaption{position:absolute;inset:auto 0 0 0;padding:1.4rem .6rem .5rem;font:500 .66rem/1.3 var(--f-caps);letter-spacing:.1em;text-transform:uppercase;color:var(--card);background:linear-gradient(transparent,rgba(58,34,21,.75))}

/* feeling */
.feeling{text-align:center}
.quote{font:500 italic var(--step1)/1.6 var(--f-display);font-size:clamp(1.25rem,2.3vw,1.6rem);color:var(--ink-soft);margin-top:1rem}

/* inner page hero */
.page-hero{text-align:center;padding-block:clamp(3rem,7vw,5rem) clamp(2rem,5vw,3rem);background:linear-gradient(var(--panel),var(--paper));border-bottom:1px solid var(--line)}
.page-hero h1{font:600 var(--step4)/1.1 var(--f-display);margin-block:.7rem 1rem}
.page-hero .wrap{display:grid;justify-items:center}

/* menu */
.menu-tabs-wrap{position:sticky;top:calc(env(safe-area-inset-top,0px) + 65px);z-index:30;background:var(--paper);border-bottom:1px solid var(--line)}
.menu-tabs{display:flex;gap:.4rem;overflow-x:auto;padding-block:.7rem;scrollbar-width:none}
.menu-tabs::-webkit-scrollbar{display:none}
.tab{flex:none;font:500 .74rem/1 var(--f-caps);letter-spacing:.12em;text-transform:uppercase;background:transparent;color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:.65rem 1rem;cursor:pointer}
.tab[aria-selected="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.menu-body{padding-block:2.5rem 4rem;display:grid;gap:3.5rem}
.menu-group{display:grid;gap:2.6rem;scroll-margin-top:140px}
.group-title{font:600 var(--step3)/1.1 var(--f-display);text-align:center;padding-bottom:.6rem;border-bottom:1px solid var(--gold)}
.menu-cat{display:grid;gap:1.2rem;scroll-margin-top:140px}
.cat-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.3rem 1.2rem}
.cat-head .title-caps{font-size:var(--step1)}
.cat-note{font-size:.92rem;font-style:italic;color:var(--ink-soft)}
.menu-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));gap:.2rem 3rem}
.menu-list li{display:flex;align-items:baseline;gap:.6rem;padding-block:.65rem;border-bottom:1px dotted var(--line)}
.ml-main{min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:.2rem .5rem}
.ml-name{font:600 1.18rem/1.3 var(--f-display)}
.ml-desc{flex-basis:100%;font-size:.88rem;color:var(--ink-soft);line-height:1.4}
.ml-dots{flex:1}
.ml-price{font:600 1.1rem/1 var(--f-display);font-variant-numeric:tabular-nums;white-space:nowrap}
.ml-order{font:500 .66rem/1 var(--f-caps);letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:var(--gold-deep);border:1px solid var(--line);border-radius:999px;padding:.45rem .7rem;white-space:nowrap}
.ml-order:hover{border-color:var(--gold);background:var(--card)}
.allergens{display:grid;gap:.8rem;padding:1.6rem;background:var(--panel);border-radius:var(--radius);scroll-margin-top:140px}
.allergens .title-caps{font-size:var(--step1)}
.allergens p{font-size:.95rem;color:var(--ink-soft)}

/* story */
.belief{font:500 italic clamp(1.6rem,3.4vw,2.4rem)/1.3 var(--f-display);margin:.6rem 0 0}
.mv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:2rem;margin-top:3rem}
.mv-grid>div{display:grid;gap:.6rem;padding-top:1.2rem;border-top:1px solid var(--gold)}
.mv-grid .title-caps{font-size:var(--step1)}
.founders{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:2rem}
.founder{display:flex;flex-direction:column;gap:.6rem;min-width:0}
.founder-mono,.founder-photo{width:120px;height:120px;border-radius:50%;margin-bottom:.4rem}
.founder-photo{object-fit:cover;border:3px solid var(--card);box-shadow:0 0 0 1px var(--gold)}
.founder-mono{display:grid;place-items:center;background:var(--panel);border:1px solid var(--gold);font:500 3rem/1 var(--f-caps);color:var(--gold-deep)}
.founder h3{font:600 1.7rem/1.2 var(--f-display)}
.founder-title{font:500 .78rem/1.5 var(--f-caps);letter-spacing:.12em;text-transform:uppercase;color:var(--gold-deep)}
.closing{font:500 italic 1.4rem/1.4 var(--f-display);color:var(--ink-soft);margin-top:3rem}

/* experience */
.exp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:1.2rem}
.exp{padding:1.4rem;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);display:grid;gap:.4rem;align-content:start}
.exp h3{font:600 1.35rem/1.2 var(--f-display)}
.exp p{font-size:.93rem;color:var(--ink-soft)}
.chips{list-style:none;padding:0;margin:1.4rem 0 0;display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem}
.chips li{font:500 .76rem/1 var(--f-caps);letter-spacing:.1em;text-transform:uppercase;padding:.7rem 1rem;border:1px solid var(--gold);border-radius:999px}

/* visit & contact */
.visit-grid{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:3rem;align-items:start}
.visit-arch{border-radius:200px 200px var(--radius) var(--radius);border:1px solid var(--line)}
.visit-info{display:grid;gap:1.8rem;min-width:0}
.info-block{display:grid;gap:.5rem}
.info-block .title-caps{font-size:1rem;color:var(--gold-deep)}
.addr{font:600 1.5rem/1.35 var(--f-display)}
.map{width:100%;height:320px;border:1px solid var(--line);border-radius:var(--radius)}
.contact-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:3rem;align-items:start}
.enquiry{display:grid;gap:1.1rem;padding:clamp(1.2rem,3vw,2rem);background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
.field{display:grid;gap:.35rem;min-width:0}
.field-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:1.1rem}
.field label{font:500 .74rem/1 var(--f-caps);letter-spacing:.12em;text-transform:uppercase}
.opt{text-transform:none;letter-spacing:0;color:var(--ink-soft)}
.field input,.field select,.field textarea{width:100%;font:inherit;font-size:1rem;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:.7rem .8rem}
.enquiry .btn{justify-self:start}
.form-ok,.form-err{padding:.8rem 1rem;border-radius:4px;font-size:.95rem}
.form-ok{background:#E6EFDC;color:#2E5A26;border:1px solid #B9CFA6}
.form-err{background:#F6E0D8;color:#8A2E1A;border:1px solid #E2B5A6}
.contact-side{display:grid;gap:2rem}

/* footer */
.site-foot{background:var(--panel);border-top:1px solid var(--line);margin-top:0}
.foot-skyline{width:100%;max-height:140px;object-fit:cover;object-position:center bottom;opacity:.85;mix-blend-mode:multiply}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:2rem;padding-block:2.5rem}
.foot-brand{display:grid;gap:.8rem;align-content:start}
.foot-brand img{width:200px}
.foot-grid h3{font:500 .82rem/1 var(--f-caps);letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:.9rem}
.foot-grid p,.foot-links{font-size:.93rem}
.foot-grid>div{display:grid;gap:.5rem;align-content:start}
.foot-links{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
.foot-links a{color:var(--ink);text-decoration:none}
.foot-links a:hover{color:var(--gold-deep);text-decoration:underline}
.muted{color:var(--ink-soft);font-size:.9rem}
.foot-base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.6rem;padding-block:1.1rem;border-top:1px solid var(--line);font:400 .72rem/1.5 var(--f-caps);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}

.wa-float{position:fixed;right:calc(18px + env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:50;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#1F8A4C;color:#fff;box-shadow:0 6px 20px rgba(58,34,21,.3);transition:transform .2s}
.wa-float:hover{transform:scale(1.07)}

/* reveal: visible by default, only enhanced when JS adds .js */
.js .reveal{transform:translateY(22px);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.js .reveal.in{opacity:1;transform:none}

@media (max-width:960px){
  .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .play .split,.visit-grid,.contact-grid{grid-template-columns:minmax(0,1fr)}
  .visit-arch{max-width:300px;justify-self:center}
}
@media (max-width:860px){
  .nav-toggle{display:block}
  .site-nav{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--paper);border-bottom:1px solid var(--line);padding:.5rem max(16px,env(safe-area-inset-right,0px)) 1rem max(16px,env(safe-area-inset-left,0px));display:none}
  .site-nav.open{display:flex}
  .site-nav a:not(.btn){padding-block:.9rem;border-bottom:1px solid var(--line)}
  .site-nav .btn{margin-top:.8rem}
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .brand img{height:40px}
  .menu-tabs-wrap{top:calc(env(safe-area-inset-top,0px) + 57px)}
}
@media (max-width:560px){
  .lead{font-size:1.05rem}
  .hero-copy{padding-block:2rem 2.6rem}
  .foot-grid{grid-template-columns:minmax(0,1fr)}
  .flavour-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem .8rem}
  .flavour p{font-size:.85rem}
  .flavour-foot{flex-direction:column;gap:.3rem}
  .ml-order{padding:.4rem .55rem}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
  .js .reveal{transform:none}
}