/* =========================================================
   BROST AMAAL — site styles (no framework, ~1 request)
   Theme colours come from CSS variables set per season.
   ========================================================= */
:root{
  --bg:#141110;--bg2:#1d1816;--surface:#241d1a;--ink:#FFF6E9;--muted:#c9b8a6;--brand:#E87532;--brand2:#741F25;--gold:#E9B44C;--cream:#FFF6E9;--line:rgba(255,246,233,.1);
  --head:'Playfair Display',serif;--body:'DM Sans','Hind Siliguri',system-ui,sans-serif;--ar:'Reem Kufi','Tahoma',sans-serif;--bn:'Hind Siliguri','DM Sans',sans-serif;
  --r:22px;--r-sm:14px;--ease:cubic-bezier(.22,1,.36,1);--wrap:1220px;
  --glass:color-mix(in srgb,var(--surface) 72%,transparent);
  --soft:color-mix(in srgb,var(--ink) 6%,transparent);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.65 var(--body);overflow-x:clip;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--head);line-height:1.12;margin:0 0 .5em;font-weight:800;letter-spacing:-.01em}
h1 em,h2 em,h3 em{font-style:italic;color:var(--brand);font-weight:600}
p{margin:0 0 1em}
.wrap{width:min(var(--wrap),100% - 32px);margin-inline:auto}
.bn{font-family:var(--bn)}
.ar{font-family:var(--ar);color:var(--gold);direction:rtl}
.muted{color:var(--muted)}
.small{font-size:.86rem}
.center{text-align:center}
.w100{width:100%}
.skip{position:absolute;left:-999px;top:8px;background:var(--brand);color:#fff;padding:8px 14px;border-radius:8px;z-index:200}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:700 .74rem/1 var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
.eyebrow::before{content:"";width:26px;height:1.5px;background:currentColor}
.tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--brand);margin-bottom:10px}

/* ---------- Buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:15px 28px;border-radius:999px;font-weight:700;font-size:.95rem;
  background:var(--ink);color:var(--bg);transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .3s;overflow:hidden;isolation:isolate;white-space:nowrap}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s var(--ease);z-index:-1}
.btn:hover{transform:translateY(-2px)}
.btn:hover::after{transform:translateX(120%)}
.btn-glow{background:linear-gradient(135deg,var(--brand),color-mix(in srgb,var(--brand) 60%,var(--brand2)));color:#fff;box-shadow:0 10px 30px -10px var(--brand)}
.btn-glow:hover{box-shadow:0 16px 40px -10px var(--brand)}
.btn-ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ink) 30%,transparent)}
.btn-ghost:hover{box-shadow:inset 0 0 0 1.5px var(--gold);color:var(--gold)}
.btn-sm{padding:11px 20px;font-size:.88rem}

/* ---------- Season bar ---------- */
.season-bar{position:relative;z-index:61;text-align:center;padding:8px 16px;font-size:.86rem;font-weight:500;background:linear-gradient(90deg,var(--brand2),color-mix(in srgb,var(--brand2) 50%,var(--brand)),var(--brand2));color:#fff}
.season-ar{font-family:var(--ar);color:var(--gold);margin-right:6px;font-size:1.05em}

/* ---------- Navigation ---------- */
.nav{position:sticky;top:0;z-index:60;transition:background .4s,box-shadow .4s,backdrop-filter .4s}
.page-home .hero{margin-top:-78px}
.nav{background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.page-home .nav:not(.is-solid){background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 70%,transparent),transparent);box-shadow:none;backdrop-filter:none}
.nav-in{width:min(1320px,100% - 32px);margin:auto;display:flex;align-items:center;gap:20px;height:78px}
.brand{display:flex;align-items:center;flex-shrink:0}
.logo{display:flex;align-items:center;gap:10px}
.logo-mark{width:46px;height:46px;transition:transform .8s var(--ease)}
.brand:hover .logo-mark{transform:rotate(-20deg) scale(1.06)}
.logo-txt{display:flex;flex-direction:column;line-height:1}
.logo-txt b{font-family:var(--head);font-size:1.18rem;letter-spacing:.12em;color:var(--ink)}
.logo-txt i{font-style:normal;font-family:var(--ar);color:var(--gold);font-size:.95rem;margin-top:4px}
.logo-img{height:50px;width:auto}
.nav-links{display:flex;gap:2px;margin-inline:auto}
.nav-links a{position:relative;display:flex;flex-direction:column;align-items:center;padding:8px 13px;border-radius:12px;font-weight:600;font-size:.92rem;transition:color .25s}
.nav-links a small{font-family:var(--bn);font-size:.66rem;color:var(--muted);font-weight:400;line-height:1;margin-top:2px;opacity:.8}
.nav-links a::after{content:"";position:absolute;left:50%;bottom:0;width:0;height:2px;background:var(--brand);border-radius:2px;transition:width .35s var(--ease),left .35s var(--ease)}
.nav-links a:hover,.nav-links a.is-active{color:var(--brand)}
.nav-links a:hover::after,.nav-links a.is-active::after{width:60%;left:20%}
.nav-cta{display:flex;align-items:center;gap:10px}
.burger{display:none;width:44px;height:44px;border-radius:12px;background:var(--soft);flex-direction:column;justify-content:center;align-items:center;gap:5px}
.burger span{width:20px;height:2px;background:var(--ink);border-radius:2px;transition:transform .35s var(--ease),opacity .2s}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.cart-btn{position:relative;width:44px;height:44px;border-radius:12px;background:var(--soft);display:grid;place-items:center}
.cart-btn svg{width:22px}
.cart-btn b{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;border-radius:10px;background:var(--brand);color:#fff;font-size:.7rem;display:grid;place-items:center}
.drawer{position:fixed;inset:0;z-index:59;background:color-mix(in srgb,var(--bg) 96%,transparent);backdrop-filter:blur(10px);padding:110px 28px 30px;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.drawer.is-open{opacity:1;visibility:visible}
.drawer-in{display:flex;flex-direction:column;gap:6px}
.drawer-in>a{font-family:var(--head);font-size:1.9rem;font-weight:800;padding:6px 0;border-bottom:1px solid var(--line);transform:translateX(40px);opacity:0;transition:transform .5s var(--ease),opacity .5s;transition-delay:calc(var(--i)*50ms)}
.drawer-in>a small{font-family:var(--bn);font-size:.9rem;color:var(--muted);font-weight:400;margin-left:8px}
.drawer.is-open .drawer-in>a{transform:none;opacity:1}
.drawer-foot{display:flex;gap:10px;margin-top:24px;flex-wrap:wrap}

/* ---------- Pattern (8-point Arabic star) ---------- */
.pattern{position:absolute;inset:0;opacity:.06;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cg fill='none' stroke='%23E9B44C' stroke-width='1'%3E%3Crect x='22' y='22' width='36' height='36'/%3E%3Crect x='22' y='22' width='36' height='36' transform='rotate(45 40 40)'/%3E%3Ccircle cx='40' cy='40' r='8'/%3E%3Cpath d='M0 40h14M66 40h14M40 0v14M40 66v14'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-image:radial-gradient(ellipse at 70% 40%,#000 10%,transparent 70%);mask-image:radial-gradient(ellipse at 70% 40%,#000 10%,transparent 70%)}

/* ---------- Entrance + reveal ---------- */
.in{opacity:0;transform:translateY(24px);animation:rise .9s var(--ease) forwards;animation-delay:calc(var(--i,0)*110ms + .1s)}
@keyframes rise{to{opacity:1;transform:none}}
.reveal{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--i,0)*60ms)}
.reveal.from-side{transform:translateX(60px) rotate(4deg)}
.flip .reveal.from-side{transform:translateX(-60px) rotate(-4deg)}
.reveal.is-in{opacity:1;transform:none}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;padding:130px 0 90px;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:radial-gradient(1200px 600px at 75% 45%,color-mix(in srgb,var(--brand2) 55%,transparent),transparent 65%),linear-gradient(180deg,var(--bg),var(--bg2))}
.hero-glow{position:absolute;right:8%;top:22%;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--brand) 45%,transparent),transparent 65%);filter:blur(20px);animation:breathe 6s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.12);opacity:.75}}
.hero-in{position:relative;display:grid;grid-template-columns:1.02fr 1fr;gap:40px;align-items:center}
.hero h1{font-size:clamp(2.6rem,5.6vw,4.9rem);margin-bottom:.2em}
.hero-ar{font-family:var(--ar);color:var(--gold);font-size:clamp(1.2rem,2vw,1.6rem);margin-bottom:18px}
.lead{font-size:1.08rem;color:var(--muted);max-width:560px}
.lead-bn{color:var(--ink);opacity:.85;font-size:1.05rem}
.pulse{width:9px;height:9px;border-radius:50%;background:#38d27a;box-shadow:0 0 0 0 #38d27a;animation:ping 2s infinite}
.hero .eyebrow::before{display:none}
@keyframes ping{70%{box-shadow:0 0 0 10px transparent}100%{box-shadow:0 0 0 0 transparent}}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap;margin:28px 0 36px}
.hero-facts{display:flex;gap:34px;list-style:none;padding:0;margin:0}
.hero-facts li{display:flex;align-items:center;gap:10px}
.hero-facts b{font-family:var(--head);font-size:2.4rem;color:var(--gold);line-height:1}
.hero-facts span{font-size:.78rem;color:var(--muted);line-height:1.3}

.hero-stage{position:relative;aspect-ratio:1/1;max-width:600px;width:100%;margin-left:auto}
.stage-ring{position:absolute;inset:7%;border-radius:50%;border:1.5px dashed color-mix(in srgb,var(--gold) 45%,transparent);animation:spin 40s linear infinite}
.stage-ring::before{content:"";position:absolute;inset:9%;border-radius:50%;background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--ink) 9%,transparent),transparent 70%);border:1px solid var(--line)}
@keyframes spin{to{transform:rotate(360deg)}}
.slide{position:absolute;inset:0;margin:0;display:grid;place-items:center;pointer-events:none}
.slide img{width:78%;filter:drop-shadow(0 40px 40px rgba(0,0,0,.45));opacity:0;transform:translateX(70%) rotate(28deg) scale(.7);transition:transform 1.1s var(--ease),opacity .7s}
.slide.is-on img{opacity:1;transform:none}
.slide.is-out img{opacity:0;transform:translateX(-60%) rotate(-24deg) scale(.7)}
.slide-word{position:absolute;top:2%;right:-4%;font:900 clamp(3.5rem,9vw,8rem)/1 var(--head);color:transparent;-webkit-text-stroke:1.5px color-mix(in srgb,var(--c) 70%,transparent);letter-spacing:-.02em;opacity:0;transform:translateX(30%);transition:opacity .8s,transform 1.2s var(--ease);white-space:nowrap}
.slide.is-on .slide-word{opacity:.55;transform:none}
.slide figcaption{position:absolute;left:0;bottom:12%;padding:16px 20px;border-radius:18px;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--line);
  display:flex;flex-direction:column;gap:2px;min-width:220px;opacity:0;transform:translateX(80px);transition:opacity .6s .35s,transform .9s .35s var(--ease)}
.slide.is-on figcaption{opacity:1;transform:none;pointer-events:auto}
.cap-cat{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c);font-weight:700}
.cap-cat i{font-style:normal;font-family:var(--ar);letter-spacing:0;color:var(--gold);margin-left:6px}
.slide figcaption b{font-family:var(--head);font-size:1.25rem}
.cap-price{font-weight:700;color:var(--gold)}
.stage-nav{position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);display:flex;gap:6px;flex-wrap:wrap;justify-content:center;width:110%}
.stage-nav button{padding:7px 12px;border-radius:999px;font-family:var(--bn);font-size:.8rem;background:var(--soft);border:1px solid var(--line);transition:all .3s}
.stage-nav button.is-on{background:var(--brand);color:#fff;border-color:var(--brand)}
.scroll-cue{position:absolute;left:50%;bottom:22px;width:26px;height:42px;border-radius:14px;border:1.5px solid color-mix(in srgb,var(--ink) 40%,transparent);transform:translateX(-50%)}
.scroll-cue span{position:absolute;left:50%;top:8px;width:4px;height:8px;border-radius:2px;background:var(--gold);transform:translateX(-50%);animation:cue 1.8s infinite}
@keyframes cue{60%{transform:translate(-50%,12px);opacity:0}}

/* ---------- Marquee ---------- */
.marquee{overflow:hidden;background:var(--brand);color:#fff;padding:14px 0;transform:rotate(-1.2deg);margin:-14px -10px 0;position:relative;z-index:2}
.marquee-track,.river-track{display:flex;gap:40px;width:max-content;animation:slide 38s linear infinite}
.marquee span{font:800 1.3rem/1 var(--head);white-space:nowrap;text-transform:uppercase;letter-spacing:.04em}
.marquee i{font-style:normal;font-family:var(--ar);font-weight:500;margin-left:8px;opacity:.85}
@keyframes slide{to{transform:translateX(-50%)}}

/* ---------- Category orbit ---------- */
.cats{display:grid;grid-template-columns:repeat(7,1fr);gap:14px;padding:80px 0 30px}
.cat{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px}
.cat-img{width:116px;height:116px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--c) 35%,transparent),var(--surface) 70%);border:1px solid var(--line);transition:transform .5s var(--ease),box-shadow .5s;margin-bottom:8px}
.cat-img img{width:84%;transition:transform .6s var(--ease)}
.cat:hover .cat-img{transform:translateY(-8px);box-shadow:0 20px 40px -18px var(--c)}
.cat:hover .cat-img img{transform:rotate(-10deg) scale(1.1)}
.cat b{font-weight:700;font-size:.95rem}
.cat small{font-family:var(--bn);color:var(--muted);font-size:.8rem}

/* ---------- Section heads ---------- */
.sec-head{max-width:720px;margin:0 auto 60px;text-align:center}
.sec-head h2{font-size:clamp(2rem,4vw,3.3rem)}
.sec-head.row{display:flex;justify-content:space-between;align-items:end;text-align:left;max-width:none;gap:20px}
.sec-head .eyebrow::before{display:none}

/* ---------- Kitchen / features (one by one) ---------- */
.kitchen{padding:90px 0 60px}
.feature{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding:50px 0;position:relative}
.feature + .feature::before{content:"";position:absolute;top:0;left:20%;right:20%;height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent)}
.feature.flip .feature-media{order:2}
.feature-media{position:relative;aspect-ratio:1/1;display:grid;place-items:center}
.feature-media::before{content:"";position:absolute;inset:10%;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--c) 40%,transparent),transparent 70%)}
.feature-media img{position:relative;width:82%;filter:drop-shadow(0 30px 34px rgba(0,0,0,.4));transition:transform 1.2s var(--ease)}
.feature:hover .feature-media img{transform:rotate(-6deg) scale(1.05)}
.plate-ring{position:absolute;inset:4%;border-radius:50%;border:1px dashed color-mix(in srgb,var(--c) 60%,transparent);animation:spin 60s linear infinite}
.feature-num{position:absolute;top:0;left:0;font:900 7rem/1 var(--head);color:transparent;-webkit-text-stroke:1.5px color-mix(in srgb,var(--ink) 18%,transparent)}
.feature-badge{position:absolute;right:6%;top:12%;background:var(--gold);color:#1b1208;font-weight:800;font-size:.78rem;padding:8px 14px;border-radius:999px;transform:rotate(8deg);box-shadow:0 10px 24px -10px var(--gold)}
.feature-copy h3{font-size:clamp(1.9rem,3.2vw,2.7rem);margin-bottom:.1em}
.big-ar{font-size:1.5rem;margin-bottom:14px;text-align:left}
.feature-copy>p{color:var(--muted);font-size:1.04rem}
blockquote{margin:22px 0;padding:18px 22px 18px 54px;border-radius:var(--r-sm);background:var(--soft);border-left:3px solid var(--brand);position:relative;font-style:italic}
blockquote svg{position:absolute;left:16px;top:16px;width:24px;fill:var(--brand)}
blockquote cite{display:block;margin-top:6px;font-size:.8rem;font-style:normal;color:var(--gold);font-weight:700}
.meta{display:flex;gap:10px;list-style:none;padding:0;margin:0 0 26px;flex-wrap:wrap}
.meta li{padding:10px 16px;border-radius:12px;border:1px solid var(--line);font-weight:600;font-size:.92rem}
.meta small{display:block;font-size:.68rem;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;font-weight:500}
.feature-foot{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.price{font-weight:800;color:var(--gold)}
.price.big{font:800 2rem/1 var(--head)}
.price s{font-size:.6em;color:var(--muted);font-weight:400;margin-left:6px}

/* ---------- Story band ---------- */
.story-band{position:relative;padding:110px 0;background:linear-gradient(135deg,var(--brand2),color-mix(in srgb,var(--brand2) 60%,var(--bg)));overflow:hidden;color:#fff}
.story-band .pattern{opacity:.12;-webkit-mask-image:none;mask-image:none}
.story-band .muted{color:rgba(255,255,255,.78)}
.story-band h2{font-size:clamp(1.9rem,3.6vw,3rem)}
.story-band h2 em{color:var(--gold)}
.story-band-in{position:relative;display:grid;grid-template-columns:1.2fr 1fr;gap:60px;align-items:center}
.story-band .btn-ghost{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:16px;list-style:none;padding:0;margin:0}
.stats li{padding:26px;border-radius:var(--r);background:rgba(0,0,0,.18);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(6px)}
.stats b{display:block;font:800 3rem/1 var(--head);color:var(--gold)}
.stats span{font-size:.88rem;opacity:.85}

/* ---------- Team ---------- */
.team{padding:110px 0 60px}
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.member{perspective:1200px;min-height:380px}
.member.is-featured{grid-row:span 2;grid-column:span 2;min-height:600px}
.member-in{position:relative;height:100%;transition:transform .9s var(--ease);transform-style:preserve-3d}
.member:hover .member-in,.member:focus .member-in,.member.is-flipped .member-in{transform:rotateY(180deg)}
.member-front,.member-back{position:absolute;inset:0;border-radius:var(--r);overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;border:1px solid var(--line)}
.member-front img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.member-cap{position:absolute;left:0;right:0;bottom:0;padding:22px;background:linear-gradient(transparent,rgba(0,0,0,.85));color:#fff}
.member-cap h3{font-size:1.3rem;margin:6px 0 2px}
.member-cap p{margin:0;font-size:.86rem;opacity:.8}
.is-featured .member-cap h3{font-size:2.2rem}
.yrs{display:inline-block;padding:5px 12px;border-radius:999px;background:var(--brand);color:#fff;font-size:.76rem}
.yrs b{font-size:1rem}
.yrs.big{font-size:1rem;padding:8px 16px}
.yrs.big b{font-size:1.6rem}
.member-back{transform:rotateY(180deg);background:linear-gradient(160deg,var(--surface),var(--brand2));padding:30px;display:flex;flex-direction:column;justify-content:center;gap:6px}
.member-back h3{font-size:1.5rem;margin-top:12px}
.spec{color:var(--gold);font-weight:700}

/* ---------- Testimonials ---------- */
.voices{position:relative;padding:110px 0 40px;background:linear-gradient(180deg,transparent,var(--bg2) 30%,var(--bg2))}
.voices-in{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:center}
.voices h2{font-size:clamp(2rem,4vw,3.2rem)}
.score{display:flex;align-items:center;gap:16px;margin:10px 0 26px}
.score>b{font:800 4.6rem/1 var(--head);color:var(--gold)}
.stars{--r:5;font-size:1.4rem;letter-spacing:3px;background:linear-gradient(90deg,var(--gold) calc(var(--r)/5*100%),color-mix(in srgb,var(--ink) 20%,transparent) 0);-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block}
.stars.sm{font-size:.95rem;margin-left:auto}
.score small{display:block;color:var(--muted)}
.deck-ctrl{display:flex;align-items:center;gap:14px;margin-bottom:10px}
.deck-ctrl button{width:52px;height:52px;border-radius:50%;border:1.5px solid var(--line);font-size:1.2rem;transition:all .3s}
.deck-ctrl button:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.deck-ctrl span{font-weight:700;font-variant-numeric:tabular-nums}
.deck{position:relative;height:380px;touch-action:pan-y}
.vcard{--o:0;position:absolute;inset:0 30px 30px 0;margin:0;padding:34px;border-radius:28px;background:linear-gradient(160deg,color-mix(in srgb,var(--surface) 90%,var(--ink) 4%),var(--surface));border:1px solid var(--line);
  box-shadow:0 30px 60px -30px rgba(0,0,0,.6);display:flex;flex-direction:column;transform-origin:50% 120%;cursor:grab;user-select:none;
  transform:translate(calc(var(--o)*18px),calc(var(--o)*14px)) rotate(calc(var(--o)*3deg)) scale(calc(1 - var(--o)*.05));opacity:calc(1 - var(--o)*.25);
  transition:transform .7s var(--ease),opacity .5s}
.vcard:not(.is-front)>*{opacity:0;transition:opacity .3s}
.vcard>*{transition:opacity .5s .2s}
.vcard.is-hidden{opacity:0;pointer-events:none}
.vcard.dragging{transition:none;cursor:grabbing}
.vcard-top{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.vcard-top small{display:block;color:var(--muted)}
.avatar{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font:800 1.4rem/1 var(--head);color:#fff;background:linear-gradient(135deg,hsl(var(--h) 65% 55%),hsl(calc(var(--h) + 40) 70% 40%))}
.vcard blockquote{background:none;border:0;padding:0;margin:0 0 auto;font:600 clamp(1.15rem,2vw,1.45rem)/1.45 var(--head);font-style:italic}
.vcard figcaption{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}
.ordered,.sample,.src{font-size:.76rem;padding:6px 12px;border-radius:999px;background:var(--soft);font-weight:600}
.sample{background:color-mix(in srgb,var(--gold) 25%,transparent);color:var(--gold)}
.quote-river{overflow:hidden;margin-top:70px;padding:18px 0;border-block:1px solid var(--line);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.river-track{animation-duration:60s;animation-direction:reverse}
.river-track span{white-space:nowrap;font-family:var(--head);font-style:italic;color:var(--muted)}
.river-track i{color:var(--gold)}

/* ---------- Duo cards ---------- */
.duo{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:90px 0 40px}
.duo-card{position:relative;display:flex;align-items:center;gap:10px;padding:36px;border-radius:28px;overflow:hidden;background:linear-gradient(135deg,var(--brand),var(--brand2));color:#fff;min-height:250px;transition:transform .5s var(--ease)}
.duo-card.alt{background:linear-gradient(135deg,var(--surface),var(--bg2));color:var(--ink);border:1px solid var(--line)}
.duo-card img{position:absolute;right:-50px;bottom:-60px;width:260px;opacity:.9;transition:transform .9s var(--ease)}
.duo-card div{position:relative;max-width:62%}
.duo-card .eyebrow{color:inherit;opacity:.8}
.duo-card h3{font-size:2rem}
.duo-card .go{font-weight:800}
.duo-card:hover{transform:translateY(-6px)}
.duo-card:hover img{transform:rotate(-18deg) scale(1.08)}

/* ---------- Blog cards ---------- */
.blog-teaser{padding:70px 0}
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.post{border-radius:var(--r);overflow:hidden;background:var(--surface);border:1px solid var(--line);transition:transform .5s var(--ease),box-shadow .5s}
.post:hover{transform:translateY(-6px);box-shadow:0 30px 50px -30px rgba(0,0,0,.6)}
.post-img{aspect-ratio:16/10;display:grid;place-items:center;background:radial-gradient(circle,color-mix(in srgb,var(--brand) 30%,transparent),var(--bg2));overflow:hidden}
.post-img img{width:60%;transition:transform .8s var(--ease)}
.post:hover .post-img img{transform:scale(1.1) rotate(-6deg)}
.post-img img[src*="uploads"]{width:100%;height:100%;object-fit:cover}
.post-body{padding:22px}
.post-body h3{font-size:1.3rem}
.post-body p{color:var(--muted);font-size:.94rem}
.post-body small{color:var(--gold);font-weight:700}
.notice{padding:16px 22px;border-radius:var(--r-sm);background:var(--soft);border:1px dashed color-mix(in srgb,var(--gold) 50%,transparent);text-align:center;margin:30px 0}

/* ---------- CTA band + footer ---------- */
.cta-band{padding:30px 0 0}
.cta-band-in{display:flex;justify-content:space-between;align-items:center;gap:30px;padding:46px;border-radius:32px;background:radial-gradient(600px 200px at 0 0,color-mix(in srgb,var(--brand) 45%,transparent),transparent),var(--surface);border:1px solid var(--line);flex-wrap:wrap}
.cta-band h2{font-size:clamp(1.7rem,3.2vw,2.6rem);margin-bottom:.2em}
.cta-band-btns{display:flex;gap:12px;flex-wrap:wrap}
.footer{padding:80px 0 30px;margin-top:80px;background:var(--bg2);border-top:1px solid var(--line);position:relative}
.foot-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.3fr;gap:40px}
.foot-brand p{color:var(--muted);margin:18px 0}
.footer h4{font:700 .78rem/1 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:18px}
.footer h4.mt{margin-top:26px}
.foot-col p,.foot-col a{color:var(--muted);font-size:.94rem}
.foot-col a:hover{color:var(--brand)}
.addr{display:flex;gap:10px}
.addr svg{width:20px;flex-shrink:0;fill:var(--brand);margin-top:3px}
.socials{display:flex;gap:8px;flex-wrap:wrap}
.socials a{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--soft);border:1px solid var(--line);transition:all .35s var(--ease)}
.socials svg{width:19px;fill:var(--ink);transition:fill .3s}
.socials a:hover{background:var(--brand);transform:translateY(-4px) rotate(-6deg)}
.socials a:hover svg{fill:#fff}
.foot-btns{display:flex;flex-wrap:wrap;gap:8px}
.chip-btn{display:inline-flex;align-items:center;gap:6px;padding:9px 14px;border-radius:999px;background:var(--soft);border:1px solid var(--line);font-size:.84rem;font-weight:600;color:var(--ink)!important;transition:all .3s}
.chip-btn svg{width:16px;fill:currentColor}
.chip-btn.wa{background:#25D366;color:#fff!important;border-color:#25D366}
.chip-btn:hover{transform:translateY(-2px)}
.branches{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.branches li{padding:12px 14px;border-radius:12px;border:1px solid var(--line);display:grid;font-size:.9rem}
.branches li b{display:flex;align-items:center;gap:8px}
.branches li.open b::before{content:"";width:8px;height:8px;border-radius:50%;background:#38d27a}
.branches li.coming_soon{opacity:.7;border-style:dashed}
.branches span{color:var(--muted);font-size:.82rem}
.branches a{font-size:.8rem!important;color:var(--brand)!important}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 14px}
.map-box{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;border:1px solid var(--line);background:var(--surface);cursor:pointer}
.map-box.big{aspect-ratio:16/10}
.map-box iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:saturate(.9)}

.map-ph{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;text-align:center;gap:4px;
  background:repeating-linear-gradient(45deg,transparent 0 22px,var(--soft) 22px 23px),repeating-linear-gradient(-45deg,transparent 0 22px,var(--soft) 22px 23px)}
.map-ph svg{width:44px;fill:var(--brand);animation:bob 2s ease-in-out infinite}
.map-ph span{font-size:.82rem;color:var(--muted)}
@keyframes bob{50%{transform:translateY(-8px)}}
.map-dir{display:inline-block;margin-top:10px;font-size:.88rem;color:var(--brand);font-weight:700}
.foot-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:50px;padding-top:24px;border-top:1px solid var(--line);font-size:.84rem;color:var(--muted)}
.foot-bottom a:hover{color:var(--brand)}

/* ---------- Floating widgets ---------- */
.to-top{position:fixed;left:20px;bottom:24px;z-index:55;width:48px;height:48px;border-radius:50%;background:var(--surface);border:1px solid var(--line);display:grid;place-items:center;opacity:0;transform:translateY(20px);transition:all .4s var(--ease);pointer-events:none}
.to-top svg{width:22px}
.to-top.is-on{opacity:1;transform:none;pointer-events:auto}
.chef{position:fixed;right:20px;bottom:22px;z-index:70}
.chef-btn{position:relative;width:76px;height:76px;border-radius:50%;padding:4px;background:linear-gradient(135deg,var(--gold),var(--brand));box-shadow:0 14px 30px -8px rgba(0,0,0,.6);animation:chefbob 3.2s ease-in-out infinite;transition:transform .4s var(--ease)}
.chef-btn img{width:100%;height:100%;border-radius:50%}
.chef-btn:hover{transform:scale(1.08) rotate(-6deg)}
.chef.is-open .chef-btn{animation:none;transform:rotate(-12deg)}
.chef-ping{position:absolute;top:2px;right:2px;width:16px;height:16px;border-radius:50%;background:#38d27a;border:3px solid var(--bg)}
.chef-ping::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid #38d27a;animation:ring 1.8s infinite}
@keyframes ring{to{transform:scale(2.2);opacity:0}}
@keyframes chefbob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.chef-bubble{position:absolute;right:88px;bottom:22px;width:max-content;max-width:220px;padding:10px 14px;border-radius:16px 16px 4px 16px;background:var(--ink);color:var(--bg);font-size:.84rem;box-shadow:0 10px 30px -10px rgba(0,0,0,.5);
  opacity:0;transform:translateX(10px) scale(.9);transform-origin:right bottom;transition:all .5s var(--ease);pointer-events:none}
.chef-bubble .bn{display:block;font-size:.78rem;opacity:.7}
.chef-bubble.is-on{opacity:1;transform:none}
.chef.is-open .chef-bubble{opacity:0}
.chef-actions{position:absolute;right:6px;bottom:88px;display:flex;flex-direction:column;gap:12px;align-items:flex-end}
.ca{display:flex;align-items:center;gap:10px;flex-direction:row-reverse;opacity:0;transform:translateY(30px) scale(.4);pointer-events:none;transition:all .45s var(--ease);transition-delay:calc((2 - var(--a))*50ms)}
.chef.is-open .ca{opacity:1;transform:none;pointer-events:auto;transition-delay:calc(var(--a)*70ms)}
.ca svg{width:58px;height:58px;padding:15px;border-radius:50%;fill:#fff;box-shadow:0 10px 24px -8px rgba(0,0,0,.5);transition:transform .3s}
.ca:hover svg{transform:scale(1.1)}
.ca span{padding:6px 12px;border-radius:999px;background:var(--ink);color:var(--bg);font-size:.8rem;font-weight:700;white-space:nowrap}
.ca-ms svg{background:linear-gradient(135deg,#00B2FF,#A033FF)}
.ca-wa svg{background:#25D366}
.ca-info svg{background:linear-gradient(135deg,var(--brand),var(--brand2))}

.panel{position:fixed;right:20px;bottom:110px;z-index:80;width:min(380px,calc(100vw - 24px));max-height:min(600px,calc(100svh - 140px));display:flex;flex-direction:column;border-radius:24px;overflow:hidden;
  background:var(--bg2);border:1px solid var(--line);box-shadow:0 40px 80px -20px rgba(0,0,0,.7);opacity:0;transform:translateY(20px) scale(.96);transform-origin:right bottom;pointer-events:none;transition:all .4s var(--ease)}
.panel.is-open{opacity:1;transform:none;pointer-events:auto}
.panel-h{display:flex;align-items:center;gap:12px;padding:14px 16px;background:linear-gradient(135deg,var(--brand2),color-mix(in srgb,var(--brand2) 60%,var(--brand)));color:#fff}
.panel-h img{border-radius:50%;background:#fff2}
.panel-h div{flex:1;line-height:1.2}
.panel-h small{display:flex;align-items:center;gap:6px;font-size:.76rem;opacity:.85}
.dot{width:8px;height:8px;border-radius:50%;background:#38d27a;display:inline-block}
.x{width:34px;height:34px;border-radius:50%;font-size:1.5rem;line-height:1;color:inherit;background:rgba(255,255,255,.12)}
.bot-log{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;min-height:220px;scroll-behavior:smooth}
.msg{max-width:86%;padding:10px 14px;border-radius:16px;font-size:.92rem;line-height:1.5;animation:pop .35s var(--ease)}
.msg.bot{background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:4px}
.msg.me{align-self:flex-end;background:var(--brand);color:#fff;border-bottom-right-radius:4px}
.msg .acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.msg .acts a{padding:5px 10px;border-radius:999px;background:var(--brand);color:#fff;font-size:.78rem;font-weight:700}
.msg ul{margin:6px 0 0;padding-left:18px}
.typing span{display:inline-block;width:7px;height:7px;margin:0 2px;border-radius:50%;background:var(--muted);animation:typ 1s infinite}
.typing span:nth-child(2){animation-delay:.15s}.typing span:nth-child(3){animation-delay:.3s}
@keyframes typ{50%{transform:translateY(-5px);opacity:.4}}
@keyframes pop{from{opacity:0;transform:translateY(8px) scale(.97)}}
.bot-quick{display:flex;gap:6px;overflow-x:auto;padding:0 12px 10px;scrollbar-width:none}
.bot-quick button{flex-shrink:0;padding:7px 12px;border-radius:999px;border:1px solid var(--line);font-size:.8rem;background:var(--soft);font-family:var(--bn)}
.bot-quick button:hover{border-color:var(--brand);color:var(--brand)}
.bot-form,.wa-form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line)}
.bot-form input,.wa-form textarea{flex:1;padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:var(--surface);outline:0;resize:none}
.bot-form button,.wa-form button{width:46px;border-radius:14px;background:var(--brand);display:grid;place-items:center}
.bot-form svg,.wa-form svg{width:20px;fill:#fff}
.wa-h{background:#075E54}
.wa-av{width:42px;height:42px;border-radius:50%;overflow:hidden;background:#fff;display:block}
.wa-av svg{width:100%;height:100%}
.wa-body{flex:1;padding:18px;background:#ECE5DD url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Ccircle cx='20' cy='20' r='1.2' fill='%23d6cdc4'/%3E%3C/svg%3E");color:#111;overflow-y:auto;min-height:240px}
.wa-msg{position:relative;background:#fff;padding:10px 14px 18px;border-radius:0 12px 12px 12px;max-width:85%;font-size:.92rem;box-shadow:0 1px 1px rgba(0,0,0,.1);animation:pop .4s var(--ease)}
.wa-msg time{position:absolute;right:10px;bottom:4px;font-size:.66rem;color:#999}
.wa-chips{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin-top:14px}
.wa-chips button{padding:8px 12px;border-radius:999px;background:#fff;color:#075E54;font-size:.84rem;font-weight:600;border:1px solid #cfe9e2}
.wa-form{background:#f0f0f0}
.wa-form textarea{background:#fff;color:#111;border-color:#ddd}
.wa-form button{background:#25D366}
.scrim{position:fixed;inset:0;z-index:65;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:opacity .3s}
.scrim.is-on{opacity:1;visibility:visible}

/* ---------- Modal ---------- */
.modal{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);opacity:0;visibility:hidden;transition:all .35s}
.modal.is-open{opacity:1;visibility:visible}
.modal-card{position:relative;display:grid;grid-template-columns:1fr 1.1fr;width:min(900px,100%);max-height:90svh;overflow:auto;border-radius:28px;background:var(--bg2);border:1px solid var(--line);transform:translateY(30px) scale(.96);transition:transform .5s var(--ease)}
.modal.is-open .modal-card{transform:none}
.modal .x{position:absolute;top:14px;right:14px;z-index:2;background:var(--soft);color:var(--ink)}
.modal-img{display:grid;place-items:center;padding:30px;background:radial-gradient(circle,color-mix(in srgb,var(--brand) 35%,transparent),var(--surface) 75%)}
.modal-img img{width:100%;max-width:360px;filter:drop-shadow(0 20px 30px rgba(0,0,0,.4));animation:spinIn .8s var(--ease)}
.modal-img img[src*="uploads"]{border-radius:20px}
@keyframes spinIn{from{transform:rotate(-30deg) scale(.7);opacity:0}}
.modal-body{padding:36px}
.modal-body h3{font-size:2rem;margin-bottom:0}
.modal-body .ar{font-size:1.3rem;text-align:left;margin-bottom:12px}
.modal-body h5{margin:16px 0 4px;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.modal-meta{display:flex;gap:8px;flex-wrap:wrap}
.modal-meta span{padding:6px 12px;border-radius:999px;background:var(--soft);font-size:.82rem}
.modal-body blockquote{padding-left:22px}
.modal-body blockquote:empty{display:none}
.modal-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:22px;flex-wrap:wrap}
.modal-foot .price{font:800 1.9rem/1 var(--head)}

/* ---------- Page hero + menu ---------- */
.page-hero{position:relative;padding:90px 0 60px;text-align:center;overflow:hidden;background:radial-gradient(800px 300px at 50% 0,color-mix(in srgb,var(--brand2) 50%,transparent),transparent)}
.page-hero .pattern{-webkit-mask-image:radial-gradient(ellipse at 50% 30%,#000,transparent 70%);mask-image:radial-gradient(ellipse at 50% 30%,#000,transparent 70%)}
.page-hero h1{font-size:clamp(2.4rem,6vw,4.4rem)}
.page-hero .eyebrow::before{display:none}
.page-hero .lead{margin:auto}
.menu{padding:10px 0 60px}
.filters{position:sticky;top:78px;z-index:20;display:flex;gap:8px;overflow-x:auto;padding:12px 4px;margin-bottom:10px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);scrollbar-width:none}
.filters button{flex-shrink:0;padding:10px 18px;border-radius:999px;border:1px solid var(--line);font-weight:600;font-size:.9rem;transition:all .3s var(--ease)}
.filters button small{font-family:var(--bn);font-weight:400;color:var(--muted);margin-left:4px}
.filters button.is-on{background:var(--brand);border-color:var(--brand);color:#fff}
.filters button.is-on small{color:#fff9}
.menu-search{margin:6px 0 30px}
.menu-search input{width:100%;max-width:420px;padding:13px 18px;border-radius:999px;border:1px solid var(--line);background:var(--surface);outline:0}
.menu-group{padding:30px 0;transition:opacity .4s}
.menu-group.is-hidden{display:none}
.menu-group-h{display:flex;gap:16px;align-items:center;margin-bottom:22px}
.menu-group-h h2{font-size:2rem;margin:0}
.menu-group-h .ar{font-size:1.2rem;margin-left:8px}
.menu-group-h p{margin:0}
.dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.dcard{border-radius:var(--r);background:var(--surface);border:1px solid var(--line);overflow:hidden;cursor:pointer;transition:transform .5s var(--ease),box-shadow .5s,border-color .3s,opacity .4s}
.dcard:hover{transform:translateY(-6px);box-shadow:0 30px 50px -30px rgba(0,0,0,.7);border-color:color-mix(in srgb,var(--brand) 50%,transparent)}
.dcard.is-hidden{display:none}
.dcard-img{position:relative;aspect-ratio:4/3;display:grid;place-items:center;background:radial-gradient(circle at 50% 60%,color-mix(in srgb,var(--brand) 22%,transparent),transparent 70%);overflow:hidden}
.dcard-img img{width:72%;transition:transform .7s var(--ease)}
.dcard-img img[src*="uploads"]{width:100%;height:100%;object-fit:cover}
.dcard:hover .dcard-img img{transform:scale(1.1) rotate(-5deg)}
.badge{position:absolute;top:12px;left:12px;padding:5px 11px;border-radius:999px;background:var(--gold);color:#1b1208;font-size:.72rem;font-weight:800}
.spice{position:absolute;top:10px;right:12px;font-size:.8rem}
.dcard-body{padding:18px}
.dcard-top{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.dcard h3{font-size:1.15rem;margin:0 0 6px}
.dcard .ar{font-size:.9rem;white-space:nowrap}
.dcard p{font-size:.88rem;color:var(--muted);margin-bottom:14px}
.dcard-foot{display:flex;justify-content:space-between;align-items:center}
.dcard .price{font-size:1.15rem}
.more{font-size:.82rem;color:var(--brand);font-weight:700}
.add{padding:8px 14px;border-radius:999px;background:var(--brand);color:#fff;font-weight:700;font-size:.84rem}
.empty{text-align:center;color:var(--muted);padding:40px}

/* ---------- Forms ---------- */
.form-page{display:grid;grid-template-columns:.8fr 1.4fr;gap:30px;padding:20px 0 60px;align-items:start}
.form-aside{padding:30px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);position:sticky;top:100px}
.ticks{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:10px}
.ticks li{padding-left:28px;position:relative;color:var(--muted)}
.ticks li::before{content:"✦";position:absolute;left:0;color:var(--brand)}
.ticks b{color:var(--ink)}
.card-form{padding:34px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);display:grid;gap:16px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.card-form label{display:grid;gap:6px;font-size:.84rem;font-weight:600;color:var(--muted)}
.card-form input,.card-form select,.card-form textarea,.cart-form input,.cart-form textarea{width:100%;padding:13px 15px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--ink);outline:0;transition:border-color .3s,box-shadow .3s}
.card-form input:focus,.card-form select:focus,.card-form textarea:focus{border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 18%,transparent)}
.picks{border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-wrap:wrap;gap:8px}
.picks legend{font-size:.84rem;font-weight:600;color:var(--muted);padding:0 6px}
.pick input{position:absolute;opacity:0}
.pick span{display:inline-block;padding:7px 13px;border-radius:999px;border:1px solid var(--line);font-size:.84rem;cursor:pointer;transition:all .25s;color:var(--ink);font-weight:500}
.pick input:checked + span{background:var(--brand);border-color:var(--brand);color:#fff}
.pick input:focus-visible + span{outline:2px solid var(--gold)}
.flash{padding:14px 18px;border-radius:12px;font-weight:600}
.flash.ok{background:color-mix(in srgb,#38d27a 18%,transparent);color:#38d27a;border:1px solid color-mix(in srgb,#38d27a 40%,transparent)}
.flash.err{background:color-mix(in srgb,#ff5a5a 15%,transparent);color:#ff7b7b}

/* ---------- Story / visit / prose ---------- */
.timeline{max-width:820px;padding:20px 0 60px;position:relative}
.timeline::before{content:"";position:absolute;left:110px;top:20px;bottom:60px;width:1px;background:linear-gradient(var(--brand),var(--gold),transparent)}
.tl-item{display:grid;grid-template-columns:110px 1fr;gap:36px;padding:22px 0;position:relative}
.tl-item::before{content:"";position:absolute;left:104px;top:30px;width:13px;height:13px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 5px color-mix(in srgb,var(--brand) 25%,transparent)}
.tl-when{font:700 .9rem/1.3 var(--body);color:var(--gold);padding-top:24px;text-align:right;padding-right:10px}
.tl-item h3{font-size:1.6rem}
.values{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:20px 0 40px}
.value{padding:26px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line)}
.value span{font-size:2rem}
.value h3{font-size:1.2rem;margin-top:10px}
.value p{color:var(--muted);font-size:.92rem;margin:0}
.visit{padding:10px 0 40px;display:grid;gap:24px}
.visit-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.vc{display:flex;flex-direction:column;gap:4px;text-align:left;padding:22px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);transition:transform .4s var(--ease),border-color .3s}
.vc:hover{transform:translateY(-5px);border-color:var(--brand)}
.vc span{font-size:1.6rem}
.vc p{margin:0;color:var(--muted);font-size:.9rem;overflow-wrap:anywhere}
.vc i{font-style:normal;color:var(--brand);font-weight:700;font-size:.84rem;margin-top:auto;padding-top:8px}
.visit-main{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:start}
.prose-wrap{max-width:780px;padding:10px 0 60px}
.post-hero-img{width:100%;max-height:420px;object-fit:contain;border-radius:var(--r);background:var(--surface);padding:30px;margin-bottom:30px}
.prose{font-size:1.08rem}
.prose h2,.prose h3{margin-top:1.4em}
.prose a{color:var(--brand);text-decoration:underline}
.sm-h{font-size:1.8rem}
.pager{margin-top:30px}
.pagination{display:flex;gap:6px;list-style:none;padding:0;justify-content:center}
.page-link{display:block;padding:8px 14px;border-radius:10px;border:1px solid var(--line)}
.active .page-link{background:var(--brand);color:#fff}

/* ---------- Cart (future) ---------- */
.cart{top:90px;bottom:auto}
.cart-items{padding:14px;overflow:auto;display:grid;gap:10px}
.ci{display:flex;align-items:center;gap:10px;padding:10px;border-radius:12px;background:var(--surface)}
.ci b{flex:1;font-size:.9rem}
.ci button{width:28px;height:28px;border-radius:8px;background:var(--soft)}
.cart-form{padding:14px;display:grid;gap:8px;border-top:1px solid var(--line)}
.seg{display:flex;gap:8px}
.seg label{flex:1;padding:8px;border-radius:10px;border:1px solid var(--line);text-align:center;font-size:.86rem}
.cart-total{display:flex;justify-content:space-between;font-weight:800;font-size:1.1rem}
.cart-msg{font-size:.86rem;color:var(--gold);margin:0}

/* ---------- Seasonal decorations ---------- */
.deco{position:fixed;inset:0;pointer-events:none;z-index:3;overflow:hidden}
.deco-lanterns .deco,.deco-stars .deco,.deco-sun .deco{position:absolute;bottom:auto;height:100vh;z-index:2}
.ember{position:absolute;bottom:-10px;width:5px;height:5px;border-radius:50%;background:var(--brand);box-shadow:0 0 10px 2px var(--brand);opacity:0;animation:emb var(--t) linear infinite;animation-delay:var(--d)}
@keyframes emb{0%{transform:translate(0,0);opacity:0}10%{opacity:.7}100%{transform:translate(40px,-100vh);opacity:0}}
.flake{position:absolute;top:-10px;width:var(--s);height:var(--s);border-radius:50%;background:#fff;opacity:.75;animation:snow var(--t) linear infinite;animation-delay:var(--d)}
@keyframes snow{to{transform:translate(60px,105vh)}}
.drop{position:absolute;top:-60px;width:1.5px;height:50px;background:linear-gradient(transparent,color-mix(in srgb,var(--ink) 50%,transparent));animation:rain var(--t) linear infinite;animation-delay:var(--d)}
@keyframes rain{to{transform:translate(-30px,110vh)}}
.star{position:absolute;width:3px;height:3px;background:var(--gold);border-radius:50%;box-shadow:0 0 6px var(--gold);animation:tw 3s ease-in-out infinite;animation-delay:var(--d)}
@keyframes tw{50%{opacity:.15;transform:scale(.5)}}
.lantern{position:absolute;top:0;width:34px;transform-origin:50% 0;animation:sway 4s ease-in-out infinite;animation-delay:var(--d)}
.lantern svg{width:34px;height:auto;margin-top:var(--h);filter:drop-shadow(0 0 14px var(--gold))}
.lantern::before{content:"";position:absolute;left:50%;top:0;width:1px;height:var(--h);background:var(--gold);opacity:.6}
@keyframes sway{50%{transform:rotate(5deg)}}
.moon{position:absolute;top:110px;right:6%;width:70px;height:70px;border-radius:50%;box-shadow:-14px 8px 0 0 var(--gold);transform:rotate(-20deg);opacity:.85;filter:drop-shadow(0 0 18px var(--gold))}
.sun{position:absolute;top:-140px;right:-140px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--gold) 55%,transparent),transparent 65%);animation:breathe 5s ease-in-out infinite}
.alpona{position:absolute;top:0;bottom:0;width:22px;opacity:.35;background-size:22px auto!important;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='60' viewBox='0 0 46 60'%3E%3Cg fill='none' stroke='%23d7261e' stroke-width='2'%3E%3Cpath d='M23 4c8 8 8 18 0 26-8-8-8-18 0-26Z'/%3E%3Ccircle cx='23' cy='44' r='6'/%3E%3Cpath d='M8 44h8M30 44h8'/%3E%3C/g%3E%3C/svg%3E") repeat-y}
.alpona-l{left:0}.alpona-r{right:0;transform:scaleX(-1)}

/* Light theme (Boishakh) tweaks */
.is-light .member-back,.is-light .story-band{color:#fff}
.is-light .hero-bg{background:radial-gradient(1000px 600px at 75% 45%,color-mix(in srgb,var(--brand) 18%,transparent),transparent 65%),linear-gradient(180deg,var(--bg),var(--bg2))}
.is-light .slide img,.is-light .feature-media img{filter:drop-shadow(0 30px 30px rgba(120,30,10,.25))}

/* ---------- Responsive ---------- */
@media (max-width:1180px){
  .nav-links a{padding:8px 9px;font-size:.86rem}
  .cats{grid-template-columns:repeat(4,1fr);row-gap:30px}
  .team-grid{grid-template-columns:repeat(3,1fr)}
  .member.is-featured{grid-column:span 3;grid-row:auto;min-height:460px}
  .visit-cards{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:1020px){
  .nav-links{display:none}
  .burger{display:flex}
  .nav-cta{margin-left:auto}
  .hero{padding-top:110px}
  .hero-in,.story-band-in,.voices-in,.feature,.visit-main,.form-page{grid-template-columns:1fr}
  .hero-stage{max-width:520px;margin:10px auto 30px}
  .hero-in{display:flex;flex-direction:column-reverse}
  .feature{gap:20px}
  .feature.flip .feature-media{order:0}
  .foot-grid{grid-template-columns:1fr 1fr}
  .post-grid{grid-template-columns:1fr 1fr}
  .values{grid-template-columns:1fr 1fr}
  .form-aside{position:static}
  .modal-card{grid-template-columns:1fr}
  .modal-img{padding:20px}
  .modal-img img{max-width:240px}
}
@media (max-width:680px){
  body{font-size:15px}
  .page-home .hero{margin-top:-66px}
  .nav-in{height:66px}
  .nav-cta .btn{display:none}
  .logo-mark{width:40px;height:40px}
  .logo-txt b{font-size:1rem}
  .hero h1{font-size:2.4rem}
  .hero-facts{gap:18px}
  .hero-facts b{font-size:1.9rem}
  .hero-stage{max-width:340px;margin:0 auto 40px}
  .hero{padding-top:84px}
  .slide figcaption{min-width:0;left:4%;bottom:14%;padding:10px 14px}
  .slide figcaption b{font-size:1rem}
  .stage-nav{width:100%;bottom:-20px}
  .stage-nav button{font-size:.72rem;padding:5px 9px}
  .cats{grid-template-columns:repeat(4,1fr);gap:10px}
  .cat-img{width:74px;height:74px}
  .cat b{font-size:.78rem}
  .feature-num{font-size:4.5rem}
  .team-grid{grid-template-columns:1fr 1fr}
  .member{min-height:300px}
  .member.is-featured{grid-column:span 2;min-height:400px}
  .deck{height:420px}
  .vcard{inset:0 14px 26px 0;padding:24px}
  .duo,.post-grid,.foot-grid,.grid2,.values,.visit-cards{grid-template-columns:1fr}
  .duo-card div{max-width:70%}
  .stats b{font-size:2.2rem}
  .cta-band-in{padding:28px}
  .timeline::before{left:12px}
  .tl-item{grid-template-columns:1fr;gap:4px;padding-left:40px}
  .tl-item::before{left:6px}
  .tl-when{text-align:left;padding:0}
  .sec-head.row{flex-direction:column;align-items:start}
  .chef-btn{width:64px;height:64px}
  .chef{right:14px;bottom:16px}
  .panel{right:12px;bottom:92px}
  .card-form,.form-aside{padding:22px}
  .filters{top:66px}
  .lantern:nth-child(2),.lantern:nth-child(3){display:none}
  .lantern{transform:scale(.75)}
  .moon{width:44px;height:44px;top:80px;right:4%;box-shadow:-9px 5px 0 0 var(--gold)}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .deco{display:none}
  .reveal,.in{opacity:1;transform:none}
}
.d-sm-none{display:none!important}.d-none.d-sm-flex{display:flex!important;justify-content:center}.pager p.text-muted,.pager .small.text-muted{display:none}

/* =========================================================
   v2 — real photos, logo, 3D dish animation, torn band, 3D map
   ========================================================= */
.logo-img{width:52px;height:52px;border-radius:50%;object-fit:contain;filter:drop-shadow(0 6px 14px rgba(0,0,0,.35));transition:transform .8s var(--ease)}
.brand:hover .logo-img{transform:rotate(-12deg) scale(1.06)}
.foot-brand .logo-img{width:64px;height:64px}

/* photo cut-outs: keep proportions inside square stages */
.slide img{width:auto;height:80%;max-width:88%;object-fit:contain}
.feature-media img{width:auto;height:80%;max-width:86%;object-fit:contain}
.dcard-img img{width:auto;height:84%;max-width:84%;object-fit:contain}
.cat-img img{width:86%;height:86%;object-fit:contain}
.post-img img{width:auto;height:84%;object-fit:contain}
.modal-img img{max-height:380px;width:auto;max-width:100%;object-fit:contain}
.duo-card img{width:220px;height:260px;object-fit:contain;right:-20px;bottom:-30px}

/* ---- 3D tilt (follows the pointer) ---- */
[data-tilt]{--rx:0deg;--ry:0deg;--gx:50%;--gy:30%;transform-style:preserve-3d;transform:perspective(900px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .6s var(--ease)}
[data-tilt].is-tilting{transition:transform .1s linear}
.feature-media[data-tilt] img{transform:translateZ(70px)}
.feature-media .plate-ring{transform:translateZ(10px)}
.feature-num{transform:translateZ(30px)}
.feature-badge{transform:translateZ(90px) rotate(8deg)}
.feature-shadow{position:absolute;left:22%;right:22%;bottom:9%;height:9%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.55),transparent);filter:blur(4px);animation:shadow3d 4.5s ease-in-out infinite}
@keyframes shadow3d{50%{scale:.78;opacity:.55}}
/* idle levitation — uses individual transform props so it stacks with tilt/slide transforms */
.float3d{animation:float3d 4.5s ease-in-out infinite}
@keyframes float3d{0%,100%{translate:0 0;rotate:z 0deg}50%{translate:0 -16px;rotate:z -3deg}}
.feature:nth-child(even) .float3d{animation-delay:-1.6s}

/* hero: dishes spin in from the right in 3D, then levitate */
.hero-stage{transform-style:preserve-3d}
.slide{transform-style:preserve-3d;perspective:1000px}
.slide img{transform:translateX(75%) rotateY(-80deg) rotateZ(14deg) scale(.6)!important;opacity:0;transition:transform 1.2s var(--ease),opacity .8s}
.slide.is-on img{transform:translateZ(60px) rotateY(0) scale(1)!important;opacity:1;animation:float3d 4s ease-in-out .9s infinite}
.slide.is-out img{transform:translateX(-70%) rotateY(70deg) rotateZ(-12deg) scale(.6)!important;opacity:0;animation:none}
.slide figcaption{bottom:10%;left:-2%;transform:translateZ(95px) translateX(80px)}
.slide.is-on figcaption{transform:translateZ(95px)}
.stage-nav{bottom:-34px}
.slide-word{transform:translateZ(-60px) translateX(30%)}
.slide.is-on .slide-word{transform:translateZ(-60px)}

/* menu cards: image pops out of the card + glare */
.dcard-img{perspective:800px}
.dcard-img img{transition:transform .7s var(--ease),filter .7s;filter:drop-shadow(0 14px 14px rgba(0,0,0,.35))}
.dcard:hover .dcard-img img{transform:translateZ(60px) scale(1.1) rotate(-4deg)!important;filter:drop-shadow(0 28px 24px rgba(0,0,0,.5))}
.dcard-img::after,.storefront::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--gx) var(--gy),rgba(255,255,255,.22),transparent 45%);opacity:0;transition:opacity .4s}
.dcard:hover .dcard-img::after,.storefront:hover::after{opacity:1}
.dcard-img img[src*="uploads"]{height:100%;max-width:none}
.cat:hover .cat-img img{transform:rotate(-10deg) scale(1.16) translateY(-6px)}

/* ---- orange service band with torn edges (idea from the reference) ---- */
.band{position:relative;background:var(--brand);color:#fff;margin:70px 0 30px;padding:60px 0}
.torn{position:absolute;left:0;right:0;height:34px;background:var(--brand);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 34' preserveAspectRatio='none'%3E%3Cpath d='M0 34V18L11 13L20 16L35 8L44 6L52 16L68 13L88 5L99 20L115 15L127 9L148 7L160 10L182 4L203 24L223 12L243 12L254 9L266 13L284 15L293 23L306 16L322 11L332 11L347 12L356 21L377 13L385 13L402 13L423 20L434 17L448 23L460 17L475 9L486 13L498 5L507 5L522 24L534 20L550 24L565 14L575 10L600 18V34Z'/%3E%3C/svg%3E") 0 0/600px 100% repeat-x;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 34' preserveAspectRatio='none'%3E%3Cpath d='M0 34V18L11 13L20 16L35 8L44 6L52 16L68 13L88 5L99 20L115 15L127 9L148 7L160 10L182 4L203 24L223 12L243 12L254 9L266 13L284 15L293 23L306 16L322 11L332 11L347 12L356 21L377 13L385 13L402 13L423 20L434 17L448 23L460 17L475 9L486 13L498 5L507 5L522 24L534 20L550 24L565 14L575 10L600 18V34Z'/%3E%3C/svg%3E") 0 0/600px 100% repeat-x}
.torn.top{top:-33px}.torn.bottom{bottom:-33px;transform:scaleY(-1)}
.band-in{position:relative;display:grid;grid-template-columns:repeat(3,1fr) .8fr;gap:30px;align-items:center}
.band-item{text-align:center}
.band-ic{display:inline-grid;place-items:center;width:74px;height:74px;border-radius:50%;border:2px solid rgba(255,255,255,.85);margin-bottom:14px;transition:transform .6s var(--ease),background .4s}
.band-ic svg{width:34px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.band-item:hover .band-ic{transform:rotateY(180deg);background:rgba(0,0,0,.15)}
.band h3{font-family:var(--body);font-size:1.15rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.band p{margin:0;opacity:.92;font-size:.92rem}
.band small{opacity:.8}
.band-fries{width:100%;max-width:250px;margin:-120px auto -100px;filter:drop-shadow(0 30px 30px rgba(0,0,0,.45))}

/* ---- storefront photo ---- */
.story-media{display:grid;gap:16px}
.storefront{position:relative;margin:0;border-radius:24px;overflow:hidden;box-shadow:0 40px 60px -30px rgba(0,0,0,.7);border:1px solid rgba(255,255,255,.15)}
.storefront img{width:100%;aspect-ratio:16/10;object-fit:cover;transform:translateZ(30px) scale(1.04)}
.storefront figcaption{position:absolute;left:14px;bottom:14px;padding:8px 14px;border-radius:999px;background:rgba(0,0,0,.6);backdrop-filter:blur(6px);color:#fff;font-size:.82rem;font-weight:600}
.story-media .stats li{padding:18px}
.story-media .stats b{font-size:2.3rem}
.story-photo{padding:10px 0 20px}
.storefront.wide img{aspect-ratio:21/9}

/* ---- 3D map ---- */
.map3d{position:relative}
.map3d-stage{position:relative;perspective:1100px;perspective-origin:50% 0}
.map3d-plane{--mx:42deg;--mz:-10deg;--ms:.86;position:relative;transform-style:preserve-3d;transform:rotateX(var(--mx)) rotateZ(var(--mz)) scale(var(--ms));transform-origin:50% 70%;transition:transform 1.1s var(--ease);border-radius:var(--r)}
.map3d-plane .map-box{box-shadow:0 50px 60px -20px rgba(0,0,0,.75),0 0 0 6px color-mix(in srgb,var(--surface) 80%,var(--brand) 20%);cursor:pointer}
.map3d-plane .map-box iframe{pointer-events:none}
.map3d-shade{position:absolute;inset:0;border-radius:var(--r);pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.45),transparent 45%);transition:opacity .8s}
.map3d:not(.is-flat):hover .map3d-plane{--mx:34deg;--mz:-6deg;--ms:.9}
.map3d.is-flat .map3d-plane{--mx:0deg;--mz:0deg;--ms:1}
.map3d.is-flat .map-box iframe{pointer-events:auto}
.map3d.is-flat .map3d-shade,.map3d.is-flat .pin3d{opacity:0}
.grid3d{position:absolute;inset:0;background:linear-gradient(var(--line) 1px,transparent 1px) 0 0/28px 28px,linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/28px 28px}
.pin3d{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d;transform:translateZ(2px);transition:opacity .5s;pointer-events:none}
.pin3d-bb{position:absolute;left:0;top:0;width:0;height:0;transform-style:preserve-3d;transform-origin:0 0;transform:rotateZ(calc(-1 * var(--mz))) rotateX(calc(-1 * var(--mx)));transition:transform 1.1s var(--ease)}
.pin3d-head{position:absolute;left:-17px;top:-52px;width:34px;height:34px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:linear-gradient(135deg,var(--brand),var(--brand2));box-shadow:inset -4px -4px 8px rgba(0,0,0,.3),0 0 0 3px #fff;animation:pinbounce 1.8s ease-in-out infinite}
.pin3d-head::after{content:"";position:absolute;inset:10px;border-radius:50%;background:#fff}
.pin3d-label{position:absolute;left:0;top:-104px;width:max-content;transform:translateX(-50%);display:flex;align-items:center;gap:6px;white-space:nowrap;padding:5px 12px 5px 5px;border-radius:999px;background:var(--ink);color:var(--bg);font-weight:800;font-size:.8rem;box-shadow:0 10px 20px -6px rgba(0,0,0,.5);animation:pinbounce 1.8s ease-in-out infinite}
.pin3d-label img{border-radius:50%}
.pin3d-shadow{position:absolute;left:-12px;top:-6px;width:24px;height:12px;border-radius:50%;background:rgba(0,0,0,.5);filter:blur(2px);animation:pinshadow 1.8s ease-in-out infinite}
.pin3d-ring{position:absolute;left:-40px;top:-20px;width:80px;height:40px;border-radius:50%;border:3px solid var(--brand);opacity:0;animation:pinring 2.4s ease-out infinite}
.pin3d-ring.r2{animation-delay:1.2s}
@keyframes pinbounce{50%{translate:0 -12px}}
@keyframes pinshadow{50%{scale:.6;opacity:.5}}
@keyframes pinring{0%{transform:scale(.3);opacity:.9}100%{transform:scale(1.6);opacity:0}}
.map3d-ctrl{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px;position:relative;z-index:2}
.map3d-ctrl button,.map3d-ctrl a{padding:7px 11px;border-radius:999px;border:1px solid var(--line);background:var(--soft);font-size:.8rem;font-weight:700;transition:all .3s}
.map3d-ctrl button.is-on{background:var(--brand);border-color:var(--brand);color:#fff}
.map3d-ctrl .go{margin-left:auto;color:var(--brand)}
.map3d.big .map-box{aspect-ratio:16/11}

@media (max-width:1020px){
  .band-in{grid-template-columns:1fr 1fr 1fr}
  .band-fries{display:none}
}
@media (max-width:680px){
  .band-in{grid-template-columns:1fr;gap:34px}
  .logo-img{width:44px;height:44px}
  .map3d-plane{--mx:36deg;--mz:0deg;--ms:.92}
}
@media (hover:none){ .dcard .dcard-img img{animation:float3d 5s ease-in-out infinite} }
.map-box.is-sat iframe,.is-dark .map-box.is-sat iframe{filter:none}

/* =========== v3: sticky header everywhere, shop photo, Google-style 3D map =========== */
.nav{position:sticky;position:-webkit-sticky;top:0}
.season-bar + .nav{top:0}
@media (max-width:1020px){
  .nav,.page-home .nav:not(.is-solid){background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
  .page-home .hero{margin-top:0}
  .drawer{z-index:58}
}
@media (max-width:680px){
  .nav-in{height:64px;gap:10px}
  .logo-img{width:42px;height:42px}
  .logo-txt b{font-size:.95rem;letter-spacing:.08em}
  .logo-txt i{font-size:.85rem}
  .page-home .hero{padding-top:24px}
  .filters{top:64px}
  .season-bar{font-size:.74rem;padding:6px 10px}
  .season-bar .bn{display:none}
}

.storefront img{aspect-ratio:auto;height:auto}
.storefront.wide img{aspect-ratio:auto;max-height:520px;object-fit:cover;object-position:50% 40%}
.sf-glow{position:absolute;left:20%;right:20%;top:0;height:18%;background:radial-gradient(ellipse at 50% 20%,rgba(255,200,90,.55),transparent 70%);mix-blend-mode:screen;animation:sfglow 3.5s ease-in-out infinite;pointer-events:none}
@keyframes sfglow{50%{opacity:.45}}
.sf-hot{position:absolute;transform:translate(-50%,-50%) translateZ(40px);display:flex;align-items:center;gap:8px;pointer-events:none}
.sf-hot i{position:relative;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(238,90,31,.85)}
.sf-hot i::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid #fff;animation:ring 1.8s infinite}
.sf-hot b{padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.94);color:#1b1513;font-size:.76rem;white-space:nowrap;box-shadow:0 8px 18px -8px rgba(0,0,0,.6)}
.sf-hot.alt b{background:rgba(23,17,15,.85);color:#fff}
.sf-open{position:absolute;top:14px;right:14px;display:flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;background:rgba(0,0,0,.65);backdrop-filter:blur(6px);color:#fff;font-size:.8rem;font-weight:700}
.sf-open i,.g-open::before{width:9px;height:9px;border-radius:50%;background:#38d27a;box-shadow:0 0 0 0 #38d27a;animation:ping 2s infinite;display:inline-block}
.is-closed i,.g-open.is-closed::before{background:#ff5a5a;box-shadow:none;animation:none}
.visit .storefront{margin-bottom:6px}
@media (max-width:680px){.sf-hot b{font-size:.66rem;padding:4px 8px}.sf-hot.alt{display:none}.sf-open{font-size:.7rem;top:10px;right:10px}}

/* Google-Maps-like look */
.map-ph.gmap{display:block;background:#eef0e9}
.map-ph.gmap svg{position:absolute;inset:0;width:100%;height:100%}
.map3d-plane .map-box{box-shadow:0 50px 60px -20px rgba(0,0,0,.75),0 0 0 6px #fff}
.map3d-shade{background:linear-gradient(180deg,rgba(0,0,0,.28),transparent 40%)}
.gcard{position:absolute;left:10px;top:10px;right:56px;max-width:300px;display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;background:#fff;color:#202124;box-shadow:0 2px 6px rgba(60,64,67,.3);font-family:Roboto,Arial,sans-serif;transform:translateZ(6px);z-index:2}
.gcard img{border-radius:50%;flex-shrink:0}
.gcard div{flex:1;min-width:0;line-height:1.25}
.gcard b{display:block;font-size:.86rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gcard small{display:block;font-size:.72rem;color:#5f6368}
.g-open{display:flex!important;align-items:center;gap:6px;color:#188038!important;font-weight:600}
.g-open.is-closed{color:#d93025!important}
.g-dir{width:36px;height:36px;border-radius:50%;background:#1a73e8;display:grid;place-items:center;flex-shrink:0;pointer-events:auto}
.g-dir svg{width:20px;fill:#fff}
.gzoom{position:absolute;right:10px;bottom:10px;display:grid;background:#fff;border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,.3);transform:translateZ(6px);z-index:2}
.gzoom span{width:34px;height:32px;display:grid;place-items:center;color:#666;font:500 1.2rem/1 Arial}
.gzoom span+span{border-top:1px solid #e6e6e6}
.garea{position:absolute;left:50%;bottom:16%;transform:translateX(-50%) translateZ(4px);font:800 1.05rem/1 Arial,sans-serif;letter-spacing:.3em;color:#5f6368;text-shadow:0 0 4px #fff,0 0 8px #fff;pointer-events:none;z-index:2}
.map3d.is-flat .gcard,.map3d.is-flat .gzoom,.map3d.is-flat .garea{opacity:0;pointer-events:none}
.gcard,.gzoom,.garea{transition:opacity .5s}
.storefront img{transform:none;object-position:50% 20%}
.pin3d-label{display:none}
@media (max-width:680px){.slide figcaption{left:3%;bottom:14%}}
.gcard{top:auto;bottom:10px}
.gzoom{bottom:auto;top:10px}
.garea{bottom:auto;top:14%}

/* ---- 100% Halal seal ---- */
.halal{display:inline-block;width:110px;height:110px;filter:drop-shadow(0 10px 18px rgba(0,0,0,.4))}
.halal svg{width:100%;height:100%;display:block}
.halal-ring{transform-origin:60px 60px;animation:spin 18s linear infinite}
.halal-hero{position:absolute;left:2%;top:6%;z-index:3;transform:translateZ(120px) rotate(-10deg);animation:float3d 5s ease-in-out infinite}
.halal-pill{margin-left:6px;padding:4px 10px;border-radius:999px;background:#0f6b4f;color:#fff;letter-spacing:.08em;font-size:.68rem}
.halal-nav{display:flex;align-items:center;gap:6px;padding:4px 12px 4px 4px;border-radius:999px;background:color-mix(in srgb,#0f6b4f 85%,transparent);color:#fff;font-size:.8rem;white-space:nowrap}
.halal-nav .halal{width:34px;height:34px;filter:none}
.halal-foot{display:flex;align-items:center;gap:12px;margin:0 0 18px}
.halal-foot .halal{width:70px;height:70px}
.halal-foot b{display:block}
.halal-foot small{color:var(--muted)}
.band-in{grid-template-columns:repeat(4,1fr) .7fr}
.values{grid-template-columns:repeat(5,1fr)}
@media (max-width:1180px){.halal-nav b{display:none}.halal-nav{padding:3px}.values{grid-template-columns:repeat(3,1fr)}}
@media (max-width:1020px){.band-in{grid-template-columns:1fr 1fr}}
@media (max-width:680px){.halal-hero{width:76px;height:76px;left:0;top:2%}.halal-nav .halal{width:30px;height:30px}.band-in{grid-template-columns:1fr 1fr;gap:26px 14px}.band p{font-size:.8rem}.values{grid-template-columns:1fr}}
@media (max-width:680px){.halal-pill{display:none}}