:root{--ink:#17130f;--cream:#efe4d3;--cream2:#f8f2e9;--coffee:#4a2515;--amber:#b86a22;--red:#a93427;--green:#31483d;--line:rgba(23,19,15,.15);--ease:cubic-bezier(.22,.7,.2,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--cream2)}body{margin:0;color:var(--ink);background:var(--cream2);font-family:"IBM Plex Sans Arabic",system-ui,sans-serif;overflow-x:hidden}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button{font:inherit}.noise{position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.025;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E")}.cursor-glow{position:fixed;width:34rem;height:34rem;border-radius:50%;background:radial-gradient(circle,rgba(255,189,108,.16),transparent 66%);translate:-50% -50%;pointer-events:none;z-index:0;transition:opacity .3s}
.site-header{position:fixed;z-index:100;top:0;left:0;right:0;padding:20px clamp(20px,4vw,64px);display:flex;align-items:center;justify-content:space-between;mix-blend-mode:multiply;transition:background .4s,backdrop-filter .4s,padding .4s}.site-header.scrolled{background:rgba(248,242,233,.72);backdrop-filter:blur(14px);padding-top:13px;padding-bottom:13px}.brand{display:flex;gap:12px;align-items:baseline;direction:rtl}.brand-ar{font-size:25px;font-weight:700}.brand-en{font:600 10px/1 "Manrope",sans-serif;letter-spacing:.18em}.nav{display:flex;gap:26px;align-items:center;font-size:13px}.nav a{opacity:.7;transition:.25s}.nav a:hover{opacity:1}.nav-cta{border:1px solid currentColor;border-radius:999px;padding:9px 14px}.menu-toggle{display:none;background:none;border:0}.menu-toggle span{display:block;width:24px;height:1px;background:var(--ink);margin:6px}
.frame-story{height:520vh;background:#dfe2e1;position:relative}.frame-sticky{height:100vh;position:sticky;top:0;overflow:hidden;perspective:1200px}#frameCanvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;background:#dfe2e1}.hero-vignette{position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,rgba(18,12,7,.06),transparent 28%,transparent 72%,rgba(18,12,7,.05));pointer-events:none}.hero-grid{position:absolute;inset:0;z-index:2;background-image:linear-gradient(rgba(20,15,10,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(20,15,10,.055) 1px,transparent 1px);background-size:9vw 9vw;mask-image:linear-gradient(to bottom,transparent,black 28%,black 72%,transparent);opacity:.24}.hero-copy{position:absolute;z-index:4;top:50%;right:clamp(24px,7vw,110px);width:min(560px,42vw);transform:translateY(-42%) translateY(35px);opacity:0;pointer-events:none;transition:opacity .42s var(--ease),transform .62s var(--ease)}.hero-copy--alt{right:auto;left:clamp(24px,7vw,110px);text-align:left;direction:rtl}.hero-copy.is-active{opacity:1;transform:translateY(-50%) translateY(0);pointer-events:auto}.eyebrow,.section-no{font:600 11px/1.4 "Manrope",sans-serif;letter-spacing:.18em;text-transform:uppercase}.hero-copy h1,.hero-copy h2{font-size:clamp(50px,7.2vw,116px);line-height:.9;margin:20px 0 26px;font-weight:500;letter-spacing:-.05em}.hero-copy h2{font-size:clamp(46px,6.3vw,92px)}.hero-copy em{font-style:normal;color:var(--coffee)}.hero-copy p{max-width:390px;font-size:clamp(15px,1.5vw,20px);line-height:1.8}.hero-note{font-size:12px!important;opacity:.55}.text-link{display:inline-flex;align-items:center;gap:14px;border-bottom:1px solid;padding-bottom:8px;margin-top:8px}.frame-counter{position:absolute;z-index:5;left:clamp(24px,4vw,64px);bottom:28px;direction:ltr;display:flex;align-items:center;gap:10px;font:500 10px "Manrope";letter-spacing:.16em}.frame-counter i{width:42px;height:1px;background:currentColor;opacity:.4}.scroll-rail{position:absolute;z-index:5;right:clamp(12px,2vw,32px);top:25%;height:50%;width:2px;background:rgba(0,0,0,.12);overflow:hidden}.scroll-rail span{display:block;width:100%;height:100%;background:var(--ink);transform:scaleY(0);transform-origin:top}
.story-panel{min-height:110vh;padding:10vh clamp(24px,6vw,100px);display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:5vw;background:#20120b;color:#f7ecdd;position:relative;overflow:hidden}.story-media{position:relative;z-index:2;max-width:760px;transform:perspective(900px) rotateY(7deg) rotateX(2deg)}.story-media img{width:100%;filter:drop-shadow(0 40px 70px rgba(0,0,0,.32))}.story-copy{position:relative;z-index:3}.story-copy h2,.mosaic-copy h2,.dessert-copy h2,.place-intro h2,.ramadan-copy h2,.visit-card h2{font-size:clamp(48px,6vw,94px);line-height:.98;margin:18px 0 26px;font-weight:500;letter-spacing:-.045em}.story-copy p,.mosaic-copy p,.dessert-copy p,.place-intro p,.ramadan-copy p{font-size:clamp(16px,1.4vw,20px);line-height:1.9;max-width:520px;opacity:.78}.pill{display:inline-block;border:1px solid rgba(255,255,255,.45);padding:12px 18px;border-radius:999px;margin-top:18px}.orbit{position:absolute;border:1px solid rgba(255,255,255,.08);border-radius:50%;pointer-events:none}.orbit-a{width:46vw;height:46vw;right:-15vw;bottom:-18vw}.orbit-b{width:28vw;height:28vw;right:-5vw;bottom:-10vw}
.kinetic-strip{overflow:hidden;background:#d59045;color:#23150e;border-block:1px solid rgba(0,0,0,.14)}.marquee{display:flex;width:max-content;animation:marquee 26s linear infinite}.marquee span{font:600 clamp(38px,6vw,88px)/1 "IBM Plex Sans Arabic";padding:22px 0;white-space:nowrap}@keyframes marquee{to{transform:translateX(50%)}}
.mosaic-scene{min-height:115vh;display:grid;grid-template-columns:1.18fr .82fr;gap:2vw;align-items:center;padding:8vh clamp(20px,5vw,80px);background:#f5ead9;position:relative;overflow:hidden}.mosaic-backdrop{position:relative;z-index:1}.mosaic-backdrop img{width:100%;max-width:900px;filter:drop-shadow(0 40px 55px rgba(57,28,11,.22));transform:rotate(-3deg)}.mosaic-copy{position:relative;z-index:2}.mosaic-copy h2 em{font-style:normal;color:var(--amber)}.floating-bean{position:absolute;border-radius:50% 45% 50% 45%;background:linear-gradient(145deg,#8f4b23,#2d160c);box-shadow:inset -4px -7px 8px rgba(0,0,0,.25),0 18px 30px rgba(46,22,9,.2)}.bean-1{width:48px;height:34px;right:9%;top:13%;transform:rotate(35deg)}.bean-2{width:30px;height:21px;right:44%;bottom:10%;transform:rotate(-20deg)}
.split-products{display:grid;grid-template-columns:1fr 1fr;background:#0f1a16;color:#f6ebda;min-height:115vh}.product-card{padding:7vh 5vw 6vh;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;border-left:1px solid rgba(255,255,255,.1)}.product-card--matcha{background:#31483d}.product-card--coffee{background:#2e170e}.product-image{width:min(100%,650px);margin:auto;transition:transform .5s var(--ease);transform-style:preserve-3d}.product-image img{filter:drop-shadow(0 35px 50px rgba(0,0,0,.28))}.product-meta{margin-top:30px}.product-meta span{font:600 10px "Manrope";letter-spacing:.18em;opacity:.55}.product-meta h3{font-size:clamp(30px,3vw,48px);margin:12px 0 8px;font-weight:500}.product-meta p{opacity:.67;line-height:1.8;max-width:430px}
.pour-transition{height:100vh;background:#e7d0b1;position:relative;overflow:hidden;display:grid;place-items:center}.pour-visual{position:relative;z-index:2;width:min(74vw,920px);transform:rotate(8deg)}.pour-visual img{filter:drop-shadow(0 40px 65px rgba(73,33,13,.24))}.pour-words{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-around;direction:ltr;color:rgba(46,23,14,.08);font:700 clamp(90px,18vw,260px)/.75 "Manrope";letter-spacing:-.08em;white-space:nowrap}.pour-words span:nth-child(2){text-align:right}
.dessert-scene{min-height:105vh;padding:8vh clamp(24px,7vw,110px);display:grid;grid-template-columns:.8fr 1.2fr;gap:6vw;align-items:center;background:#fffaf2}.dessert-visual img{filter:drop-shadow(0 35px 60px rgba(63,36,18,.15))}.dessert-copy h2{color:#6d3d1f}
.editorial-poster{min-height:105vh;background:#c74b3c;padding:8vh clamp(24px,6vw,90px);display:grid;grid-template-columns:1fr .8fr;align-items:center;gap:7vw;color:#fff7ed;overflow:hidden}.poster-card{max-width:680px;transform:rotate(-2deg);box-shadow:0 35px 90px rgba(66,18,12,.24)}.poster-copy .big-quote{font-size:clamp(48px,6vw,92px);line-height:1.02;margin:0 0 26px;font-weight:500;letter-spacing:-.04em}.poster-copy>p:last-child{max-width:500px;line-height:1.9;opacity:.75}
.place-section{padding:11vh clamp(20px,5vw,84px);background:#eae4d8}.place-intro{display:grid;grid-template-columns:1fr 1.3fr .8fr;align-items:end;gap:30px;margin-bottom:7vh}.place-intro .section-no{align-self:start}.place-intro h2{margin:0}.place-intro p{font-size:16px}.place-intro em{font-style:normal;color:#66816e}.place-grid{display:grid;grid-template-columns:1.2fr .9fr .9fr;gap:18px;align-items:stretch}.place-shot{margin:0;overflow:hidden;border-radius:2px;min-height:520px}.place-shot img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}.place-shot:hover img{transform:scale(1.045)}.place-shot--tall{min-height:680px;grid-row:span 2}
.ramadan-scene{min-height:100vh;background:#18231e;color:#f7ead7;display:grid;grid-template-columns:1fr 1fr;gap:5vw;align-items:center;padding:8vh clamp(20px,6vw,96px)}.ramadan-image{max-width:620px;margin:auto;transform:rotate(2deg);box-shadow:0 35px 80px rgba(0,0,0,.24)}.ramadan-copy>span{font:600 10px "Manrope";letter-spacing:.18em;opacity:.5}
.gallery-break{position:relative;background:#130d09;overflow:hidden}.gallery-break img{width:100%;height:min(88vh,900px);object-fit:cover;display:block;filter:saturate(.88) contrast(1.03)}.gallery-overlay{position:absolute;inset:auto 5vw 5vh;display:flex;align-items:center;gap:18px;color:white;font:600 11px "Manrope";letter-spacing:.18em}.gallery-overlay i{height:1px;width:120px;background:white;opacity:.45}
.visit-section{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;background:#efe1cc}.visit-visual{overflow:hidden}.visit-visual img{width:100%;height:100%;object-fit:cover}.visit-card{padding:10vh 7vw;display:flex;flex-direction:column;justify-content:center}.visit-card h2{font-size:clamp(62px,8vw,120px);margin:18px 0 45px}.visit-data{border-top:1px solid var(--line)}.visit-data>div{display:grid;grid-template-columns:130px 1fr;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}.visit-data span{opacity:.5;font-size:12px}.visit-data strong{font-weight:500}.visit-actions{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}.primary-btn,.secondary-btn{padding:14px 18px;border-radius:999px;border:1px solid var(--ink);font-size:14px}.primary-btn{background:var(--ink);color:var(--cream2)}.visit-card small{opacity:.45;margin-top:20px;line-height:1.6}
footer{min-height:42vh;background:#15110e;color:#f4e6d3;padding:60px clamp(22px,6vw,90px);display:grid;grid-template-columns:1fr 1fr auto;align-items:end;gap:30px}.footer-brand{display:flex;flex-direction:column}.footer-brand span{font-size:clamp(70px,12vw,170px);line-height:.8;font-weight:600}.footer-brand small{font:600 10px "Manrope";letter-spacing:.22em;margin-top:20px;opacity:.45}footer p{opacity:.45;max-width:300px;line-height:1.7;font-size:12px}footer>a{font-size:13px;border-bottom:1px solid;padding-bottom:5px}
.reveal{opacity:0;transform:translateY(55px) scale(.985);transition:opacity 1s var(--ease),transform 1s var(--ease)}.reveal.is-visible{opacity:1;transform:translateY(0) scale(1)}
@media (max-width:900px){.site-header{mix-blend-mode:normal}.nav{position:fixed;inset:0;background:rgba(248,242,233,.96);backdrop-filter:blur(14px);flex-direction:column;justify-content:center;font-size:22px;opacity:0;pointer-events:none;transition:.3s}.nav.open{opacity:1;pointer-events:auto}.menu-toggle{display:block;position:relative;z-index:101}.hero-copy,.hero-copy--alt{width:auto;right:24px;left:24px;top:auto;bottom:13vh;text-align:right}.hero-copy h1,.hero-copy h2{font-size:clamp(52px,14vw,82px)}.frame-counter{bottom:18px}.scroll-rail{display:none}.story-panel,.mosaic-scene,.dessert-scene,.editorial-poster,.ramadan-scene,.visit-section{grid-template-columns:1fr;min-height:auto;padding-top:11vh;padding-bottom:11vh}.story-media{order:2}.story-copy{order:1}.mosaic-backdrop{order:2}.split-products{grid-template-columns:1fr}.product-card{min-height:90vh}.dessert-visual{order:2}.editorial-poster{gap:55px}.place-intro{grid-template-columns:1fr;margin-bottom:5vh}.place-grid{grid-template-columns:1fr 1fr}.place-shot{min-height:390px}.place-shot--tall{grid-column:span 2;min-height:560px}.visit-visual{height:70vh}.visit-card{padding:10vh 24px}.visit-card h2{font-size:clamp(62px,16vw,100px)}footer{grid-template-columns:1fr;min-height:55vh}.footer-brand span{font-size:26vw}}
@media (max-width:580px){.brand-en{display:none}.frame-story{height:390vh}.hero-grid{background-size:20vw 20vw}.hero-copy{bottom:8.5vh}.hero-copy h1,.hero-copy h2{font-size:clamp(44px,12.5vw,66px)}.hero-copy p{font-size:14px;line-height:1.7;max-width:84vw}.story-panel,.mosaic-scene,.dessert-scene,.editorial-poster,.ramadan-scene{padding-inline:20px}.story-copy h2,.mosaic-copy h2,.dessert-copy h2,.place-intro h2,.ramadan-copy h2{font-size:13vw}.split-products .product-card{padding:8vh 20px}.pour-transition{height:72vh}.pour-visual{width:110vw}.place-section{padding-inline:16px}.place-grid{grid-template-columns:1fr}.place-shot,.place-shot--tall{grid-column:auto;min-height:460px}.visit-data>div{grid-template-columns:95px 1fr}.gallery-break img{height:55vh}.cursor-glow{display:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.marquee{animation:none}.reveal{opacity:1;transform:none;transition:none}.cursor-glow{display:none}}