/* SIREH — public site. Colours come from /theme.css (set in the dashboard). */
@font-face{font-family:"Plex Arabic";src:url(../fonts/ibm-plex-sans-arabic-arabic-400-normal.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Plex Arabic";src:url(../fonts/ibm-plex-sans-arabic-arabic-500-normal.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Plex Arabic";src:url(../fonts/ibm-plex-sans-arabic-arabic-600-normal.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:"Plex Arabic";src:url(../fonts/ibm-plex-sans-arabic-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Plex Arabic";src:url(../fonts/ibm-plex-sans-arabic-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Plex Arabic";src:url(../fonts/ibm-plex-sans-arabic-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap;unicode-range:U+0000-00FF,U+2000-206F,U+20AC,U+2122}
@font-face{font-family:"Cormorant";src:url(../fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Cormorant";src:url(../fonts/cormorant-garamond-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Montserrat";src:url(../fonts/montserrat-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Montserrat";src:url(../fonts/montserrat-latin-500-normal.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  --bg:#EEE4D1;--surface:#F7F2E8;--ink:#2B2219;--gold:#C49B5B;--accent:#2B2219;--dark:#14110E;
  --muted:color-mix(in srgb,var(--ink) 62%,var(--bg));
  --line:color-mix(in srgb,var(--ink) 14%,var(--bg));
  --soft:color-mix(in srgb,var(--ink) 6%,var(--bg));
  --on-accent:#F7F2E8;
  --r:20px;--r-sm:12px;--pad:clamp(16px,4vw,40px);--max:1160px;
  --f-body:"SirehArBody","Plex Arabic",system-ui,sans-serif;
  --f-display:"SirehArDisplay","SirehArBody","Plex Arabic",system-ui,sans-serif;
  --f-latin:"SirehEnDisplay","Cormorant",Georgia,serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}
html[lang=en]{--f-body:"SirehEnBody","Montserrat",system-ui,sans-serif;--f-display:"SirehEnDisplay","Cormorant",Georgia,serif}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.7 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
html[lang=en] body{font-size:15px;letter-spacing:.005em}
img,video,svg{display:block;max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:500;line-height:1.25;margin:0}
p{margin:0}
.wrap{width:min(100% - 2*var(--pad),var(--max));margin-inline:auto}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.num,bdi.num{font-variant-numeric:tabular-nums;direction:ltr;unicode-bidi:isolate}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* ---------- Logo ---------- */
.logo{display:block;max-width:100%;height:auto}
.logo--emblem{aspect-ratio:661/466}.logo--horizontal{aspect-ratio:1355.7/466}.logo--word{aspect-ratio:527.1/90.9}.logo--primary{aspect-ratio:677.9/697.2}
.hdr__logo .logo{height:36px;width:auto}
.brandmark{display:flex;align-items:center;gap:10px;height:100%}
.brandmark .logo--emblem{height:40px;width:auto}
.brandmark .logo--word{height:11px;width:auto}
.logo use{color:var(--lg-ink)}
.on-dark{--lg-ink:#EEE4D1;--lg-word:#EEE4D1;--lg-gold:var(--gold)}

/* ---------- Buttons ---------- */
.btn{--h:52px;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--h);padding:0 28px;border-radius:999px;border:1px solid transparent;
  background:var(--accent);color:var(--on-accent);font-weight:500;font-size:16px;text-decoration:none;cursor:pointer;transition:transform .25s var(--ease),background .25s,box-shadow .25s;white-space:nowrap}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 24px -14px color-mix(in srgb,var(--accent) 80%,transparent)}
.btn:active{transform:none}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn--ghost:hover{background:var(--soft)}
.btn--gold{background:var(--gold);color:#1a140e}
.btn--sm{--h:40px;padding:0 18px;font-size:14px}
.btn--block{width:100%}
.link{background:none;border:0;padding:0;color:inherit;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--gold);cursor:pointer;font-weight:500}

/* ---------- Header ---------- */
.hdr{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.hdr__in{display:flex;align-items:center;gap:20px;height:68px}
.hdr__logo{height:44px;display:block;flex:none;text-decoration:none}
.hdr__logo img{height:100%;width:auto;max-width:200px;object-fit:contain}
.hdr nav{display:flex;gap:26px;margin-inline-start:auto}
.hdr nav a{text-decoration:none;font-size:15px;color:var(--muted);transition:color .2s}
.hdr nav a:hover,.hdr nav a[aria-current=page]{color:var(--ink)}
.hdr__end{display:flex;align-items:center;gap:10px}
.hdr nav + .hdr__end{margin-inline-start:12px}
.lang{background:none;border:1px solid var(--line);border-radius:999px;height:40px;min-width:46px;padding:0 12px;cursor:pointer;font:500 13px/1 "Montserrat",sans-serif;letter-spacing:.08em}
html[lang=en] .lang{font-family:"Plex Arabic",sans-serif;letter-spacing:0;font-size:15px}
.burger{display:none;background:none;border:1px solid var(--line);border-radius:999px;width:42px;height:40px;cursor:pointer;padding:0;align-content:center}
.burger span{display:block;width:16px;height:1.5px;background:var(--ink);margin:3px auto;transition:transform .3s var(--ease)}
.drawer{position:fixed;inset:68px 0 auto;background:var(--bg);border-bottom:1px solid var(--line);padding:12px var(--pad) 24px;display:none;z-index:39}
.drawer.is-open{display:block}
.drawer a{display:block;padding:14px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:18px}
@media (max-width:860px){
  .hdr nav{display:none}
  .burger{display:grid}
  .hdr__end{margin-inline-start:auto}
  .hdr__cta{display:none}
}

/* ---------- Sections ---------- */
.sec{padding:clamp(56px,9vw,112px) 0}
.sec--tight{padding-top:clamp(24px,4vw,48px)}
.sec--dark{background:var(--dark);color:#EEE4D1;--line:rgba(238,228,209,.16);--muted:rgba(238,228,209,.66);--soft:rgba(238,228,209,.06)}
.sec__head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:clamp(24px,4vw,44px)}
.sec__head h2{font-size:clamp(28px,4.2vw,44px)}
.sec__head p{color:var(--muted);margin-top:8px;max-width:56ch}
.eyebrow{font:500 12px/1 "Montserrat",sans-serif;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;display:block}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ---------- Hero (catering first) ---------- */
.hero{position:relative;min-height:calc(100svh - 68px);display:grid;place-items:center;text-align:center;padding:clamp(40px,7vw,80px) 0 clamp(56px,8vw,96px);overflow:hidden;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:-2}
.hero__bg img,.hero__bg video{width:100%;height:100%;object-fit:cover}
.hero__shade{position:absolute;inset:0;z-index:-1;background:#000;opacity:var(--shade,.35)}
.hero--plain::before{content:"";position:absolute;inset:-20%;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 45% at 50% 38%,color-mix(in srgb,#fff 38%,transparent),transparent 70%)}
.hero__in{width:min(100% - 2*var(--pad),640px);display:flex;flex-direction:column;align-items:center}
.hero__emblem{width:clamp(210px,34vw,330px);margin-bottom:clamp(14px,2vw,22px)}
.hero__emblem svg,.hero__emblem img{width:100%;height:auto}
.hero__word{width:clamp(170px,22vw,220px)}
.hero__word svg{width:100%;height:auto}
.hero__tag{font-family:var(--f-display);color:var(--gold);font-size:clamp(22px,3vw,28px);margin-top:14px}
html[lang=en] .hero__tag{font-style:italic;letter-spacing:.02em}
.hero__text{color:var(--muted);max-width:42ch;margin:14px auto 0;font-size:clamp(16px,1.8vw,18px)}
.hero__ctas{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:28px}
.hero__note{margin-top:16px;font-size:13px;color:var(--muted)}
.hero__scroll{position:absolute;bottom:22px;inset-inline:0;margin:auto;width:24px;height:38px;border:1.5px solid var(--line);border-radius:999px}
.hero__scroll::after{content:"";position:absolute;top:8px;left:50%;width:3px;height:7px;border-radius:2px;background:var(--gold);transform:translateX(-50%);animation:scrolly 2.2s var(--ease) infinite}
@keyframes scrolly{0%{opacity:0;transform:translate(-50%,0)}30%{opacity:1}100%{opacity:0;transform:translate(-50%,12px)}}
.hero--media{color:#F7F2E8;--muted:rgba(247,242,232,.82);--line:rgba(247,242,232,.35);--lg-ink:#F7F2E8;--lg-word:#F7F2E8}
.hero--media .btn--ghost{color:#F7F2E8}
.hero__in > *{animation:rise 1s var(--ease) both}
.hero__in > :nth-child(2){animation-delay:.12s}.hero__in > :nth-child(3){animation-delay:.22s}.hero__in > :nth-child(4){animation-delay:.32s}.hero__in > :nth-child(n+5){animation-delay:.42s}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.closed-note{margin-top:22px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 16px;font-size:14px;color:var(--ink)}

/* ---------- Steps ---------- */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,24px);counter-reset:s}
.steps li{position:relative;padding:22px 20px 24px;border-top:1px solid var(--line)}
.steps li::before{counter-increment:s;content:counter(s);display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--gold);color:var(--gold);font:500 15px/1 "Montserrat",sans-serif;margin-bottom:16px}
.steps li p{font-size:16px}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.steps{grid-template-columns:1fr;gap:0}.steps li{display:flex;gap:16px;align-items:center;padding:14px 0;border-top:0}.steps li::before{margin:0;flex:none}}

/* ---------- Packages ---------- */
.pkgs{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(14px,2vw,22px)}
.pkg{position:relative;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s}
.pkg:hover{transform:translateY(-3px);box-shadow:0 24px 40px -30px rgba(43,34,25,.45)}
.pkg__img{aspect-ratio:16/9;background:var(--soft)}
.pkg__img img{width:100%;height:100%;object-fit:cover}
.pkg__body{padding:clamp(20px,2.6vw,30px);display:flex;flex-direction:column;gap:10px;flex:1}
.pkg__top{display:flex;justify-content:space-between;align-items:start;gap:16px}
.pkg h3{font-size:clamp(22px,2.4vw,27px)}
.pkg__story{color:var(--muted);font-size:15px}
.price{display:inline-flex;align-items:baseline;gap:6px;font-weight:600;font-size:22px;white-space:nowrap}
.price small{font-weight:400;font-size:13px;color:var(--muted)}
.sar{display:inline-block;width:.78em;height:.88em;vertical-align:-.06em;flex:none}
.badge{align-self:flex-start;background:var(--gold);color:#1a140e;font-size:12px;font-weight:600;padding:4px 12px;border-radius:999px;line-height:1.5}
.pkg details{border-top:1px solid var(--line);margin-top:6px;padding-top:12px}
.pkg summary{cursor:pointer;list-style:none;font-weight:500;font-size:15px;display:flex;justify-content:space-between;align-items:center}
.pkg summary::-webkit-details-marker{display:none}
.pkg summary::after{content:"+";font:400 22px/1 "Montserrat",sans-serif;color:var(--gold);transition:transform .3s}
.pkg details[open] summary::after{transform:rotate(45deg)}
.pkg ul{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.pkg li{display:flex;gap:10px;font-size:15px}
.pkg li::before{content:"";flex:none;width:6px;height:6px;margin-top:.7em;background:var(--gold);transform:rotate(45deg)}
.pkg__go{margin-top:auto;padding-top:14px}
@media (max-width:700px){.pkgs{grid-template-columns:1fr}}

/* ---------- Occasions ---------- */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:999px;border:1px solid var(--line);background:var(--surface);text-decoration:none;font-size:15px;transition:background .2s,border-color .2s,color .2s;cursor:pointer}
.chip:hover{border-color:var(--gold)}
.chip[aria-pressed=true],.chip.is-on{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* ---------- Banners (full-bleed slider) ---------- */
.banners{position:relative;overflow:hidden;background:var(--dark)}
.banners__track{display:flex;transition:transform .8s var(--ease)}
.banner{position:relative;flex:0 0 100%;aspect-ratio:12/5;color:#F7F2E8;text-decoration:none;display:block}
.banner img,.banner video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.banner__txt{position:absolute;inset:auto 0 0;padding:clamp(20px,5vw,64px);background:linear-gradient(transparent,rgba(0,0,0,.55))}
.banner__txt h3{font-size:clamp(24px,4vw,48px)}
.banner__txt p{opacity:.85;margin-top:6px}
.banners__nav{position:absolute;inset-inline:0;bottom:16px;display:flex;justify-content:center;gap:8px;z-index:3}
.banners__nav button{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.45);cursor:pointer;padding:0;transition:width .3s}
.banners__nav button[aria-current=true]{background:#fff;width:24px;border-radius:9px}
.banners__arrow{position:absolute;top:50%;translate:0 -50%;z-index:3;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.5);background:rgba(0,0,0,.25);color:#fff;cursor:pointer;display:grid;place-items:center;font-size:20px;backdrop-filter:blur(6px)}
.banners__arrow--prev{inset-inline-start:18px}.banners__arrow--next{inset-inline-end:18px}
@media (max-width:700px){.banner{aspect-ratio:4/5}.banners__arrow{display:none}}

/* ---------- Dishes ---------- */
.dishes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,3vw,36px)}
.dish{text-align:center}
.dish__img{width:min(100%,280px);aspect-ratio:1;margin:0 auto 18px;border-radius:50%;overflow:hidden;background:radial-gradient(circle at 50% 40%,var(--surface),var(--soft));display:grid;place-items:center}
.dish__img img{width:100%;height:100%;object-fit:cover}
.dish__img svg{width:46%;height:auto;opacity:.35}
.dish .eyebrow{margin-bottom:8px}
.dish h3{font-size:24px}
.dish p{color:var(--muted);font-size:15px;margin-top:8px;max-width:34ch;margin-inline:auto}
@media (max-width:860px){.dishes{grid-template-columns:1fr;gap:44px}}

/* ---------- Gallery ---------- */
.gallery{columns:3 260px;column-gap:14px}
.gallery figure{margin:0 0 14px;break-inside:avoid;border-radius:var(--r-sm);overflow:hidden;position:relative;background:var(--soft)}
.gallery img,.gallery video{width:100%;height:auto}
.gallery figcaption{position:absolute;inset:auto 0 0;padding:28px 14px 10px;font-size:14px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.55))}

/* ---------- Restaurant / visit ---------- */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(24px,5vw,72px);align-items:center}
.split__media{border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;background:var(--soft);display:grid;place-items:center}
.split__media img,.split__media video{width:100%;height:100%;object-fit:cover}
.split__media .ph{width:40%;height:auto;opacity:.25}
.split__txt h2{font-size:clamp(28px,4vw,44px)}
.split__txt p{color:var(--muted);margin-top:14px}
.split__btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.facts{display:grid;gap:14px;margin-top:22px}
.fact{display:flex;gap:14px;align-items:start}
.fact svg{flex:none;width:22px;height:22px;color:var(--gold);margin-top:3px}
.fact strong{display:block;font-weight:500}
.fact span{color:var(--muted);font-size:15px}
@media (max-width:860px){.split{grid-template-columns:1fr}.split__media{aspect-ratio:4/3}}

/* ---------- Forms ---------- */
.form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.f{display:flex;flex-direction:column;gap:7px;min-width:0}
.f--full{grid-column:1/-1}
.f label,.f .lbl{font-size:14px;font-weight:500}
.f input,.f select,.f textarea{width:100%;min-height:50px;padding:12px 16px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface);transition:border-color .2s,box-shadow .2s;font-size:16px}
.f textarea{min-height:110px;resize:vertical}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 22%,transparent)}
.f .hint{font-size:13px;color:var(--muted)}
.f .err{font-size:13px;color:#A00000;display:none}
.f.has-err input,.f.has-err select,.f.has-err textarea{border-color:#A00000}
.f.has-err .err{display:block}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);opacity:0;pointer-events:none}
.form-msg{grid-column:1/-1;font-size:15px}
.form-msg.ok{color:#2e6b3a}.form-msg.bad{color:#A00000}
.sec--dark .f input,.sec--dark .f select,.sec--dark .f textarea{background:rgba(238,228,209,.06);color:#EEE4D1}
.sec--dark .f select option{color:#2B2219}
@media (max-width:640px){.form{grid-template-columns:1fr}}

/* ---------- Footer ---------- */
.ftr{background:var(--dark);color:#EEE4D1;padding:64px 0 28px;--muted:rgba(238,228,209,.6);--line:rgba(238,228,209,.14)}
.ftr__top{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px;align-items:start}
.ftr__logo{width:150px}.ftr__logo svg{width:100%;height:auto}
.ftr__sig{font-family:var(--f-display);font-size:19px;margin-top:18px;max-width:30ch;color:#EEE4D1}
.ftr h4{font:500 12px/1 "Montserrat",sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
.ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ftr a{text-decoration:none;color:var(--muted);transition:color .2s}
.ftr a:hover{color:#EEE4D1}
.ftr__bot{border-top:1px solid var(--line);margin-top:44px;padding-top:20px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
@media (max-width:760px){.ftr__top{grid-template-columns:1fr}}

/* ---------- Mobile booking bar ---------- */
.mbar{position:fixed;inset:auto 0 0;z-index:30;padding:10px var(--pad) calc(10px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--bg) 94%,transparent);backdrop-filter:blur(10px);border-top:1px solid var(--line);display:none;transform:translateY(110%);transition:transform .4s var(--ease)}
.mbar.show{transform:none}
@media (max-width:760px){.mbar{display:block}.has-mbar{padding-bottom:84px}}

/* ---------- Toast ---------- */
.toast{position:fixed;inset-inline:0;bottom:24px;margin:auto;width:max-content;max-width:calc(100% - 32px);background:var(--ink);color:var(--bg);padding:12px 20px;border-radius:999px;font-size:15px;z-index:100;opacity:0;transform:translateY(10px);transition:.3s var(--ease);pointer-events:none}
.toast.show{opacity:1;transform:none}
@media (max-width:1023px){body:has(.bbar) .toast,body:has(.mbar.show) .toast{bottom:96px}}

/* ======================= Booking wizard ======================= */
.book{padding:28px 0 140px}
.book__grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:32px;align-items:start}
.book__head{margin-bottom:22px}
.book__head h1{font-size:clamp(28px,4vw,40px)}
.book__head p{color:var(--muted);margin-top:6px}
.prog{display:flex;gap:6px;margin:20px 0 26px;list-style:none;padding:0}
.prog li{flex:1;display:flex;flex-direction:column;gap:8px;font-size:12.5px;color:var(--muted);cursor:default}
.prog li::before{content:"";height:3px;border-radius:3px;background:var(--line);transition:background .4s}
.prog li.done::before,.prog li.cur::before{background:var(--gold)}
.prog li.cur{color:var(--ink);font-weight:500}
.prog li.done{cursor:pointer}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:clamp(18px,3vw,28px)}
.card + .card{margin-top:16px}
.card h2{font-size:21px;margin-bottom:6px}
.card > p.sub{color:var(--muted);font-size:14.5px;margin-bottom:18px}
.qgroup{margin-top:20px}
.qgroup:first-of-type{margin-top:0}
.qgroup > .lbl{display:block;font-weight:500;margin-bottom:10px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){.grid2{grid-template-columns:1fr}}
.stepper{align-self:flex-start;display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;background:var(--bg);height:50px}
.stepper button{width:50px;height:48px;border:0;background:none;font-size:22px;cursor:pointer;color:var(--ink)}
.stepper button:disabled{opacity:.3;cursor:not-allowed}
.f .stepper input,.stepper input{width:76px;border:0;background:none;text-align:center;font-weight:600;font-size:18px;min-height:0;padding:0;border-radius:0;-moz-appearance:textfield;appearance:textfield}
.stepper input::-webkit-inner-spin-button,.stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.f .stepper input:focus,.stepper input:focus{outline:none;box-shadow:none}
.stepper--sm{height:40px}.stepper--sm button{width:38px;height:38px;font-size:18px}.stepper.stepper--sm input{width:40px;font-size:16px}
.opt{display:flex;gap:14px;align-items:start;width:100%;text-align:start;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg);cursor:pointer;transition:border-color .2s,background .2s}
.opt + .opt{margin-top:10px}
.opt:hover{border-color:color-mix(in srgb,var(--gold) 60%,var(--line))}
.opt[aria-checked=true],.opt[aria-pressed=true]{border-color:var(--ink);background:var(--surface);box-shadow:inset 0 0 0 1px var(--ink)}
.opt__dot{flex:none;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--line);margin-top:3px;position:relative}
.opt[aria-checked=true] .opt__dot{border-color:var(--ink)}
.opt[aria-checked=true] .opt__dot::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--ink)}
.opt__main{flex:1;min-width:0}
.opt__main strong{display:block;font-weight:600}
.opt__main span{display:block;color:var(--muted);font-size:14px;margin-top:2px}
.opt__price{flex:none;font-weight:600;white-space:nowrap}
.tabs{display:flex;gap:6px;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:4px;margin-bottom:18px}
.tabs button{flex:1;height:42px;border:0;border-radius:999px;background:none;cursor:pointer;font-weight:500;color:var(--muted)}
.tabs button[aria-selected=true]{background:var(--ink);color:var(--bg)}
.acc{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg);overflow:hidden}
.acc + .acc{margin-top:10px}
.acc > summary{list-style:none;cursor:pointer;padding:15px 18px;font-weight:600;display:flex;justify-content:space-between;align-items:center}
.acc > summary::-webkit-details-marker{display:none}
.acc > summary::after{content:"+";font:400 22px/1 "Montserrat",sans-serif;color:var(--gold)}
.acc[open] > summary::after{content:"−"}
.item{display:flex;gap:14px;align-items:center;padding:14px 18px;border-top:1px solid var(--line)}
.item__img{flex:none;width:58px;height:58px;border-radius:10px;overflow:hidden;background:var(--soft)}
.item__img img{width:100%;height:100%;object-fit:cover}
.item__main{flex:1;min-width:0}
.item__main strong{display:block;font-weight:600}
.item__main span{display:block;font-size:13.5px;color:var(--muted)}
.tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.tags i{font-style:normal;font-size:11.5px;border:1px solid var(--line);border-radius:999px;padding:1px 8px;color:var(--muted)}
.item__end{display:flex;flex-direction:column;align-items:end;gap:6px}
.addbtn{height:40px;padding:0 16px;border-radius:999px;border:1px solid var(--ink);background:none;cursor:pointer;font-weight:500}
.sum{position:sticky;top:90px}
.sum h3{font-size:19px;margin-bottom:14px}
.sum__rows{display:grid;gap:9px;font-size:14.5px}
.sum__row{display:flex;justify-content:space-between;gap:12px}
.sum__row span:first-child{color:var(--muted)}
.sum__row.disc{color:#2e6b3a}.sum__row.disc span:first-child{color:inherit}
.sum__total{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);margin-top:14px;padding-top:14px;font-weight:600;font-size:20px}
.sum__vat{font-size:12.5px;color:var(--muted);margin-top:4px}
.sum__due{margin-top:12px;background:var(--bg);border-radius:10px;padding:10px 14px;display:flex;justify-content:space-between;font-size:15px}
.sum__empty{color:var(--muted);font-size:14.5px}
.nav-btns{display:flex;justify-content:space-between;gap:12px;margin-top:22px}
.nav-btns .btn{min-width:140px}
.bbar{display:none}
.agree{display:flex;gap:12px;align-items:start;font-size:14.5px;margin-top:16px;cursor:pointer}
.agree input{width:20px;height:20px;margin-top:3px;accent-color:var(--ink);flex:none}
.terms{font-size:13.5px;color:var(--muted);margin-top:12px;white-space:pre-line}
.promo{display:flex;gap:8px}
.promo input{flex:1}
.review dl{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;margin:0;font-size:15px}
.review dt{color:var(--muted)}
.review dd{margin:0}
.review .edit{font-size:13px}
.success{text-align:center;padding:32px 0}
.success__ic{width:72px;height:72px;margin:0 auto 18px;border-radius:50%;background:var(--ink);color:var(--bg);display:grid;place-items:center}
.success__ic svg{width:34px;height:34px}
.success h1{font-size:clamp(26px,4vw,36px)}
.success .no{font:600 22px/1.2 "Montserrat",sans-serif;letter-spacing:.06em;margin:14px 0 6px}
.success p{color:var(--muted);max-width:46ch;margin:8px auto 0}
.success .btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:26px}
.errbox{border:1px solid #A00000;color:#A00000;background:color-mix(in srgb,#A00000 6%,var(--surface));border-radius:var(--r-sm);padding:12px 16px;font-size:14.5px;margin-bottom:16px}
@media (max-width:1023px){
  .book__grid{grid-template-columns:1fr}
  .sum{display:none}
  .bbar{display:flex;position:fixed;inset:auto 0 0;z-index:30;background:var(--surface);border-top:1px solid var(--line);padding:12px var(--pad) calc(12px + env(safe-area-inset-bottom));gap:12px;align-items:center}
  .bbar__t{flex:1;min-width:0}
  .bbar__t small{display:block;color:var(--muted);font-size:12.5px}
  .bbar__t strong{font-size:19px}
  .nav-btns{display:none}
}

/* ======================= Order tracking / invoice ======================= */
.ord{padding:32px 0 80px}
.ord__wrap{width:min(100% - 2*var(--pad),780px);margin:auto}
.track{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.track li{display:flex;flex-direction:column;gap:8px;font-size:12.5px;color:var(--muted);text-align:center}
.track li::before{content:"";height:4px;border-radius:4px;background:var(--line)}
.track li.done::before{background:var(--gold)}
.track li.cur{color:var(--ink);font-weight:600}
.track li.cur::before{background:var(--ink)}
.pill{display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:999px;font-size:13px;font-weight:500;background:var(--soft)}
.pill.st-cancelled{background:#f3dada;color:#7a1010}
.pill.st-completed{background:#dcebdc;color:#245a2c}
.inv{margin-top:16px}
.inv table{width:100%;border-collapse:collapse;font-size:14.5px}
.inv th,.inv td{padding:10px 6px;border-bottom:1px solid var(--line);text-align:start;vertical-align:top}
.inv th{font-weight:500;color:var(--muted);font-size:13px}
.inv td.n{text-align:end;white-space:nowrap}
.inv__head{display:flex;justify-content:space-between;gap:16px;align-items:start;flex-wrap:wrap}
.inv__qr img{width:120px;height:120px;image-rendering:pixelated}
.inv__seller{font-size:13.5px;color:var(--muted)}
@media print{
  .hdr,.ftr,.noprint,.toast,.mbar{display:none!important}
  body{background:#fff}
  .card{border:0;padding:0}
  .ord{padding:0}
}

/* ======================= Restaurant menu page ======================= */
.mhead{text-align:center;padding:48px 0 18px}
.mhead h1{font-size:clamp(32px,5vw,52px)}
.mtabs{display:flex;justify-content:center;gap:8px;margin:18px 0 8px}
.mcats{position:sticky;top:68px;z-index:20;background:var(--bg);border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.mcats::-webkit-scrollbar{display:none}
.mcats__in{display:flex;gap:8px;padding:12px 0;width:max-content;margin-inline:auto}
.mcats a{white-space:nowrap;text-decoration:none;font-size:14px;padding:8px 14px;border-radius:999px;border:1px solid var(--line)}
.mcats a.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.msec{padding:40px 0 8px}
.msec h2{font-size:28px;margin-bottom:12px;display:flex;align-items:center;gap:14px}
.msec h2::after{content:"";flex:1;height:1px;background:var(--line)}
.mlist{display:grid;grid-template-columns:1fr 1fr;gap:0 48px}
.mi{display:flex;gap:14px;padding:16px 0;border-bottom:1px dashed var(--line)}
.mi__img{flex:none;width:64px;height:64px;border-radius:10px;overflow:hidden}
.mi__img img{width:100%;height:100%;object-fit:cover}
.mi__main{flex:1;min-width:0}
.mi__row{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.mi strong{font-weight:600}
.mi p{color:var(--muted);font-size:14px;margin-top:3px}
@media (max-width:760px){.mlist{grid-template-columns:1fr}}

/* 404 */
.nf{min-height:70vh;display:grid;place-items:center;text-align:center;padding:40px var(--pad)}
.nf h1{font-size:44px;margin:18px 0 8px}
.nf p{color:var(--muted);margin-bottom:24px}
.nf__logo{width:180px;height:auto;margin:auto;aspect-ratio:661/466}