/* PASOLA · pasola.fr · main stylesheet · v1
   Mobile-first. Desktop overrides via min-width: 769px. */

/* ============================================================
     PASOLA · pasola.fr · index · v1 · Avril 2026
     Mobile-first. Desktop overrides via min-width: 769px.
     Chrome-only (pas de Safari hacks).
     Tokens de la Spécification chromatique v2.
     ============================================================ */

  :root {
    --ivory: #FAF8F4;
    --indigo: #1A2C3D;
    --dusk: #3D5675;
    --terra: #8B4A2E;
    --sand: #C7A574;
    --rule: rgba(26, 44, 61, 0.15);
    --muted: rgba(26, 44, 61, 0.6);
    --overlay: rgba(26, 44, 61, 0.35);
    --bg: var(--ivory);
    --text-primary: var(--indigo);
    --text-secondary: var(--dusk);

    --font-display: 'Cinzel', 'Times New Roman', serif;
    --font-editorial: 'Cormorant Garamond', Georgia, serif;
    --font-functional: 'Outfit', system-ui, sans-serif;

    /* Échelle d'espacement vertical · Vague 1 audit AMAN-grade · 3 valeurs
       au lieu d'uniforme. Appliquées section par section selon enjeu narratif. */
    --pad-tight-y: 64px;
    --pad-default-y: 96px;
    --pad-generous-y: 128px;

    /* D-07 · token mesure unique pour line-length editorial · ~65-70 caractères
       en Cormorant 17px. Appliqué globalement aux blocs de prose. */
    --measure: 600px;
  }

  * { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; }
  body {
    background: var(--bg); color: var(--text-primary);
    font-family: var(--font-editorial);
    font-size: 16px; line-height: 1.68; font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
  }

  a { color: inherit; text-decoration: none; }
  button { font-family: inherit; cursor: pointer; background: none; border: none; }
  img, svg, video { display: block; max-width: 100%; height: auto; }

  .sr-only {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
  }
  .skip-link {
    position: absolute; top: -40px; left: 0; background: var(--indigo); color: var(--ivory);
    padding: 10px 14px; z-index: 100; font-family: var(--font-functional);
    font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase;
  }
  .skip-link:focus { top: 0; }

  /* ===== Header · grille 3 colonnes, progressif (monumental → compact au scroll) ===== */
  .site-header {
    position: fixed; top: 0; left: 0; right: 0; z-index: 50;
    padding: 20px 18px 18px;
    background: rgba(250, 248, 244, 0.82);
    backdrop-filter: saturate(140%) blur(10px);
    -webkit-backdrop-filter: saturate(140%) blur(10px);
    border-bottom: 0.5px solid transparent;
    display: grid; grid-template-columns: 1fr auto 1fr;
    align-items: center; gap: 12px;
    transition: padding 320ms cubic-bezier(0.4, 0, 0.2, 1),
                background 240ms ease,
                border-color 240ms ease;
  }
  .site-header.is-scrolled {
    padding: 11px 18px;
    background: rgba(250, 248, 244, 0.96);
    border-bottom-color: var(--rule);
  }

  .header-right {
    justify-self: end; display: flex; align-items: center; gap: 16px;
  }
  .brand-lockup {
    justify-self: center; display: flex; align-items: center; gap: 11px;
    text-decoration: none; transition: gap 320ms cubic-bezier(0.4, 0, 0.2, 1);
  }
  .site-header.is-scrolled .brand-lockup { gap: 9px; }

  .brand-emblem {
    color: var(--indigo);
    width: 32px; height: 18px;
    transition: width 320ms cubic-bezier(0.4, 0, 0.2, 1),
                height 320ms cubic-bezier(0.4, 0, 0.2, 1);
  }
  .site-header.is-scrolled .brand-emblem { width: 22px; height: 12px; }

  .brand-wordmark {
    font-family: var(--font-display);
    font-size: 17px; letter-spacing: 0.34em;
    color: var(--indigo); font-weight: 400;
    padding-left: 0.34em; line-height: 1;
    transition: font-size 320ms cubic-bezier(0.4, 0, 0.2, 1);
  }
  .site-header.is-scrolled .brand-wordmark { font-size: 12px; }

  .nav-toggle {
    justify-self: start; display: flex; align-items: center; gap: 10px;
    padding: 6px 0; color: var(--indigo);
  }
  .nav-toggle-icon {
    width: 22px; height: 14px; display: flex; flex-direction: column;
    justify-content: space-between;
  }
  .nav-toggle-icon span {
    display: block; height: 1px; width: 100%; background: var(--indigo);
    transition: transform 220ms ease, opacity 220ms ease;
  }
  .nav-toggle-icon span:nth-child(2) { width: 70%; }
  .nav-toggle-label {
    font-family: var(--font-functional); font-size: 11px;
    letter-spacing: 0.22em; text-transform: uppercase; color: var(--indigo);
    display: none;
  }

  .lang-switch {
    display: flex; align-items: center; gap: 8px;
    font-family: var(--font-functional); font-size: 11px;
    letter-spacing: 0.22em; text-transform: uppercase; font-weight: 400;
  }
  .lang-switch a {
    color: var(--dusk); transition: color 180ms ease; padding-bottom: 3px;
    border-bottom: 0.5px solid transparent;
  }
  .lang-switch a:hover, .lang-switch a:focus { color: var(--indigo); }
  .lang-switch a[aria-current="true"] {
    color: var(--indigo); border-bottom-color: var(--indigo);
  }
  .lang-switch-sep { color: rgba(26,44,61,0.3); }

  @media (prefers-reduced-motion: reduce) {
    .site-header, .brand-lockup, .brand-emblem, .brand-wordmark { transition: none; }
  }

  /* ===== Mobile nav overlay ===== */
  .nav-overlay {
    position: fixed; inset: 0; z-index: 40;
    background: var(--ivory);
    padding: 96px 24px 32px;
    opacity: 0; pointer-events: none;
    transition: opacity 240ms ease;
    display: flex; flex-direction: column;
  }
  .nav-overlay[aria-hidden="false"] { opacity: 1; pointer-events: auto; }
  .nav-overlay ul { list-style: none; display: flex; flex-direction: column; gap: 20px; margin-top: 24px; }
  .nav-overlay a {
    font-family: var(--font-display); font-size: 20px; letter-spacing: 0.08em;
    color: var(--indigo); font-weight: 500;
  }
  .nav-overlay .nav-locale {
    margin-top: auto; padding-top: 24px; border-top: 0.5px solid var(--rule);
    font-family: var(--font-functional); font-size: 11px;
    letter-spacing: 0.18em; text-transform: uppercase; color: var(--dusk);
  }
  .nav-overlay .nav-locale a { font-family: inherit; font-size: inherit; letter-spacing: inherit; }
  .nav-overlay .nav-locale a[aria-current="true"] { color: var(--indigo); font-weight: 500; }

  /* ===== Layout ===== */
  main { padding-top: 0; }
  /* Espacement vertical par défaut · token "default" — overrides par section ci-dessous */
  section { padding: var(--pad-default-y) 24px; }

  /* Variantes de rythme · sections-clés respirent davantage (generous) ;
     sections-listes plus serrées (tight) — discipline AMAN-grade Vague 1 D-05. */
  .lieu, .vision { padding-top: var(--pad-generous-y); padding-bottom: var(--pad-generous-y); }
  .videos, .press { padding-top: var(--pad-tight-y); padding-bottom: var(--pad-tight-y); }

  .container { max-width: 720px; margin: 0 auto; }

  .eyebrow {
    font-family: var(--font-functional); font-size: 11px;
    letter-spacing: 0.22em; text-transform: uppercase; color: var(--dusk);
    font-weight: 400;
  }
  /* D-03 · section-mark passe en muted gris (anciennement Terra Rossa).
     Terra reste réservé à la progress bar et aux CTAs réels. */
  .section-mark {
    font-family: var(--font-functional); font-size: 11px;
    letter-spacing: 0.22em; text-transform: uppercase; color: var(--muted);
    font-weight: 400; display: block; margin-bottom: 28px;
  }

  /* ===== Hero · vidéo encadrée, bords ivoire, type Aman ===== */
  .hero {
    padding: 82px 8px 28px;
    background: var(--ivory);
    display: flex; flex-direction: column;
    min-height: 100vh;
  }
  .hero-video-frame {
    position: relative; flex: 1;
    border: 0.5px solid var(--rule);
    overflow: hidden;
    background: var(--indigo);
    display: flex; flex-direction: column; justify-content: flex-end;
    /* C-04 · aspect-ratio explicite 16/9 → layout pré-calculé, zéro CLS au chargement vidéo.
       min-height conservée comme garde-fou si le viewport est très petit. */
    aspect-ratio: 16 / 9;
    min-height: 560px;
  }
  .hero-video {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover; z-index: 0;
    background: var(--indigo);
  }
  .hero-video-frame::after {
    content: ""; position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(
      to top,
      rgba(26,44,61,0.6) 0%,
      rgba(26,44,61,0.25) 40%,
      rgba(26,44,61,0.05) 75%,
      rgba(26,44,61,0.1) 100%
    );
    pointer-events: none;
  }

  /* ===== Media Frame · format cinematic partagé avec hero video =====
     Utilisé pour photos pleine largeur Sections II Esprit et III Vision.
     Même langage visuel que .hero-video-frame : full-bleed, background indigo,
     border rule, overlay gradient subtle, caption overlay bas. Différence :
     aspect-ratio fixe (pas min-height 100vh) pour ne pas dominer le flow. */
  .media-frame {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    aspect-ratio: 16 / 9;
    max-height: 72vh;
    background: var(--indigo);
    border-top: 0.5px solid var(--rule);
    border-bottom: 0.5px solid var(--rule);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }
  .media-frame img {
    position: absolute; inset: 0;
    width: 100%; height: 100%;
    object-fit: cover;
    z-index: 0;
    background: var(--indigo);
    display: block;
  }
  .media-frame::after {
    content: ""; position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(
      to top,
      rgba(26,44,61,0.55) 0%,
      rgba(26,44,61,0.2) 35%,
      rgba(26,44,61,0.05) 70%,
      rgba(26,44,61,0.0) 100%
    );
    pointer-events: none;
  }
  .media-frame-caption {
    position: relative; z-index: 2;
    padding: 28px 26px 26px;
    font-family: var(--font-functional);
    font-size: 10px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: rgba(250, 248, 244, 0.82);
    font-weight: 400;
  }
  .media-frame-caption em {
    font-family: var(--font-editorial);
    font-style: italic;
    font-size: 14px;
    letter-spacing: 0.02em;
    text-transform: none;
    color: rgba(250, 248, 244, 0.68);
    display: block;
    margin-top: 6px;
  }

  /* D-02 · hero-text positionné bottom-left avec respiration AMAN-grade.
     Plus de CTA dans l'overlay (descendu en fin de section "Pourquoi Sumba"). */
  .hero-text {
    position: absolute;
    z-index: 2;
    bottom: 10vh;
    left: 20px;
    right: 20px;
    max-width: 540px;
    display: flex; flex-direction: column; gap: 14px;
    color: var(--ivory);
  }
  .hero-text .eyebrow { color: rgba(250,248,244,0.78); }
  .hero-title {
    font-family: var(--font-display); font-weight: 500;
    font-size: clamp(26px, 7.5vw, 36px); line-height: 1.18; letter-spacing: 0.02em;
    color: var(--ivory); max-width: 540px;
    overflow-wrap: break-word; hyphens: auto;
  }
  .hero-subline {
    font-family: var(--font-editorial); font-weight: 400;
    font-size: 15px; line-height: 1.65; color: rgba(250,248,244,0.92);
    max-width: 380px;
    overflow-wrap: break-word;
  }
  /* CTA hero retiré · descendu en fin de Section I "Pourquoi Sumba" et en sticky bottom-right */
  /* CTA inline en fin de section Pourquoi Sumba · variante cartouche au sol (non-flottante) */
  .section-cta {
    position: relative;
    display: inline-block;
    padding: 16px 32px;
    margin-top: 32px;
    background: transparent;
    color: var(--indigo);
    font-family: var(--font-functional);
    font-size: 11px; letter-spacing: 0.32em;
    text-transform: uppercase; font-weight: 400;
    border-top: 0.5px solid var(--indigo);
    border-bottom: 0.5px solid var(--indigo);
    border-left: 0; border-right: 0;
    cursor: pointer; text-decoration: none;
    transition: color 280ms ease, border-color 280ms ease;
  }
  .section-cta::before,
  .section-cta::after {
    content: ""; position: absolute;
    width: 8px; height: 8px;
    border-style: solid; border-color: var(--indigo);
    transition: border-color 280ms ease;
  }
  .section-cta::before {
    top: -0.5px; left: -0.5px;
    border-width: 0.5px 0 0 0.5px;
  }
  .section-cta::after {
    bottom: -0.5px; right: -0.5px;
    border-width: 0 0.5px 0.5px 0;
  }
  .section-cta:hover,
  .section-cta:focus {
    color: var(--terra);
    border-top-color: var(--terra);
    border-bottom-color: var(--terra);
  }
  .section-cta:hover::before,
  .section-cta:hover::after,
  .section-cta:focus::before,
  .section-cta:focus::after {
    border-color: var(--terra);
  }

  .sound-toggle {
    position: absolute; bottom: 20px; right: 20px; z-index: 3;
    width: 42px; height: 42px; border-radius: 50%;
    background: rgba(26,44,61,0.35); color: var(--ivory);
    display: flex; align-items: center; justify-content: center;
    backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
    border: 0.5px solid rgba(250,248,244,0.25);
    transition: background 180ms ease, border-color 180ms ease;
    cursor: pointer;
  }
  .sound-toggle:hover, .sound-toggle:focus {
    background: rgba(26,44,61,0.55);
    border-color: rgba(250,248,244,0.45);
  }
  .sound-toggle svg { width: 16px; height: 16px; }

  /* ===== Hero progress indicator · spec brand book v1.1 (Terra Rossa, surfaces à progression) ===== */
  .hero-progress {
    position: absolute;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
    width: 42%; max-width: 240px;
    height: 0.5px;
    background: rgba(139, 74, 46, 0.12);
    pointer-events: none;
    z-index: 3;
  }
  .hero-progress-fill {
    position: absolute;
    top: 0; left: 0;
    width: 0%; height: 100%;
    background: var(--terra);
    opacity: 0.65;
    transition: width 300ms ease-out;
  }
  @media (prefers-reduced-motion: reduce) {
    .hero-progress-fill { transition: none; }
  }

  .hero-tagline-wrap {
    text-align: center; padding: 18px 0 4px;
  }
  .hero-tagline {
    font-family: var(--font-editorial); font-style: italic; font-size: 14px;
    letter-spacing: 0.14em; color: var(--dusk); padding-left: 0.14em;
  }

  /* ===== Filet divider (minimal, entre sections proches) ===== */
  .filet-divider {
    display: flex; align-items: center; justify-content: center;
    padding: 36px 24px;
  }
  .filet-divider::before {
    content: ""; display: block; width: 56px; height: 0.5px;
    background: rgba(139, 74, 46, 0.45);
  }

  /* ===== Social pictos (footer) — SVG minimaux, respect du brand book (pas de stock icon library) ===== */
  .social-row {
    display: flex; gap: 16px; align-items: center; flex-wrap: wrap;
  }
  .social-picto {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px;
    border: 0.5px solid var(--indigo);
    border-radius: 50%;
    color: var(--indigo);
    transition: background 180ms ease, color 180ms ease, border-color 180ms ease;
  }
  .social-picto svg {
    width: 16px; height: 16px;
    stroke: currentColor; fill: none;
    stroke-width: 1.35;
    stroke-linecap: round; stroke-linejoin: round;
  }
  .social-picto:hover, .social-picto:focus {
    background: var(--terra); color: var(--ivory); border-color: var(--terra);
  }
  .social-picto.is-inactive {
    cursor: not-allowed;
    opacity: 0.28;
    border-style: dashed;
    pointer-events: none;
  }
  .social-picto.is-inactive:hover {
    background: transparent; color: var(--indigo); border-color: var(--indigo);
  }

  /* ===== Placeholders médias · .media-slot utilisé Section Lieu ===== */
  .media-slot {
    border: 0.5px dashed rgba(26, 44, 61, 0.3);
    background: rgba(26, 44, 61, 0.04);
  }

  /* ===== Floating CTA · Cartouche flottant bas-droite vers Calendly =====
     Identité : pattern cartouche brand book v1.1 — fond ivoire qui flotte sur le contenu,
     filets indigo + marqueurs angulaires, drop-shadow subtil. Fonction conservée : Calendly. */
  /* Variante 04 · "Plus simple" · Cormorant italic + flèche, sans encadrement.
     Halo text-shadow ivoire pour lisibilité sur tous fonds. Hover Terra.
     Pas de fond, pas de border, pas de box-shadow, pas d'icône. Le minimum strict. */
  .floating-cta {
    position: fixed; bottom: 16px; right: 16px; z-index: 45;
    display: inline-flex; align-items: center; gap: 6px;
    padding: 8px 12px;
    background: transparent;
    color: var(--indigo);
    font-family: var(--font-editorial);
    font-style: italic;
    font-size: 15px; font-weight: 400;
    text-decoration: none; cursor: pointer;
    border: 0;
    text-shadow: 0 1px 4px rgba(250, 248, 244, 0.95),
                 0 0 12px rgba(250, 248, 244, 0.85);
    transition: color 240ms ease;
  }
  .floating-cta .arrow {
    font-style: normal;
    font-family: var(--font-functional);
    font-size: 12px;
    transition: transform 240ms ease;
  }
  .floating-cta:hover, .floating-cta:focus {
    color: var(--terra);
  }
  .floating-cta:hover .arrow,
  .floating-cta:focus .arrow {
    transform: translateX(3px);
  }
  /* Variante automatique · activée par JS quand le bouton survole une section
     indigo (press-featured, site-footer). Inverse la lisibilité — texte ivoire
     avec halo indigo, hover passe en sand (Terra serait illisible sur indigo). */
  .floating-cta--on-dark {
    color: var(--ivory);
    text-shadow: 0 1px 4px rgba(26, 44, 61, 0.85),
                 0 0 14px rgba(26, 44, 61, 0.65);
  }
  .floating-cta--on-dark:hover,
  .floating-cta--on-dark:focus {
    color: var(--sand);
  }

  /* ===== Overview (intro + cartes) ===== */
  .overview { padding: 96px 22px; }
  .overview-lede {
    font-family: var(--font-editorial); font-style: italic; font-weight: 300;
    font-size: 20px; line-height: 1.5; color: var(--indigo);
    max-width: 640px; margin-bottom: 56px;
  }

  /* ===== Zones wrap · Section IV Résidences ===== */
  .zones-wrap { padding: 0 22px 96px; }
  .zones-intro {
    display: flex; flex-direction: column; gap: 14px;
    margin-bottom: 48px; max-width: 640px;
  }
  .zones-intro .section-mark {
    font-family: var(--font-functional); font-size: 10px;
    letter-spacing: 0.28em; text-transform: uppercase;
    color: var(--muted); font-weight: 400;
  }
  .zones-intro .section-title {
    font-family: var(--font-display); font-size: 28px;
    font-weight: 500; letter-spacing: 0.06em;
    line-height: 1.22; color: var(--indigo);
  }
  .zones-intro .lede {
    font-family: var(--font-editorial); font-style: normal;
    font-weight: 400; font-size: 18px; line-height: 1.6;
    color: var(--indigo); max-width: var(--measure);
  }

  /* ===== Spirit / Vision — sections éditoriales ===== */
  .spirit .section-title, .vision .section-title {
    font-family: var(--font-display); font-size: 28px; font-weight: 500;
    letter-spacing: 0.06em; line-height: 1.22; color: var(--indigo);
    margin-bottom: 28px;
  }
  .spirit .lede, .vision .lede {
    font-family: var(--font-editorial); font-style: normal; font-weight: 400;
    font-size: 19px; line-height: 1.6; color: var(--indigo);
    margin-bottom: 28px; max-width: var(--measure);
  }
  .spirit .body, .vision .body {
    font-family: var(--font-editorial); font-size: 16px; line-height: 1.72;
    color: var(--indigo);
  }
  .spirit .body p, .vision .body p { margin-bottom: 14px; }
  .spirit .body p:last-child, .vision .body p:last-child { margin-bottom: 0; }

  /* ===== Lieu (Pourquoi Sumba) ===== */
  .lieu .section-title {
    font-family: var(--font-display); font-size: 28px; font-weight: 500;
    letter-spacing: 0.06em; line-height: 1.22; color: var(--indigo);
    margin-bottom: 32px;
  }
  .lieu .body {
    font-family: var(--font-editorial); font-size: 16px; line-height: 1.72;
    color: var(--indigo);
  }
  .lieu .body p { margin-bottom: 14px; }
  .lieu .body p:last-child { margin-bottom: 0; }
  .lieu .media-slot {
    aspect-ratio: 4 / 3; background: rgba(26,44,61,0.04);
    border: 0.5px solid var(--rule); margin: 40px 0 16px;
    display: flex; align-items: center; justify-content: center;
  }
  .lieu .media-caption {
    font-family: var(--font-editorial); font-style: italic; font-size: 14px;
    color: var(--muted); line-height: 1.5;
  }

  /* ===== Zones ===== */
  .zones .section-title {
    font-family: var(--font-display); font-size: 28px; font-weight: 500;
    letter-spacing: 0.06em; line-height: 1.22; color: var(--indigo);
    margin-bottom: 16px;
  }
  .zones .lede {
    font-family: var(--font-editorial); font-style: normal; font-weight: 400;
    font-size: 18px; line-height: 1.6; color: var(--indigo);
    margin-bottom: 40px; max-width: var(--measure);
  }
  .zone-list { display: flex; flex-direction: column; gap: 48px; }
  .zone {
    display: flex; flex-direction: column; gap: 14px;
    padding-bottom: 40px; border-bottom: 0.5px solid var(--rule);
  }
  .zone:last-child { border-bottom: none; padding-bottom: 0; }
  .zone-mark {
    font-family: var(--font-functional); font-size: 10px;
    letter-spacing: 0.28em; text-transform: uppercase; color: var(--terra);
    font-weight: 500;
  }
  .zone-title {
    font-family: var(--font-display); font-size: 22px; letter-spacing: 0.06em;
    font-weight: 500; color: var(--indigo); line-height: 1.25;
  }
  .zone-body {
    font-family: var(--font-editorial); font-size: 15px; line-height: 1.7;
    color: var(--indigo);
  }
  .zone-meta {
    display: flex; gap: 28px; margin-top: 10px;
    font-family: var(--font-functional); font-size: 11px;
    letter-spacing: 0.12em; text-transform: uppercase; color: var(--dusk);
  }
  .zone-meta span strong {
    display: block; font-family: var(--font-display); font-size: 18px;
    color: var(--indigo); letter-spacing: 0.06em; font-weight: 500;
    margin-top: 4px; text-transform: none;
  }

  /* ===== Videos (Regards d'amis) ===== */
  .videos .section-title {
    font-family: var(--font-display); font-size: 28px; font-weight: 500;
    letter-spacing: 0.06em; line-height: 1.22; color: var(--indigo);
    margin-bottom: 20px;
  }
  .videos .lede {
    font-family: var(--font-editorial); font-style: normal; font-weight: 400;
    font-size: 18px; line-height: 1.6; color: var(--indigo);
    margin-bottom: 40px; max-width: var(--measure);
  }
  .videos-list { display: flex; flex-direction: column; gap: 56px; }

  /* ===== Carousel Regards (horizontal, scroll-snap style AMAN) ===== */
  .regards-carousel {
    display: flex; gap: 20px;
    overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 22px;
    padding: 4px 22px 24px;
    margin: 0 -22px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(139, 74, 46, 0.4) transparent;
  }
  .regards-carousel::-webkit-scrollbar { height: 3px; }
  .regards-carousel::-webkit-scrollbar-track { background: transparent; }
  .regards-carousel::-webkit-scrollbar-thumb {
    background: rgba(139, 74, 46, 0.4); border-radius: 2px;
  }
  .regards-carousel::-webkit-scrollbar-thumb:hover {
    background: rgba(139, 74, 46, 0.7);
  }
  .regards-carousel .video-item {
    flex: 0 0 82%;
    scroll-snap-align: start;
    margin: 0;
  }
  .regards-carousel .video-thumb {
    aspect-ratio: 16 / 10;
  }
  .regards-hint {
    font-family: var(--font-functional); font-size: 10px;
    letter-spacing: 0.24em; text-transform: uppercase;
    color: rgba(26, 44, 61, 0.45);
    margin-top: 4px; padding-left: 22px;
  }
  .regards-hint::before {
    content: "→ "; color: var(--terra);
  }
  .video-item { display: flex; flex-direction: column; gap: 18px; }
  .video-thumb {
    aspect-ratio: 16 / 10;
    background: rgba(26,44,61,0.06);
    border: 0.5px solid var(--rule);
    position: relative;
    display: flex; align-items: center; justify-content: center;
  }
  .video-play {
    width: 44px; height: 44px; border-radius: 50%;
    border: 0.5px solid var(--indigo); background: var(--ivory);
    color: var(--indigo);
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    transition: background 180ms ease, color 180ms ease, border-color 180ms ease;
  }
  .video-play::before {
    content: "";
    width: 0; height: 0;
    border-left: 10px solid currentColor;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    margin-left: 3px;
  }
  .video-play:hover, .video-play:focus {
    background: var(--terra); color: var(--ivory); border-color: var(--terra);
  }
  .video-quote {
    font-family: var(--font-editorial); font-style: italic; font-weight: 300;
    font-size: 18px; line-height: 1.55; color: var(--indigo);
    padding-left: 16px; border-left: 0.5px solid var(--terra);
  }

  /* ===== Footer soundtrack · embed Spotify adapté fond Night Indigo ===== */
  .footer-soundtrack {
    margin-top: 40px;
    max-width: 520px;
  }
  .footer-soundtrack-label {
    font-family: var(--font-functional);
    font-size: 10px;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: rgba(250, 248, 244, 0.55);
    font-weight: 400;
    display: block;
    margin-bottom: 16px;
  }
  .footer-soundtrack-embed iframe {
    display: block;
    border: 0;
    border-radius: 2px;
    width: 100%;
    background: transparent;
  }

  /* ===== Press ===== */
  .press .section-title {
    font-family: var(--font-display); font-size: 28px; font-weight: 500;
    letter-spacing: 0.06em; line-height: 1.22; color: var(--indigo);
    margin-bottom: 36px;
  }
  .press-list { display: flex; flex-direction: column; }
  .press-item {
    padding: 28px 0; border-bottom: 0.5px solid var(--rule);
  }
  .press-item:first-child { padding-top: 0; }
  .press-item:last-child { border-bottom: none; }
  .press-title {
    font-family: var(--font-editorial); font-style: italic; font-size: 18px;
    line-height: 1.35; color: var(--indigo); font-weight: 400; margin-bottom: 12px;
  }
  .press-meta {
    font-family: var(--font-functional); font-size: 11px;
    letter-spacing: 0.22em; text-transform: uppercase; color: var(--dusk);
    font-weight: 400;
  }
  .press-link {
    display: inline-block; margin-top: 10px;
    font-family: var(--font-functional); font-size: 10px;
    letter-spacing: 0.2em; text-transform: uppercase; color: var(--indigo);
    border-bottom: 0.5px solid var(--indigo); padding-bottom: 2px;
    transition: color 180ms ease, border-color 180ms ease;
  }
  .press-link:hover, .press-link:focus { color: var(--terra); border-color: var(--terra); }

  /* ===== AMAN Carousel · horizontal scroll mobile avec progress bar, grille desktop ===== */
  /* Réutilisé par Section IV Résidences et Section V Videos */
  .aman-carousel {
    position: relative;
  }
  .aman-carousel-track {
    display: flex;
    gap: 18px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 22px;
    padding: 2px 22px 8px;
    margin: 0 -22px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .aman-carousel-track::-webkit-scrollbar { display: none; }

  .aman-card {
    flex: 0 0 84%;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    min-width: 0;
  }
  .aman-card-media {
    aspect-ratio: 3 / 2;
    background: rgba(26,44,61,0.04);
    border: 0.5px dashed rgba(26,44,61,0.3);
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .aman-card-media.has-content {
    border-style: solid;
    border-color: rgba(26,44,61,0.12);
    background: rgba(26,44,61,0.04);
  }
  .aman-card-media-video {
    aspect-ratio: 16 / 9;
    border-style: solid;
    border-color: rgba(26,44,61,0.12);
  }
  .aman-card-media img,
  .aman-card-media iframe {
    width: 100%; height: 100%;
    object-fit: cover;
    border: 0;
    display: block;
  }
  .aman-card-placeholder {
    font-family: var(--font-functional);
    font-size: 10px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--dusk);
    text-align: center;
    padding: 0 20px;
  }
  .aman-card-placeholder::before {
    content: "En attente · ";
    color: var(--terra);
  }
  .aman-card-eyebrow {
    font-family: var(--font-functional);
    font-size: 10px;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--dusk);
    margin: 22px 0 10px;
    font-weight: 400;
  }
  .aman-card-title {
    font-family: var(--font-editorial);
    font-size: 23px;
    font-weight: 400;
    line-height: 1.22;
    color: var(--indigo);
    margin: 0 0 14px;
    letter-spacing: 0.01em;
  }
  .aman-card-body {
    font-family: var(--font-editorial);
    font-size: 15.5px;
    line-height: 1.62;
    color: var(--indigo);
    margin: 0 0 20px;
    flex: 1;
  }
  .aman-card-meta {
    display: flex;
    flex-direction: column;
    margin: 0 0 22px;
    padding-top: 14px;
    border-top: 0.5px solid rgba(26,44,61,0.15);
  }
  .aman-card-meta-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 7px 0;
    border-bottom: 0.5px solid rgba(26,44,61,0.08);
  }
  .aman-card-meta-row:last-child { border-bottom: none; }
  .aman-card-meta-label {
    font-family: var(--font-functional);
    font-size: 10px;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--dusk);
    font-weight: 400;
  }
  .aman-card-meta-value {
    font-family: var(--font-editorial);
    font-size: 15px;
    color: var(--indigo);
    font-weight: 400;
  }
  .aman-card-link {
    font-family: var(--font-editorial);
    font-size: 15px;
    color: var(--indigo);
    border-bottom: 0.5px solid var(--indigo);
    padding-bottom: 2px;
    text-decoration: none;
    align-self: flex-start;
    transition: color 180ms ease, border-color 180ms ease;
  }
  .aman-card-link:hover,
  .aman-card-link:focus {
    color: var(--terra);
    border-color: var(--terra);
  }
  .aman-card-attrib {
    font-family: var(--font-functional);
    font-size: 11px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--dusk);
    font-weight: 400;
    margin: 18px 0 0;
  }

  /* Variante éditoriale · pour Sections II (Esprit) et III (Vision) ·
     plus sobre que les cartes résidences, juste media + caption italique */
  .aman-card-editorial .aman-card-media {
    aspect-ratio: 4 / 5;  /* portrait éditorial, plus digne que 3/2 landscape */
  }
  .aman-card-editorial-caption {
    font-family: var(--font-editorial);
    font-style: italic;
    font-size: 15px;
    line-height: 1.55;
    color: var(--indigo);
    margin-top: 18px;
    text-align: left;
  }
  .aman-card-editorial-caption .caption-meta {
    display: block;
    font-family: var(--font-functional);
    font-style: normal;
    font-size: 10px;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--dusk);
    margin-top: 8px;
    font-weight: 400;
  }

  /* Progress bar Terra Rossa sous carrousel · spec brand book v1.1 */
  /* D-09 · Progress bar affinée AMAN-grade · 0.5pt sub-pixel, track plus discret */
  .aman-progress {
    width: 100%;
    max-width: 240px;
    height: 0.5px;
    background: rgba(139, 74, 46, 0.12);
    margin: 36px auto 0;
    position: relative;
  }
  .aman-progress-fill {
    position: absolute;
    top: 0; left: 0;
    height: 100%;
    width: 0%;
    background: var(--terra);
    opacity: 0.65;
    transition: width 200ms ease-out;
  }
  @media (prefers-reduced-motion: reduce) {
    .aman-progress-fill { transition: none; }
  }

  /* ===== Press Featured · bandeau Night Indigo (Growing International Spotlight) ===== */
  .press-featured {
    background: var(--indigo);
    color: var(--ivory);
    padding: 64px 0 72px;
    margin: 0;
  }
  .press-featured-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 22px;
  }
  .press-featured-intro {
    text-align: center;
    margin-bottom: 52px;
  }
  .press-featured-eyebrow {
    font-family: var(--font-functional);
    font-size: 10px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--sand);
    display: inline-block;
    margin-bottom: 22px;
    font-weight: 400;
  }
  .press-featured-title {
    font-family: var(--font-editorial);
    font-size: 32px;
    font-weight: 400;
    line-height: 1.14;
    letter-spacing: 0.005em;
    color: var(--ivory);
    margin: 0;
  }
  .press-featured-title em {
    font-style: italic;
    font-weight: 400;
  }
  .press-featured-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    align-items: stretch;
  }
  .press-featured-card {
    display: flex;
    flex-direction: column;
  }
  .press-featured-name {
    font-family: var(--font-editorial);
    font-size: 26px;
    font-weight: 400;
    color: var(--ivory);
    margin: 0 0 20px 0;
    letter-spacing: 0.005em;
    line-height: 1.2;
  }
  .press-featured-name em {
    font-style: italic;
    font-weight: 400;
  }
  .press-featured-rule {
    height: 1px;
    background: rgba(250, 248, 244, 0.2);
    margin-bottom: 26px;
  }
  .press-featured-quote {
    font-family: var(--font-editorial);
    font-style: italic;
    font-size: 17px;
    line-height: 1.5;
    color: var(--ivory);
    margin: 0 0 24px 0;
    font-weight: 400;
  }
  .press-featured-desc {
    font-family: var(--font-editorial);
    font-size: 15px;
    line-height: 1.7;
    color: rgba(250, 248, 244, 0.6);
    margin: 0 0 30px 0;
    flex: 1;
  }
  .press-featured-link {
    font-family: var(--font-functional);
    font-size: 11px;
    letter-spacing: 0.26em;
    text-transform: uppercase;
    color: var(--sand);
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    transition: color 180ms ease, gap 180ms ease;
    align-self: flex-start;
  }
  .press-featured-link-arrow {
    display: inline-block;
    transition: transform 180ms ease;
  }
  .press-featured-link:hover,
  .press-featured-link:focus {
    color: var(--ivory);
  }
  .press-featured-link:hover .press-featured-link-arrow,
  .press-featured-link:focus .press-featured-link-arrow {
    transform: translateX(4px);
  }

  /* ===== Vision · section éditoriale portrait (titre · meta · filet · figure · body) ===== */
  .vision .container {
    max-width: 840px;
    text-align: center;
  }
  .vision-head {
    margin-bottom: 56px;
  }
  .vision .section-mark {
    text-align: center;
    margin-bottom: 32px;
  }
  .vision-title {
    font-family: var(--font-editorial) !important;
    font-weight: 400 !important;
    font-size: 26px !important;
    line-height: 1.18 !important;
    letter-spacing: 0.005em !important;
    color: var(--indigo);
    margin: 0 auto 24px !important;
    max-width: 720px;
  }
  .vision-title em {
    font-style: italic;
    font-weight: 400;
  }
  .vision-meta {
    font-family: var(--font-functional);
    font-size: 11px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--dusk);
    font-weight: 400;
    margin-bottom: 36px;
  }
  .vision-rule {
    width: 520px;
    max-width: 100%;
    height: 0.5px;
    background: rgba(26, 44, 61, 0.35);
    margin: 0 auto 56px;
  }
  .vision-body {
    max-width: 640px;
    margin: 0 auto;
    text-align: left;
  }
  .vision-body p {
    font-family: var(--font-editorial);
    font-size: 16.5px;
    line-height: 1.7;
    color: var(--indigo);
    margin-bottom: 18px;
  }
  .vision-body p:last-child { margin-bottom: 0; }

  /* ===== Contact ===== */
  .contact .section-title {
    font-family: var(--font-display); font-size: 28px; font-weight: 500;
    letter-spacing: 0.06em; line-height: 1.22; color: var(--indigo);
    margin-bottom: 28px;
  }
  .contact .lede {
    font-family: var(--font-editorial); font-style: normal; font-weight: 400;
    font-size: 18px; line-height: 1.6; color: var(--indigo);
    margin-bottom: 40px; max-width: var(--measure);
  }
  .form { display: flex; flex-direction: column; gap: 28px; }
  .form-field { display: flex; flex-direction: column; gap: 10px; }
  .form-label {
    font-family: var(--font-functional); font-size: 11px;
    letter-spacing: 0.22em; text-transform: uppercase; color: var(--dusk);
    font-weight: 400;
  }
  .form-profile-group {
    display: flex; flex-direction: column; gap: 12px; margin-top: 6px;
  }
  .form-profile {
    display: flex; align-items: flex-start; gap: 14px; cursor: pointer;
    padding: 14px 16px; border: 0.5px solid var(--rule);
    transition: border-color 180ms ease, background 180ms ease;
  }
  .form-profile:hover { border-color: var(--dusk); }
  .form-profile input[type="radio"] {
    margin-top: 4px; accent-color: var(--indigo);
  }
  .form-profile-text {
    display: flex; flex-direction: column; gap: 2px;
  }
  .form-profile-title {
    font-family: var(--font-display); font-size: 14px; letter-spacing: 0.06em;
    color: var(--indigo); font-weight: 500;
  }
  .form-profile-desc {
    font-family: var(--font-editorial); font-size: 14px; line-height: 1.5;
    color: var(--muted);
  }
  .form-input, .form-textarea {
    font-family: var(--font-editorial); font-size: 16px; line-height: 1.5;
    color: var(--indigo); padding: 12px 14px;
    border: 0.5px solid var(--rule); background: var(--ivory);
    transition: border-color 180ms ease;
  }
  .form-input:focus, .form-textarea:focus {
    outline: none; border-color: var(--indigo);
  }
  .form-textarea { min-height: 120px; resize: vertical; font-family: var(--font-editorial); }
  .form-submit {
    align-self: flex-start; margin-top: 8px;
    padding: 14px 32px; background: var(--indigo); color: var(--ivory);
    font-family: var(--font-functional); font-size: 11px;
    letter-spacing: 0.22em; text-transform: uppercase; font-weight: 400;
    transition: background 180ms ease;
  }
  .form-submit:hover, .form-submit:focus { background: var(--terra); }
  .form-note {
    font-family: var(--font-editorial); font-style: italic; font-size: 13px;
    color: var(--muted); margin-top: 14px; line-height: 1.5;
  }

  /* ===== Footer · inspiration Singita ===== */
  .site-footer {
    background: var(--indigo); color: var(--ivory);
    padding: 72px 24px 40px;
  }
  .site-footer .footer-inner { max-width: 1080px; margin: 0 auto; }

  /* Brand band */
  .footer-brand {
    margin-bottom: 48px; padding-bottom: 40px;
    border-bottom: 0.5px solid rgba(250,248,244,0.15);
    display: flex; flex-direction: column; align-items: center; gap: 12px;
    text-align: center;
  }
  .footer-emblem { color: var(--ivory); }
  .footer-wordmark {
    font-family: var(--font-display); font-size: 20px;
    letter-spacing: 0.36em; color: var(--ivory);
    font-weight: 400; padding-left: 0.36em; line-height: 1;
  }
  .footer-tagline {
    font-family: var(--font-editorial); font-style: italic; font-size: 14px;
    letter-spacing: 0.14em; color: var(--sand); padding-left: 0.14em;
  }

  /* Newsletter band */
  .footer-newsletter {
    margin-bottom: 48px; padding-bottom: 48px;
    border-bottom: 0.5px solid rgba(250,248,244,0.15);
    max-width: 640px; margin-left: auto; margin-right: auto;
    text-align: center;
  }
  .footer-newsletter-title {
    font-family: var(--font-display); font-size: 22px;
    font-weight: 500; letter-spacing: 0.08em;
    color: var(--ivory); margin-bottom: 14px;
  }
  .footer-newsletter-desc {
    font-family: var(--font-editorial); font-style: italic;
    font-weight: 300; font-size: 15px; line-height: 1.55;
    color: rgba(250,248,244,0.8); margin-bottom: 28px;
  }
  .footer-newsletter-form {
    display: flex; flex-direction: column; gap: 16px;
    text-align: left;
  }
  .newsletter-field { display: flex; flex-direction: column; gap: 6px; }
  .newsletter-label {
    font-family: var(--font-functional); font-size: 10px;
    letter-spacing: 0.22em; text-transform: uppercase;
    color: rgba(250,248,244,0.7); font-weight: 500;
  }
  .newsletter-input {
    font-family: var(--font-editorial); font-size: 15px;
    color: var(--ivory); padding: 10px 0;
    background: transparent; border: none;
    border-bottom: 0.5px solid rgba(250,248,244,0.3);
    transition: border-color 180ms ease;
  }
  .newsletter-input:focus {
    outline: none; border-bottom-color: var(--sand);
  }
  .newsletter-consent {
    display: flex; gap: 10px; align-items: flex-start;
    font-family: var(--font-editorial); font-style: italic;
    font-size: 13px; line-height: 1.5;
    color: rgba(250,248,244,0.7);
    cursor: pointer; margin-top: 6px;
  }
  .newsletter-consent input[type="checkbox"] {
    margin-top: 3px; accent-color: var(--sand);
  }
  .newsletter-submit {
    align-self: flex-start; margin-top: 8px;
    padding: 12px 28px;
    background: var(--terra); color: var(--ivory);
    font-family: var(--font-functional); font-size: 11px;
    letter-spacing: 0.22em; text-transform: uppercase; font-weight: 400;
    border: none; cursor: pointer;
    transition: background 180ms ease;
  }
  .newsletter-submit:hover, .newsletter-submit:focus { background: var(--sand); color: var(--indigo); }

  /* 3-column thematic grid */
  .footer-grid {
    display: flex; flex-direction: column; gap: 40px;
    margin-bottom: 48px; padding-bottom: 48px;
    border-bottom: 0.5px solid rgba(250,248,244,0.15);
  }
  .footer-col h4 {
    font-family: var(--font-functional); font-size: 10px;
    letter-spacing: 0.24em; text-transform: uppercase; color: var(--sand);
    font-weight: 500; margin: 0 0 16px;
  }
  .footer-col ul {
    list-style: none; display: flex; flex-direction: column; gap: 10px;
    padding: 0; margin: 0;
  }
  .footer-col a {
    font-family: var(--font-editorial); font-size: 15px; color: var(--ivory);
    opacity: 0.82; transition: opacity 180ms ease, color 180ms ease;
    text-decoration: none;
  }
  .footer-col a:hover, .footer-col a:focus { opacity: 1; color: var(--sand); }

  /* Contact block */
  .footer-contact {
    margin-bottom: 40px; padding-bottom: 36px;
    border-bottom: 0.5px solid rgba(250,248,244,0.15);
    display: flex; flex-direction: column; gap: 14px;
  }
  .footer-contact-line {
    font-family: var(--font-display); font-size: 18px;
    letter-spacing: 0.04em; color: var(--ivory);
    font-weight: 400; margin: 0;
  }
  .footer-contact-line a {
    color: var(--ivory); text-decoration: none;
    border-bottom: 0.5px solid rgba(250,248,244,0.35);
    padding-bottom: 2px;
    cursor: pointer;
    transition: color 180ms ease, border-color 180ms ease;
  }
  .footer-contact-line a:hover { color: var(--sand); border-bottom-color: var(--sand); }
  .footer-contact-label {
    color: var(--sand); font-family: var(--font-functional);
    font-size: 11px; letter-spacing: 0.22em;
    text-transform: uppercase; font-weight: 500;
    margin-right: 12px;
  }
  .footer-contact-calendly {
    color: var(--ivory) !important;
    border-bottom: 0.5px solid rgba(199,165,116,0.45);
    padding-bottom: 3px;
    transition: border-color 180ms ease, color 180ms ease;
  }
  .footer-contact-calendly:hover { border-bottom-color: var(--sand); color: var(--sand) !important; }
  .footer-contact-all {
    font-family: var(--font-functional); font-size: 11px;
    letter-spacing: 0.22em; text-transform: uppercase;
    color: var(--sand); font-weight: 500; margin: 6px 0 0;
  }
  .footer-contact-all a { color: inherit; text-decoration: none; }
  .footer-contact-all a:hover { opacity: 0.7; }

  /* Social pictos row (dark context override) */
  .site-footer .social-row { justify-content: flex-start; margin-bottom: 28px; }
  .site-footer .social-picto {
    border-color: rgba(250,248,244,0.3);
    color: var(--ivory);
  }
  .site-footer .social-picto:hover, .site-footer .social-picto:focus {
    background: var(--sand); border-color: var(--sand); color: var(--indigo);
  }

  /* Meta bottom */
  .footer-rule {
    height: 0.5px; background: rgba(250,248,244,0.15); margin: 20px 0 18px;
  }
  .footer-meta {
    display: flex; flex-direction: column; gap: 10px;
    font-family: var(--font-functional); font-size: 10px;
    letter-spacing: 0.16em; text-transform: uppercase;
    color: rgba(250,248,244,0.55); font-weight: 400;
  }
  .footer-meta a { color: inherit; text-decoration: none; transition: color 180ms ease; }
  .footer-meta a:hover { color: var(--sand); }
  .footer-legal, .footer-language {
    display: flex; gap: 10px; flex-wrap: wrap; align-items: center;
  }
  .footer-legal span[aria-hidden], .footer-language span[aria-hidden] {
    color: rgba(250,248,244,0.3);
  }


  /* ===== Desktop overrides ===== */
  @media (min-width: 769px) {
    .site-header { padding: 26px 32px 22px; }
    .site-header.is-scrolled { padding: 13px 32px; }
    .brand-emblem { width: 42px; height: 24px; }
    .site-header.is-scrolled .brand-emblem { width: 26px; height: 14px; }
    .brand-wordmark { font-size: 22px; }
    .site-header.is-scrolled .brand-wordmark { font-size: 13px; }
    .brand-lockup { gap: 14px; }
    .site-header.is-scrolled .brand-lockup { gap: 9px; }
    .nav-toggle-label { display: inline; }

    .nav-overlay { padding: 120px 48px 48px; }
    .nav-overlay ul { gap: 24px; }
    .nav-overlay a { font-size: 26px; }

    section { padding: 128px 48px; }
    .container { max-width: 760px; }

    .hero { padding: 104px 16px 32px; }
    .hero-video-frame { min-height: calc(100vh - 180px); }

    /* Media frame · desktop bandeau cinematic 21:9 (plus fin que 16:9) */
    .media-frame {
      aspect-ratio: 21 / 9;
      max-height: 78vh;
    }
    .media-frame-caption {
      padding: 40px 72px 40px;
      font-size: 11px;
      letter-spacing: 0.3em;
    }
    .media-frame-caption em {
      font-size: 16px;
      margin-top: 8px;
    }
    /* D-02 · hero-text bottom-left desktop · respiration AMAN-grade généreuse */
    .hero-text {
      bottom: 8vh;
      left: 6vw;
      right: 6vw;
      max-width: 640px;
      gap: 18px;
    }
    /* D-01 prepa · hero-title cap 64px desktop, line-height respirant, tracking moins serré */
    .hero-title { font-size: 64px; line-height: 1.16; letter-spacing: 0.02em; max-width: 640px; }
    .hero-subline { font-size: 18px; max-width: 440px; }
    .sound-toggle { bottom: 28px; right: 28px; width: 46px; height: 46px; }
    .sound-toggle svg { width: 18px; height: 18px; }
    .hero-tagline-wrap { padding: 22px 0 4px; }
    .hero-tagline { font-size: 16px; }

    .spirit .section-title, .vision .section-title, .lieu .section-title,
    .zones .section-title, .videos .section-title, .press .section-title,
    .contact .section-title { font-size: 46px; letter-spacing: 0.06em; line-height: 1.15; }
    /* D-04 desktop · ledes en roman regular (déjà appliqué), juste le size */
    .spirit .lede, .vision .lede { font-size: 22px; }
    .zones .lede, .videos .lede { font-size: 20px; }
    .spirit .body, .vision .body, .lieu .body { font-size: 17px; }
    .video-quote { font-size: 22px; }

    /* D-02 desktop · section-cta cartouche au sol · padding généreux */
    .section-cta {
      padding: 18px 36px;
      letter-spacing: 0.34em;
    }

    /* Carousel Regards desktop */
    .regards-carousel {
      padding: 4px 48px 28px;
      margin: 0 -48px;
      scroll-padding-left: 48px;
      gap: 28px;
    }
    .regards-carousel .video-item { flex: 0 0 32%; }
    .regards-hint { padding-left: 48px; font-size: 11px; }

    .zone-title { font-size: 26px; }
    .zone-body { font-size: 16px; }
    .zone-meta span strong { font-size: 22px; }
    .zone-meta { gap: 40px; }

    .press-title { font-size: 22px; }

    /* Overview · desktop padding */
    .overview { padding: 128px 48px 96px; }
    .overview-lede { font-size: 24px; max-width: 780px; margin-bottom: 72px; }

    .zones-wrap { padding: 0 48px 128px; }
    .zones-intro { margin-bottom: 64px; }
    .zones-intro .section-title { font-size: 40px; letter-spacing: 0.08em; }
    .zones-intro .lede { font-size: 22px; }

    /* Séparateur desktop (filet uniquement) */
    .filet-divider { padding: 56px 48px; }

    /* Floating CTA desktop */
    .floating-cta { bottom: 28px; right: 28px; padding: 10px 14px; font-size: 17px; gap: 8px; }
    .floating-cta .arrow { font-size: 13px; }

    /* Social pictos desktop */
    .social-picto { width: 40px; height: 40px; }
    .social-picto svg { width: 17px; height: 17px; }

    .site-footer { padding: 96px 48px 56px; }

    .footer-newsletter { max-width: 760px; padding-bottom: 64px; margin-bottom: 64px; }
    .footer-newsletter-title { font-size: 28px; }
    .footer-newsletter-desc { font-size: 17px; margin-bottom: 32px; }
    .footer-newsletter-form {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px 24px;
    }
    .newsletter-field:nth-child(3) { grid-column: span 2; }
    .newsletter-consent { grid-column: span 2; }
    .newsletter-submit { grid-column: span 2; justify-self: start; }

    .footer-grid {
      flex-direction: row; justify-content: space-between; gap: 64px;
    }
    .footer-col { flex: 1; }
    .footer-wordmark { font-size: 22px; }

    .footer-contact {
      flex-direction: row; flex-wrap: wrap; align-items: center; gap: 36px;
    }
    .footer-contact-line { font-size: 22px; }
    .footer-contact-all { margin: 0 0 0 auto; }

    .footer-meta {
      flex-direction: row; justify-content: space-between; align-items: center;
    }

    .form { max-width: 560px; }
    .form-profile-group { flex-direction: column; gap: 10px; }

    /* Press Featured · desktop 3-col + padding plus généreux + titre grand */
    .press-featured { padding: 96px 0 108px; }
    .press-featured-inner { padding: 0 32px; }
    .press-featured-intro { margin-bottom: 80px; }
    .press-featured-eyebrow { font-size: 11px; letter-spacing: 0.32em; margin-bottom: 28px; }
    .press-featured-title { font-size: 48px; }
    .press-featured-grid { grid-template-columns: repeat(3, 1fr); gap: 56px; }
    .press-featured-name { font-size: 28px; }
    .press-featured-quote { font-size: 17.5px; }
    .press-featured-desc { font-size: 15.5px; }

    /* Videos section desktop · le carrousel AMAN gère déjà la bascule */

    /* AMAN Carousel · desktop bascule en grille, no scroll, progress caché */
    .aman-carousel-track {
      display: grid;
      grid-template-columns: repeat(var(--cols, 3), 1fr);
      gap: 32px;
      overflow: visible;
      padding: 0;
      margin: 0;
    }
    .aman-card {
      flex: initial;
      scroll-snap-align: none;
    }
    .aman-card-title { font-size: 26px; }
    .aman-card-body { font-size: 16px; }
    .aman-progress { display: none; }

    /* Vision editorial · desktop titre plus grand + rule plus large */
    .vision-title { font-size: 38px !important; line-height: 1.16 !important; }
    .vision-rule { width: 520px; margin: 0 auto 64px; }
    .vision-body p { font-size: 17px; }
  }

  /* Reveal on scroll — discreet fade, no translate */
  .reveal { opacity: 0; transition: opacity 800ms ease; }
  .reveal.is-visible { opacity: 1; }
  @media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transition: none; }
    html { scroll-behavior: auto; }
  }