/* Mobile-first shell — black nav so transparent logo sits on brand black */
.site-header{
  position:fixed;
  inset-inline:0;
  top:0;
  z-index:40;
  height:calc(var(--header-h) + var(--safe-top));
  padding-top:var(--safe-top);
  background:#0a0a0a;
  border-bottom:1px solid rgba(224,161,148,.18);
  overflow:hidden;
  transition:box-shadow .25s var(--ease-soft), background .25s var(--ease-soft);
}
.site-header.is-scrolled{
  background:#000;
  box-shadow:0 8px 28px -8px rgba(0,0,0,.55);
  border-bottom-color:rgba(224,161,148,.28);
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  height:var(--header-h);
  min-height:var(--header-h);
  max-height:var(--header-h);
  overflow:hidden;
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:.65rem;
  text-decoration:none;
  color:#F7EAE5;
  min-width:0;
  max-height:100%;
}
.site-header .brand picture{
  display:block;
  flex-shrink:0;
  width:88px;
  height:88px;
  line-height:0;
  overflow:hidden;
  border-radius:50%;
}
.site-header .brand-logo,
.site-header .brand picture img.brand-logo{
  width:88px !important;
  height:88px !important;
  max-width:88px !important;
  max-height:88px !important;
  flex-shrink:0;
  border-radius:50%;
  background:#0a0a0a;
  object-fit:contain;
  border:1px solid rgba(224,161,148,.35);
}
@media (min-width:480px){
  .brand{gap:.85rem}
}
@media (min-width:768px){
  .site-header .brand picture{
    width:96px;
    height:96px;
  }
  .site-header .brand-logo,
  .site-header .brand picture img.brand-logo{
    width:96px !important;
    height:96px !important;
    max-width:96px !important;
    max-height:96px !important;
  }
}
.brand-text{min-width:0}
.brand-name{
  display:block;
  font-family:var(--font-display);
  font-size:clamp(1.15rem,4vw,1.35rem);
  font-weight:600;
  line-height:1;
  color:#F7EAE5;
  white-space:nowrap;
}
.brand-sub{
  display:block;
  margin-top:.2rem;
  font-size:.6rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#C9B0A9;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
@media (min-width:400px){
  .brand-sub{font-size:.65rem; letter-spacing:.16em}
}
.nav-desktop{display:none; align-items:center; gap:.25rem}
.nav-desktop a{
  text-decoration:none;
  color:#C9B0A9;
  font-weight:500;
  padding:.55rem 1rem;
  border-radius:var(--r-pill);
  min-height:44px;
  display:inline-flex;
  align-items:center;
  transition:all .25s var(--ease-soft);
}
.nav-desktop a:hover,
.nav-desktop a.is-active{color:#FFFBF8; background:rgba(224,161,148,.18)}
.header-actions{display:flex; align-items:center; gap:.5rem; flex-shrink:0}
.nav-toggle{
  width:44px; height:44px; border-radius:50%;
  border:1px solid rgba(224,161,148,.35); background:#141414;
  display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
  cursor:pointer; touch-action:manipulation;
}
.nav-toggle span{display:block; width:16px; height:1.5px; background:#F7EAE5; border-radius:99px}
@media (min-width:960px){
  .nav-desktop{display:flex}
  .nav-toggle{display:none}
}
.hide-sm{display:none}
@media (min-width:640px){.hide-sm{display:inline-flex}}

.mobile-nav{
  position:fixed; inset:0; z-index:60;
  background:rgba(0,0,0,.55); backdrop-filter:blur(4px);
}
.mobile-nav[hidden]{display:none!important}
.mobile-nav-panel{
  position:absolute; right:0; top:0; height:100%;
  width:min(100%,360px);
  background:#0a0a0a;
  border-radius:32px 0 0 32px;
  padding:max(1.25rem, var(--safe-top)) 1.25rem max(1.5rem, var(--safe-bottom));
  box-shadow:var(--sh-lg);
  display:flex; flex-direction:column; gap:1.25rem;
  animation:fade-up .35s var(--ease-soft);
  border-left:1px solid rgba(224,161,148,.22);
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.mobile-nav-top{display:flex; align-items:center; justify-content:space-between; gap:.75rem}
.nav-close{
  width:44px; height:44px; border-radius:50%; background:#1a1a1a;
  font-size:1.5rem; cursor:pointer; color:#F7EAE5;
  border:1px solid rgba(224,161,148,.3); flex-shrink:0;
}
.mobile-nav nav{display:flex; flex-direction:column; gap:.2rem; flex:1}
.mobile-nav nav a{
  font-family:var(--font-display);
  font-size:clamp(1.5rem,6vw,1.85rem);
  text-decoration:none;
  color:#F7EAE5;
  padding:.75rem .5rem;
  border-radius:var(--r-md);
  min-height:48px;
  display:flex;
  align-items:center;
}
.mobile-nav nav a:hover,
.mobile-nav nav a:active{background:rgba(224,161,148,.16); color:#FFFBF8}
.mobile-nav .brand-name{color:#F7EAE5}
.mobile-nav .brand-sub{color:#C9B0A9}
.mobile-nav .btn{width:100%}

/* Hero — full-bleed, brand-first, mobile stacked */
.hero{
  position:relative;
  min-height:100svh;
  min-height:100dvh;
  display:flex;
  align-items:flex-end;
  padding:calc(var(--header-h) + var(--safe-top) + 1.5rem) 0 calc(2.5rem + var(--safe-bottom));
  overflow:hidden;
}
@media (min-width:768px){
  .hero{align-items:center; padding-bottom:4.5rem}
}
.hero-media{position:absolute; inset:0}
.hero-media picture{
  position:absolute; inset:0; display:block;
}
.hero-media picture,
.hero-media img{width:100%; height:100%; object-fit:cover; object-position:62% center}
.arch-frame picture,
.arch-frame img{width:100%; aspect-ratio:4/5; object-fit:cover; transition:transform .7s var(--ease-soft)}
.gallery-item picture,
.gallery-item img{width:100%; aspect-ratio:4/5; object-fit:cover; transition:transform .7s var(--ease-soft)}
.menu-page-card picture,
.menu-page-card img{width:100%; height:auto}
.brand-logo,
.footer-brand-logo,
.contact-logo{
  border-radius:50%;
  object-fit:contain;
  background:#0a0a0a;
}
@media (min-width:900px){
  .hero-media img{object-position:center}
}
.hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(255,251,248,.35) 0%, rgba(255,251,248,.82) 48%, rgba(255,251,248,.96) 100%),
    radial-gradient(70% 55% at 80% 20%, rgba(252,210,174,.22), transparent 65%);
}
@media (min-width:768px){
  .hero-media::after{
    background:
      linear-gradient(105deg, rgba(255,251,248,.94) 0%, rgba(255,251,248,.78) 42%, rgba(58,40,38,.28) 100%),
      radial-gradient(60% 60% at 70% 40%, rgba(252,210,174,.28), transparent 70%);
  }
}
.hero-blob{position:absolute; border-radius:50%; filter:blur(80px); pointer-events:none; display:none}
@media (min-width:768px){
  .hero-blob{display:block}
  .hero-blob.a{left:-6rem; top:6rem; width:18rem; height:18rem; background:rgba(254,228,204,.5)}
  .hero-blob.b{right:2rem; bottom:2rem; width:20rem; height:20rem; background:rgba(245,213,206,.45)}
}
.hero-copy{position:relative; width:100%; max-width:36rem}
.hero-copy .text-script{
  font-size:clamp(1.55rem,6vw,2.5rem);
  color:var(--rose-700);
  margin-bottom:.35rem;
  text-shadow:0 1px 0 rgba(255,251,248,.7);
}
.hero-brand-mark{
  width:72px; height:72px; border-radius:50%;
  margin-bottom:.85rem;
  border:1px solid rgba(224,161,148,.35);
  background:#0a0a0a;
  object-fit:contain;
  box-shadow:var(--sh-sm);
}
@media (min-width:768px){
  .hero-brand-mark{width:88px; height:88px; margin-bottom:1rem}
}
.hero-location{
  display:block;
  margin-top:.5rem;
  font-family:var(--font-display);
  font-weight:500;
  font-size:clamp(1.05rem,3.5vw,1.35rem);
  color:var(--ink-muted);
  letter-spacing:.02em;
}
.hero-actions{
  display:flex;
  flex-direction:column;
  gap:.75rem;
  margin-top:1.5rem;
  width:100%;
}
.hero-actions .btn{width:100%; justify-content:center}
@media (min-width:480px){
  .hero-actions{
    flex-direction:row;
    flex-wrap:wrap;
    width:auto;
  }
  .hero-actions .btn{width:auto}
}
@media (min-width:768px){
  .hero-actions{margin-top:2rem}
}

/* Marquee */
.marquee{overflow:hidden; border-block:1px solid var(--line); background:var(--peach-100); padding:.85rem 0}
@media (min-width:768px){.marquee{padding:1rem 0}}
.marquee-track{
  display:flex; width:max-content; gap:2rem;
  animation:marquee 28s linear infinite; white-space:nowrap; padding-inline:1rem;
}
@media (min-width:768px){.marquee-track{gap:2.5rem}}
.marquee-track span{
  font-family:var(--font-display);
  font-size:clamp(1.05rem,3vw,1.25rem);
  font-style:italic;
  color:var(--ink-muted);
}
.marquee-track i{color:var(--rose-400); font-style:normal; margin-inline:1rem}

/* Sections — mobile-first spacing */
.section{padding:clamp(3rem,8vw,5rem) 0}
.section-alt{background:var(--bg-alt)}
.section-head{max-width:40rem; margin-inline:auto; text-align:center}
.section-head p.lead{margin-top:.85rem; margin-inline:auto}
.ornament{
  display:flex; align-items:center; justify-content:center; gap:.75rem;
  color:var(--peach-400); margin-top:1.5rem;
}
.ornament span{height:1px; flex:1; max-width:5rem; background:linear-gradient(90deg,transparent,var(--peach-400))}
@media (min-width:480px){.ornament span{max-width:7rem}}
.ornament span:last-child{background:linear-gradient(270deg,transparent,var(--peach-400))}

.service-grid{display:grid; gap:1rem; margin-top:2rem}
@media (min-width:640px){.service-grid{grid-template-columns:repeat(2,1fr); margin-top:2.5rem}}
@media (min-width:1024px){.service-grid{grid-template-columns:repeat(4,1fr); gap:1.5rem; margin-top:3rem}}
.service-card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:1.25rem; box-shadow:var(--sh-xs); height:100%;
}
@media (min-width:480px){.service-card{padding:1.5rem}}
@media (hover:hover){.service-card:hover{border-color:var(--rose-200)}}
.service-icon{
  width:48px; height:48px; border-radius:50%; background:var(--rose-100); color:var(--rose-700);
  display:grid; place-items:center; margin-bottom:1rem;
  transition:transform .3s var(--ease-spring);
}
@media (hover:hover){.service-card:hover .service-icon{transform:scale(1.1)}}
.service-card h3{font-family:var(--font-body); font-size:1.1rem; font-weight:600}
.service-card p{margin-top:.5rem; font-size:.875rem; color:var(--ink-muted)}

.split{display:grid; gap:2rem; align-items:center}
@media (min-width:960px){.split{grid-template-columns:1fr 1fr; gap:4rem}}
.arch-frame{
  position:relative; border-radius:999px 999px 24px 24px; overflow:hidden; box-shadow:var(--sh-lg);
}
.arch-frame picture{display:block; width:100%}
.arch-frame picture,
.arch-frame img{width:100%; aspect-ratio:4/5; object-fit:cover; transition:transform .7s var(--ease-soft)}
.media-zoom{overflow:hidden}
@media (hover:hover){
  .media-zoom:hover img{transform:scale(1.04)}
}
.arch-offset{
  position:absolute; inset:-10px;
  border-radius:999px 999px 28px 28px;
  background:rgba(254,228,204,.7); z-index:-1;
}
@media (min-width:480px){.arch-offset{inset:-12px}}
.checklist{list-style:none; padding:0; margin:1.5rem 0 0; display:grid; gap:.75rem}
.checklist li{display:flex; align-items:flex-start; gap:.75rem; font-size:.95rem}
.checklist li::before{
  content:""; width:10px; height:10px; margin-top:.45rem;
  border-radius:50%; background:var(--rose-500); box-shadow:var(--sh-glow); flex-shrink:0;
}

.story-grid{display:grid; gap:1rem; margin-top:2rem}
@media (min-width:768px){.story-grid{grid-template-columns:repeat(3,1fr); gap:1.5rem; margin-top:3rem}}
.story-card{
  background:var(--blush); border-radius:var(--r-lg);
  padding:1.35rem; box-shadow:var(--sh-xs); height:100%;
}
@media (min-width:480px){.story-card{padding:1.75rem}}

.cta-band{
  border-radius:var(--r-xl);
  background-image:var(--grad-glow);
  padding:2rem 1.25rem;
  text-align:center;
  box-shadow:var(--sh-glow);
  position:relative;
  overflow:hidden;
}
@media (min-width:768px){.cta-band{padding:4rem}}
.cta-band .text-script{font-size:clamp(1.55rem,4vw,2.5rem); color:var(--ink-deep)}
.cta-band .actions{
  display:flex; flex-direction:column; gap:.75rem; margin-top:1.5rem;
}
.cta-band .actions .btn{width:100%}
@media (min-width:480px){
  .cta-band .actions{
    flex-direction:row; flex-wrap:wrap; justify-content:center;
  }
  .cta-band .actions .btn{width:auto}
}

/* Menu page */
.page-hero{
  padding:calc(var(--header-h) + var(--safe-top) + 2rem) 0 2rem;
  background:var(--grad-blush);
  text-align:center;
}
@media (min-width:768px){.page-hero{padding-top:calc(var(--header-h) + 3rem); padding-bottom:2.5rem}}
.page-hero .lead{max-width:40rem; margin:1rem auto 0}
.menu-actions{
  display:flex; flex-direction:column; gap:.75rem;
  margin-top:1.35rem; align-items:stretch;
}
.menu-actions .btn{width:100%}
@media (min-width:480px){
  .menu-actions{flex-direction:row; flex-wrap:wrap; justify-content:center; align-items:center}
  .menu-actions .btn{width:auto}
}
.menu-pages{display:grid; gap:1.25rem; margin-top:1.75rem}
@media (min-width:768px){.menu-pages{grid-template-columns:repeat(2,1fr); gap:1.5rem; margin-top:2rem}}
.menu-page-card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  overflow:hidden; box-shadow:var(--sh-xs);
}
.menu-page-card img{width:100%; height:auto}
.menu-page-card figcaption{padding:1rem 1.15rem; font-size:.875rem; color:var(--ink-muted)}
.price-highlights{display:grid; gap:1rem; margin-top:2rem}
@media (min-width:768px){.price-highlights{grid-template-columns:repeat(3,1fr); margin-top:2.5rem}}
.price-card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:1.25rem; box-shadow:var(--sh-xs);
}
@media (min-width:480px){.price-card{padding:1.5rem}}
.price-card h3{font-family:var(--font-display); font-size:1.35rem; margin-bottom:.75rem}
.price-card ul{list-style:none; padding:0; margin:0; display:grid; gap:.55rem}
.price-card li{
  display:flex; justify-content:space-between; gap:.75rem;
  font-size:.9rem; border-bottom:1px dashed var(--line); padding-bottom:.45rem;
}
.price-card li span:last-child{color:var(--rose-700); font-weight:600; white-space:nowrap}

/* Gallery — 2-col mobile, 3-col tablet+ */
.gallery-grid{display:grid; gap:.75rem; grid-template-columns:repeat(2,1fr)}
@media (min-width:768px){.gallery-grid{grid-template-columns:repeat(3,1fr); gap:1.25rem}}
.gallery-item{
  margin:0; border-radius:var(--r-md); overflow:hidden; background:var(--sand);
  border:1px solid var(--line); box-shadow:var(--sh-xs); position:relative;
}
@media (min-width:480px){.gallery-item{border-radius:var(--r-lg)}}
.gallery-item img{width:100%; aspect-ratio:4/5; object-fit:cover; transition:transform .7s var(--ease-soft)}
@media (hover:hover){.gallery-item:hover img{transform:scale(1.04)}}
.gallery-item figcaption{
  position:absolute; inset:auto 0 0 0;
  padding:.85rem .65rem .65rem;
  background:linear-gradient(180deg, transparent, rgba(58,40,38,.6));
  color:#FFFBF8; font-size:.72rem; font-weight:500; line-height:1.3;
}
@media (min-width:480px){
  .gallery-item figcaption{padding:1.15rem 1rem .85rem; font-size:.85rem}
}
.gallery-item.wide{grid-column:span 2}
@media (min-width:768px){.gallery-item.wide{grid-column:span 2}}

/* Contact */
.contact-grid{display:grid; gap:1.5rem}
@media (min-width:960px){.contact-grid{grid-template-columns:1fr 1.1fr; gap:2.5rem; align-items:start}}
.contact-card{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r-xl);
  padding:1.35rem; box-shadow:var(--sh-sm);
}
@media (min-width:480px){.contact-card{padding:1.75rem}}
.contact-list{list-style:none; padding:0; margin:1.35rem 0 0; display:grid; gap:1rem}
.contact-list li{display:grid; gap:.25rem}
.contact-list strong{font-size:.75rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-subtle)}
.contact-list a,.contact-list span{font-size:1rem; color:var(--ink); text-decoration:none; font-weight:500; word-break:break-word}
.contact-list a:hover{color:var(--rose-700)}
.contact-actions{
  display:flex; flex-direction:column; gap:.75rem; margin-top:1.5rem;
}
.contact-actions .btn{width:100%; justify-content:center}
@media (min-width:480px){
  .contact-actions{flex-direction:row; flex-wrap:wrap}
  .contact-actions .btn{width:auto}
}
.map-frame{
  border:0; width:100%; min-height:280px; border-radius:var(--r-xl);
  box-shadow:var(--sh-md); border:1px solid var(--line); background:var(--sand);
}
@media (min-width:480px){.map-frame{min-height:360px}}
@media (min-width:960px){.map-frame{min-height:420px}}
.faq{margin-top:2rem; display:grid; gap:.75rem}
@media (min-width:768px){.faq{margin-top:3rem}}
.faq details{
  background:var(--surface); border:1px solid var(--line); border-radius:20px;
  padding:1rem 1.15rem;
  transition:background .25s var(--ease-soft), border-color .25s var(--ease-soft);
}
.faq details[open]{background:var(--rose-50); border-color:var(--rose-200)}
.faq summary{
  cursor:pointer; font-weight:600; list-style:none;
  display:flex; justify-content:space-between; align-items:flex-start; gap:1rem;
  min-height:44px; font-size:.95rem;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; color:var(--rose-600); font-size:1.25rem; flex-shrink:0; line-height:1}
.faq details[open] summary::after{content:"×"}
.faq p{margin-top:.75rem; color:var(--ink-muted); font-size:.95rem}

/* Footer */
.site-footer{
  background:var(--blush);
  padding-top:2.5rem;
  margin-top:1.5rem;
  padding-bottom:calc(4.5rem + var(--safe-bottom));
}
@media (min-width:768px){
  .site-footer{padding-top:3rem; margin-top:2rem; padding-bottom:0}
}
.footer-grid{display:grid; gap:1.75rem; padding-bottom:2rem}
@media (min-width:640px){.footer-grid{grid-template-columns:1fr 1fr; gap:2rem}}
@media (min-width:960px){.footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr; padding-bottom:2.5rem}}
.footer-tagline{font-size:clamp(1.25rem,4vw,1.5rem); color:var(--rose-600); margin:.75rem 0 .5rem}
.footer-heading{font-family:var(--font-body); font-size:1rem; margin-bottom:.85rem}
.footer-address{font-style:normal; color:var(--ink-muted); line-height:1.7; font-size:.95rem}
.footer-links{list-style:none; padding:0; margin:0; display:grid; gap:.45rem}
.footer-links a{
  color:var(--ink-muted); text-decoration:none; font-size:.9rem;
  display:inline-flex; min-height:40px; align-items:center;
}
.footer-links a:hover{color:var(--rose-700)}
.footer-bottom{
  display:flex; flex-direction:column; gap:.35rem; border-top:1px solid var(--line);
  padding:1.15rem 0 1.4rem; font-size:.8125rem; color:var(--ink-subtle);
}
.footer-credit{margin-top:.15rem}
@media (min-width:640px){
  .footer-bottom{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:.35rem 1rem;
    align-items:center;
  }
  .footer-bottom p:nth-child(2){text-align:right}
  .footer-credit{grid-column:1 / -1; text-align:center; margin-top:.5rem}
}
.contact-logo{margin-inline:auto; box-shadow:var(--sh-sm)}
.page-hero .contact-logo{margin-bottom:1rem}
.footer-brand-logo{width:56px; height:56px; padding:4px; box-sizing:border-box}
@media (min-width:480px){.footer-brand-logo{width:64px; height:64px}}

.fab-whatsapp{
  position:fixed;
  right:max(.85rem, env(safe-area-inset-right));
  bottom:max(.85rem, env(safe-area-inset-bottom));
  z-index:50;
  width:52px; height:52px; border-radius:50%;
  background:#25D366; color:#fff; display:grid; place-items:center;
  box-shadow:var(--sh-lg); text-decoration:none;
  transition:transform .25s var(--ease-soft);
  -webkit-tap-highlight-color:transparent;
}
@media (min-width:480px){.fab-whatsapp{width:56px; height:56px}}
@media (hover:hover){.fab-whatsapp:hover{transform:translateY(-3px) scale(1.04); color:#fff}}

.breadcrumbs{font-size:.8rem; color:var(--ink-subtle); margin-bottom:.85rem}
.breadcrumbs a{color:var(--ink-muted); text-decoration:none}
.breadcrumbs a:hover{color:var(--rose-700)}

/* Utility: prevent accidental overflow on tiny screens */
@media (max-width:359px){
  .brand-sub{display:none}
  .display{font-size:1.9rem}
}