/* Babylonia Cafe — "Guest in the Home": El Messiri + Faustina; night/parchment/jewel/gold */
@font-face{font-family:'El Messiri';font-weight:500;font-display:swap;src:url(../fonts/el-messiri-500.woff2) format('woff2')}
@font-face{font-family:'El Messiri';font-weight:600;font-display:swap;src:url(../fonts/el-messiri-600.woff2) format('woff2')}
@font-face{font-family:'Faustina';font-weight:400;font-display:swap;src:url(../fonts/faustina-400.woff2) format('woff2')}
@font-face{font-family:'Faustina';font-weight:600;font-display:swap;src:url(../fonts/faustina-600.woff2) format('woff2')}
:root{--night:#1A0F18;--parch:#F3E6D0;--jewel:#6B2D5B;--gold:#E0C04A;--teal:#1F6B5C;--s1:8px;--s2:16px;--s3:24px;--s4:40px;--s5:64px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-bottom:96px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--night);color:var(--parch);font-family:'Faustina',Georgia,serif;font-size:1.125rem;line-height:1.7}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{font-family:'El Messiri',serif;font-weight:600;line-height:1.15;margin:0 0 var(--s2)}
h1{font-size:clamp(2.25rem,6vw,3.25rem);font-weight:500}
h2{font-size:clamp(1.75rem,4vw,2.125rem)}
h3{font-size:1.375rem}
p{margin:0 0 var(--s2)}
a{color:inherit}
.num{white-space:nowrap}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--gold);color:var(--night);padding:12px 16px;z-index:9}.skip:focus{left:8px}
.top,main>section,.band{width:min(1080px,100% - 40px);margin-inline:auto}
.top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--s1);padding:var(--s2) 0}
.brand{font-family:'El Messiri',serif;font-size:1.4rem;font-weight:600;text-decoration:none;min-height:44px;display:inline-flex;align-items:center;color:var(--gold)}
.top nav{display:flex;gap:2px}
.top nav a{min-height:44px;min-width:44px;padding:0 12px;display:inline-flex;align-items:center;text-decoration:none;opacity:.85}
.top nav a:hover{opacity:1;text-decoration:underline;text-underline-offset:5px}
.hero{padding:var(--s4) 0 var(--s5)}
.hero-stage{display:grid;gap:var(--s4);align-items:center}
@media (min-width:800px){.hero-stage{grid-template-columns:140px 1fr;gap:var(--s5)}}
.lamp{width:120px;color:var(--gold);justify-self:center}
.lamp .glow{fill:var(--gold);opacity:.25;animation:glow 2.2s ease-in-out 1}
.lamp .steam{opacity:0;animation:steam 2.4s ease-out .3s 1 forwards}
.lamp .steam.s2{animation-delay:.55s}
@keyframes glow{0%,100%{opacity:.2}40%{opacity:.55}}
@keyframes steam{from{opacity:0;transform:translateY(8px)}50%{opacity:.7}to{opacity:.35;transform:translateY(-6px)}}
.eyebrow{letter-spacing:.08em;text-transform:uppercase;font-size:.85rem;color:var(--gold);margin-bottom:var(--s1)}
.lede{max-width:36em;opacity:.92}
.actions{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s3)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;min-height:50px;padding:12px 24px;text-decoration:none;font-weight:600;border-radius:4px;font-family:'Faustina',serif}
.btn-main{background:var(--gold);color:var(--night)}
.btn-main:hover{filter:brightness(1.05)}
.btn-line{border:2px solid var(--parch);background:transparent;color:var(--parch)}
.bands{display:flex;flex-direction:column;gap:var(--s5);padding:var(--s4) 0}
.band{display:grid;gap:var(--s3)}
@media (min-width:780px){.band{grid-template-columns:1fr 1.1fr;align-items:center}.band-alt{direction:rtl}.band-alt>*{direction:ltr}}
.band img{border-radius:6px;border:1px solid rgba(224,192,74,.25);width:100%;object-fit:cover;max-height:420px}
.band h2{color:var(--gold)}
.gallery{display:grid;gap:var(--s2);grid-template-columns:1fr 1fr;padding:var(--s3) 0 var(--s5);width:min(1080px,100% - 40px);margin-inline:auto}
.gallery img{width:100%;height:220px;object-fit:cover;border-radius:6px}
.quotes{padding:var(--s4) 0;display:grid;gap:var(--s4)}
@media (min-width:800px){.quotes{grid-template-columns:1fr 1fr}}
.quotes figure{margin:0;padding:var(--s3);background:var(--jewel);border-radius:8px;border-top:3px solid var(--gold)}
.quotes blockquote{margin:0 0 var(--s2)}
.quotes blockquote p{margin:0;font-size:1.05rem}
.quotes figcaption{opacity:.85;font-size:.95rem}
.visit{padding:var(--s5) 0;border-top:1px solid rgba(243,230,208,.15)}
.visit address{font-style:normal;margin-bottom:var(--s3)}
.hours{margin-bottom:var(--s3)}
.hours h3{color:var(--gold);margin-bottom:4px}
.foot{padding:var(--s3) 20px 120px;text-align:center;opacity:.7;font-size:.95rem}
.bar{position:fixed;left:0;right:0;bottom:0;display:flex;gap:8px;justify-content:center;padding:12px 10px;background:rgba(26,15,24,.94);border-top:1px solid rgba(224,192,74,.35);z-index:8}
.bar .btn{flex:1;max-width:280px;min-width:0;padding:12px 10px;font-size:.95rem}
@media(max-width:360px){.bar{gap:6px;padding:10px 8px}.bar .btn{padding:12px 6px;font-size:.875rem}}
