/* Accueil FR/EN : le ruban supérieur reprend l’ancienne présentation.
   Logo principal exact du kit et fond translucide sur la vidéo.
   Titres, paragraphes et actions gardent la typographie de la charte V2. */
.home-video {--header-height:104px}
/* Voile allégé : plus de lumière sur le spa, contraste conservé côté texte. */
.home-video .hero-video:after {
  background:linear-gradient(90deg,rgba(17,11,15,.58) 0%,rgba(17,11,15,.48) 45%,rgba(17,11,15,.32) 100%),linear-gradient(0deg,rgba(17,11,15,.2),transparent 24%);
}
.home-video .header,.home-video .header:not(.header-scrolled) {
  height:var(--header-height);color:var(--paper);background:rgba(20,12,17,.48);
  border-bottom-color:rgba(247,243,236,.15);
}
.home-video .header.header-scrolled {background:var(--paper);color:var(--wine);border-bottom-color:var(--line)}
.home-video .header-inner {display:flex;width:calc(100% - 104px);max-width:1260px;gap:22px;padding:0}
.home-video .header .brand--principal {width:calc(var(--logo-width) + 2 * var(--logo-space));padding:var(--logo-space);background:transparent}
.home-video .header .brand--principal img {width:var(--logo-width);max-width:none;height:auto;aspect-ratio:1200/773;object-fit:contain}
.home-video .header .brand-principal-dark {display:none}
.home-video .header.header-scrolled .brand-principal-light {display:none}
.home-video .header.header-scrolled .brand-principal-dark {display:block}
.home-video .header .nav {color:inherit}
.home-video .header .nav-submenu {color:var(--wine)}
.home-video .header .nav>a,.home-video .header .nav-dropdown>summary,.home-video .header .language,
.home-video .header .header-end>.button,.home-video .hero-video-copy .button,.home-video .hero-video-copy .text-link {font-size:var(--text-action);font-weight:600}
.home-video .header .header-end {width:auto;gap:18px}
.home-video .header:not(.header-scrolled) .header-end>.button {background:rgba(247,243,236,.08);border-color:rgba(247,243,236,.7);color:var(--paper)}
.home-video .header:not(.header-scrolled) .header-end>.button:hover {background:var(--paper);color:var(--wine)}
.home-video .header:not(.header-scrolled) .nav>a:after {background:var(--paper)}
.home-video .header:not(.header-scrolled) .menu-button span {background:var(--paper)}
.home-video .header:not(.header-scrolled) :focus-visible {outline-color:var(--paper);box-shadow:0 0 0 2px var(--wine)}
/* The hero is one decision area. Practical details stay in the existing spa,
   access and footer sections; media controls no longer create a layout row. */
.home-video .hero-video-main {
  padding-top:calc(var(--header-height) + 40px);
  padding-bottom:88px;
}
.hero-video-tools {
  position:absolute;right:max(24px,env(safe-area-inset-right));
  bottom:max(20px,env(safe-area-inset-bottom));z-index:2;
}
.hero-video-tools[hidden],.hero-sound-toggle [hidden] {display:none!important}
.hero-video .hero-sound-toggle {
  width:44px;height:44px;min-width:44px;min-height:44px;padding:0;
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:var(--paper);background:rgba(20,12,17,.55);
  border:1px solid rgba(247,243,236,.65);
}
.hero-video .hero-sound-toggle svg {width:20px;height:20px}
.hero-video .hero-sound-toggle:hover {background:rgba(20,12,17,.75);border-color:var(--paper)}
.hero-video-fallback {
  position:absolute;right:24px;bottom:20px;z-index:2;
  display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;
  background:rgba(20,12,17,.55);color:var(--paper);font-size:14px;
  text-decoration:underline;text-underline-offset:4px;
}
@media(min-width:1500px) {
  .home-video .header-inner {width:calc(100% - 160px);max-width:1760px}
}
@media(max-width:1279px) {
  .home-video .header-inner {width:calc(100% - 64px)}
  .home-video .header .nav {color:var(--wine);background:var(--paper)}
  .home-video .header:not(.header-scrolled) .nav>a:after {background:var(--wine)}
  .home-video .header:not(.header-scrolled) .nav :focus-visible {outline-color:var(--wine);box-shadow:0 0 0 2px var(--paper)}
}
@media(max-width:620px) {
  .home-video {--header-height:90px}
  .home-video .hero-video:after {background:rgba(17,11,15,.56)}
  .home-video .header-inner {width:calc(100% - 32px);height:100%;gap:8px;display:flex;padding:0;grid-template-rows:none}
  .home-video .header .header-end {margin-left:auto;width:auto;gap:12px}
  .home-video .header .header-end>.button {display:none}
  .home-video .header .nav {top:calc(var(--header-height) - 1px);max-height:calc(100dvh - var(--header-height))}
  /* Let the stacked actions use some of the space above the copy. The hero
     can still grow on short screens or with enlarged text. */
  .home-video .hero-video-main {padding-top:calc(var(--header-height) + 16px);padding-bottom:max(80px,calc(env(safe-area-inset-bottom) + 64px))}
  .home-video .hero-video-copy {width:100%}
  .home-video .hero-video-copy .actions {flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:10px;margin-top:24px}
  .home-video .hero-video-copy .actions>.button {width:100%;min-height:52px;justify-content:space-between;padding:14px 20px}
  .home-video .hero-video-copy .actions>.text-link {align-self:flex-start;max-width:100%;min-height:44px}
  .hero-video-tools {right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom))}
}
@media print {.hero-video-tools,.hero-video-fallback {display:none!important}}