/* Mosaïque: grout and marble light, charcoal bands, ruby, turmeric and jade accents. */
:root{--charcoal:#28292E;--marble:#DDDCDB;--grout:#FFF9F4;--ruby:#8A221B;--ruby-dk:#6F1B15;--turmeric:#E08928;--jade:#465D2A;--ink:#28292E;--paper:#FFFDFA;--soft:#F4EFE9;--mute:#5E5F64;--mute-dk:#BDBBB8;--line:#E2DCD3;--line-dk:#45464C;--rose:#8A221B;--h:68px;
 --f-head:"At Gambit","Gloock",Georgia,serif;--f-body:"Aloevera Display","Jost",system-ui,sans-serif;--f-accent:"Classic Mosaic","Gloock",Georgia,serif;
 --track:.05em;--to-end:to right;--tex-marble:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='320'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .4 0 0 0 0 .4 0 0 0 0 .4 0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='320' height='320' filter='url(%23n)'/%3E%3C/svg%3E")}
html[lang=ar]{--f-head:"Cairo","Gloock",sans-serif;--f-body:"Cairo","Jost",system-ui,sans-serif;--f-accent:"Cairo",sans-serif;--track:0em;--to-end:to left}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--f-body);font-size:1.125rem;line-height:1.65;letter-spacing:0;color:var(--ink);background:var(--grout);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{font-family:var(--f-head);font-weight:400;line-height:1.1;letter-spacing:0}
html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] h3{font-weight:600;line-height:1.3}
:focus-visible{outline:3px solid var(--turmeric);outline-offset:3px;border-radius:3px}
.skip{position:absolute;inset-inline-start:-999px;top:8px;background:var(--grout);color:var(--ink);padding:10px 16px;border-radius:4px;z-index:100}.skip:focus{inset-inline-start:8px}
.wrap{max-width:1240px;margin:0 auto;padding-inline:32px}

/* logo: the wordmark and the emblem are masks, so they take the colour of the text around them and are never stretched */
.wm{display:block;height:var(--lh,26px);aspect-ratio:604.3/124.5;background:currentColor;-webkit-mask:url(../img/brand/wordmark.svg) no-repeat center/contain;mask:url(../img/brand/wordmark.svg) no-repeat center/contain}
.em{display:block;height:var(--lh,48px);aspect-ratio:142.6/154.9;background:currentColor;-webkit-mask:url(../img/brand/emblem.svg) no-repeat center/contain;mask:url(../img/brand/emblem.svg) no-repeat center/contain}

/* graphic elements from the brand book */
.orn1,.orn3 i{display:block;aspect-ratio:1;background:url(../img/brand/diamond-yellow.svg) center/contain no-repeat}
.orn1{width:40px}
.orn3{display:flex;gap:8px;margin-bottom:22px}.orn3 i{width:26px;background-image:url(../img/brand/diamond-green.svg)}
.orn3.c{justify-content:center}
.wave{height:22px;background:url(../img/brand/wave-red.svg) repeat-x 0 50%/auto 22px}
.wave.y{background-image:url(../img/brand/wave-yellow.svg)}
.wavewrap{padding-block:26px;background:var(--grout)}
.tex-marble{background-color:var(--marble);background-image:var(--tex-marble)}
.tex-tile{background-color:var(--grout);background-image:linear-gradient(rgba(40,41,46,.055) 1.5px,transparent 1.5px),linear-gradient(90deg,rgba(40,41,46,.055) 1.5px,transparent 1.5px);background-size:30px 30px}

/* header */
.hdr{position:sticky;top:0;z-index:50;background:var(--grout);color:var(--ink);border-bottom:1px solid var(--line)}
.hdr .wrap{height:var(--h);display:flex;align-items:center;gap:28px}
.brand{display:block;flex:none;padding:8px 0}
.nav{display:flex;gap:4px;margin-inline-start:20px}
.nav a{text-decoration:none;font:500 0.9375rem/1 var(--f-body);letter-spacing:.12em;text-transform:uppercase;padding:14px 14px;border-bottom:2px solid transparent}
html[lang=ar] .nav a{letter-spacing:0;text-transform:none;font-size:1.0625rem;font-weight:600}
.nav a:hover{color:var(--ruby)}.nav a[aria-current=page]{border-bottom-color:var(--turmeric)}
.hr{margin-inline-start:auto;display:flex;gap:10px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:500 1rem/1 var(--f-body);letter-spacing:var(--track);text-decoration:none;padding:15px 28px;border-radius:2px;border:1.5px solid var(--ruby);background:var(--ruby);color:var(--grout);cursor:pointer;min-height:48px;transition:background .2s,color .2s,border-color .2s}
html[lang=ar] .btn{font-weight:600}
.btn:hover{background:var(--ruby-dk);border-color:var(--ruby-dk)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--charcoal)}.btn.ghost:hover{background:var(--charcoal);color:var(--grout)}
.on-dark .btn.ghost,.btn.ghost.lt{color:var(--grout);border-color:var(--grout)}.on-dark .btn.ghost:hover,.btn.ghost.lt:hover{background:var(--grout);color:var(--charcoal);border-color:var(--grout)}
.btn.dk{background:var(--charcoal);border-color:var(--charcoal);color:var(--grout)}.btn.dk:hover{background:var(--jade);border-color:var(--jade)}
.btn.sm{padding:11px 20px;min-height:44px;font-size:0.9375rem}
.lang{display:inline-flex;align-items:center;gap:7px;font:500 0.9375rem/1 var(--f-body);letter-spacing:.05em;border:1.5px solid var(--line);background:transparent;color:inherit;border-radius:2px;padding:10px 14px;min-height:44px;cursor:pointer}.lang:hover{border-color:var(--turmeric)}
.lang span{opacity:.55}.lang .l-sep{opacity:.35}
html[lang=en] .lang .l-en,html[lang=ar] .lang .l-ar{opacity:1;font-weight:700}
.lang .l-ar{font-family:"Cairo",sans-serif;font-size:1.0625rem;line-height:1}
.plang{display:none}
.burger{display:none;margin-inline-start:auto;width:48px;height:48px;border:0;background:transparent;cursor:pointer;position:relative;color:inherit}
.burger i{position:absolute;inset-inline:11px;height:2px;background:currentColor;transition:transform .25s,opacity .25s}
.burger i:nth-child(1){top:17px}.burger i:nth-child(2){top:23px}.burger i:nth-child(3){top:29px}
.burger[aria-expanded=true] i:nth-child(1){top:23px;transform:rotate(45deg)}.burger[aria-expanded=true] i:nth-child(2){opacity:0}.burger[aria-expanded=true] i:nth-child(3){top:23px;transform:rotate(-45deg)}
.mnav{position:fixed;inset:var(--h) 0 0 0;background:var(--grout);color:var(--ink);z-index:49;padding:28px 24px 120px;display:none;flex-direction:column;gap:0;overflow:auto}
.mnav.open{display:flex}
.mnav a{font:400 2.375rem/1.15 var(--f-head);text-decoration:none;padding:16px 0;border-bottom:1px solid var(--line)}
html[lang=ar] .mnav a{font-weight:600;font-size:2rem}
.mnav .mlang{align-self:flex-start;margin-top:26px;font-size:1.0625rem}
/* over the opening photo the header is clear, then turns grout */
.hdr--over{position:fixed;inset-inline:0;top:0;background:linear-gradient(rgba(40,41,46,.72),rgba(40,41,46,0));border-bottom-color:transparent;color:var(--grout);transition:background .35s,color .35s,border-color .35s}
.hdr--over .lang{border-color:rgba(255,249,244,.45)}
.hdr--over .nav a:hover{color:var(--turmeric)}
.hdr--over.solid{background:var(--grout);color:var(--ink);border-bottom-color:var(--line)}
.hdr--over.solid .lang{border-color:var(--line)}.hdr--over.solid .nav a:hover{color:var(--ruby)}

/* hero */
.hero2{position:relative;min-height:100vh;min-height:max(640px,100svh);display:flex;align-items:flex-end;background:var(--charcoal);color:var(--grout);overflow:hidden;isolation:isolate}
.hbg{position:absolute;inset:0;z-index:-1;overflow:hidden}
.hbg img{width:100%;height:100%;object-fit:cover;object-position:50% 62%;transform-origin:62% 50%;animation:kb 28s ease-in-out infinite alternate}
.hbg:after{content:"";position:absolute;inset:0;background:linear-gradient(var(--to-end),rgba(40,41,46,.78) 0,rgba(40,41,46,.5) 42%,rgba(40,41,46,.08) 78%),linear-gradient(0deg,rgba(40,41,46,.7) 0,rgba(40,41,46,0) 42%)}
.hwrap{width:100%;padding-block:calc(var(--h) + 48px) 84px}
.hero2 h1{font-size:clamp(2.875rem,6.6vw,6.5rem);line-height:1.02;max-width:12em}
html[lang=ar] .hero2 h1{line-height:1.25;font-size:clamp(2.5rem,5.6vw,5.5rem)}
.ln{display:block;animation:rise 1.1s cubic-bezier(.2,.8,.2,1) both}.ln:nth-child(2){animation-delay:.12s}.ln:nth-child(3){animation-delay:.24s}
.sub{font-size:1.25rem;line-height:1.6;max-width:34em;margin-top:26px;color:#F1ECE6}
.cta{display:grid;width:max-content;max-width:100%;grid-auto-flow:column;grid-auto-columns:1fr;gap:12px;margin-top:34px}
.hero2 .sub,.hero2 .cta,.hero2 .status,.hero2 .proof,.hero2 .opill{animation:rise 1.1s cubic-bezier(.2,.8,.2,1) .42s both}
.status{display:inline-flex;align-items:center;gap:10px;margin-top:30px;font-weight:500;font-size:1rem}
.status:before{content:"";width:10px;height:10px;border-radius:50%;background:var(--turmeric);flex:none}
.status.open:before{background:#7FB069}
.proof{margin-top:12px;font-size:0.9375rem;color:var(--mute-dk)}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.1)}}
/* what people say: one press line, three short guest quotes (originals kept in English) */
.words{background:var(--grout);text-align:center}
.sec.words h2{font-size:clamp(2.125rem,4vw,3.5rem);margin-inline:auto;max-width:none}
.pull{max-width:860px;margin:40px auto 0}
.pull p{font:400 clamp(1.625rem,3.2vw,2.625rem)/1.3 var(--f-head);color:var(--ink);letter-spacing:0}
.pull figcaption{margin-top:16px;font-size:0.9375rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.pull figcaption a{text-decoration:none;border-bottom:1px solid var(--line)}
.quotes{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:56px;text-align:start}
.quotes li{background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--ruby);padding:28px 26px 24px;display:flex;flex-direction:column;justify-content:space-between;gap:18px}
.quotes p{font-size:1.125rem;line-height:1.6;color:#3A3B40}
.quotes blockquote{text-align:left}
.quotes .who{font-size:0.875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
html[lang=ar] .pull figcaption,html[lang=ar] .quotes .who{letter-spacing:0;text-transform:none}
/* offers */
.js-offers[hidden],.opill[hidden]{display:none!important}
.opill{display:inline-flex;align-items:center;gap:10px;max-width:100%;margin-top:18px;padding:9px 16px 9px 9px;border:1px solid rgba(255,249,244,.4);border-radius:24px;background:rgba(40,41,46,.45);color:var(--grout);text-decoration:none;font-size:0.9375rem;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.opill .op-l{flex:none;padding:5px 10px;border-radius:14px;background:var(--turmeric);color:var(--charcoal);font-size:0.75rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase}
html[lang=ar] .opill .op-l{letter-spacing:0}
.opill .op-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.opill i{font-style:normal;flex:none}html[dir=rtl] .opill i{transform:scaleX(-1)}
.opill:hover{border-color:var(--turmeric)}
.hwrap .opill{margin:0 0 22px}
.offers{padding:72px 0 96px}
.otrack{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;outline:none}
.otrack::-webkit-scrollbar{display:none}
.ocard{flex:none;width:min(84vw,420px);scroll-snap-align:start;background:var(--paper);border:1px solid var(--line);display:flex;flex-direction:column}
.otrack.one{justify-content:center}.otrack.one .ocard{width:min(100%,520px)}
.oc-im{aspect-ratio:4/3;width:100%;overflow:hidden;background:var(--soft)}
.oc-im picture,.oc-im img{display:block;width:100%;height:100%}.oc-im img{object-fit:cover}
.oc-pat{position:relative;background:var(--soft)}
.oc-ring{position:absolute;left:50%;top:50%;height:78%;aspect-ratio:1;transform:translate(-50%,-50%);background:url(../img/brand/circle-colour.svg) center/contain no-repeat}
.oc-tx{padding:22px 22px 26px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;flex:1}
.oc-tx h2{font-size:clamp(1.75rem,3vw,2rem)}
.oc-d{font-size:1rem;line-height:1.55;color:#3A3B40}
.oc-m{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px}
.oc-p{font:500 1.375rem var(--f-body);color:var(--ruby)}
.oc-u{font-size:0.875rem;color:var(--jade)}
.onav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:22px}
.onb{width:46px;height:46px;border:1px solid var(--charcoal);border-radius:50%;background:transparent;color:var(--charcoal);font:400 1.25rem/1 var(--f-body);cursor:pointer}
.onb:disabled{opacity:.3;cursor:default}html[dir=rtl] .onb{transform:scaleX(-1)}
.odots{display:flex;gap:4px}
.odot{width:24px;height:24px;padding:0;border:0;background:transparent;cursor:pointer;position:relative}
.odot:after{content:"";position:absolute;inset:8px;border-radius:50%;background:var(--line)}
.odot[aria-current=true]:after{background:var(--turmeric);inset:6px}
.offers .gcount{color:var(--mute)}
.onone{text-align:center;padding:24px 0}.onone p{font-size:1.125rem;margin-bottom:20px}

@media (max-width:700px){.pull{margin-top:28px}.quotes{grid-template-columns:1fr;gap:14px;margin-top:36px}.quotes li{padding:22px 20px 20px}}

@media (max-width:700px){.hbg img{animation:none}}   /* no slow zoom on phones: smoother scrolling, less battery */
@keyframes rise{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}

/* sections */
.sec{padding:104px 0;position:relative}
.sec h2,.h2{font-size:clamp(2.25rem,4.4vw,3.875rem);max-width:14em}
.rule{display:block;width:64px;height:2px;background:var(--turmeric);margin:20px 0 0}
.lead{font-size:1.1875rem;line-height:1.65;max-width:30em;margin-top:22px}

/* about */
.about{background:var(--grout);padding:56px 0 120px}
.about .wrap{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:96px;align-items:center}
.about h2{font-size:clamp(2.5rem,5vw,4.5rem)}
.about p{font-size:clamp(1.1875rem,1.6vw,1.4375rem);line-height:1.8;max-width:30em;margin-top:28px;color:#3A3B40}
.afig{position:relative;aspect-ratio:4/5;width:calc(100% - 24px);margin:12px;outline:1px solid var(--turmeric);outline-offset:12px;overflow:hidden;background:var(--marble)}
.afig img{width:100%;height:100%;object-fit:cover;object-position:34% 50%}

/* dishes */
.rows{list-style:none;margin-top:30px}
.rows li{display:flex;align-items:center;gap:18px;padding:14px 0;border-top:1px solid var(--line)}
.rows li:last-child{border-bottom:1px solid var(--line)}
.th{width:76px;height:76px;flex:none;border-radius:50%;background:#fff;overflow:hidden}
.th img{width:100%;height:100%;object-fit:cover}
.it{display:block;min-width:0}
.it i{display:block;font:400 1.375rem/1.25 var(--f-head);font-style:normal}
html[lang=ar] .it i{font-weight:600}
.it small{display:block;font-size:0.9375rem;line-height:1.5;color:var(--mute);margin-top:3px;max-width:30em}
.more{margin-top:30px}
.note{font-size:0.875rem;color:var(--mute);margin-top:16px}

/* signature */
.sigf{position:relative;color:var(--ink);padding:120px 0 112px}
.sghead h2{font-size:clamp(2.75rem,5.6vw,5.5rem);line-height:1.04}
html[lang=ar] .sghead h2{line-height:1.25;font-size:clamp(2.5rem,5vw,4.75rem)}
.sgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(40px,7vw,104px);margin-top:56px;align-items:start}
.sg:nth-child(2){margin-top:72px}
.sgf{position:relative;aspect-ratio:4/5;width:calc(100% - 24px);margin:12px;background:var(--soft);outline:1px solid var(--turmeric);outline-offset:12px}
.sgf img{width:100%;height:100%;object-fit:cover}
.sgt{margin-top:34px;max-width:30em}
.sgt h3{font-size:clamp(1.875rem,3vw,2.5rem)}
.sgt p{color:#3A3B40;margin-top:10px;font-size:1.0625rem;line-height:1.65}
.sgcta{margin-top:64px}

/* photo band */
.pband{position:relative;min-height:min(86svh,800px);display:flex;align-items:center;color:var(--grout);background:var(--charcoal);overflow:hidden;isolation:isolate}
.pimg{position:absolute;inset:-7% 0;z-index:-2}
.pimg img{width:100%;height:100%;object-fit:cover;object-position:50% 55%;transform:translate3d(0,var(--py,0px),0)}
.pband:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(var(--to-end),rgba(40,41,46,.82) 0,rgba(40,41,46,.2) 74%)}
.bigline{font-family:var(--f-head);font-size:clamp(2.5rem,6.4vw,6.25rem);line-height:1.04;max-width:10.5em;letter-spacing:0}
html[lang=ar] .bigline{font-weight:600;line-height:1.3;font-size:clamp(2.25rem,5.4vw,5.25rem)}
.pband .wrap{width:100%}.pband .orn1{margin-bottom:22px}

/* kitchen */
.kitchen{background:var(--grout)}
.kitchen .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:96px;align-items:start}
.kfig{position:sticky;top:calc(var(--h) + 36px);aspect-ratio:4/5;max-height:calc(100svh - var(--h) - 72px);width:calc(100% - 24px);margin:12px;background:var(--marble);outline:1px solid var(--turmeric);outline-offset:12px}
picture.vp{display:contents}
.kfig{overflow:hidden}.kfig img{width:100%;height:100%;object-fit:cover}
.kitchen .th{width:92px;height:92px}
.kitchen .it i{font-size:1.5625rem}
.kitchen .it small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.th picture{display:block;width:100%;height:100%}

/* around: horizontal photo track on charcoal */
.evening{background:var(--charcoal);color:var(--grout);padding:112px 0 96px;overflow:hidden}
.ehead{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.gnav{display:flex;gap:10px}
.gnav button{width:52px;height:52px;border:1px solid var(--turmeric);background:transparent;color:var(--grout);border-radius:50%;cursor:pointer;font:400 1.375rem/1 var(--f-body)}
.gnav button:hover{background:var(--turmeric);color:var(--charcoal)}
html[dir=rtl] .gnav button{transform:scaleX(-1)}
.track{--gut:max(32px,calc((100vw - 1240px)/2 + 32px));display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:48px var(--gut) 18px;scroll-padding-inline:var(--gut);scrollbar-width:none}
.track::-webkit-scrollbar{display:none}
.track figure{flex:none;height:min(68svh,580px);aspect-ratio:3/4;scroll-snap-align:start;overflow:hidden;background:#3a3b41}
.track img{width:100%;height:100%;object-fit:cover;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
@media (hover:hover) and (pointer:fine) and (min-width:1024px){.track figure:hover img{transform:scale(1.04)}}

/* reserve */
.reserve{overflow:hidden}
.reserve>.wrap{position:relative;z-index:1}
.reserve .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:72px;align-items:start}
.reserve .circ{position:absolute;inset-inline-start:-150px;bottom:-190px;width:340px;aspect-ratio:1;background:url(../img/brand/circle-colour.svg) center/contain no-repeat;opacity:.9;pointer-events:none;z-index:0}
.ways{list-style:none;margin-top:34px;display:grid;gap:0;max-width:30em}
.ways li{display:flex;gap:18px;align-items:baseline;padding:14px 0;border-top:1px solid var(--line);font-size:1.125rem}
.ways li:last-child{border-bottom:1px solid var(--line)}
.ways span{font:500 0.875rem var(--f-body);letter-spacing:.14em;text-transform:uppercase;color:var(--ruby);min-width:112px;padding-inline-end:8px;flex:none}
html[lang=ar] .ways span{letter-spacing:0;text-transform:none;font-size:1.0625rem;font-weight:600}
.ways a{text-decoration:none;font-weight:500;overflow-wrap:anywhere;padding:8px 0;display:inline-block}.ways a:hover{text-decoration:underline}
.rform{background:var(--paper);padding:38px 40px 34px;outline:1px solid var(--turmeric);outline-offset:-10px;display:grid;gap:18px;box-shadow:0 18px 40px -24px rgba(40,41,46,.35)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.three{display:grid;grid-template-columns:1.3fr 1.1fr .7fr;gap:18px}
.fld{display:grid;gap:6px;min-width:0}
.fld label{font:500 0.875rem var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
html[lang=ar] .fld label{letter-spacing:0;text-transform:none;font-size:1rem;font-weight:600}
.fld input,.fld select,.fld textarea{font:400 1.0625rem var(--f-body);color:var(--ink);background:#fff;border:1px solid #8C8D91;border-radius:2px;padding:12px 12px;min-height:48px;width:100%}
.fld textarea{resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:2px solid var(--ruby);outline-offset:1px;border-color:var(--ruby)}
.ferr{color:var(--ruby);font-size:0.875rem;font-weight:500;margin:0}.fld [aria-invalid=true]{border-color:var(--ruby);border-width:2px}
html[lang=ar] .fld input[dir=ltr]{text-align:right}
.rerr{color:var(--ruby);font-weight:600;font-size:0.9375rem}
.rform .fine{font-size:0.875rem;color:var(--mute);line-height:1.5}

/* footer */
.ftr{background:var(--charcoal);color:var(--grout);padding:68px 0 48px}
.ftr .wrap{display:grid;grid-template-columns:1.4fr 1fr 1.2fr;gap:48px}
.ftr p,.ftr li{font-size:0.9375rem;color:var(--mute-dk);line-height:1.7}
.ftr .wm{--lh:34px;margin-bottom:20px}
.ftr h4{font:500 0.875rem/1 var(--f-body);letter-spacing:.14em;text-transform:uppercase;margin-bottom:14px;color:var(--turmeric)}
html[lang=ar] .ftr h4{letter-spacing:0;text-transform:none;font-size:1.0625rem;font-weight:600}
.ftr ul{list-style:none}
.ftr a{text-decoration:none;display:inline-block;padding:10px 0;overflow-wrap:anywhere}.ftr a:hover{text-decoration:underline}
.ftr .fine{grid-column:1/-1;border-top:1px solid var(--line-dk);padding-top:22px;font-size:0.875rem}
.ftr .credit a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;margin-inline-start:-15px;color:var(--mute-dk);opacity:.35;transition:opacity .2s}.ftr .credit .afm{height:14px}.ftr .credit a:hover,.ftr .credit a:focus-visible{opacity:1}
.afm{display:block;flex:none;height:18px;aspect-ratio:28/24;background:currentColor;-webkit-mask:url(../img/brand/af-mark.svg) no-repeat center/contain;mask:url(../img/brand/af-mark.svg) no-repeat center/contain}

/* mobile bar and toast */
.mbar{display:none}
.toast{position:fixed;inset-inline-start:50%;bottom:90px;transform:translate(-50%,20px);background:var(--charcoal);color:var(--grout);padding:14px 20px;border-radius:3px;font-weight:500;font-size:0.9375rem;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:80;max-width:calc(100vw - 32px);text-align:center;border:1px solid var(--turmeric)}
html[dir=rtl] .toast{transform:translate(50%,20px)}
.toast.show{opacity:1;transform:translate(-50%,0)}html[dir=rtl] .toast.show{transform:translate(50%,0)}

/* menu page */
.menupage{position:relative;background:var(--grout)}
.mban{position:relative;min-height:clamp(340px,50svh,500px);display:flex;align-items:flex-end;background:var(--charcoal);color:var(--grout);overflow:hidden;isolation:isolate}
.mbg{position:absolute;inset:0;z-index:-1}
.mbg picture{display:block;width:100%;height:100%}
.mbg img{width:100%;height:100%;object-fit:cover;object-position:50% 56%}
.mbg:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(40,41,46,.88) 0,rgba(40,41,46,.5) 55%,rgba(40,41,46,.35) 100%)}
.mban .wrap{width:100%;padding-block:calc(var(--h) + 44px) 44px}
.mban h1,.vhero h1{font-size:clamp(3.75rem,10vw,9.375rem);line-height:.98}
html[lang=ar] .mban h1,html[lang=ar] .vhero h1{line-height:1.2}
.mnote{margin-top:20px;font-size:1rem;color:#E6E1DB;max-width:44em}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.msearch{padding-block:26px 22px}
.msearch form{position:relative;max-width:900px;margin:0 auto}
.msearch input{width:100%;min-height:54px;font:400 1.125rem var(--f-body);letter-spacing:0;color:var(--ink);background:var(--paper);border:1.5px solid var(--charcoal);border-radius:2px;padding:12px 52px 12px 48px;appearance:none;-webkit-appearance:none}
.msearch input::-webkit-search-cancel-button{display:none}
.msearch input::placeholder{color:var(--mute)}
.msearch form:before{content:"";position:absolute;inset-inline-start:16px;top:50%;width:22px;height:22px;margin-top:-11px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22' fill='none' stroke='%2328292E' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='9' cy='9' r='6.5'/%3E%3Cpath d='M14 14l5.5 5.5'/%3E%3C/svg%3E") center/contain no-repeat}
.qx{position:absolute;inset-inline-end:4px;top:4px;width:46px;height:46px;border:0;background:none;font:400 1.875rem/1 var(--f-body);color:var(--charcoal);cursor:pointer}
.qx[hidden]{display:none}
.chips{position:sticky;top:var(--h);z-index:40;transition:top .25s;background:var(--grout);border-bottom:1px solid var(--line);border-top:1px solid var(--line)}
.chips .wrap{display:flex;gap:6px;overflow-x:auto;padding:8px 32px;scrollbar-width:none}.chips .wrap::-webkit-scrollbar{display:none}
.chip{flex:none;text-decoration:none;font:500 0.875rem/1 var(--f-body);letter-spacing:.1em;text-transform:uppercase;padding:14px 16px;border-radius:2px;border:1px solid transparent;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center}
.chip[hidden]{display:none}
html[lang=ar] .chip{letter-spacing:0;text-transform:none;font-size:1rem;font-weight:600}
.chip:hover{border-color:var(--turmeric)}.chip.on{background:var(--charcoal);color:var(--grout)}
.mcard{background:var(--paper);max-width:900px;margin:40px auto 0;padding:24px 64px 44px;outline:1px solid var(--turmeric);outline-offset:-12px;position:relative;box-shadow:0 24px 50px -34px rgba(40,41,46,.4)}
.msec{padding:52px 0 6px;scroll-margin-top:calc(var(--h) + 70px)}
.msec[hidden],.mi[hidden],.mnone[hidden]{display:none}
.msec h2{font-size:clamp(1.875rem,3.6vw,2.75rem);max-width:none;display:flex;align-items:center;gap:20px}
.msec h2:after{content:"";flex:1;height:1px;background:var(--turmeric)}
.snote{font-size:0.9375rem;color:var(--mute);margin-top:8px}
.qon .mmedia{display:none}
.mmedia{margin-top:22px}
.hls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}
.hl{align-self:start;justify-content:flex-start}
.hl{display:block;text-align:start;font:inherit;letter-spacing:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;min-width:0}
.hl .im{display:block;aspect-ratio:4/5;overflow:hidden;background:var(--soft);position:relative}
.hl .im:after{content:"";position:absolute;inset:0;border:8px solid transparent;transition:border-color .2s}
.hl:focus-visible .im:after{border-color:var(--paper)}
@media (hover:hover) and (pointer:fine) and (min-width:1024px){.hl:hover .im:after{border-color:var(--paper)}}
.hl picture,.hl img{display:block;width:100%;height:100%}
.hl img{object-fit:cover}
.hl h3{font-size:1.3125rem;line-height:1.25;margin-top:12px}
.mbn{aspect-ratio:16/7;overflow:hidden;background:var(--soft);outline:1px solid var(--turmeric);outline-offset:-8px}
.mbn picture,.mbn img{display:block;width:100%;height:100%}
.mbn img{object-fit:cover;object-position:50% 55%}
.mpat{height:56px;background-repeat:repeat-x;background-position:0 50%;background-size:auto 28px}
.mpat.p0{background-image:url(../img/brand/wave-red.svg)}
.mpat.p1{background-image:url(../img/brand/diamond-yellow.svg);background-size:44px 44px;background-position:0 50%}
.mpat.p2{background-image:url(../img/brand/wave-yellow.svg)}
.mlist{list-style:none;margin-top:14px}
.mi{display:flex;align-items:baseline;gap:12px;padding:13px 0;border-bottom:1px solid var(--line)}
.mi:last-child{border-bottom:0}
.mi .it i{font-size:1.25rem}
.mi .it small{font-size:0.9375rem}
.mi .it small.opt{font-size:0.875rem;color:var(--jade);margin-top:2px}
.mi .dots{flex:1;border-bottom:2px dotted var(--turmeric);min-width:14px;align-self:flex-end;transform:translateY(-8px)}
.mi .dots{order:3}.mi .pr{order:4}.mi .it{order:1}
.pr{font:500 1.25rem/1 var(--f-body);font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--ruby)}
.mnone{text-align:center;padding:60px 0 30px;color:var(--mute);font-size:1.125rem}
.mcta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;padding-block:44px 80px}

/* photos fade in over their soft colour (photo-fade.js) */
html.js img.fi{opacity:0;transition:opacity .45s ease}
html.js img.fi.ok{opacity:1}
@media (prefers-reduced-motion:reduce){html.js img.fi{transition:none}}
/* menu sections sheet (phones) */
.secs{margin:auto auto 0;width:100%;max-width:560px;max-height:78svh;padding:0;border:0;background:var(--paper);color:var(--ink);overflow:hidden;display:none}
.secs[open]{display:flex;flex-direction:column}
.secs::backdrop{background:rgba(40,41,46,.6)}
.secs-top{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 12px;border-bottom:1px solid var(--line)}
.secs-top h2{font-size:1.5rem}
.secs-x{width:44px;height:44px;border:0;background:none;color:var(--ink);font:400 1.875rem/1 var(--f-body);cursor:pointer}
.secs-list{overflow-y:auto;overscroll-behavior:contain;padding:6px 0 calc(14px + env(safe-area-inset-bottom))}
.secs-list a{display:flex;align-items:center;min-height:52px;padding:0 22px;color:var(--ink);text-decoration:none;font-size:1.0625rem;border-bottom:1px solid var(--line)}
.secs-list a[aria-current]{color:var(--ruby);font-weight:500}
/* menu QR */
.mh{display:flex;align-items:flex-end;gap:14px}
.qrb{flex:none;width:44px;height:44px;margin-bottom:.3em;padding:10px;border:1px solid rgba(255,249,244,.45);border-radius:50%;background:transparent;color:var(--grout);cursor:pointer;transition:background .2s,border-color .2s}
.qrb:hover,.qrb:focus-visible{background:rgba(255,249,244,.14);border-color:var(--grout)}
.qrb svg{display:block;width:100%;height:100%}
.qrd{margin:auto;width:min(calc(100% - 32px),340px);padding:44px 28px 28px;border:0;background:var(--paper);color:var(--charcoal);text-align:center}
.qrd::backdrop{background:rgba(40,41,46,.86)}
.qr-im{display:block;width:100%;max-width:240px;height:auto;margin:0 auto 18px;aspect-ratio:1}
.qrd h2{font-size:1.625rem}
.qr-u{margin:6px 0 18px;font-size:0.8125rem;color:#5A5B60;word-break:break-all}
.qr-act{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
/* lightbox */
.lb{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px}
.lb[hidden]{display:none}
.lb-bg{position:absolute;inset:0;background:rgba(40,41,46,.86)}
.lb-box{position:relative;display:flex;flex-direction:column;width:min(100%,520px);max-height:calc(100svh - 40px);background:var(--paper);outline:none;overflow:auto;overscroll-behavior:contain;transition:transform .25s ease}
.lb.dragging .lb-box{transition:none}
.lb-im{aspect-ratio:4/5;flex:none;background:var(--soft);max-height:62svh;width:100%;overflow:hidden}
.lb-im picture,.lb-im img{display:block;width:100%;height:100%}
.lb-im img{object-fit:cover}
.lb-tx{padding:20px 24px 26px}
.lb-tx h2{font-size:1.875rem}
.lb-d{margin-top:8px;font-size:1rem;line-height:1.55;color:#3A3B40}.lb-d:empty,.lb-o:empty{display:none}
.lb-o{margin-top:8px;font-size:0.875rem;color:var(--jade)}
.lb-p{display:block;margin-top:12px;font:500 1.5rem var(--f-body);color:var(--ruby)}
.mi-hit{animation:mihit 2.4s ease}
@keyframes mihit{0%,40%{background:rgba(224,137,40,.18)}100%{background:transparent}}
.lb-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}.lb-row .lb-p{margin-top:0}
.lb-sh{display:inline-flex;flex:none;align-items:center;gap:8px;min-height:44px;padding:0 16px 0 12px;border:1px solid var(--line);border-radius:22px;color:var(--charcoal);text-decoration:none;font-size:0.9375rem}
.lb-sh svg{width:20px;height:20px;color:var(--jade)}
.lb-sh:hover,.lb-sh:focus-visible{border-color:var(--charcoal)}
.lb-x{position:absolute;top:8px;inset-inline-end:8px;z-index:2;width:46px;height:46px;border:0;border-radius:50%;background:var(--paper);color:var(--charcoal);font:400 1.875rem/1 var(--f-body);cursor:pointer}
html.lb-open{overflow:hidden}

/* visit page */
.vhero{position:relative;background:var(--charcoal);color:var(--grout);overflow:hidden;isolation:isolate}
.vhero .vbg{position:absolute;inset:0;z-index:-1}
.vhero .vbg img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.vhero .vbg:after{content:"";position:absolute;inset:0;background:linear-gradient(var(--to-end),rgba(40,41,46,.85) 0,rgba(40,41,46,.5) 55%,rgba(40,41,46,.15) 100%),linear-gradient(0deg,rgba(40,41,46,.6) 0,rgba(40,41,46,0) 30%)}
.vhero .wrap{display:flex;align-items:flex-end;min-height:clamp(480px,64svh,640px);padding-block:calc(var(--h) + 40px) 64px}
.vhero .lead{max-width:24em;color:#F1ECE6}
.info{background:var(--grout)}
.vgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px}
.vgrid h3{font-size:2rem;margin-bottom:16px}
.vgrid p,.vgrid li{font-size:1.125rem}
.vgrid p+p{margin-top:12px}
.vgrid ul{list-style:none;display:grid;gap:8px}
.vgrid li{padding-inline-start:22px;position:relative}.vgrid li:before{content:"";position:absolute;inset-inline-start:0;top:.75em;width:8px;height:8px;background:var(--turmeric);transform:rotate(45deg)}
.soft{color:var(--mute);font-size:1rem}
.lnk{font-weight:500;display:inline-block;padding:6px 0;text-underline-offset:4px;color:var(--ruby)}

/* photography motion */
.rv-on .rv{opacity:0;transform:translateY(30px);transition:opacity .9s ease var(--d,0s),transform .9s cubic-bezier(.2,.8,.2,1) var(--d,0s)}
.rv-on .rv.in{opacity:1;transform:none}
.px{overflow:hidden}
.px img{width:100%;height:100%;object-fit:cover;transform:translate3d(0,var(--py,0px),0) scale(1.14);will-change:transform}
.ob{outline:1px solid var(--turmeric);outline-offset:12px}

@media (max-width:980px){
 .nav,.hr{display:none}.burger{display:block}.burger{margin-inline-start:0}.plang{display:inline-flex;margin-inline-start:auto;padding:8px 12px;min-height:40px}.plang .l-all{opacity:1}
 .sec{padding:68px 0}
 .about{padding:40px 0 80px}.about .wrap{grid-template-columns:1fr;gap:56px}.afig{max-width:560px;aspect-ratio:4/4.4}
 .reserve .wrap{grid-template-columns:1fr;gap:44px}.reserve .circ{width:220px;inset-inline-start:-100px;bottom:-110px;opacity:.55}
 .ftr .wrap{grid-template-columns:1fr 1fr}.ftr .wrap>div:first-child{grid-column:1/-1}
 .vgrid{grid-template-columns:1fr;gap:38px}
 .mcard{padding:12px 28px 28px;margin-top:28px}
 .wrap{padding-inline:20px}.chips .wrap{padding:8px 20px}
 .hls{display:flex;overflow-x:auto;scroll-snap-type:x proximity;--hb:15px;margin-inline:calc(-1 * var(--hb));padding:4px var(--hb) 10px;scroll-padding-inline:var(--hb);gap:14px;scrollbar-width:none}.hls::-webkit-scrollbar{display:none}.hl{flex:none;width:62%;max-width:280px;scroll-snap-align:start}
 body{padding-bottom:72px}
 .mbar{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--grout);padding:8px 10px calc(8px + env(safe-area-inset-bottom));gap:8px;border-top:1px solid var(--line)}
 .mbar a{letter-spacing:var(--track);display:flex;align-items:center;justify-content:center;min-height:50px;border-radius:2px;color:var(--ink);text-decoration:none;font-weight:500;font-size:0.9375rem;border:1px solid var(--line)}
 .mbar button{letter-spacing:var(--track);display:flex;align-items:center;justify-content:center;min-height:50px;border-radius:2px;color:var(--ink);background:none;font:inherit;font-weight:500;font-size:0.9375rem;border:1px solid var(--line);cursor:pointer}
 .mbar a.main{background:var(--ruby);border-color:var(--ruby);color:var(--grout)}
 .toast{bottom:92px}
 .hero2 .hbg img{object-position:50% 38%}
 .hbg:after{background:linear-gradient(0deg,rgba(40,41,46,.94) 0,rgba(40,41,46,.78) 46%,rgba(40,41,46,.3) 100%)}
 .hwrap{padding-block:calc(var(--h) + 28px) 96px}
 .sigf{padding:80px 0}.kitchen .wrap{grid-template-columns:1fr;gap:56px}
 .sgrid{grid-template-columns:1fr;gap:56px;margin-top:40px}.sg{max-width:520px}.sg:nth-child(2){margin-top:0}
 .pband{min-height:72svh}
 .kfig{position:relative;top:auto;max-height:none;aspect-ratio:4/4.4;max-width:560px}
 .evening{padding:80px 0 72px}.track{--gut:20px}.track figure{height:min(62svh,460px)}
 .vhero .wrap{min-height:0;padding-block:calc(var(--h) + 56px) 48px}
 .mban .wrap{padding-block:calc(var(--h) + 28px) 28px}
}
@media (max-width:640px){
 .reserve .circ{display:none}
 .rform{padding:28px 22px 26px}.two,.three{grid-template-columns:1fr}.three{grid-template-columns:1fr 1fr}.three .fld:first-child{grid-column:1/-1}
}
@media (max-width:420px){
 body{font-size:1.0625rem}
 .brand{--lh:22px}
 .sub{font-size:1.125rem;margin-top:20px}.cta{margin-top:26px;grid-auto-flow:row}.status{margin-top:22px}
 .th{width:64px;height:64px}.it i{font-size:1.25rem}.pr{font-size:1.125rem}
 .mcard{padding:8px 20px 28px}.mi .it i{font-size:1.1875rem}.hls{--hb:7px}.msearch{padding-block:18px 14px}
 .ftr .wrap{grid-template-columns:1fr}
 .hero2 h1{font-size:clamp(2.5rem,12.4vw,3.375rem)}
 html[lang=ar] .hero2 h1{font-size:clamp(2.125rem,10.4vw,2.875rem)}
 .bigline{font-size:clamp(2.125rem,10vw,3rem)}.sghead h2{font-size:clamp(2.5rem,11vw,3.25rem)}
 .gnav button{width:46px;height:46px}.mban h1,.vhero h1{font-size:clamp(min(3.25rem,15vw),17vw,4.75rem)}
}
@media (prefers-reduced-motion:reduce){
 .hbg img,.ln,.hero2 .sub,.hero2 .cta,.hero2 .status,.hero2 .proof,.hero2 .opill{animation:none}
 .rv-on .rv{opacity:1;transform:none;transition:none}
 .px img,.pimg img{transform:none;will-change:auto}.track img{transition:none}
 html{scroll-behavior:auto}
}

/* page transitions: a short cross-fade between pages of the site */
@view-transition{navigation:auto}
.brand{view-transition-name:brand}
::view-transition-old(root),::view-transition-new(root){animation-duration:.3s}
@media (prefers-reduced-motion:reduce){@view-transition{navigation:none}}

/* photo track counter */
.gcount{align-self:center;font-size:0.875rem;color:var(--mute-dk);min-width:3.8em;text-align:center;font-variant-numeric:tabular-nums}

/* reservation: three short steps */
.rflow{display:grid;gap:18px}
.rstep{font-size:0.875rem;color:var(--mute)}.rstep b{color:var(--ink)}
.rpane{display:grid;gap:18px}.rpane[hidden]{display:none}
.rlab{font:500 0.875rem var(--f-body);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
html[lang=ar] .rlab{letter-spacing:0;text-transform:none;font-size:1rem;font-weight:600}
.chiprow{display:flex;flex-wrap:wrap;gap:8px}
.dchip,.tchip,.ochip,.schip{font:500 1rem/1.2 var(--f-body);letter-spacing:var(--track);border:1px solid #8C8D91;background:#fff;color:var(--ink);border-radius:2px;padding:10px 14px;min-height:48px;cursor:pointer;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.dchip{min-width:78px}.dchip b{font:600 0.875rem var(--f-body);letter-spacing:.1em;text-transform:uppercase}.dchip span{font-size:0.9375rem}.dchip small{font-size:0.75rem;color:var(--ruby);font-weight:600}
html[lang=ar] .dchip b{letter-spacing:0;text-transform:none;font-size:1rem}
.ochip,.schip{flex-direction:row}
.dchip:hover,.tchip:hover:not(:disabled),.ochip:hover,.schip:hover{border-color:var(--charcoal)}
.dchip[aria-pressed=true],.tchip[aria-pressed=true],.ochip[aria-pressed=true],.schip[aria-pressed=true]{background:var(--charcoal);color:var(--grout);border-color:var(--charcoal)}
.dchip[aria-pressed=true] small{color:var(--turmeric)}
.tchip:disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}
.stepper{display:inline-flex;align-items:center;border:1px solid #8C8D91;background:#fff;border-radius:2px;width:max-content}
.stepper button{width:54px;height:52px;border:0;background:transparent;font:400 1.625rem/1 var(--f-body);cursor:pointer;color:var(--ink)}
.stepper button:hover{background:var(--soft)}
.stepper output{min-width:72px;text-align:center;font:400 1.375rem var(--f-head);padding-inline:6px}
.rnav{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.rform .btn.ghost{color:var(--ink);border-color:var(--charcoal)}.rform .btn.ghost:hover{background:var(--charcoal);color:var(--grout)}
.rform .btn:disabled{opacity:.4;cursor:not-allowed}
.rsum{font:400 1.375rem/1.35 var(--f-head);padding-bottom:12px;border-bottom:1px solid var(--line)}
html[lang=ar] .rsum{font-weight:600;font-size:1.25rem}
.mbar a:only-child{grid-column:1/-1}

/* category bar with a mouse: the row fades at the edge that has more, and arrows scroll it */
.chv{display:none}
@media (hover:hover) and (pointer:fine){
 .chips .wrap.more-s{-webkit-mask-image:linear-gradient(to var(--chv-s),transparent 0,#000 88px);mask-image:linear-gradient(to var(--chv-s),transparent 0,#000 88px)}
 .chips .wrap.more-e{-webkit-mask-image:linear-gradient(to var(--chv-e),transparent 0,#000 88px);mask-image:linear-gradient(to var(--chv-e),transparent 0,#000 88px)}
 .chips .wrap.more-s.more-e{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 88px,#000 calc(100% - 88px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 88px,#000 calc(100% - 88px),transparent 100%)}
 .chips{--chv-s:right;--chv-e:left}
 html[dir=rtl] .chips{--chv-s:left;--chv-e:right}
 .chv{position:absolute;top:50%;z-index:2;width:44px;height:44px;margin-top:-22px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--ink);cursor:pointer;place-items:center;box-shadow:0 2px 8px -4px rgba(40,41,46,.35)}
 .chv:hover{border-color:var(--turmeric)}
 .chv svg{width:18px;height:18px}
 .chv.s{inset-inline-start:max(8px,calc((100% - 1240px) / 2 + 8px))}.chv.e{inset-inline-end:max(8px,calc((100% - 1240px) / 2 + 8px))}
 html[dir=rtl] .chv svg{transform:scaleX(-1)}
 .chips.more-s .chv.s,.chips.more-e .chv.e{display:grid}
}

/* phones, menu page: the header slides away while scrolling down and comes back on the way up */
@media (max-width:980px){
 .hdr{transition:background .35s,color .35s,border-color .35s,transform .25s}
 html.hdr-away .hdr{transform:translateY(-100%)}
 html.hdr-away .chips{top:0}
}
@media (max-width:980px) and (prefers-reduced-motion:reduce){.hdr,.chips{transition:none}}

/* phones, menu rows: name and price on one line, description full width, photo button below */
@media (max-width:640px){
 .mi{display:grid;grid-template-columns:1fr auto;column-gap:14px;align-items:start}
 .mi .it{grid-column:1/-1;grid-row:1}
 .mi .it i{padding-inline-end:3.4em}
 .mi .it small{max-width:none}
 .mi .pr{grid-column:2;grid-row:1;padding-top:.2em}
 .mi .dots{display:none}
 /* section photos: a taller frame so a portrait photo is not cut to a thin, zoomed strip */
 .mbn{aspect-ratio:4/3}
}