@font-face{font-family:"Serif";src:url(fonts/serif-normal-300_600.woff2) format("woff2");font-weight:300 600;font-style:normal;font-display:swap}
@font-face{font-family:"Serif";src:url(fonts/serif-italic-300_600.woff2) format("woff2");font-weight:300 600;font-style:italic;font-display:swap}
@font-face{font-family:"Sans";src:url(fonts/sans-normal-400_700.woff2) format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"ArabicSerif";src:url(fonts/amiri-ar.woff2) format("woff2");font-display:swap}
:root{--cream:#fbf5ee;--sand:#f3e7da;--shell:#efe0cf;--peach:#f1b394;--peach-d:#d9825d;--cocoa:#3a2a21;--cocoa-2:#5b463a;--muted:#7d6a5d;--sea:#8fb8bf;--line:rgba(58,42,33,.14);--r:22px;--shadow:0 18px 50px -24px rgba(58,42,33,.35)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:"Sans",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--cocoa);background:var(--cream);font-size:17px;line-height:1.6;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3{font-family:"Serif",Georgia,serif;font-weight:400;line-height:1.08;letter-spacing:-.01em}
em{font-style:italic;color:var(--peach-d)}
.wrap{width:min(1180px,100% - 40px);margin-inline:auto}
.skip{position:absolute;left:-999px;top:8px;background:var(--cocoa);color:#fff;padding:10px 14px;border-radius:10px;z-index:99}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--peach-d);outline-offset:3px;border-radius:6px}
svg{width:18px;height:18px;fill:currentColor;flex:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:50px;padding:0 24px;border-radius:999px;font-weight:600;font-size:15.5px;text-decoration:none;transition:transform .25s ease,background .25s,box-shadow .25s,color .25s;white-space:nowrap;border:1.5px solid transparent}
.btn:hover{transform:translateY(-2px)}
.btn--peach{background:var(--peach);color:var(--cocoa);box-shadow:0 12px 26px -14px rgba(217,130,93,.9)}
.btn--peach:hover{background:#eea582}
.btn--ink{background:var(--cocoa);color:var(--cream)}
.btn--ink:hover{background:#2a1e17}
.btn--line{border-color:var(--line);background:rgba(255,255,255,.6);color:var(--cocoa)}
.btn--line:hover{border-color:var(--cocoa)}
.btn--sm{min-height:44px;padding:0 18px;font-size:14.5px}

/* nav */
.nav{position:fixed;inset:0 0 auto;z-index:50;transition:background .3s,box-shadow .3s}
.nav.is-solid{background:rgba(251,245,238,.92);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);box-shadow:0 1px 0 var(--line)}
.nav__in{width:min(1240px,100% - 32px);margin-inline:auto;display:flex;align-items:center;gap:24px;height:74px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;min-height:44px}
.brand__logo{width:132px;height:auto}
.brand__loc{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);border-left:1px solid var(--line);padding-left:12px}
.nav__links{display:flex;gap:28px;margin-left:auto}
.nav__links a{text-decoration:none;font-size:15px;color:var(--cocoa-2);position:relative;padding:12px 0}
.nav__links a::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:1.5px;background:var(--peach-d);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.nav__links a:hover::after{transform:scaleX(1)}
.burger{display:none;width:46px;height:46px;border:0;background:transparent;border-radius:50%;cursor:pointer;position:relative;margin-left:auto}
.burger span{position:absolute;left:12px;right:12px;height:2px;background:var(--cocoa);transition:transform .3s,top .3s}
.burger span:first-child{top:18px}.burger span:last-child{top:26px}
.burger[aria-expanded="true"] span:first-child{top:22px;transform:rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{top:22px;transform:rotate(-45deg)}
.drawer{display:flex;flex-direction:column;gap:4px;padding:10px 20px 24px;background:var(--cream);box-shadow:0 20px 30px -20px rgba(0,0,0,.25)}
.drawer[hidden]{display:none}
.drawer a:not(.btn){font-family:"Serif",serif;font-size:26px;text-decoration:none;padding:10px 0;border-bottom:1px solid var(--line)}
.drawer .btn{margin-top:14px}

/* hero */
.hero{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:56px;width:min(1240px,100% - 40px);margin:0 auto;padding:118px 0 70px;min-height:min(880px,100vh)}
.hero__media{position:relative;order:2}
.hero__media picture{display:block;border-radius:300px 300px var(--r) var(--r);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:4/4.6}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:100% 50%;animation:zoom 14s ease-out both}
@keyframes zoom{from{transform:scale(1.08)}to{transform:scale(1)}}
.hero__badge{position:absolute;left:-28px;bottom:42px;background:#fff;border-radius:18px;padding:14px 18px;box-shadow:var(--shadow);display:grid;grid-template-columns:auto auto;align-items:center;column-gap:10px;animation:float 6s ease-in-out infinite}
.hero__badge .stars{grid-column:1/-1}
.hero__badge b{font-family:"Serif",serif;font-size:30px;font-weight:500;line-height:1}
.hero__badge small{font-size:12.5px;color:var(--muted);line-height:1.25;max-width:90px}
@keyframes float{50%{transform:translateY(-8px)}}
.stars{display:inline-flex;gap:2px;color:#e6a23c}
.stars svg{width:15px;height:15px}
.hero__copy{order:1}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--cocoa-2);background:var(--sand);padding:8px 14px;border-radius:999px}
.dot{width:8px;height:8px;border-radius:50%;background:#b9a596}
.dot.open{background:#4f9d69;box-shadow:0 0 0 0 rgba(79,157,105,.6);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(79,157,105,0)}100%{box-shadow:0 0 0 0 rgba(79,157,105,0)}}
.hero h1{font-size:clamp(46px,6.4vw,92px);margin:22px 0 12px}
.hero h1 em{display:inline-block}
.ar{font-family:"ArabicSerif","Amiri",serif;font-size:24px;color:var(--peach-d);margin-bottom:16px;text-align:left}
.lede{font-size:clamp(17px,1.45vw,20px);color:var(--cocoa-2);max-width:520px}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin:30px 0 30px}
.facts{list-style:none;display:flex;gap:0;border-top:1px solid var(--line);padding-top:20px;max-width:520px}
.facts li{flex:1;display:flex;flex-direction:column;padding-right:18px}
.facts li+li{border-left:1px solid var(--line);padding-left:18px}
.facts b{font-family:"Serif",serif;font-size:22px;font-weight:500}
.facts span{font-size:14px;color:var(--muted)}

/* ribbon */
.ribbon{background:var(--cocoa);color:var(--cream);overflow:hidden;padding:16px 0}
.ribbon__track{display:flex;gap:26px;width:max-content;animation:marq 38s linear infinite;font-family:"Serif",serif;font-style:italic;font-size:22px;align-items:center}
.ribbon i{font-style:normal;color:var(--peach);font-size:14px}
@keyframes marq{to{transform:translateX(-50%)}}

/* sections */
section{scroll-margin-top:80px}
.kicker{font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--peach-d);font-weight:600;margin-bottom:14px}
.sec-head{max-width:720px;margin-bottom:46px}
.sec-head h2,.intro h2,.celebrate h2{font-size:clamp(34px,4.4vw,58px)}
.sec-head p:not(.kicker){color:var(--cocoa-2);margin-top:16px;font-size:18px}
.intro{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding:120px 0}
.intro p:not(.kicker){color:var(--cocoa-2);margin-top:20px;font-size:18px}
.intro__img{border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);position:relative}
.intro__img::after{content:"";position:absolute;inset:14px;border:1px solid rgba(255,255,255,.6);border-radius:14px;pointer-events:none}
.intro__img img{width:100%;aspect-ratio:4/3;object-fit:cover}

.menu{background:var(--sand);padding:110px 0}
.dishes{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.dish{background:var(--cream);border-radius:var(--r);padding:12px 12px 22px;transition:transform .35s ease,box-shadow .35s}
.dish:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.dish__img{border-radius:14px;overflow:hidden;aspect-ratio:4/5;margin-bottom:18px}
.dish__img img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.dish:hover .dish__img img{transform:scale(1.06)}
.dish h3{font-size:26px;padding:0 8px}
.dish p{font-size:15px;color:var(--muted);padding:6px 8px 0;line-height:1.5}
.menu__note{margin-top:34px;text-align:center;color:var(--cocoa-2)}
.menu__note a{font-weight:600;color:var(--peach-d);display:inline-block;padding:10px 2px}

.space{background:var(--cocoa);color:var(--cream);padding:110px 0}
.sec-head--light h2{color:var(--cream)}
.sec-head--light em{color:var(--peach)}
.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:230px;gap:16px;grid-auto-flow:dense}
.b{position:relative;border-radius:18px;overflow:hidden}
.b img{width:100%;height:100%;object-fit:cover;transition:transform 1s ease}
.b:hover img{transform:scale(1.05)}
.b--wide{grid-column:span 2}
.b--tall{grid-row:span 2}
.b figcaption{position:absolute;left:12px;bottom:12px;background:rgba(251,245,238,.92);color:var(--cocoa);font-size:13px;padding:6px 12px;border-radius:999px;font-weight:600}

.reviews{padding:120px 0}
.big{font-size:1.25em;color:var(--peach-d)}
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.q{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:30px 28px;display:flex;flex-direction:column;gap:16px}
.q p{font-family:"Serif",serif;font-size:21px;line-height:1.4;flex:1}
.q footer{font-size:14px;color:var(--muted);font-weight:600}
.link-arrow{display:inline-flex;gap:8px;align-items:center;margin-top:30px;font-weight:600;color:var(--peach-d);text-decoration:none;min-height:44px}
.link-arrow:hover span{transform:translateX(4px)}
.link-arrow span{transition:transform .25s}

.celebrate{background:linear-gradient(180deg,var(--shell),var(--sand));padding:110px 0;position:relative;overflow:hidden}
.celebrate::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(241,179,148,.45),transparent 70%);right:-160px;top:-160px}
.celebrate__in{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;position:relative}
.celebrate__copy p:not(.kicker){color:var(--cocoa-2);margin-top:18px;font-size:18px}
.ticks{list-style:none;margin-top:24px;display:grid;gap:12px}
.ticks li{padding-left:34px;position:relative}
.ticks li::before{content:"";position:absolute;left:0;top:3px;width:22px;height:22px;border-radius:50%;background:var(--peach) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z' fill='%233a2a21'/%3E%3C/svg%3E") center/14px no-repeat}
.planner{background:#fff;border-radius:26px;padding:32px;box-shadow:var(--shadow);display:grid;gap:14px}
.planner h3{font-size:30px;margin-bottom:4px}
.planner label{display:grid;gap:6px;font-size:13px;font-weight:600;color:var(--cocoa-2);letter-spacing:.02em}
.planner input,.planner select,.planner textarea{font:inherit;font-size:16px;font-weight:400;color:var(--cocoa);border:1.5px solid var(--line);border-radius:12px;padding:11px 14px;background:var(--cream);min-height:48px;width:100%;min-width:0}
.planner textarea{resize:vertical;min-height:70px}
.planner input:focus,.planner select:focus,.planner textarea:focus{outline:none;border-color:var(--peach-d)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.planner__btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.planner__btns .btn{flex:1}
.fine{font-size:12.5px;color:var(--muted);word-break:break-word}

.visit{padding:120px 0}
.visit__grid{display:grid;grid-template-columns:1fr 1.25fr;gap:28px}
.visit__card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:34px}
.visit__card h3{font-size:30px}
.addr{color:var(--cocoa-2);margin:10px 0 22px}
.hours{display:grid;margin-bottom:26px}
.h{display:flex;justify-content:space-between;padding:10px 12px;border-bottom:1px dashed var(--line);font-size:15.5px;border-radius:10px}
.h b{font-weight:600}
.h.today{background:var(--sand);border-bottom-color:transparent}
.h.today span::after{content:" · today";color:var(--peach-d);font-weight:600}
.visit__btns{display:flex;flex-wrap:wrap;gap:10px}
.visit__map{position:relative;border-radius:var(--r);overflow:hidden;min-height:420px;background:var(--sand) url(img/arches.webp) center/cover;box-shadow:var(--shadow)}
.visit__map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:saturate(.75) sepia(.12)}
.map-open{position:absolute;right:14px;bottom:14px;background:var(--cocoa);color:var(--cream);text-decoration:none;font-size:14px;font-weight:600;padding:12px 16px;border-radius:999px;min-height:44px;display:inline-flex;align-items:center}

.foot{background:var(--cocoa);color:rgba(251,245,238,.85);padding:60px 0 40px}
.foot__in{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;align-items:flex-start}
.foot__logo{width:140px;margin-bottom:14px}
.foot p{font-size:15px}
.foot a{color:inherit;text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.foot a:hover{color:var(--peach)}
.foot__links{display:flex;flex-direction:column;gap:2px}
.foot__links a{display:inline-flex;align-items:center;gap:8px;min-height:44px}
.credit{text-align:center;font-size:12.5px;opacity:.6;margin-top:40px;padding:0 20px}

.dock{display:none}

.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

@media (max-width:1080px){
 .nav__links{display:none}
 .burger{display:block;margin-left:0}
 .nav__call{margin-left:auto}
 .dishes{grid-template-columns:repeat(2,1fr)}
 .quotes{grid-template-columns:1fr}
}
@media (max-width:860px){
 body{font-size:16px}
 .nav__in{height:64px;gap:10px}
 .brand__logo{width:100px}
 .brand__loc{display:none}
 .nav__call span{display:none}
 .nav__call{width:44px;padding:0;border-radius:50%}
 .hero{grid-template-columns:1fr;gap:26px;padding:84px 0 46px;min-height:0}
 .hero__media{order:1}
 .hero__media picture{aspect-ratio:4/4.3;border-radius:200px 200px 20px 20px}
 .hero__badge{left:12px;bottom:14px;padding:10px 14px}
 .hero__badge b{font-size:24px}
 .hero__copy{order:2}
 .hero h1{font-size:clamp(40px,11.5vw,60px);margin:18px 0 8px}
 .eyebrow{font-size:11.5px}
 .hero__cta .btn{flex:1 1 100%}
 .facts b{font-size:19px}
 .intro{grid-template-columns:1fr;gap:34px;padding:80px 0}
 .menu,.space,.celebrate{padding:80px 0}
 .reviews,.visit{padding:80px 0}
 .sec-head{margin-bottom:32px}
 .dishes{gap:14px}
 .dish{padding:8px 8px 16px}
 .dish h3{font-size:21px;padding:0 6px}
 .dish p{font-size:13.5px;padding:4px 6px 0}
 .bento{grid-template-columns:repeat(2,1fr);grid-auto-rows:170px;gap:10px}
 .b--wide{grid-column:span 2}
 .celebrate__in,.visit__grid{grid-template-columns:1fr;gap:34px}
 .planner{padding:22px}
 .visit__card{padding:24px}
 .visit__map{min-height:320px}
 .visit__btns .btn{flex:1 1 auto}
 .q p{font-size:19px}
 .foot{padding-bottom:110px}
 .hero__media img{object-position:50% 50%}
 .dock{display:grid;grid-template-columns:repeat(3,1fr);position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:60;background:rgba(58,42,33,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:20px;padding:6px;box-shadow:0 14px 34px -12px rgba(0,0,0,.5);transform:translateY(140%);opacity:0;visibility:hidden;transition:transform .4s ease,opacity .3s,visibility .4s}
 .dock.show{transform:none;opacity:1;visibility:visible}
 .dock a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:var(--cream);text-decoration:none;font-size:12px;font-weight:600;min-height:52px;border-radius:14px}
 .dock a:first-child{background:var(--peach);color:var(--cocoa)}
}
@media (max-width:400px){
 .row{grid-template-columns:1fr}
 .dish p{display:none}
}
@media (prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important}
 .reveal{opacity:1;transform:none}
}
