/* ==========================================================================
   NORVELIS — layout.css
   Conteneurs, en-tête vitré, navigation, pied de page.
   ========================================================================== */

/* ----- Conteneur ----- */
.nv-container {
  width: 100%;
  max-width: calc(var(--nv-container) + var(--nv-gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--nv-gutter);
}
.nv-container--slim {
  max-width: calc(var(--nv-container-slim) + var(--nv-gutter) * 2);
}

/* Section : rythme vertical généreux */
.nv-section {
  padding-block: var(--nv-space-3xl);
  position: relative;
}
.nv-section--mist { background: var(--nv-mist); }
.nv-section--navy {
  background: var(--nv-navy);
  color: var(--nv-on-navy);
}
.nv-section--navy h2,
.nv-section--navy h3,
.nv-section--navy h4 { color: #fff; }

/* ==========================================================================
   EN-TÊTE — transparent sur le hero, verre dépoli au défilement
   ========================================================================== */
.nv-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: var(--nv-z-header);
  height: var(--nv-header-h);
  display: flex;
  align-items: center;
  transition: background-color var(--nv-dur) var(--nv-ease),
              box-shadow var(--nv-dur) var(--nv-ease),
              backdrop-filter var(--nv-dur) var(--nv-ease),
              border-color var(--nv-dur) var(--nv-ease);
  border-bottom: 1px solid transparent;
}
.nv-header__inner {
  width: 100%;
  max-width: calc(var(--nv-container) + var(--nv-gutter) * 2);
  margin-inline: auto;
  padding-inline: var(--nv-gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--nv-space-lg);
}

/* État par défaut (au-dessus d'un hero sombre) : texte clair */
.nv-header__brand,
.nv-header .nv-nav__link { color: rgba(255, 255, 255, 0.94); }
.nv-header .nv-nav__link::after { background: var(--nv-gold); }

/* Marque */
.nv-header__brand {
  font-family: var(--nv-font-display);
  font-size: 1.55rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.nv-header__brand .nv-dot { color: var(--nv-gold); }

.nv-header__logo-img {
    display: block;
    height: 120px;
    width: auto;
}

/* État "scrollé" : verre dépoli clair, texte marine */
.nv-header.is-scrolled {
  background: rgba(255, 255, 255, 0.72);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  backdrop-filter: saturate(180%) blur(18px);
  border-bottom-color: var(--nv-line);
  box-shadow: 0 10px 40px -28px rgba(11, 30, 61, 0.5);
}
.nv-header.is-scrolled .nv-header__brand,
.nv-header.is-scrolled .nv-nav__link { color: var(--nv-navy); }

/* Sur pages intérieures (header non transparent d'emblée) */
.nv-header--solid {
  background: rgba(255, 255, 255, 0.82);
  -webkit-backdrop-filter: saturate(180%) blur(18px);
  backdrop-filter: saturate(180%) blur(18px);
  border-bottom-color: var(--nv-line);
}
.nv-header--solid .nv-header__brand,
.nv-header--solid .nv-nav__link { color: var(--nv-navy); }

/* Navigation */
.nv-nav { display: flex; align-items: center; gap: var(--nv-space-lg); }
.nv-nav__menu { display: flex; align-items: center; gap: clamp(1.25rem, 2.4vw, 2.5rem); }
.nv-nav__link {
  position: relative;
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  padding-block: 0.4rem;
}
.nv-nav__link::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 100%;
  height: 1px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--nv-dur-fast) var(--nv-ease);
}
.nv-nav__link:hover::after,
.nv-nav .current-menu-item > .nv-nav__link::after,
.nv-nav .current_page_item > a::after { transform: scaleX(1); }
.nv-nav .current-menu-item > .nv-nav__link,
.nv-nav .current_page_item > a { color: var(--nv-gold-600); }

/* Bouclier menu mobile */
.nv-nav-toggle {
  display: none;
  width: 46px; height: 46px;
  border: 1px solid currentColor;
  background: transparent;
  border-radius: 50%;
  cursor: pointer;
  position: relative;
  color: inherit;
}
.nv-nav-toggle span,
.nv-nav-toggle span::before,
.nv-nav-toggle span::after {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  width: 18px; height: 1.5px;
  background: currentColor;
  transform: translate(-50%, -50%);
  transition: transform var(--nv-dur-fast) var(--nv-ease), opacity var(--nv-dur-fast);
}
.nv-nav-toggle span::before { transform: translate(-50%, -7px); }
.nv-nav-toggle span::after  { transform: translate(-50%, 5px); }
.nv-nav-toggle[aria-expanded="true"] span { background: transparent; }
.nv-nav-toggle[aria-expanded="true"] span::before { transform: translate(-50%, -50%) rotate(45deg); }
.nv-nav-toggle[aria-expanded="true"] span::after  { transform: translate(-50%, -50%) rotate(-45deg); }

/* ==========================================================================
   PIED DE PAGE
   ========================================================================== */
.nv-footer {
  background: var(--nv-navy);
  color: var(--nv-on-navy);
  padding-block: var(--nv-space-2xl) var(--nv-space-lg);
}
.nv-footer a { color: var(--nv-on-navy); }
.nv-footer a:hover { color: var(--nv-gold); }

.nv-footer__grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  gap: var(--nv-space-xl);
  padding-bottom: var(--nv-space-xl);
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.nv-footer__brand {
  font-family: var(--nv-font-display);
  font-size: 1.9rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: var(--nv-space-sm);
}
.nv-footer__brand .nv-dot { color: var(--nv-gold); }
.nv-footer__tag {
  color: var(--nv-on-navy-soft);
  max-width: 34ch;
  font-size: 0.975rem;
}
.nv-footer__col-title {
  font-family: var(--nv-font-body);
  font-size: var(--nv-fs-eyebrow);
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--nv-gold);
  margin-bottom: var(--nv-space-md);
}
.nv-footer__list li { margin-bottom: 0.7rem; }
.nv-footer__list a { color: var(--nv-on-navy-soft); font-size: 0.975rem; }
.nv-footer__list a:hover { color: #fff; }

.nv-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--nv-space-sm);
  padding-top: var(--nv-space-lg);
  font-size: 0.85rem;
  color: var(--nv-on-navy-soft);
}
.nv-footer__legal { display: flex; gap: var(--nv-space-md); flex-wrap: wrap; }