html { font-size: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  font-family: var(--ff-base);
  font-size: var(--fs-400);
  line-height: var(--lh-base);
  color: var(--c-text);
  background: var(--c-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding-bottom: 0;
}
@media (min-width: 768px) {
  body.has-sticky-cta { padding-bottom: var(--sticky-cta-h); }
}

h1, h2, h3, h4, h5, h6 {
  color: var(--c-navy);
  line-height: var(--lh-tight);
  font-family: var(--ff-display);
  letter-spacing: -0.02em;
  font-weight: 800;
}
h1 {
  font-size: var(--fs-1100);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: -0.03em;
}
h2 {
  font-size: var(--fs-900);
  font-weight: 800;
  text-transform: uppercase;
}
h3 {
  font-size: var(--fs-700);
  font-weight: 700;
}
h4 { font-size: var(--fs-600); }
h5 { font-size: var(--fs-500); }
h6 { font-size: var(--fs-400); }

/* Hero title : grande typo mais hyphenable sur mobile */
.hero__title, .hero--page .hero__title {
  font-size: var(--fs-1100);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: -0.03em;
  line-height: 1;
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: auto;
}
@media (max-width: 480px) {
  .hero__title, .hero--page .hero__title {
    font-size: 2.25rem; /* 36px sur petit mobile */
    line-height: 1.05;
  }
}
@media (min-width: 1024px) {
  .hero__title { font-size: var(--fs-1200); }
}

p { color: var(--c-text); }
p + p { margin-top: var(--sp-4); }

a {
  color: var(--c-blue);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color var(--t-fast);
}
a:hover { color: var(--c-navy); }

strong, b { font-weight: 700; }
em { font-style: italic; }

ul, ol { padding-left: 0; list-style: none; }
.prose ul, .prose ol { padding-left: var(--sp-5); }
.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }
.prose li + li { margin-top: var(--sp-2); }

hr {
  border: 0;
  border-top: 1px solid var(--c-border);
  margin: var(--sp-6) 0;
}

::selection {
  background: var(--c-cyan);
  color: var(--c-navy);
}

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 1000;
  background: var(--c-navy);
  color: var(--c-white);
  padding: var(--sp-3) var(--sp-4);
  border-radius: 0 0 var(--r-md) 0;
}
.skip-link:focus { left: 0; }

body.no-scroll { overflow: hidden; }

[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 800ms cubic-bezier(0.22, 1, 0.36, 1), transform 800ms cubic-bezier(0.22, 1, 0.36, 1);
}
[data-reveal].is-revealed { opacity: 1; transform: none; }

.grid > [data-reveal]:nth-child(1) { transition-delay: 0ms; }
.grid > [data-reveal]:nth-child(2) { transition-delay: 80ms; }
.grid > [data-reveal]:nth-child(3) { transition-delay: 160ms; }
.grid > [data-reveal]:nth-child(4) { transition-delay: 240ms; }
.grid > [data-reveal]:nth-child(5) { transition-delay: 320ms; }
.grid > [data-reveal]:nth-child(6) { transition-delay: 400ms; }
.grid > [data-reveal]:nth-child(7) { transition-delay: 480ms; }
.grid > [data-reveal]:nth-child(8) { transition-delay: 560ms; }
.partners-grid > [data-reveal]:nth-child(1) { transition-delay: 0ms; }
.partners-grid > [data-reveal]:nth-child(2) { transition-delay: 60ms; }
.partners-grid > [data-reveal]:nth-child(3) { transition-delay: 120ms; }
.partners-grid > [data-reveal]:nth-child(4) { transition-delay: 180ms; }
.partners-grid > [data-reveal]:nth-child(5) { transition-delay: 240ms; }
.partners-grid > [data-reveal]:nth-child(6) { transition-delay: 300ms; }
.partners-grid > [data-reveal]:nth-child(7) { transition-delay: 360ms; }
.partners-grid > [data-reveal]:nth-child(8) { transition-delay: 420ms; }

@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; transition: none; }
}

/* Accent rouge cyan dans les titres */
.text-cyan { color: var(--c-cyan); }
.text-blue { color: var(--c-blue); }

/* Mot accentué dans un titre (couleur cyan) */
.t-accent {
  background: linear-gradient(180deg, transparent 60%, rgba(5, 218, 240, 0.35) 60%);
  padding: 0 0.1em;
}
