.language-switcher { display: inline-flex; align-items: center; gap: 2px; border: 1px solid #c3a77550; padding: 3px; border-radius: 9px; flex-shrink: 0; }
.language-switcher button { border: 0; border-radius: 5px; background: transparent; color: var(--muted); font-size: 10px; font-weight: 600; letter-spacing: .5px; min-width: 32px; min-height: 38px; padding: 5px; transition: color 180ms ease, background 180ms ease; }
.language-switcher button:hover { color: var(--gold); background: #c3a77512; }
.language-switcher button[aria-pressed=true] { background: #c3a77525; color: var(--gold); }
.header { gap: 18px; }
.header nav { gap: 20px; }
.mobile-menu { top: var(--header-height, 96px); }
@media(max-width:1280px) { .header { padding-inline: 3%; gap: 12px; } .header nav { gap: 14px; } .header .brand > span { font-size: 21px; } .header-actions .small { padding-inline: 12px; gap: 12px; } }
@media(min-width:801px) and (max-width:1150px) { .header nav { display: none; } .header .menu-toggle { display: block; } .header-actions { margin-left: auto; } }
@media(max-width:800px) { .header { flex-wrap: wrap; height: auto; min-height: 96px; padding-block: 12px; gap: 10px; } .language-switcher { margin-right: auto; } .header-actions { margin-left: 0; } .header .brand > span { font-size: 20px; } .header .brand img { width: 38px; height: 38px; } .language-switcher button { min-width: 29px; min-height: 38px; } }
@media(max-width:560px) { .header { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 7px 10px; } .header > .brand { grid-column: 1 / 3; } .language-switcher { grid-column: 3; grid-row: 1; margin: 0; } .header-actions { grid-column: 1 / 3; grid-row: 2; } .header .menu-toggle { grid-column: 3; grid-row: 2; justify-self: end; } .location-button { min-height: 38px; } .mobile-menu { top: 114px; } .header .brand > span { font-size: 21px; }    }
@media(prefers-reduced-motion:reduce) { .language-switcher button { transition: none; } }
/* Greek's longer first word needs fluid sizing: the old fixed 61px clipped
   inside the hero even though the document itself had no horizontal scroll. */
@media(max-width:560px) {
  html[lang=el] .hero h1 { font-size: clamp(34px, 11vw, 58px); line-height: 1.08; letter-spacing: -.8px; }
}

/* Keep Headspa's video and translated overlays within the phone viewport. */
@media(max-width:800px) {
  .ritual { grid-template-columns: minmax(0, 1fr); }
  .ritual-visual, .ritual-content { min-width: 0; max-width: 100%; }
  .ritual-visual { height: clamp(280px, 90vw, 420px); min-height: 0; }
  .ritual-visual video { max-width: 100%; object-fit: cover; }
  html[lang] .ritual-word { left: 7%; right: 7%; bottom: 28px; font-size: clamp(38px, 12vw, 72px); line-height: 1.15; }
  .ritual .visual-label { left: 7%; right: 7%; top: 26px; font-size: 9px; letter-spacing: 1.7px; line-height: 1.8; }
  .ritual-content h2 { font-size: clamp(36px, 11vw, 58px); }
}