/* ============================================================
   Mille Mentors — Base element defaults
   ------------------------------------------------------------
   Light, unopinionated resets + brand defaults so any surface
   that links styles.css inherits the right type and colour.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--font-text);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--text-body);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-family: var(--font-display);
  color: var(--text-strong);
  font-weight: var(--weight-semibold);
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-heading);
}

p { margin: 0; }

a {
  color: var(--color-primary);
  text-decoration: none;
  transition: color var(--transition-fast) var(--ease-standard);
}
a:hover { color: var(--color-primary-hover); }

::selection {
  background: var(--mm-orange-flamme);
  color: var(--mm-gris-brume);
}

:focus-visible {
  outline: var(--focus-width) solid var(--focus-ring);
  outline-offset: var(--focus-offset);
}

/* ---- Brand « motif bande » -----------------------------------
   Vertical band motif: the M monogram repeated over vertical colour
   stripes, per the charte (« utilisé en bande verticale reprenant
   le logo dans une composition répétitive »). Apply .mm-band /
   .mm-band-cool to an edge strip or panel. NOTE: the M used here is
   the PLACEHOLDER mark — swap in the official monogram from the
   brand TOOLBOX/MOTIFS files when they are added to assets/. */
.mm-band {
  background-color: var(--mm-orange-flamme);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 64 64'%3E%3Cpath d='M8 48 C8 28 14 20 24 20 C32 20 33 30 33 40 C33 30 35 16 45 16 C54 16 56 26 56 44' fill='none' stroke='%23FFDED1' stroke-width='7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),
    repeating-linear-gradient(to right,
      var(--mm-orange-flamme) 0 40px,
      var(--mm-corail-doux) 40px 80px);
  background-repeat: repeat, repeat;
  background-size: 40px 40px, auto;
}
.mm-band-cool {
  background-color: var(--mm-bleu-lagon);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 64 64'%3E%3Cpath d='M8 48 C8 28 14 20 24 20 C32 20 33 30 33 40 C33 30 35 16 45 16 C54 16 56 26 56 44' fill='none' stroke='%23EAF9F9' stroke-width='7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),
    repeating-linear-gradient(to right,
      var(--mm-bleu-lagon) 0 40px,
      var(--mm-bleu-menthol) 40px 80px);
  background-repeat: repeat, repeat;
  background-size: 40px 40px, auto;
}