/* Balance Therapy – Modern RTL design system */
/* Palette: Teal #2BB1A8, Sage #9CC5A1, Off-white #F7F1EC, Lavender #A68AC8, Charcoal #2E2E2E */

:root{
  /* Colors */
  --teal:#2BB1A8;
  --sage:#9CC5A1;
  --off:#F7F1EC;
  --lav:#A68AC8;
  --charcoal:#2E2E2E;
  --ink:var(--charcoal);
  --muted:#6f6f6f;
  --card:#ffffff;

  /* Elevation + Radii */
  --radius:16px;
  --radius-sm:12px;
  --shadow-sm:0 6px 16px rgba(0,0,0,.06);
  --shadow:0 12px 32px rgba(0,0,0,.10);

  /* Spacing */
  --space-1:6px;
  --space-2:10px;
  --space-3:14px;
  --space-4:18px;
  --space-5:24px;
  --space-6:32px;
  --space-7:48px;
  --space-8:72px;

  /* Typography */
  --font-body:'Assistant', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --font-heading:'Heebo', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --fs-1: clamp(28px, 4vw, 48px);
  --fs-2: clamp(22px, 2.4vw, 34px);
  --fs-3: clamp(18px, 1.8vw, 22px);
  --fs-4: 16px;
  --header-h: 76px;
}

*{box-sizing:border-box}
html,body{margin:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  line-height:1.7;
  color:var(--ink);
  background:linear-gradient(180deg, rgba(156,197,161,.12), rgba(247,241,236,1) 22%, rgba(247,241,236,1));
  background-attachment:fixed;
}

/* Links & Focus */
a{color:var(--teal);text-decoration:none}
a:hover{text-decoration:underline}
:focus{outline:none}
:focus-visible{outline:3px solid var(--lav);outline-offset:2px}

/* Utilities */
.container{max-width:1100px;margin:0 auto;padding:clamp(14px,3vw,28px)}
.grid{display:grid;gap:clamp(14px,2vw,24px)}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}
.section{padding:clamp(30px,5vw,64px) 0}
.section.accent{background:linear-gradient(135deg, rgba(43,177,168,.05), rgba(166,138,200,.06))}
.section.highlight{background:linear-gradient(135deg, rgba(156,197,161,.18), rgba(43,177,168,.08))}
.muted{color:var(--muted)}
.price{font-size:var(--fs-3);color:var(--ink)}
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;border:0;padding:0;clip:rect(0 0 0 0);overflow:hidden}
.ltr{direction:ltr;unicode-bidi:bidi-override}

/* Buttons */
.btn{display:inline-block;border:0;border-radius:999px;font-weight:700;padding:.9rem 1.25rem;cursor:pointer;transition:transform .06s ease, box-shadow .2s ease}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--teal);color:#fff;box-shadow:var(--shadow-sm)}
.btn-primary:hover{box-shadow:var(--shadow)}
.btn-outline{background:transparent;border:2px solid var(--teal);color:var(--teal)}
.btn-ghost{background:transparent;border:2px solid rgba(46,46,46,.12);color:var(--ink)}
.btn-link{background:transparent;color:var(--teal);padding:.2rem 0}
.btn.sm{padding:.55rem .9rem}

/* Cards */
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:clamp(16px,2vw,24px);color:var(--ink)}
.media-card{overflow:hidden}
.media-card img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius)}

/* Badges, chips, pills */
.badge{display:inline-flex;gap:.5rem;align-items:center;background:rgba(43,177,168,.12);padding:.45rem .75rem;border-radius:999px;color:var(--teal);font-weight:700}
.trust{display:flex;gap:10px;flex-wrap:wrap;margin-top:1rem;padding:0}
.trust .chip{list-style:none;background:#fff;border:1px solid #ececec;border-radius:999px;padding:.35rem .65rem;color:#333}

/* Header / Nav */
.skip-link{position:absolute;inset-inline-start:10px;top:-40px;background:var(--lav);color:#fff;padding:8px 12px;border-radius:8px;z-index:1000;transition:top .2s}
.skip-link:focus{top:10px}
.site-header{z-index:20;background:transparent;backdrop-filter:none;border-bottom:0}
.header-wrap{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:8px;min-height:auto;position:relative;padding:8px 0}
.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}
.brand .logo{
  display:inline-block;
  width:36px;
  height:36px;
  background-image:url('https://i.ibb.co/cc771RB4/50087f0631b3.png');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  border-radius:10px;
  flex:0 0 36px;
  box-shadow:0 2px 8px rgba(0,0,0,.08);
}
.brand .brand-text{display:flex;flex-direction:column;line-height:1}
.brand .brand-text small{color:var(--muted);font-size:.9rem}
.nav-toggle{display:none;background:transparent;border:0;cursor:pointer;padding:10px;border-radius:10px}
.nav-toggle .bar{display:block;width:22px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px}
.nav .menu{display:flex;align-items:center;justify-content:center;gap:14px;list-style:none;margin:0;padding:0}
.site-header .nav{width:100%}
.nav .menu a{font-weight:600}
.nav .menu .divider{width:1px;height:22px;background:rgba(46,46,46,.15);margin-inline:2px}

/* Emphasized brand card in header */
.site-header .brand{
  background:transparent;
  padding:0;
  border-radius:0;
  box-shadow:none;
  transform:none;
  position:relative;
  z-index:120;
}

/* Header logo: inline on the right, vertically centered within header-top */
.site-header .site-logo{
  position:static;
  transform:none;
  display:inline-block;
  width: clamp(64px, 7vw, 80px);
  aspect-ratio: 1 / 1;
  background-image:url('https://i.ibb.co/cc771RB4/50087f0631b3.png');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  border-radius:12px;
  box-shadow:0 2px 8px rgba(0,0,0,.08);
}

/* Header container: no extra padding; nav sits on its own row */
.site-header .header-wrap{
  padding-inline-end: 0;
}

/* Header top row: brand text to the left of logo (RTL-friendly), actions pushed to the far start */
.header-top{display:flex;align-items:center;justify-content:flex-end;gap:12px}
.header-top .header-actions{margin-inline-start:auto}
.header-top .brand{color:inherit;text-decoration:none}
.header-top .brand .brand-text{display:flex;flex-direction:column;line-height:1}
.header-top .brand .brand-text strong{font-size:clamp(1.35rem, 2.4vw, 1.8rem)}
.header-top .brand .brand-text small{font-size:clamp(1.05rem, 1.6vw, 1.2rem);color:var(--muted)}
.site-header .brand .logo{
  width:68px;
  height:68px;
  flex:0 0 68px;
  border-radius:12px;
}
.site-header .brand .brand-text strong{
  font-size:clamp(1.35rem, 2.8vw, 2rem);
}
.site-header .brand .brand-text small{
  font-size:clamp(1.05rem, 1.8vw, 1.2rem);
}

/* Stack brand title and subtitle above the logo */
.header-top .brand-stack{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:6px;
}
.header-top .brand-stack .brand-text{
  line-height:1.05;
  margin-bottom: 8px;
}
.header-top .brand-stack .brand-text strong{
  line-height:1.1;
}
.header-top .brand-stack .brand-text small{
  color:var(--muted);
}

/* Tweak logo size when stacked under text */
.brand-stack .site-logo{
  width: clamp(80px, 11vw, 180px);
  aspect-ratio: 1 / 1;
  height: auto;
  border-radius: 12px;
  margin-top: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
}

/* Language switcher */
.nav .menu .lang-switch{display:flex;align-items:center;gap:8px}
.nav .menu .lang-switch .lang-btn{
  background:transparent;
  border:1.5px solid rgba(46,46,46,.18);
  border-radius:999px;
  padding:.22rem .52rem;
  font-weight:800;
  font-size:.8rem;
  line-height:1;
  color:var(--ink);
  cursor:pointer;
}
.nav .menu .lang-switch .lang-btn[aria-pressed="true"],
.nav .menu .lang-switch .lang-btn.active{
  background:var(--lav);
  color:#fff;
  border-color:transparent;
}

/* Language switcher (inside hero, static top-left) */
.lang-switcher{
  display:inline-flex;
  gap:8px;
  background:rgba(247,241,236,.92);
  backdrop-filter:saturate(120%) blur(8px);
  padding:6px 12px;
  margin-bottom:8px;
  border-radius:999px;
  border:1px solid rgba(46,46,46,.08);
  box-shadow:var(--shadow-sm);
  position:static;
  margin-top:0;
  margin-left:24px;
  z-index:1;
}

/* Row wrapper to align the switch to the right under the header */
.lang-row{
  display:flex;
  justify-content:flex-end; /* RTL-friendly: aligns to the right edge */
  margin-top:8px;
}
.lang-switcher .lang-btn{
  background:transparent;
  border:1.5px solid rgba(46,46,46,.18);
  border-radius:999px;
  padding:6px 12px;
  font-weight:800;
  font-size:.8rem;
  line-height:1;
  color:var(--ink);
  cursor:pointer;
}
.lang-switcher .lang-btn[aria-pressed="true"],
.lang-switcher .lang-btn.active{
  background:var(--lav);
  color:#fff;
  border-color:transparent;
}

/* Header-embedded language switcher next to hamburger */
.site-header .header-actions{display:flex;align-items:center;gap:12px}
.site-header .header-lang-switch{
  position:relative; /* keep overlay z-index within sticky header */
  top:auto;
  inset-inline-start:auto;
  margin:0;
  z-index:500;
  box-shadow:var(--shadow-sm);
}

/* Extra-compact on very small screens */
@media (max-width:420px){
  .site-header .header-lang-switch{gap:6px;flex-wrap:wrap}
  .site-header .header-lang-switch .lang-btn{padding:.26rem .5rem;font-size:.72rem}
}

/* Hero */
.hero-section{position:relative;padding:0 0 clamp(44px,8vw,112px) 0;background:
  radial-gradient(800px 300px at 80% -10%, rgba(166,138,200,.18), transparent),
  radial-gradient(700px 400px at -10% 10%, rgba(43,177,168,.15), transparent)}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:center;margin-top:clamp(24px,6vw,56px)}
.hero-text h1{font-family:var(--font-heading);font-size:calc(var(--fs-1) * 1.15);margin:.4em 0}
.hero-text .lead{color:var(--muted);font-size:clamp(18px,2.4vw,22px)}
.cta-row{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1rem}

/* Intro Video */
.video-hero .video-frame{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);background:#000}
.video-hero .video{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:cover}

/* About Gallery */
/* Make About cards fit content height and avoid stretched equal heights */
#about .grid{align-items:start}
#about .card, #about .media-card{height:auto;min-height:0}
.about-gallery .gallery{position:relative;display:block;aspect-ratio:9/16;overflow:hidden;cursor:pointer;background:#000}
.about-gallery .gallery img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;opacity:0;transition:opacity .35s ease}
.about-gallery .gallery img.is-active{opacity:1}
.about-gallery .stories-progress{position:absolute;inset-inline:8px;top:8px;display:grid;grid-template-columns:repeat(var(--stories-count,4),1fr);gap:6px;z-index:2}
.about-gallery .stories-progress .bar{height:2px;background:rgba(255,255,255,.35);border-radius:999px;overflow:hidden}
.about-gallery .stories-progress .bar .fill{display:block;height:100%;width:0;background:#fff;opacity:.9;transition:width 2s linear}
@media (max-width:760px){
  .about-gallery .gallery{aspect-ratio:3/4}
}

/* Offers */
section.offer .container.grid{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}
section.offer .card{
  display: grid;
  gap: 12px;
}
section.offer .offer-media img{
  width: 100%;
  height: auto;
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow-sm);
  display: block;
}
section.offer .dates{
  font-size: .92rem;
}

/* Stack offers on smaller screens */
@media (max-width: 980px){
  section.offer .container.grid{
    grid-template-columns: 1fr;
  }
}

/* Services */
.service .meta{display:flex;gap:8px;margin-top:8px}
.pill{display:inline-block;padding:.2rem .6rem;border-radius:999px;background:rgba(166,138,200,.12);color:#4b3f5f;font-weight:600;font-size:.9rem}

/* Service details (expandable) */
.service-details{margin-top:8px}
.service-details summary{
  cursor:pointer;
  color:var(--teal);
  font-weight:800;
  padding:.25rem 0;
}
.service-details .list{margin-top:6px}

/* Enlarge the top service card only */
section#services .grid .card.service:first-child{
  grid-column: 1 / -1; /* take full width on desktop */
  padding: clamp(32px, 3.6vw, 56px); /* extra breathing room */
  min-height: clamp(320px, 32vh, 460px); /* visibly taller hero-like card */
}

section#services .grid .card.service:first-child h3{
  font-size: calc(var(--fs-3) * 1.5);
}

section#services .grid .card.service:first-child p{
  font-size: calc(var(--fs-4) * 1.2);
}

section#services .grid .card.service:first-child .meta{
  gap: 12px;
}

section#services .grid .card.service:first-child .pill{
  font-size: 1.05rem;
  padding: .35rem .85rem;
}

section#services .grid .card.service:first-child .cta-row{
  margin-top: 1.2rem;
}

/* Enlarge CTA inside the top card, but exclude any .translate-button */
section#services .grid .card.service:first-child .cta-row .btn:not(.translate-button){
  padding: 1rem 1.35rem;
  font-size: 1rem;
}

/* Shrink .translate-button to be compact (globally and inside top card) */
.translate-button,
.btn.translate-button{
  padding: .22rem .44rem;
  font-size: 10px;
  line-height: 1.05;
  border-radius: 999px;
}
.translate-button svg,
.translate-button img{
  width: 10px;
  height: 10px;
}
.translate-button .icon,
.translate-button i{
  font-size: 10px;
  line-height: 1;
}
/* Ensure the top service card uses the compact translate button */
section#services .grid .card.service:first-child .translate-button,
.top-service-card .translate-button{
  padding: .22rem .44rem;
  font-size: 10px;
}

/* Responsive refinement */
@media (max-width: 980px){
  section#services .grid .card.service:first-child{
    grid-column: 1 / -1; /* full width in 2-col layout */
    min-height: clamp(260px, 30vh, 420px);
  }
}

@media (max-width: 760px){
  section#services .grid .card.service:first-child{
    padding: clamp(20px, 5vw, 32px);
    min-height: auto; /* let content define height on small screens */
  }
  section#services .grid .card.service:first-child h3{
    font-size: calc(var(--fs-3) * 1.24);
  }
  section#services .grid .card.service:first-child p{
    font-size: calc(var(--fs-4) * 1.12);
  }
  /* Keep translate button compact on mobile */
  section#services .grid .card.service:first-child .translate-button{
    font-size: 11px;
    padding: .26rem .5rem;
  }
}

/* Top service card via class for full width and larger content */
.top-service-card{
  grid-column: 1 / -1;
  padding: clamp(36px, 4.2vw, 64px);
  min-height: clamp(360px, 34vh, 520px);
}
.top-service-card h3{ font-size: calc(var(--fs-3) * 1.6); }
.top-service-card p{ font-size: calc(var(--fs-4) * 1.22); }
.top-service-card .meta{ gap: 14px; }
.top-service-card .pill{ font-size: 1.08rem; padding: .38rem .9rem; }
.top-service-card .cta-row .btn:not(.translate-button){ padding: 1.05rem 1.45rem; font-size: 1.02rem; }

/* Header site logo bigger */
.site-header .brand .site-logo{
  width: clamp(120px, 50vw, 420px);
  aspect-ratio: 1 / 1;
  height: auto;
  flex: 0 0 clamp(120px, 50vw, 420px);
  border-radius: 14px;
}

/* Hero card sizing */
.hero-card{ gap: clamp(16px, 2.6vw, 34px); }
.hero-card .hero-text h1{ font-size: calc(var(--fs-1) * 1.3); }
.hero-card .hero-text .lead{ font-size: clamp(19px, 2.8vw, 24px); }
.hero-card .hero-image .video-frame{ box-shadow: var(--shadow); }

/* Responsive tweaks */
@media (max-width: 980px){
  .top-service-card{
    grid-column: 1 / -1;
    min-height: clamp(280px, 32vh, 440px);
  }
}
@media (max-width: 760px){
  .site-header .brand .site-logo{
    width: clamp(68px, 50vw, 280px);
    aspect-ratio: 1 / 1;
    height: auto;
    flex: 0 0 clamp(68px, 50vw, 280px);
  }
  .brand-stack .site-logo{
    width: min(40vw, 120px);
  }
  .top-service-card{
    padding: clamp(18px, 4.8vw, 28px);
    min-height: auto;
  }
  .top-service-card h3{ font-size: calc(var(--fs-3) * 1.28); }
  .top-service-card p{ font-size: calc(var(--fs-4) * 1.12); }
  .top-service-card .translate-button{ font-size: 10px; padding: .24rem .44rem; }
  .hero-card .hero-text h1{ font-size: calc(var(--fs-1) * 1.12); }
  .hero-card .hero-text .lead{ font-size: clamp(18px, 4.6vw, 20px); }
}

/* Lists and process */
.list{margin:0;padding:0;list-style:none;display:grid;gap:.5rem}
.list li{position:relative;padding-inline-start:26px}
.list li::before{content:"✓";position:absolute;inset-inline-start:0;top:0;color:var(--teal);font-weight:800}
.process{counter-reset:step}
.process li{padding-inline-start:42px}
.process li::before{counter-increment:step;content:counter(step);display:inline-grid;place-items:center;position:absolute;inset-inline-start:0;top:0;width:28px;height:28px;border-radius:50%;background:var(--teal);color:#fff;font-weight:800}

/* Quotes */
.quote p{font-size:var(--fs-3);margin:0 0 8px}
.quote footer{color:var(--muted)}

/* Posts */
.post img{width:100%;height:180px;object-fit:cover;border-radius:var(--radius-sm)}
.post .post-body{margin-top:10px}

/* Forms */
.form{display:grid;gap:14px}
.form-row{display:grid;gap:6px}
label{font-weight:700}
input,textarea,select{
  border:1.5px solid rgba(46,46,46,.18);
  border-radius:12px;
  padding:.75rem .9rem;
  font-size:16px;
  background:#fff;
  color:var(--ink);
}
input:focus,textarea:focus{border-color:var(--lav);box-shadow:0 0 0 4px rgba(166,138,200,.15)}
.form-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.form-note{font-size:.95rem}
.form-status{min-height:1.5em}

/* Footer */
.site-footer{color:#5f5f5f;font-size:.98rem;background:linear-gradient(0deg, rgba(46,46,46,.04), transparent)}
.footer-grid{display:grid;grid-template-columns:1.3fr .9fr .8fr;gap:24px;align-items:start}
.footer-menu{list-style:none;margin:0;padding:0;display:grid;gap:10px}

/* Sticky CTA */
.sticky-cta{position:fixed;inset-inline:0;bottom:0;display:flex;justify-content:center;padding:.6rem;background:rgba(247,241,236,.96);box-shadow:0 -8px 20px rgba(0,0,0,.06);backdrop-filter:saturate(120%) blur(6px);z-index:15}
.sticky-cta .btn{box-shadow:var(--shadow-sm)}

/* Instagram + WhatsApp FAB stack */
.fab-stack{
  position:fixed;
  right:16px;
  bottom:calc(16px + env(safe-area-inset-bottom, 0px)); /* safe-area bottom spacing */
  display:grid;
  grid-auto-flow:row;
  gap:8px; /* requested vertical spacing */
  z-index:1000;
}
.insta-fab{
  position:static;
  width:56px;height:56px;border-radius:50%;
  display:grid;place-items:center;
  color:#fff;
  background:linear-gradient(45deg,#F58529 0%,#FEDA77 25%,#DD2A7B 50%,#8134AF 75%,#515BD4 100%);
  box-shadow:0 10px 20px rgba(0,0,0,.18);
  transition:transform .15s ease, box-shadow .2s ease;
}
.insta-fab:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(0,0,0,.22);text-decoration:none}
.insta-fab:focus-visible{outline:3px solid #fff;outline-offset:3px}
.insta-fab svg{width:26px;height:26px;display:block}

/* WhatsApp circular FAB (same size/shape as Instagram) */
.wa-fab-circle{
  position:static;
  width:56px;height:56px;border-radius:50%;
  display:grid;place-items:center;
  color:#fff;
  background:linear-gradient(45deg, #128C7E, #25D366);
  box-shadow:0 10px 20px rgba(0,0,0,.18);
  transition:transform .15s ease, box-shadow .2s ease;
}
.wa-fab-circle:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(0,0,0,.22);text-decoration:none}
.wa-fab-circle:focus-visible{outline:3px solid #fff;outline-offset:3px}
.wa-fab-circle svg{width:26px;height:26px;display:block}

/* Floating FAB stack: place FABs vertically */
.fab-stack{
  position:fixed;
  right:16px;
  bottom:calc(16px + env(safe-area-inset-bottom, 0px));
  display:flex;
  flex-direction:column; /* Instagram on top, WhatsApp below */
  gap:16px;
  z-index:1000;
}
/* Reset positioning when inside the stack container */
.fab-stack .insta-fab,
.fab-stack .wa-fab-circle{
  position:static;
  right:auto;
  bottom:auto;
}

/* Language switcher placement: absolute top-left inside hero */
.hero{ position: relative; padding-top: 72px; }
.hero-section{ position: relative; padding-top: 72px; }

.language-switcher{
  position: absolute !important;
  top: 8px;
  left: 24px;
  right: auto;
  inset-inline-start: auto;
  inset-inline-end: auto;
  transform: none !important;
  margin: 0 0 8px 0;
  z-index: 10;
  direction: ltr;
}

/* Responsive tweak: keep compact offset on small screens */
@media (max-width:760px){
  .language-switcher{ left: 16px; margin-bottom: 6px; }
}

/* Headings */
h1,h2,h3{font-family:var(--font-heading);margin:.2em 0 .6em}
h1{font-size:var(--fs-1)}
h2{font-size:var(--fs-2)}
h3{font-size:var(--fs-3)}

/* Responsive */
@media (max-width:980px){
  .grid.cols-3{grid-template-columns:repeat(2,1fr)}
  .hero-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr;gap:10px}
}
@media (max-width:760px){
  .grid.cols-3{grid-template-columns:1fr}
  .grid.cols-2{grid-template-columns:1fr}
  .nav-toggle{display:block}
  .nav .menu{
    position:fixed;inset-inline:0;top:64px; /* header approx */
    background:#fff;border-top:1px solid rgba(46,46,46,.06);
    display:grid;gap:8px;padding:18px;
    transform:translateY(-12px);opacity:0;pointer-events:none;transition:.2s ease;
    box-shadow:0 12px 24px rgba(0,0,0,.06)
  }
  .site-header.open .nav .menu{transform:none;opacity:1;pointer-events:auto}
  .nav .menu .divider{display:none}

  /* Ensure the 'קביעת תור' CTA in the mobile nav wraps to content and doesn't stretch full width */
  .nav .menu li:last-child{
    width:auto;
    min-width:0;
    justify-self:start;
    align-self:start;
  }
  .nav .menu li:last-child a.btn{
    display:inline-block;
    width:auto; /* fallback */
    inline-size:fit-content;
    max-inline-size:100%;
    white-space:normal;
    flex-grow:0;
  }

  /* Language switcher mobile compact spacing (non-sticky) */
  .lang-row{ justify-content:flex-end; }
  .lang-switcher{
    gap: 8px;
    flex-wrap: wrap;
  }
  .lang-switcher .lang-btn{
    padding: 6px 12px;
    font-size: .78rem;
  }

  /* Header brand card – mobile tweaks */
  .site-header .brand{
    transform:none;
    padding:0;
    box-shadow:none;
  }
  .site-header .brand .logo{
    width: clamp(68px, 50vw, 280px);
    aspect-ratio: 1 / 1;
    height: auto;
    flex: 0 0 clamp(68px, 50vw, 280px);
  }
  .site-header .brand .brand-text strong{
    font-size:1.25rem;
  }
  .site-header .brand .brand-text small{
    font-size:1rem;
  }
}

/* Mobile: show inline navigation beneath header and hide hamburger */
@media (max-width:768px){
  .header-wrap{
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .header-top{
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }
  .header-top .header-actions{
    order: -1;
    margin-inline-start: 0;
  }
  .nav-toggle{ display: none; }
  .nav{ width: 100%; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
  .nav .menu{
    position: static;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 8px;
    padding: 6px 0 10px;
    margin: 0;
    background: transparent;
    border: 0;
    transform: none;
    opacity: 1;
    pointer-events: auto;
    box-shadow: none;
    white-space: nowrap;
  }
  .nav .menu a{
    display: inline-block;
    padding: 8px 8px;
    font-size: .93rem;
    line-height: 1.2;
  }
  .nav .menu .divider{ display: none; }
  .nav .menu > li{ flex: 0 0 auto; }

  /* Keep the booking CTA compact and inline */
  .nav .menu li:last-child{
    width:auto;
    min-width:0;
    justify-self:start;
    align-self:start;
  }
  .nav .menu li:last-child a.btn{
    display:inline-block;
    inline-size:fit-content;
    max-inline-size:100%;
    white-space:normal;
    padding: .5rem .8rem;
    font-size: .92rem;
  }
}

/* Emoji burst animation */
@property --driftX {
  syntax: '<length>';
  inherits: false;
  initial-value: 0px;
}
@property --trail-size {
  syntax: '<length>';
  inherits: false;
  initial-value: 8px;
}
@property --scale-start {
  syntax: '<number>';
  inherits: false;
  initial-value: 0.92;
}
@property --scale-end {
  syntax: '<number>';
  inherits: false;
  initial-value: 1.1;
}

.emoji-burst{
  position: fixed;
  top: 0;
  left: 0;
  transform: translate(0,0);
  font-size: 24px;
  line-height: 1;
  will-change: transform, opacity;
  animation: emoji-shoot var(--dur, 4500ms) var(--ease, ease-out) forwards;
  animation-delay: var(--delay, 0ms);
  pointer-events: none;
  z-index: 2000;
  filter: drop-shadow(0 4px 10px rgba(0,0,0,.15));
  contain: layout paint style;
}

.emoji-burst::after{
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: var(--trail-size, 8px);
  height: var(--trail-size, 8px);
  transform: translate(-50%, -50%) translateY(6px);
  border-radius: 50%;
  background: radial-gradient(circle at center, rgba(255,255,255,.9), rgba(255,255,255,0) 70%);
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.18));
  opacity: .4;
  animation: emoji-trail var(--trail-dur, 1350ms) ease-out forwards;
}

@keyframes emoji-shoot{
  0%{
    opacity: 0;
    --driftX: 0px;
    transform: translate(0,0) translateX(var(--driftX)) scale(var(--scale-start, .92)) rotate(0deg);
  }
  10%{
    opacity: 1;
  }
  85%{
    opacity: 1;
  }
  100%{
    opacity: 0;
    --driftX: var(--drift, 0px);
    transform: translate(var(--dx, 0px), var(--dy, -400px)) translateX(var(--driftX)) scale(var(--scale-end, 1.1)) rotate(var(--rot, 180deg));
  }
}

@keyframes emoji-trail{
  0%{
    opacity: .35;
    transform: translate(-50%, -50%) translateY(6px) scale(1);
  }
  100%{
    opacity: 0;
    transform: translate(-50%, -50%) translateY(18px) scale(.5);
  }
}

@media (prefers-reduced-motion: reduce){
  .emoji-burst{
    animation-duration: 1600ms;
  }
  .emoji-burst::after{
    animation-duration: 500ms;
  }
}

/* Desktop header layout (>=1024px): horizontal brand + nav, sticky */
@media (min-width:1024px){
  :root{
    --header-h: 112px;
  }
  .site-header{
    position: sticky;
    top: 0;
    z-index: 120;
    background: rgba(247,241,236,.92);
    backdrop-filter: saturate(120%) blur(8px);
    border-bottom: 1px solid rgba(46,46,46,.06);
    box-shadow: 0 6px 16px rgba(0,0,0,.06);
  }
  .header-wrap{
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 28px;
    min-height: var(--header-h);
    padding-block: 12px;
  }
  .header-top{
    grid-column: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 18px;
  }
  .header-top .header-actions{ display: none; }
  .header-top .brand-stack{
    display: inline-flex;
    flex-direction: row-reverse; /* logo left, text right */
    align-items: center;
    gap: 16px;
    text-align: start;
  }
  .site-header .site-logo{
    width: clamp(76px, 6vw, 96px);
    aspect-ratio: 1 / 1;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
  }
  .header-top .brand-stack .brand-text strong{
    font-size: clamp(1.6rem, 2.6vw, 2.2rem);
    line-height: 1.15;
  }
  .header-top .brand-stack .brand-text small{
    font-size: clamp(1.05rem, 1.6vw, 1.2rem);
    color: var(--muted);
  }
  .nav{
    grid-column: 2;
  }
  .nav .menu{
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 18px;
    padding: 0;
    margin: 0;
    background: transparent;
    border: 0;
    transform: none;
    opacity: 1;
    pointer-events: auto;
    box-shadow: none;
    white-space: nowrap;
  }
  .nav .menu a{
    font-size: 1.06rem;
    padding: 10px 10px;
  }
  .nav .menu .divider{
    display: block;
  }
}