:root{--blue:#18385f;--blue-deep:#102948;--blue-mid:#2c527b;--blue-soft:#e4edf5;--ice:#f3f6f8;--paper:#f8f7f2;--ink:#202d3a;--muted:#747f89;--line:rgba(24,56,95,.17);--serif:Georgia,'Times New Roman',serif;--sans:'IBM Plex Sans Arabic',sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-weight:400;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit}
.topline{height:37px;padding:0 5.8%;background:var(--blue-deep);color:#f4f6f8;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.06em}
.topline-center{font:10px 'DM Sans',sans-serif;letter-spacing:.2em;color:#d4e0ec}
.topline a span{margin-right:5px}
.site-header{height:91px;padding:0 5.8%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:5;background:var(--paper)}
.wordmark{display:flex;align-items:center;gap:9px;font:28px/1 'DM Sans',sans-serif;letter-spacing:-1.5px;flex-shrink:0}
.wordmark small{display:block;font:8px 'DM Sans',sans-serif;letter-spacing:2.7px;margin-top:6px;color:var(--muted)}
.wordmark-dot{color:var(--blue-mid)}
.monogram{width:39px;height:39px;border:1px solid var(--blue);border-radius:50%;display:grid;place-items:center;color:var(--blue);font:italic 22px var(--serif)}
.main-nav{display:flex;gap:39px;font-size:13px;color:#4e5a66}
.main-nav a,.text-link{transition:color .2s}
.main-nav a:hover,.text-link:hover{color:var(--blue-mid)}
.header-cta{font-size:12px;border-bottom:1px solid var(--blue);padding:0 0 7px 1px;white-space:nowrap}
.header-cta span{color:var(--blue-mid);margin-right:8px}
.menu-toggle{display:none}
.hero{height:min(735px,76vw);min-height:570px;position:relative;overflow:hidden;background:#52697e;color:white}
.hero-photo{position:absolute;inset:0;overflow:hidden}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 64%;transform:scale(1.015);animation:hero-in 1.3s ease-out both}
.hero-shade{position:absolute;inset:0;background:linear-gradient(270deg,rgba(12,35,62,.84) 0%,rgba(17,43,72,.63) 43%,rgba(17,43,72,.1) 100%)}
.hero-copy{position:absolute;right:12.5%;top:50%;transform:translateY(-50%);max-width:490px}
.eyebrow{font:10px 'DM Sans',var(--sans);letter-spacing:.19em;color:var(--blue-mid);margin:0 0 23px}
.eyebrow.light{color:#d7e3ee}
.eyebrow span{display:inline-block;width:21px;height:1px;background:currentColor;vertical-align:middle;margin-left:9px}
.hero h1{font-size:clamp(54px,7vw,94px);font-weight:300;line-height:1.2;letter-spacing:-.06em;margin:0 0 24px}
.hero h1 em,.intro h2 em,.menu-title h2 em,.gallery-heading h2 em,.visit h2 em{font-family:var(--serif);font-weight:400;letter-spacing:-.04em}
.hero h1 em{color:#d5e5f3}
.hero-description{font-size:15px;line-height:2;color:#e2eaf0;max-width:365px;margin:0 0 31px}
.hero-actions{display:flex;align-items:center;gap:27px}
.button{min-height:48px;padding:0 20px;display:inline-flex;align-items:center;justify-content:center;gap:23px;font-size:12px;transition:transform .2s,background .2s}
.button:hover{transform:translateY(-2px)}
.button-white{background:#f4f6f7;color:var(--blue-deep)}
.button-white span{color:var(--blue-mid)}
.text-link{font-size:12px;border-bottom:1px solid rgba(44,82,123,.55);padding-bottom:8px;display:inline-flex;gap:12px;align-items:center;color:var(--ink)}
.light-link{color:#f5f2ea;border-color:rgba(245,242,234,.55)}
.hero-caption{position:absolute;bottom:34px;right:5.8%;display:flex;gap:17px;align-items:center;font:9px 'DM Sans',sans-serif;letter-spacing:.18em;color:#eee7dc}
.hero-caption i{width:56px;height:1px;background:rgba(255,255,255,.6)}
.vertical-note{position:absolute;bottom:35px;left:5.8%;writing-mode:vertical-rl;transform:rotate(180deg);font:8px 'DM Sans',sans-serif;letter-spacing:.22em;color:#eee7dc}
.section-pad{padding-right:11%;padding-left:11%}
.intro{padding-top:132px;padding-bottom:132px;display:grid;grid-template-columns:.7fr 2fr 1.05fr;gap:6%;align-items:start}
.intro-label{display:flex;align-items:flex-start;gap:13px;font-size:12px;line-height:1.7;color:var(--muted);padding-top:13px}
.tiny-mark{color:var(--blue-mid);font-size:20px}
.intro-copy .eyebrow{margin-bottom:22px}
.intro h2,.gallery-heading h2{font-size:clamp(32px,4vw,52px);font-weight:400;line-height:1.55;letter-spacing:-.05em;margin:0}
.intro h2 em,.menu-title h2 em,.gallery-heading h2 em{color:var(--blue-mid)}
.intro-aside{padding-top:52px}
.intro-aside p{font-size:13px;line-height:2.15;color:#66727d;margin:0 0 22px}
.menu-section{background:var(--ice);padding-top:100px;padding-bottom:34px}
.menu-head{display:grid;grid-template-columns:1fr;gap:8%;align-items:center;padding-bottom:40px}
.menu-title .eyebrow{margin-bottom:17px}
.menu-title h2{font-size:clamp(48px,6vw,72px);font-weight:400;line-height:1.2;letter-spacing:-.055em;margin:0}
.menu-lead{font-size:14px;color:#65717d;margin:18px 0 22px}
.menu-note{font-size:10px;color:var(--blue-mid);display:flex;gap:9px;align-items:center}
.menu-note span{font-size:17px}
.menu-tabs{display:flex;justify-content:center;gap:8px;padding:0 5% 28px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.menu-tab{border:1px solid transparent;background:transparent;color:#5b6670;padding:11px 19px;cursor:pointer;font-size:12px;transition:color .2s,background .2s,transform .2s,border-color .2s}
.menu-tab span{font:10px 'DM Sans',sans-serif;color:var(--blue-mid);margin-right:8px}
.menu-tab:hover{background:#e7edf2;transform:translateY(-2px)}
.menu-tab.active{background:var(--blue);color:#fff}
.menu-tab.active span{color:#c9d9e8}
.menu-panel{display:grid;grid-template-columns:.77fr 1.3fr;gap:10%;padding-top:48px;padding-bottom:41px;min-height:390px}
.menu-category-intro{padding-top:12px;position:relative}
.category-mark{font:italic 38px var(--serif);color:#b8cadb;display:block;margin-bottom:23px}
.menu-category-intro .eyebrow{margin-bottom:11px}
.menu-category-intro h3{font-size:30px;font-weight:500;margin:0 0 9px;color:var(--blue-deep)}
.menu-category-intro>p:not(.eyebrow){font-size:12px;color:#7b858d;margin:0}
.menu-authentic{margin-top:29px;border-top:1px solid var(--line);padding-top:14px;display:flex;align-items:center;gap:8px;color:#68737d;font-size:10px}
.auth-dot{width:6px;height:6px;background:var(--blue-mid);border-radius:50%}
.menu-items{display:grid;grid-template-columns:1fr 1fr;column-gap:32px;align-content:start;min-width:0}
.menu-item{min-height:65px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid var(--line);padding:12px 13px;position:relative;isolation:isolate;border-radius:4px;opacity:0;transform:translateY(15px);transition:opacity .48s ease,transform .48s cubic-bezier(.2,.7,.2,1),background-color .22s ease,box-shadow .22s ease;transition-delay:calc(var(--item-order,0)*48ms)}
.menu-item.is-visible{opacity:1;transform:translateY(0)}
.menu-item::before{content:"";position:absolute;inset-block:13px;right:0;width:2px;border-radius:2px;background:var(--blue-mid);transform:scaleY(.3);opacity:0;transition:transform .24s ease,opacity .24s ease;z-index:-1}
.menu-item:hover,.menu-item:focus-within{background:#fff;box-shadow:0 8px 22px rgba(24,56,95,.075);transform:translateY(-3px);z-index:1}
.menu-item:hover::before,.menu-item:focus-within::before{transform:scaleY(1);opacity:1}
.menu-item:hover .item-name b,.menu-item:focus-within .item-name b{color:var(--blue)}
.menu-item:hover .item-price,.menu-item:focus-within .item-price{color:#376998}
.item-name{min-width:0}
.item-name b{display:block;font-size:13px;font-weight:500;color:#293b4c}
.item-name small{display:block;font:10px 'DM Sans',var(--sans);color:#818b94;margin-top:4px;direction:ltr;text-align:right}
.item-price{white-space:nowrap;color:var(--blue);font:600 13px 'DM Sans',var(--sans);display:flex;align-items:center;gap:5px}
.item-price small{font:9px var(--sans);color:#6c7881}
.menu-foot{border-top:1px solid var(--line);padding-top:18px;display:flex;justify-content:space-between;color:#818b94;font-size:10px}
.blue-band{position:relative;min-height:265px;background:var(--blue);color:#f3f6f8;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}
.quote-ornament{position:absolute;top:-26px;right:calc(50% - 66px);font:180px/1 var(--serif);opacity:.11}
.blue-band p{font:italic clamp(34px,5vw,58px) var(--serif);margin:0 0 13px;direction:ltr}
.quote-sub{font-size:12px;color:#d2ddea}
.quote-star{position:absolute;left:9%;bottom:38px;color:#dce7f0;font-size:24px}
.gallery{padding-top:112px;padding-bottom:120px}
.gallery-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:38px}
.gallery-heading .eyebrow{margin-bottom:13px}
.gallery-heading h2{font-size:clamp(33px,4vw,48px)}
.photo-gallery{display:grid;grid-template-columns:1.16fr .84fr;gap:20px;align-items:stretch}
.gallery-photo{margin:0;position:relative;overflow:hidden;background:var(--blue-soft);min-height:360px}
.gallery-photo img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;transition:transform .6s}
.gallery-photo:hover img{transform:scale(1.025)}
.gallery-store img{object-fit:contain;background:#e5edf4}
.gallery-drink img{object-position:center 64%}
.gallery-photo figcaption{position:absolute;bottom:0;right:0;left:0;display:flex;align-items:center;justify-content:space-between;padding:34px 22px 18px;background:linear-gradient(0deg,rgba(11,32,56,.77),transparent);color:#fff}
.gallery-photo figcaption span{font:8px 'DM Sans',sans-serif;letter-spacing:.16em}
.gallery-photo figcaption b{font-size:12px;font-weight:400}
.gallery-store,.gallery-drink{height:420px}
.visit{display:grid;grid-template-columns:1fr 1fr;min-height:525px;background:var(--blue-deep);color:#f5f7f8}
.visit-left{padding:90px 10% 82px 12%;align-self:center}
.visit-left .eyebrow{margin-bottom:20px}
.visit h2{font-size:clamp(52px,6.3vw,78px);line-height:1.15;font-weight:300;letter-spacing:-.06em;margin:0 0 19px}
.visit h2 em{color:#bfd3e5}
.visit-left>p:not(.eyebrow){font-size:13px;line-height:2;color:#d0dce6;margin:0 0 28px}
.visit-right{background:linear-gradient(140deg,#547494,#2c4e70);display:grid;place-items:center;padding:50px}
.visit-card{width:min(100%,390px);background:var(--paper);color:var(--ink);padding:39px 40px 33px;position:relative;box-shadow:0 25px 70px rgba(0,0,0,.13)}
.visit-symbol{position:absolute;left:35px;top:31px;width:36px;height:36px;border:1px solid #9bb2c7;border-radius:50%;display:grid;place-items:center;font:italic 20px var(--serif);color:var(--blue)}
.visit-card .eyebrow{font-size:9px;margin-bottom:13px}
.visit-card h3{font:34px 'DM Sans',sans-serif;margin:0 0 10px;letter-spacing:-1.5px}
.address{font-size:12px;line-height:1.9;color:#6f7780;margin:0 0 21px}
.rating{display:flex;align-items:center;gap:13px;border-top:1px solid var(--line);padding:16px 0}
.stars{letter-spacing:2px;color:#a48547;font-size:12px}
.rating b{font:16px 'DM Sans',sans-serif}
.rating small{font-size:9px;color:#86877f;margin-right:6px}
.map-link{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:16px;font-size:11px}
.map-link span{font-size:16px;color:var(--blue-mid)}
.footer{display:block;padding:28px 5.8% 18px;background:var(--paper)}
.footer-top{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:20px;min-height:58px}
.footer-brand{font-size:25px}
.footer-tagline{justify-self:center;font-size:11px;color:#687582;margin:0}
.footer-tagline span{font:italic 14px var(--serif);margin-right:6px}
.footer-social{justify-self:end;display:flex;align-items:center;gap:10px}
.footer-social .social-icon{width:39px;height:39px;border:1px solid rgba(24,56,95,.26);border-radius:50%;display:grid;place-items:center;color:var(--blue);background:transparent;transition:background .22s ease,color .22s ease,border-color .22s ease,transform .22s ease}
.footer-social .social-icon:hover{background:var(--blue);color:#fff;border-color:var(--blue);transform:translateY(-2px)}
.social-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.social-icon svg .social-dot{fill:currentColor;stroke:none}.social-icon svg .snap-mark{fill:currentColor;stroke:none}
.footer-bottom{margin-top:20px;padding-top:14px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}
.footer-bottom .copyright{font:8px 'DM Sans',sans-serif;color:#7d8790;letter-spacing:.12em}
.made-by{margin:0;color:#737e88;font-size:11px}
.made-by a{display:inline-flex;align-items:center;gap:4px;margin-right:3px;color:var(--blue-mid);font:600 12px 'DM Sans',sans-serif;letter-spacing:.12em;border-bottom:1px solid rgba(44,82,123,.52);padding-bottom:2px;transition:color .2s,border-color .2s}
.made-by a:hover{color:#567fa8;border-color:#567fa8}.made-by a span{font-size:12px}
/* Dedicated brand-story and coffee philosophy chapter */
.philosophy-section{padding:96px 0 102px;background:#edf2f6;overflow:hidden}
.philosophy-inner{display:grid;grid-template-columns:.78fr 1.22fr;gap:10%;align-items:center}
.philosophy-mark{min-height:405px;position:relative;background:var(--blue);display:grid;place-items:center;overflow:hidden;color:#edf4f8}
.philosophy-mark::before{content:"";position:absolute;width:75%;aspect-ratio:1;border:1px solid rgba(237,244,248,.23);border-radius:50%}
.philosophy-mark::after{content:"";position:absolute;width:58%;aspect-ratio:1;border:1px solid rgba(237,244,248,.19);border-radius:50%}
.orbit{position:absolute;border:1px solid rgba(237,244,248,.14);border-radius:50%;transform:rotate(-32deg)}
.orbit-one{width:105%;height:44%}.orbit-two{width:78%;height:32%;transform:rotate(41deg)}
.philosophy-monogram{font:italic 150px/.8 var(--serif);position:relative;z-index:1;color:#eef4f8}
.mark-caption{position:absolute;bottom:25px;right:25px;font:8px 'DM Sans',sans-serif;letter-spacing:.18em;color:#d1e1ef}
.philosophy-copy{padding:15px 0}.philosophy-copy .eyebrow{margin-bottom:17px}
.philosophy-copy h2{font-size:clamp(34px,4.4vw,55px);font-weight:400;line-height:1.52;letter-spacing:-.045em;color:var(--blue-deep);margin:0 0 20px}
.philosophy-copy h2 em{font:italic 400 1em/1.35 var(--serif);color:var(--blue-mid);letter-spacing:-.035em}
.philosophy-lead{font-size:15px;line-height:2;color:#3f5366;margin:0 0 12px;max-width:590px}
.philosophy-body{font-size:12px;line-height:2.2;color:#73808c;margin:0;max-width:590px}
.philosophy-values{margin-top:26px;border-top:1px solid rgba(24,56,95,.18);display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding-top:17px}
.philosophy-values div{display:flex;flex-direction:column;gap:8px}.philosophy-values span{font:10px 'DM Sans',sans-serif;color:var(--blue-mid);letter-spacing:.1em}.philosophy-values b{font-size:11px;font-weight:500;color:#3d4f5f}
.philosophy-signature{direction:ltr;text-align:right;font:italic 19px var(--serif);color:var(--blue);margin:29px 0 0}
.philosophy-signature span{font:10px 'DM Sans',sans-serif;color:#758494;margin-left:8px;letter-spacing:.08em}
@keyframes hero-in{from{transform:scale(1.07);opacity:.78}to{transform:scale(1.015);opacity:1}}
@media(max-width:900px){.section-pad{padding-right:7%;padding-left:7%}.main-nav{gap:20px}.intro{grid-template-columns:.5fr 2fr 1.1fr;gap:3%}.menu-panel{gap:6%}.visit-left{padding-right:8%}.philosophy-inner{gap:7%;grid-template-columns:.84fr 1.16fr}.philosophy-mark{min-height:360px}}
@media(max-width:680px){
 .topline{padding:0 5%;font-size:9px}.topline-center{display:none}
 .site-header{height:73px;padding:0 5%}.wordmark{font-size:25px}.main-nav{display:none;position:absolute;top:72px;right:0;left:0;background:var(--paper);padding:21px 7%;border-bottom:1px solid var(--line);flex-direction:column;gap:19px}.main-nav.open{display:flex}
 .header-cta{margin-right:auto;margin-left:23px;font-size:11px}.menu-toggle{display:flex;width:31px;height:31px;border:0;background:transparent;padding:7px 3px;flex-direction:column;justify-content:center;gap:6px;order:3}.menu-toggle span{height:1px;width:23px;background:var(--ink)}
 .hero{min-height:680px;height:calc(90vh - 73px);max-height:800px}.hero-photo img{object-position:56% center}.hero-shade{background:linear-gradient(0deg,rgba(12,35,62,.85),rgba(17,43,72,.4) 70%,rgba(17,43,72,.13))}.hero-copy{right:8%;left:8%;top:auto;bottom:15%;transform:none}.hero h1{font-size:clamp(56px,13vw,78px)}.hero-description{font-size:13px;max-width:310px}.hero-caption{right:8%;bottom:26px}.vertical-note{left:6%;bottom:27px;font-size:7px}
 .intro{padding-top:79px;padding-bottom:79px;grid-template-columns:1fr;gap:17px}.intro-label{padding-top:0;align-items:center}.intro-label br{display:none}.intro-label .tiny-mark{font-size:17px}.intro h2{font-size:35px;line-height:1.55}.intro-aside{padding-top:4px;max-width:410px}.intro-aside p{font-size:12px}
 .menu-section{padding-top:72px}.menu-head{grid-template-columns:1fr;gap:20px;padding-bottom:37px}.menu-title h2{font-size:57px}.menu-tabs{justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding:0 6% 18px}.menu-tab{white-space:nowrap;padding:10px 12px;font-size:11px}.menu-panel{grid-template-columns:1fr;gap:18px;padding-top:29px;padding-bottom:31px}.category-mark{font-size:29px;margin-bottom:10px}.menu-category-intro .eyebrow{margin-bottom:8px}.menu-category-intro h3{font-size:25px}.menu-authentic{margin-top:14px;padding-top:11px}.menu-items{grid-template-columns:1fr;column-gap:0}.menu-item{min-height:59px}.item-name b{font-size:13px}.menu-foot{flex-direction:column;gap:8px;font-size:9px;padding-top:13px}
 .blue-band{min-height:220px}.blue-band p{font-size:40px}.quote-star{left:7%;bottom:22px}
 .philosophy-section{padding:66px 0 72px}.philosophy-inner{grid-template-columns:1fr;gap:30px}.philosophy-mark{min-height:250px}.philosophy-monogram{font-size:113px}.mark-caption{bottom:17px;right:17px}.philosophy-copy h2{font-size:36px}.philosophy-lead{font-size:13px}.philosophy-body{font-size:11px}.philosophy-values{gap:8px}.philosophy-values b{font-size:10px}.philosophy-signature{margin-top:22px}
 .gallery{padding-top:76px;padding-bottom:82px}.gallery-heading{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:24px}.gallery-heading h2{font-size:36px}.photo-gallery{grid-template-columns:1fr;gap:13px}.gallery-store{height:340px;min-height:260px}.gallery-drink{height:400px;min-height:300px}
 .visit{grid-template-columns:1fr}.visit-left{padding:70px 8% 62px}.visit h2{font-size:66px}.visit-right{padding:40px 7%;min-height:400px}.visit-card{padding:33px 27px 28px}.visit-symbol{left:24px;top:25px}
 .footer{padding:27px 7% 17px}.footer-top{grid-template-columns:1fr auto;gap:15px 8px}.footer-brand{justify-self:start}.footer-tagline{grid-column:1/-1;grid-row:2;justify-self:start;font-size:10px}.footer-social{grid-column:2;grid-row:1;gap:7px}.footer-social .social-icon{width:36px;height:36px}.footer-bottom{margin-top:17px;gap:12px}.made-by{font-size:10px}.made-by a{font-size:11px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.menu-item,.menu-item::before,.menu-tab{transition:none!important;transform:none!important;animation:none!important}.menu-item{opacity:1!important}.menu-item:hover,.menu-item:focus-within{box-shadow:none}.philosophy-section *{scroll-behavior:auto}}