@font-face{font-family:NotoArabic;src:url('assets/NotoSansArabic-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:NotoArabic;src:url('assets/NotoSansArabic-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{--ink:#2b2723;--muted:#71685f;--paper:#f8f4ec;--cream:#eee7db;--card:#f2ece2;--line:#d8cec0;--coffee:#6d4635;--bronze:#a27553;--brown:#3d2b24;--white:#fffaf2;--font:NotoArabic,Tahoma,Arial,sans-serif;--serif:Georgia,'Times New Roman',serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}img{max-width:100%}::selection{background:#b48b68;color:white}.shell{width:min(1360px,calc(100% - 9vw));margin-inline:auto}section[id]{scroll-margin-top:110px}
.concept-bar{min-height:35px;background:var(--brown);color:#eee2d3;display:flex;align-items:center;justify-content:center;gap:10px;padding:5px 16px;font-size:10px;letter-spacing:.02em;position:relative;text-align:center}.concept-dot{width:5px;height:5px;border-radius:50%;background:#cba884;flex:none}.concept-by{position:absolute;right:4vw;font-family:var(--serif);font-size:9px;letter-spacing:.13em;opacity:.65;direction:ltr}
.site-header{height:88px;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:0 4.5vw;background:var(--paper);position:relative;z-index:3;border-bottom:1px solid #e8ded2}.brand{display:inline-flex;flex-direction:column;align-items:flex-start;line-height:1}.brand-ar{font-weight:700;font-size:37px;letter-spacing:-.09em;line-height:1.1}.brand-spark{display:inline-block;font-size:15px;color:var(--bronze);vertical-align:top;transform:translate(-3px,3px)}.brand-en{font:9px var(--serif);letter-spacing:.18em;direction:ltr;margin-top:4px}.site-header nav{display:flex;gap:38px;font-size:12px}.site-header nav a{color:#574d45;transition:color .2s}.site-header nav a:hover{color:var(--bronze)}.header-actions{display:flex;align-items:center;gap:24px}.language-toggle{border:0;background:transparent;font:700 12px var(--serif);letter-spacing:.07em;padding:12px;color:var(--ink)}.header-menu-link{display:flex;align-items:center;gap:30px;padding:13px 21px;border:1px solid var(--ink);font-size:11px;transition:background .2s,color .2s}.header-menu-link:hover{background:var(--ink);color:white}
.hero{min-height:min(690px,72vw);height:calc(100svh - 123px);max-height:840px;position:relative;display:flex;align-items:center;color:var(--white);background:#4a3426 url('assets/hero.webp') center 52%/cover no-repeat;isolation:isolate}.hero:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(28,22,17,.79),rgba(33,25,18,.52) 39%,rgba(43,33,26,.08) 78%)}.hero-copy{width:min(570px,47vw);margin-left:7vw;margin-right:auto;padding:45px 0 75px;text-align:right}.eyebrow,.section-kicker{display:inline-flex;align-items:center;gap:11px;text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:700}.eyebrow-line{width:27px;height:1px;background:#e1b78e}.hero h1{font-size:clamp(58px,6.4vw,111px);line-height:1.36;letter-spacing:-.075em;margin:16px 0 8px;font-weight:700}.hero h1 span,.hero h1 em{display:block}.hero h1 em{font-style:normal;color:#eac9a8}.hero p{font-size:15px;line-height:2.1;max-width:360px;margin:0 0 30px;color:#f7ebde}.button{min-width:165px;display:inline-flex;justify-content:space-between;align-items:center;gap:34px;padding:16px 22px;font-weight:700;font-size:12px;border:0;transition:transform .2s,background .2s,color .2s}.button:hover{transform:translateY(-2px)}.button-light{background:#fff8ed;color:#2c261f}.button-light:hover{background:#e5c7a5}.button-dark{background:var(--ink);color:white}.button-dark:hover{background:var(--coffee)}.hero-bottom{position:absolute;bottom:0;left:0;right:0;padding:25px 4.5vw;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.27);font-size:10px;letter-spacing:.05em}.hero-bottom span:first-child{font-family:var(--serif);direction:ltr}.hero-scroll{opacity:.72}
.story-section{display:grid;grid-template-columns:1fr 1.45fr .65fr;align-items:center;gap:5vw;min-height:520px;padding-block:95px}.story-mark{font-weight:700;font-size:clamp(180px,22vw,360px);line-height:.9;letter-spacing:-.14em;color:#d8c5ad;position:relative;transform:rotate(-10deg);text-align:center}.story-mark:before{content:"";width:80%;height:80%;border:1px solid #cbb69c;border-radius:50%;position:absolute;top:1%;right:5%;z-index:-1}.story-copy .section-kicker,.section-kicker{color:var(--bronze)}.story-copy h2{font-size:clamp(38px,4vw,67px);line-height:1.45;letter-spacing:-.055em;margin:15px 0 23px}.story-copy p{max-width:545px;color:#5f584e;font-size:14px;line-height:2.15;margin:0 0 30px}.story-rule{display:block;width:72px;height:1px;background:var(--bronze);margin-bottom:14px}.story-copy small{color:#9a8f80;font-size:10px;line-height:1.8;display:block}.story-aside{align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding:25px 28px;border-right:1px solid var(--line);color:var(--coffee)}.story-aside .small-star{font-size:28px;color:#b88a62;margin-bottom:18px}.story-aside>span:nth-child(2){font-weight:700;font-size:26px;line-height:1.7}.story-aside div{font:10px var(--serif);letter-spacing:.15em;direction:ltr;margin-top:30px}
.feature-section{padding-block:55px 115px}.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:30px}.section-head h2{font-size:clamp(32px,3.5vw,58px);letter-spacing:-.06em;margin:10px 0 0}.section-head p{max-width:370px;color:var(--muted);font-size:12px;line-height:2}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.feature-card{min-height:400px;background:#ebe1d2;display:grid;grid-template-columns:1fr 1fr;position:relative;overflow:hidden;cursor:pointer;border:1px solid #e5dacb;transition:transform .2s,box-shadow .2s}.feature-card:hover{transform:translateY(-4px);box-shadow:0 15px 35px #59442b14}.feature-card:nth-child(2){background:#e4d6c3}.feature-text{padding:37px 37px 32px;display:flex;flex-direction:column;align-items:flex-start;z-index:1}.feature-index{font:12px var(--serif);letter-spacing:.13em;direction:ltr;color:var(--bronze)}.feature-text h3{font-size:clamp(24px,2.45vw,39px);letter-spacing:-.05em;line-height:1.45;margin:70px 0 7px}.feature-text p{font-size:11px;line-height:1.9;color:var(--muted);margin:0 0 auto}.feature-action{font-size:12px;font-weight:700;border-bottom:1px solid var(--ink);padding-bottom:7px}.feature-art{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.feature-art:before{content:"";position:absolute;width:100%;aspect-ratio:1;border:1px solid #c9af94;border-radius:50%;opacity:.75;transform:scale(1.2)}.feature-art img{position:relative;width:108%;height:370px;object-fit:contain;filter:drop-shadow(0 24px 18px #46332633);transition:transform .3s}.feature-card:hover img{transform:scale(1.055)}.feature-card:nth-child(2) .feature-art img{width:115%;height:335px}
.menu-section{background:#ede5d9;padding:105px 0 118px}.menu-title-row{display:flex;align-items:end;justify-content:space-between;gap:35px}.menu-title-row h2{font-size:clamp(40px,4.6vw,76px);line-height:1.4;letter-spacing:-.06em;margin:8px 0 0}.menu-title-row p{max-width:430px;font-size:12px;line-height:2;color:var(--muted);margin:0 0 13px}.menu-tools{display:flex;justify-content:space-between;align-items:center;gap:25px;border-bottom:1px solid #cdbfaa;margin-top:28px;margin-bottom:31px}.category-filters{display:flex;gap:25px;overflow:auto}.filter-button{white-space:nowrap;color:#74685a;background:none;border:0;border-bottom:2px solid transparent;padding:12px 4px 17px;font-size:12px}.filter-button.active{color:var(--ink);font-weight:700;border-bottom-color:var(--coffee)}.menu-count{font:11px var(--serif);letter-spacing:.13em;white-space:nowrap;color:#8b7868}.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.product-card{display:flex;flex-direction:column;text-align:right;background:#f8f4ed;min-height:385px;border:1px solid #e2d7c9;overflow:hidden;cursor:pointer;transition:transform .2s,box-shadow .2s;border-radius:0}.product-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #4b382216}.product-art{height:242px;background:radial-gradient(circle at 50% 40%,#f5e8d4 0,#eee0cd 45%,#e4d3bd 100%);position:relative;display:flex;justify-content:center;align-items:center;overflow:hidden}.product-card:nth-child(4n+2) .product-art{background:radial-gradient(circle at 50% 40%,#f7e8dd,#e6d2c0)}.product-card:nth-child(4n+3) .product-art{background:radial-gradient(circle at 50% 40%,#eee8d6,#d8d0bc)}.product-card:nth-child(4n+4) .product-art{background:radial-gradient(circle at 50% 40%,#f5eadd,#ded1bd)}.product-art:after{content:"";width:210px;height:210px;position:absolute;top:16px;border:1px solid #ffffff7c;border-radius:50%;pointer-events:none}.product-art img{width:80%;height:220px;object-fit:contain;position:relative;z-index:1;filter:drop-shadow(0 16px 15px #49352327)}.product-art .product-illustration{width:110px;height:110px;position:relative;z-index:1;color:#795541;filter:drop-shadow(0 10px 12px #59392324)}.product-art .product-illustration svg{width:100%;height:100%}.product-card .art-corner{position:absolute;top:16px;right:17px;z-index:2;color:#8b7564;font:10px var(--serif);letter-spacing:.13em}.product-card .play-mark{position:absolute;bottom:15px;left:16px;z-index:2;background:#fff8ea;color:var(--brown);font-size:10px;padding:7px 11px}.product-card-body{flex:1;padding:20px 18px 17px;display:flex;flex-direction:column;gap:5px}.product-card-body h3{font-size:15px;margin:0;letter-spacing:-.02em}.product-card-body p{font-size:10px;line-height:1.7;color:#80766a;margin:0}.product-card-bottom{display:flex;justify-content:space-between;align-items:end;margin-top:auto;padding-top:18px;font-size:10px;color:var(--coffee)}.product-card-bottom strong{font-size:16px;font-weight:400}.menu-footnote{display:flex;align-items:center;gap:13px;color:#77695c;margin-top:25px;font-size:11px}.menu-footnote span{font-size:21px;color:var(--bronze)}.menu-footnote p{margin:0}
.visit-section{display:grid;grid-template-columns:1.1fr 1fr;min-height:480px;padding-block:110px;gap:60px;align-items:center}.visit-copy h2{font-size:clamp(42px,4.7vw,74px);line-height:1.4;letter-spacing:-.06em;margin:10px 0}.visit-copy p{font-size:14px;line-height:2;color:var(--muted);margin:0 0 30px}.visit-actions{display:flex;align-items:center;gap:30px}.text-link{font-size:12px;border-bottom:1px solid var(--ink);padding-bottom:5px}.visit-art{height:330px;background:#c4aa89;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#3b2c25}.visit-art:before,.visit-art:after{content:"";position:absolute;width:270px;height:270px;border:1px solid #6a4a3666;border-radius:50%}.visit-art:after{width:390px;height:390px}.visit-art-ar{font-size:58px;line-height:1.5;font-weight:700;letter-spacing:-.1em;z-index:1;text-align:center}.visit-art-star{position:absolute;top:25px;left:35px;font-size:35px}.visit-orbit{position:absolute;bottom:20px;right:24px;font:10px var(--serif);letter-spacing:.2em;direction:ltr}
.site-footer{background:#2b2723;color:#eee3d5;padding:50px 4.5vw 27px}.footer-top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:55px}.footer-brand .brand-ar{font-size:34px}.footer-top>span,.footer-top>a{font-size:11px;color:#bdb1a5}.footer-bottom{border-top:1px solid #766a5d55;padding-top:20px;display:flex;justify-content:space-between;gap:15px;color:#a99d90;font:10px var(--serif);letter-spacing:.1em}.footer-bottom a{text-decoration:underline;text-underline-offset:3px}
.product-dialog{border:0;padding:0;max-width:min(1000px,calc(100vw - 32px));width:100%;max-height:calc(100svh - 28px);background:var(--paper);box-shadow:0 25px 100px #1a110dbb;overflow:auto;color:var(--ink)}.product-dialog::backdrop{background:#20150fc9;backdrop-filter:blur(5px)}.dialog-close{position:absolute;z-index:10;top:17px;left:17px;border:1px solid #c5b7a8;background:#f9f4eb;width:36px;height:36px;font:24px var(--serif);line-height:1}.dialog-layout{display:grid;grid-template-columns:1.06fr .94fr;min-height:550px}.dialog-visual{background:#e7d9c7;position:relative;min-height:550px;display:flex;align-items:center;justify-content:center;overflow:hidden}.dialog-issue{position:absolute;top:26px;right:28px;z-index:6;color:#726454;font-size:10px}.animation-stage,.still-stage{width:100%;height:100%;min-height:550px;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 48%,#f7ecdb 0,#e8d9c3 54%,#d7c1a6 100%)}.still-stage[hidden],.animation-stage[hidden]{display:none}.still-stage img{width:80%;height:360px;object-fit:contain;filter:drop-shadow(0 18px 20px #3e281c30)}.still-stage .product-illustration{width:185px;height:185px;color:#795541}.still-stage .product-illustration svg{width:100%;height:100%}.dialog-copy{padding:80px 58px 55px;display:flex;flex-direction:column;align-items:flex-start}.dialog-copy h2{font-size:clamp(33px,3.5vw,55px);letter-spacing:-.07em;line-height:1.45;margin:12px 0 18px}.dialog-copy>p:not(.dialog-unverified){color:#665c51;font-size:14px;line-height:2;max-width:350px;margin:0}.dialog-line{width:100%;height:1px;background:#d9cabc;margin:35px 0 22px}.dialog-steps{display:flex;gap:9px;flex-wrap:wrap}.step-chip{border:1px solid #c9b8a5;padding:8px 12px;font-size:10px;color:#765843}.dialog-unverified{font-size:10px;line-height:1.9;color:#9d8977;margin:22px 0 28px}.dialog-copy .button{margin-top:auto}.replay-button{position:absolute;bottom:24px;left:24px;z-index:6;border:0;background:#faf4eb;color:var(--ink);display:flex;gap:9px;align-items:center;padding:10px 15px;font-size:11px;box-shadow:0 5px 20px #4a302322}.replay-button[hidden]{display:none}.replay-button span:first-child{font-size:22px;line-height:1}
.recipe-art{width:min(90%,440px);height:405px;position:relative;display:flex;align-items:center;justify-content:center}.recipe-art:before{content:"";position:absolute;width:95%;aspect-ratio:1;border:1px solid #fff9;border-radius:50%;top:5%}.recipe-art:after{content:"";position:absolute;bottom:30px;width:60%;height:25px;background:#4e321e27;border-radius:50%;filter:blur(13px)}.recipe-art .final-photo{position:absolute;z-index:5;width:94%;height:96%;object-fit:contain;opacity:0;transform:scale(.93);animation:final-appear .65s ease 2.8s forwards;filter:drop-shadow(0 20px 18px #3a261e35)}.recipe-latte .glass{position:absolute;bottom:50px;width:208px;height:260px;border:6px solid #fff8;border-top:10px solid #fffd;border-radius:13px 13px 35px 35px;z-index:2;box-shadow:inset 10px 0 12px #ffffff77,10px 15px 20px #8c695c44;overflow:hidden;animation:pop-in .6s .1s backwards}.recipe-latte .glass:after{content:"";position:absolute;bottom:0;left:5px;right:5px;height:14px;border-radius:50%;background:#fff9}.recipe-latte .milk{position:absolute;bottom:7px;left:4px;right:4px;height:0;background:linear-gradient(90deg,#f9efdf,#ead8bd,#fff6e8);border-radius:0 0 20px 20px;animation:milk-rise .7s .72s forwards}.recipe-latte .espresso{position:absolute;bottom:7px;left:4px;right:4px;height:0;background:linear-gradient(160deg,#5b3122,#ae7041 55%,#79452e);opacity:.96;animation:espresso-rise .8s 1.48s forwards}.recipe-latte .pour{position:absolute;width:12px;height:0;top:3px;background:linear-gradient(#5a3024,#b98455);z-index:3;border-radius:0 0 50% 50%;animation:pour-stream .85s 1.35s forwards}.recipe-latte .ice{position:absolute;z-index:4;width:45px;height:39px;border:3px solid #fff9;background:#ffffff50;border-radius:8px;top:0;opacity:0;transform:rotate(17deg);animation:ice-drop .55s 2.08s forwards}.recipe-latte .ice.i1{left:75px}.recipe-latte .ice.i2{left:110px;animation-delay:2.3s;transform:rotate(-22deg)}.recipe-brulee .ramekin{position:absolute;bottom:55px;width:290px;height:150px;background:repeating-linear-gradient(90deg,#eee4d6 0 13px,#dccbbb 14px 16px);border:9px solid #fff7ed;border-radius:22px 22px 95px 95px;box-shadow:0 18px 20px #6b4c3240;z-index:2;animation:pop-in .6s .1s backwards}.recipe-brulee .ramekin:before{content:"";position:absolute;top:-30px;left:-10px;right:-10px;height:67px;border-radius:50%;border:8px solid #fff7ed;background:#e3d5c3;z-index:2}.recipe-brulee .custard{position:absolute;z-index:3;bottom:170px;width:265px;height:62px;border-radius:50%;background:radial-gradient(ellipse,#f3d984,#dfb36b);transform:scale(0);animation:custard-in .8s .85s forwards}.recipe-brulee .sugar{position:absolute;z-index:4;bottom:171px;width:265px;height:62px;border-radius:50%;background:radial-gradient(ellipse,#a34d20,#be692a 55%,#e1a64c);opacity:0;transform:scale(.6);animation:caramel-in .75s 1.7s forwards}.recipe-brulee .glow{position:absolute;z-index:4;bottom:170px;width:260px;height:80px;border-radius:50%;background:#e9a741aa;filter:blur(24px);opacity:0;animation:torch .8s 2.05s forwards}.recipe-art .stage-label{position:absolute;z-index:7;bottom:4px;color:#775d49;font:11px var(--serif);direction:ltr;letter-spacing:.16em;animation:label-in .5s 3.1s backwards}
@keyframes pop-in{from{opacity:0;transform:translateY(70px) scale(.84)}to{opacity:1;transform:none}}@keyframes milk-rise{to{height:60%}}@keyframes espresso-rise{to{height:35%}}@keyframes pour-stream{30%{height:110px}75%{height:110px}100%{height:0;top:110px}}@keyframes ice-drop{to{top:41px;opacity:1}}@keyframes custard-in{to{transform:scale(1)}}@keyframes caramel-in{to{opacity:1;transform:scale(1)}}@keyframes torch{45%{opacity:1}100%{opacity:0}}@keyframes final-appear{to{opacity:1;transform:scale(1)}}@keyframes label-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
html[lang=en] .hero-copy{text-align:left}html[lang=en] .product-card,html[lang=en] .product-card-body{text-align:left}html[lang=en] .hero h1{font-family:var(--serif);font-weight:400;letter-spacing:-.045em;line-height:1.08;font-size:clamp(64px,7.4vw,116px)}html[lang=en] .story-copy h2,html[lang=en] .section-head h2,html[lang=en] .menu-title-row h2,html[lang=en] .visit-copy h2,html[lang=en] .dialog-copy h2{font-family:var(--serif);font-weight:400;letter-spacing:-.045em;line-height:1.12}html[lang=en] .site-header nav{font-family:var(--serif);font-size:14px}html[lang=en] .feature-text h3{font-family:var(--serif);font-weight:400;letter-spacing:-.03em}
@media(max-width:1050px){.story-section{grid-template-columns:.75fr 1.4fr}.story-aside{display:none}.feature-card{min-height:355px}.feature-text{padding:30px}.feature-text h3{margin-top:58px}.product-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.shell{width:calc(100% - 36px)}.concept-bar{font-size:9px;padding-inline:8px}.concept-by{display:none}.site-header{height:74px;padding:0 18px}.brand-ar{font-size:29px}.brand-en{font-size:7px}.site-header nav{display:none}.header-actions{gap:7px}.header-menu-link{padding:10px 12px;gap:8px;font-size:10px}.language-toggle{padding:8px}.hero{height:690px;min-height:0;background-position:60% center;align-items:flex-end}.hero:before{background:linear-gradient(0deg,#211913e6 3%,#211913ac 45%,#221b1424 100%)}.hero-copy{width:calc(100% - 42px);margin:0 21px;padding:0 0 108px}.hero h1{font-size:clamp(55px,11.5vw,88px);margin-bottom:8px}.hero p{font-size:12px;margin-bottom:20px}.hero-bottom{padding:19px 21px}.hero-bottom .hero-scroll{display:none}.story-section{grid-template-columns:1fr;gap:0;padding-block:55px 70px}.story-mark{font-size:180px;max-height:160px;overflow:hidden;text-align:center;opacity:.5}.story-copy h2{font-size:41px}.story-copy p{font-size:12px}.feature-section{padding-block:25px 75px}.section-head,.menu-title-row{display:block}.section-head p{margin-top:13px}.feature-grid{grid-template-columns:1fr;gap:12px}.feature-card{min-height:280px}.feature-text{padding:25px}.feature-text h3{font-size:28px;margin:35px 0 4px}.feature-art img{height:265px}.feature-card:nth-child(2) .feature-art img{height:245px}.menu-section{padding:67px 0 74px}.menu-title-row h2{font-size:44px}.menu-title-row p{margin-top:10px}.menu-tools{margin-top:14px}.category-filters{gap:18px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.product-card{min-height:315px}.product-art{height:175px}.product-art:after{width:145px;height:145px}.product-art img{height:155px}.product-art .product-illustration{width:84px;height:84px}.product-card-body{padding:14px 12px}.product-card-body h3{font-size:12px}.product-card-body p{font-size:9px}.product-card-bottom{padding-top:10px}.visit-section{grid-template-columns:1fr;gap:30px;padding-block:65px}.visit-copy h2{font-size:43px}.visit-art{height:270px}.site-footer{padding:35px 20px 20px}.footer-top{align-items:flex-start;flex-direction:column;padding-bottom:35px}.footer-bottom{font-size:9px}.dialog-layout{grid-template-columns:1fr}.dialog-visual,.animation-stage,.still-stage{min-height:335px;height:335px}.dialog-copy{padding:28px 26px 38px}.dialog-copy h2{font-size:38px}.dialog-copy>p:not(.dialog-unverified){font-size:12px}.dialog-line{margin:24px 0 18px}.recipe-art{height:320px;transform:scale(.72)}.dialog-close{top:10px;left:10px}.dialog-issue{top:16px;right:20px}.replay-button{bottom:10px;left:10px}.dialog-unverified{margin:15px 0}.product-dialog{max-height:calc(100svh - 15px)}}
@media(max-width:390px){.header-menu-link{display:none}.feature-card{min-height:250px}.feature-text h3{font-size:24px}.feature-art img{height:215px}.menu-count{display:none}.product-grid{gap:7px}.product-card-body h3{font-size:11px}.visit-actions{gap:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important}.recipe-art .final-photo{opacity:1;transform:none}}

/* The official JEERH wordmark and photographic assembly sequences. */
:root{--jeerh-rust:#ad5c3a;--jeerh-deep:#663b2b;--bronze:#a85a3d}
.site-header{height:94px;background:var(--jeerh-rust);border-bottom:0;color:#fff9f1}
.brand-official{align-items:center;justify-content:center;flex:none}
.brand-official img{display:block;width:auto;height:70px;object-fit:contain}
.site-header nav a{color:#fff5ed}.site-header nav a:hover{color:#ffe0be}
.site-header .language-toggle{color:#fff9f1}
.site-header .header-menu-link{border-color:#fff8ee;color:#fff9f1}
.site-header .header-menu-link:hover{background:#fff8ee;color:var(--jeerh-deep)}
.story-mark{display:block;width:min(100%,310px);height:auto;max-height:none;object-fit:contain;transform:rotate(-7deg);opacity:.9;justify-self:center;overflow:visible}
.story-mark:before{display:none}
.site-footer{background:var(--jeerh-rust)}
.footer-brand img{height:98px}
.footer-top>span,.footer-top>a,.footer-bottom{color:#f1ddd1}
.footer-bottom{border-top-color:#ffffff55}
.visit-art{background:var(--jeerh-rust);color:#fff8ed}
.visit-art:before,.visit-art:after{border-color:#ffffff52}
.visit-logo{width:240px;height:auto;object-fit:contain;z-index:1;filter:drop-shadow(0 12px 12px #4e2a2533)}
.visit-orbit{color:#fff6ea}.visit-art-star{color:#ffd9b9}

.dialog-steps .step-chip{transition:background .4s,color .4s,border-color .4s}
.dialog-steps .step-chip.is-active{background:var(--jeerh-rust);border-color:var(--jeerh-rust);color:white}
.animation-stage{background:#e9dcc9}
.sequence-scene{position:relative;isolation:isolate;overflow:hidden;width:100%;height:100%;min-height:550px;background:radial-gradient(circle at 48% 45%,#f9f0e4 0%,#eddfca 55%,#d6baa0 100%)}
.sequence-scene:before{content:"";position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(109deg,transparent 0 46px,#fff3 47px 48px,transparent 49px 96px);opacity:.35}
.sequence-orbit{width:450px;height:450px;position:absolute;top:48%;left:50%;transform:translate(-50%,-50%);border:1px solid #ffffffba;border-radius:50%;box-shadow:0 0 0 33px #ffffff18,0 0 0 80px #ffffff10}
.sequence-orbit:before,.sequence-orbit:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%}
.sequence-orbit:before{width:78%;height:78%;border:1px dashed #b8896b66;animation:orbit-turn 36s linear infinite}
.sequence-orbit:after{width:9px;height:9px;background:#b66949;left:11%;top:17%;box-shadow:0 0 0 5px #ffffff72}
.sequence-index{position:absolute;top:32px;left:33px;z-index:7;font:10px var(--serif);letter-spacing:.2em;color:#9d694e;direction:ltr}
.sequence-photo-stack{position:absolute;width:min(100%,510px);height:490px;top:47%;left:50%;transform:translate(-50%,-50%);z-index:2}
.sequence-brulee .sequence-photo-stack{width:min(118%,655px);height:510px;top:49%}
.sequence-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transform:translateY(12px) scale(.98);transition:opacity .58s ease,transform .85s cubic-bezier(.2,.7,.2,1),clip-path 1.05s cubic-bezier(.2,.7,.2,1);filter:drop-shadow(0 22px 18px #5e382429);pointer-events:none;user-select:none}
.sequence-photo.is-active{opacity:1;transform:translateY(0) scale(1)}
.sequence-latte .sequence-photo[data-frame="2"],.sequence-brulee .sequence-photo[data-frame="1"]{clip-path:inset(70% 0 0 0)}
.sequence-latte .sequence-photo[data-frame="2"].is-active,.sequence-brulee .sequence-photo[data-frame="1"].is-active{clip-path:inset(0)}
.sequence-brulee .sequence-photo[data-frame="3"]{clip-path:circle(0% at 50% 38%)}
.sequence-brulee .sequence-photo[data-frame="3"].is-active{clip-path:circle(95% at 50% 38%)}
.ingredient-overlay{position:absolute;z-index:5;pointer-events:none;object-fit:contain;opacity:0;user-select:none;transform-origin:50% 0}
.ingredient-overlay.is-flowing{animation:ingredient-flow 1.32s ease-in-out both}
.overlay-ice{width:185px;height:230px;top:32px;left:49%;transform:translateX(-50%) translateY(-100px) scale(.7)}
.overlay-ice.is-flowing{animation:ice-fall 1.2s cubic-bezier(.22,.76,.43,1) both}
.overlay-milk{width:190px;height:355px;top:-37px;left:47%;transform:translateX(-50%) translateY(-50px) scaleY(.72)}
.overlay-espresso{width:170px;height:340px;top:-37px;left:51%;transform:translateX(-50%) translateY(-50px) scaleY(.72);mask-image:linear-gradient(90deg,transparent 20%,#000 45% 58%,transparent 80%)}
.overlay-custard{width:205px;height:345px;top:-41px;left:51%;transform:translateX(-50%) translateY(-50px) scaleY(.72);mask-image:linear-gradient(90deg,transparent 13%,#000 35% 65%,transparent 87%)}
.overlay-sugar{width:265px;height:365px;top:-17px;left:51%;transform:translateX(-50%) translateY(-50px) scaleY(.72);mask-image:linear-gradient(90deg,transparent 12%,#000 38% 62%,transparent 88%)}
.caramel-glow{position:absolute;z-index:6;top:30%;left:50%;width:340px;height:175px;transform:translate(-50%,0) rotate(-8deg);opacity:0;border-radius:50%;background:radial-gradient(ellipse at 38% 50%,#fff9c9d9 0%,#ffbb63a8 34%,#bb532e00 70%);filter:blur(15px);mix-blend-mode:screen;pointer-events:none}
.sequence-scene.is-torching .caramel-glow{animation:torch-sweep 1.28s ease-in-out both}
.sequence-ingredient{position:absolute;right:32px;bottom:31px;z-index:8;min-width:124px;display:flex;align-items:center;gap:13px;padding:9px 13px 8px;background:#fff8efcf;backdrop-filter:blur(5px);border:1px solid #fff9;color:#724732;font-size:12px;font-weight:700}
.sequence-ingredient-number{font:11px var(--serif);color:#ac6948;direction:ltr}
.sequence-brand{position:absolute;left:29px;bottom:31px;z-index:8;width:65px;height:46px;padding:3px;background:var(--jeerh-rust);display:flex;align-items:center;justify-content:center}
.sequence-brand img{height:38px;width:auto;object-fit:contain}
.sequence-progress{position:absolute;bottom:0;right:0;left:0;height:3px;background:#be9e8766;z-index:9;direction:ltr}
.sequence-progress>span{display:block;width:0;height:100%;background:var(--jeerh-rust)}
.sequence-scene.is-playing .sequence-progress>span{animation:sequence-progress 6.3s linear forwards}
.sequence-scene.is-finished .sequence-orbit{box-shadow:0 0 0 33px #ffffff20,0 0 0 80px #ffffff17,0 0 40px #be745247}
@keyframes ingredient-flow{0%{opacity:0;transform:translateX(-50%) translateY(-90px) scaleY(.35)}18%{opacity:.92}73%{opacity:.95;transform:translateX(-50%) translateY(7px) scaleY(.9)}100%{opacity:0;transform:translateX(-50%) translateY(19px) scaleY(.62)}}
@keyframes ice-fall{0%{opacity:0;transform:translateX(-50%) translateY(-105px) scale(.75) rotate(-9deg)}24%{opacity:.95}68%{opacity:1;transform:translateX(-50%) translateY(70px) scale(.8) rotate(10deg)}100%{opacity:0;transform:translateX(-50%) translateY(115px) scale(.7) rotate(13deg)}}
@keyframes torch-sweep{0%{opacity:0;transform:translate(-70%,0) rotate(-13deg) scale(.8)}30%{opacity:.92}62%{opacity:.75}100%{opacity:0;transform:translate(-32%,1px) rotate(7deg) scale(1.15)}}
@keyframes sequence-progress{to{width:100%}}
@keyframes orbit-turn{to{transform:translate(-50%,-50%) rotate(360deg)}}
@media(max-width:760px){
  .site-header{height:76px}.brand-official img{height:57px}.story-mark{width:170px;max-height:none;opacity:.75;margin:0 auto 12px}
  .footer-brand img{height:78px}.visit-logo{width:200px}
  .sequence-scene{min-height:335px}.sequence-orbit{width:280px;height:280px}
  .sequence-photo-stack{width:350px;height:320px;top:48%}.sequence-brulee .sequence-photo-stack{width:420px;height:330px;top:48%}
  .sequence-index{top:19px;left:16px;font-size:9px}.sequence-brand{left:13px;bottom:14px;width:46px;height:33px}.sequence-brand img{height:28px}
  .sequence-ingredient{right:13px;bottom:14px;min-width:105px;padding:5px 8px;font-size:10px;gap:7px}
  .ingredient-overlay{scale:.6;top:-47px}.overlay-sugar{top:-73px}
  .caramel-glow{width:250px;height:125px;top:31%}
}
@media(prefers-reduced-motion:reduce){.sequence-photo{transition:none}.sequence-photo:not(.is-active){opacity:0}.sequence-orbit:before{animation:none}.sequence-scene.is-playing .sequence-progress>span{animation:none;width:100%}}
