/* Structure générale de page */
.nc-shell {
  width: 100%;
  overflow-x: hidden;
  overflow-x: clip; /* permet à l'en-tête de coller (voir base.css) */
}

.nc-section {
  border-top: var(--nc-bordure);
}

.nc-section--noir {
  background: var(--nc-noir);
  color: var(--nc-blanc);
}

.nc-section--cyan {
  background: var(--nc-cyan);
}

.nc-container {
  padding-left: var(--nc-pad-inline);
  padding-right: var(--nc-pad-inline);
}

/* Bandeau ticker supérieur */
.nc-ticker {
  display: flex;
  align-items: center;
  height: clamp(22px, 1.4vw, 34px);
  background: var(--nc-noir);
  color: var(--nc-blanc);
  overflow: hidden;
}

.nc-ticker__flags {
  display: flex;
  flex: none;
  height: 100%;
}

.nc-ticker__flags span {
  width: clamp(13px, 1.4vw, 34px);
}

.nc-ticker__flags span:nth-child(1) { background: var(--nc-cyan); }
.nc-ticker__flags span:nth-child(2) { background: var(--nc-magenta); }
.nc-ticker__flags span:nth-child(3) { background: var(--nc-jaune); }

.nc-ticker__track {
  flex: 1;
  overflow: hidden;
  display: flex;
}

.nc-ticker__list {
  display: flex;
  gap: clamp(26px, 3vw, 64px);
  white-space: nowrap;
  padding-left: clamp(12px, 1.4vw, 26px);
  font: 400 var(--nc-text-meta) var(--nc-police-mono);
  letter-spacing: .15em;
  text-transform: uppercase;
  animation: nc-ticker-scroll 30s linear infinite;
}

@keyframes nc-ticker-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* Entête */
.nc-header {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  gap: clamp(14px, 2.4vw, 46px);
  padding: 0 var(--nc-pad-inline);
  height: clamp(56px, 4.6vw, 88px);
  border-bottom: var(--nc-bordure);
  background: var(--nc-blanc);
}

.nc-logo {
  display: flex;
  align-items: center;
  gap: clamp(8px, .8vw, 14px);
  margin-right: auto;
}

.nc-logo__mark {
  display: grid;
  place-items: center;
  width: clamp(28px, 2.4vw, 46px);
  height: clamp(28px, 2.4vw, 46px);
  background: var(--nc-noir);
  color: var(--nc-blanc);
  font: 400 clamp(0.8125rem, 1.05vw, 1.25rem) var(--nc-police-titre);
  letter-spacing: -.03em;
}

/* Monogramme en image (logo SVG, 09/10/2026) : même carré, marge noire
   intérieure de 17 % pour garder l'équilibre de l'ancien « nc » en texte. */
img.nc-logo__mark {
  box-sizing: border-box;
  padding: calc(clamp(28px, 2.4vw, 46px) * .17);
  object-fit: contain;
}

.nc-logo__text {
  font: 400 clamp(1rem, 1.35vw, 1.625rem) var(--nc-police-titre);
  letter-spacing: -.045em;
}

.nc-nav {
  display: flex;
  align-items: center;
  gap: clamp(18px, 1.9vw, 38px);
  font: 600 var(--nc-text-nav) var(--nc-police-texte);
  letter-spacing: -.01em;
}

.nc-burger {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  cursor: pointer;
  background: var(--nc-noir);
  color: var(--nc-blanc);
}

/* Menu ouvert : violet (au lieu du magenta), demande de Christian du
   01/10/2026 — même violet que le bouton Contact. */
.nc-burger[aria-expanded="true"] {
  background: var(--nc-violet-page);
}

.nc-burger span {
  display: block;
  height: 2px;
  background: currentColor;
}

.nc-burger span:nth-child(1) { width: 19px; }
.nc-burger span:nth-child(2) { width: 19px; }
.nc-burger span:nth-child(3) { width: 13px; }

/* Icône téléphone dédiée au mobile : masquée par défaut, affichée
   uniquement sous le point de rupture, juste avant le burger (même motif
   que .nc-burger ci-dessus). Celle du header desktop, elle, reste dans
   .nc-nav et disparaît avec lui sous ce même point de rupture. Sélecteur
   à deux classes (`.nc-header-phone.nc-header-phone--mobile`) : nécessaire
   pour l'emporter sur `display: inline-flex` de `.nc-header-phone` défini
   dans components.css, chargé après ce fichier — même spécificité sinon,
   donc le dernier fichier gagnerait quel que soit le point de rupture. */
.nc-header-phone.nc-header-phone--mobile {
  display: none;
}

/* Bascule desktop / mobile, un seul point de rupture comme la V5 */
@media (max-width: 819px) {
  .nc-nav { display: none; }
  .nc-mega { display: none !important; }
  .nc-burger { display: flex; }
  .nc-header-phone.nc-header-phone--mobile { display: inline-flex; }
}

@media (min-width: 820px) {
  .nc-drawer { display: none !important; }
  .nc-realisations__item { flex: 1 1 150px; }
}

[hidden] {
  display: none !important;
}

@media (prefers-reduced-motion: reduce) {
  /* L'animation infinie du ticker doit être arrêtée, pas seulement accélérée. */
  .nc-ticker__list {
    animation: none;
  }
}