/*
 * Styles communs à Symfony (/code-promo/) et WordPress (le reste du site).
 * Chargé par templates/base.html.twig et par le thème enfant WordPress (functions.php), toujours depuis
 * /code-promo/assets/css/commun.css : une seule source pour les polices, les couleurs et la typographie de base.
 * Les composants propres à chaque plateforme restent dans styles.css (Symfony) et style.css (thème enfant).
 */

/* ------------------------------------------------------------------------------------------------------------
 * Polices, hébergées sur le site (pas de Google Fonts : ni requête tierce, ni transfert d'adresse IP)
 * - Titres : Segoe Print quand le visiteur l'a (Windows, elle n'est pas distribuée par le site : licence Microsoft),
 *   sinon Patrick Hand (SIL OFL 1.1, fonts/PatrickHand-OFL.txt), de style voisin.
 * - Texte : Open Sans variable 300-800 (SIL OFL 1.1, fonts/OpenSans-OFL.txt), sous-ensemble latin.
 * ---------------------------------------------------------------------------------------------------------- */
@font-face {
  font-family: 'Patrick Hand';
  src: url('/code-promo/assets/fonts/PatrickHand-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Open Sans';
  src: url('/code-promo/assets/fonts/OpenSans-latin.woff2') format('woff2');
  font-weight: 300 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Open Sans';
  src: url('/code-promo/assets/fonts/OpenSans-latin-italic.woff2') format('woff2');
  font-weight: 300 800;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ------------------------------------------------------------------------------------------------------------
 * Jetons : primitives (valeurs) puis rôles. Les composants n'utilisent que les rôles (--cr-…).
 * Corail et rose de la marque : en fond avec du texte foncé ; en texte, leurs teintes foncées (même nuance OKLCH,
 * contraste 5,5:1 sur blanc et 4,9:1 sur les fonds teintés, au lieu de 2,6:1).
 * ---------------------------------------------------------------------------------------------------------- */
:root {
  /* primitives */
  --corail-500: #f87a5a;
  --corail-700: #a94d36;
  --corail-800: #8a3f2c;
  --rose-100: #fdeef1;
  --rose-200: #fbd5dc;
  --rose-500: #ef798a;
  --rose-700: #b25563;
  --encre-900: #2e2e3a;
  --gris-900: #212529;
  --gris-600: #5c636a;
  --gris-300: #dee2e6;
  --gris-100: #f6f4f3;
  --blanc: #ffffff;

  /* rôles */
  --cr-texte: var(--gris-900);
  --cr-texte-secondaire: var(--gris-600);
  --cr-fond: var(--blanc);
  --cr-fond-doux: var(--gris-100);
  --cr-fond-marque: var(--rose-100);
  --cr-bordure: var(--gris-300);
  --cr-lien: var(--corail-700);
  --cr-lien-survol: var(--corail-800);
  --cr-accent: var(--corail-500);
  --cr-accent-texte-dessus: var(--encre-900);
  --cr-accent-2: var(--rose-500);
  --cr-accent-2-texte: var(--rose-700);
  --cr-fond-sombre: var(--encre-900);
  --cr-texte-sur-sombre: var(--blanc);
  --cr-texte-secondaire-sur-sombre: #c9c9d4;
  --cr-lien-sur-sombre: var(--rose-200);
  --cr-focus: #1f5fbf;
  --cr-accent-survol: #fa8d70;
  --cr-etiquette-texte: #9c4654;
  --cr-succes-texte: #1f6b3a;
  --cr-danger-fond: #fbe4e4;
  --cr-danger-texte: #8a1c1c;
  --cr-mise-en-avant-fond: #fff2c2;
  --cr-mise-en-avant-texte: #5c4400;
  --cr-mise-en-avant-bordure: #e9c46a;

  /* polices */
  --cr-police-titre: 'Segoe Print', 'Patrick Hand', cursive;
  --cr-police-texte: 'Open Sans', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;

  /* échelle typographique (taille / interligne) */
  --cr-texte-taille: 1rem;
  --cr-texte-interligne: 1.6;
  --cr-petit-taille: 0.875rem;
  --cr-h1-taille: clamp(1.75rem, 1.35rem + 1.6vw, 2.375rem);
  --cr-h2-taille: clamp(1.4rem, 1.2rem + 0.9vw, 1.75rem);
  --cr-h3-taille: 1.25rem;

  /* espacements, rayons, ombres */
  --cr-espace-1: 0.25rem;
  --cr-espace-2: 0.5rem;
  --cr-espace-3: 1rem;
  --cr-espace-4: 1.5rem;
  --cr-espace-5: 2.5rem;
  --cr-rayon: 0.5rem;
  --cr-rayon-grand: 0.75rem;
  --cr-ombre: 0 1px 2px rgb(0 0 0 / 0.06), 0 2px 8px rgb(0 0 0 / 0.06);
  /* surfaces : un anneau fin et deux ombres douces donnent le relief sans bordure ; au survol, un peu plus de relief.
     Les éléments qui les portent gardent « border: 1px solid transparent » pour le mode contraste élevé de Windows */
  --cr-ombre-surface: 0 0 0 1px rgb(0 0 0 / 0.07), 0 1px 2px rgb(0 0 0 / 0.05), 0 2px 6px rgb(0 0 0 / 0.04);
  --cr-ombre-surface-survol: 0 0 0 1px rgb(0 0 0 / 0.1), 0 2px 4px rgb(0 0 0 / 0.06), 0 8px 20px rgb(0 0 0 / 0.08);
  --cr-ombre-flottante: 0 0 0 1px rgb(0 0 0 / 0.06), 0 4px 8px rgb(0 0 0 / 0.06), 0 12px 32px rgb(0 0 0 / 0.12);
  /* liseré des images de contenu : noir pur à 8 %, jamais une teinte de la palette */
  --cr-contour-image: rgb(0 0 0 / 0.08);
  --cr-largeur-texte: 72ch;
  /* largeur des pages et marge latérale : en-tête, contenu (Symfony .container px-4, WordPress) et pied de page alignés */
  --cr-largeur-page: 1240px;
  --cr-marge-page: 1.5rem;
}

/* ------------------------------------------------------------------------------------------------------------
 * Base
 * ---------------------------------------------------------------------------------------------------------- */
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
}
body {
  font-family: var(--cr-police-texte);
  font-size: var(--cr-texte-taille);
  line-height: var(--cr-texte-interligne);
  color: var(--cr-texte);
  background-color: var(--cr-fond);
}

h1, h2, h3, .h1, .h2, .h3 {
  font-family: var(--cr-police-titre);
  /* couleur héritée : les titres restent lisibles dans les bandeaux sombres */
  color: inherit;
  letter-spacing: normal;
  text-wrap: balance;
  /* Patrick Hand n'existe qu'en 400 : pas de faux gras ; Segoe Print a un vrai gras */
  font-synthesis-weight: none;
}
h1, .h1 { font-size: var(--cr-h1-taille); line-height: 1.2; font-weight: 700; }
h2, .h2 { font-size: var(--cr-h2-taille); line-height: 1.25; font-weight: 400; }
h3, .h3 { font-size: var(--cr-h3-taille); line-height: 1.3; font-weight: 400; }
h4, h5, h6, .h4, .h5, .h6 { font-family: var(--cr-police-texte); line-height: 1.3; font-weight: 700; }

/* descriptions et textes courts sans mot orphelin en fin de bloc ; pas sur les textes longs (articles), d'après la
   fiche interfaces.dev */
.cr-offre__details, .cr-page-marque__resume, .cr-note, .cr-vide p, .cr-faq__question p, .cr-revele__lien,
.cr-bandeau, .cr-accueil__accroche, .cr-pied p, figcaption { text-wrap: pretty; }

a {
  color: var(--cr-lien);
  text-underline-position: from-font;
  text-underline-offset: 0.15em;
  text-decoration-thickness: from-font;
  text-decoration-skip-ink: auto;
}
/* survols : seulement avec une souris (sur écran tactile, :hover reste collé après un appui) */
@media (hover: hover) {
  a:hover { color: var(--cr-lien-survol); }
}

/* ancres (#faq, lettres…) : un peu d'air au-dessus du titre atteint */
:target, [id] { scroll-margin-block-start: var(--cr-espace-4); }

/* longs mots, adresses et codes : jamais hors de leur bloc */
p, li, dd, td, th, blockquote, figcaption { overflow-wrap: break-word; }

:focus-visible {
  outline: 2px solid var(--cr-focus);
  outline-offset: 2px;
}

::selection { background: var(--rose-200); color: var(--gris-900); }

/* champs : 16 px pour éviter le zoom automatique d'iOS à la saisie */
input, select, textarea { font-family: inherit; font-size: max(1rem, 16px); }

/* texte réservé aux lecteurs d'écran ; lien d'évitement visible au focus */
.cr-lecteur-ecran, .sr-only, .screen-reader-text {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.cr-evitement:focus {
  position: fixed !important;
  inset-block-start: var(--cr-espace-2);
  inset-inline-start: var(--cr-espace-2);
  z-index: 10000;
  width: auto !important;
  height: auto !important;
  clip: auto !important;
  padding: var(--cr-espace-2) var(--cr-espace-3) !important;
  margin: 0 !important;
  background: var(--cr-fond);
  color: var(--cr-lien);
  border-radius: var(--cr-rayon);
  box-shadow: var(--cr-ombre);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* ------------------------------------------------------------------------------------------------------------
 * Pubs
 * Emplacements fixes (Symfony : _partials/_pub.html.twig ; WordPress : mu-plugin codereduction-pubs.php) avec une
 * place réservée, pour que la page ne saute pas quand l'annonce arrive ; masqués si Google ne les remplit pas.
 * Les iframes d'annonces automatiques (barres latérales, ancres) ne doivent jamais élargir la page.
 * ---------------------------------------------------------------------------------------------------------- */
html, body { overflow-x: clip; }

.cr-pub {
  display: block;
  margin-block: var(--cr-espace-5);
  margin-inline: auto;
  max-width: 100%;
  min-height: 300px;
  text-align: center;
  contain: layout;
}
.cr-pub__mention {
  display: block;
  margin-block-end: var(--cr-espace-1);
  font-family: var(--cr-police-texte);
  font-size: 0.75rem;
  line-height: 1.4;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--cr-texte-secondaire);
}
.cr-pub ins.adsbygoogle { min-height: 280px; }
/* colonne latérale (ordinateur) : format vertical, reste visible au défilement */
.cr-pub--colonne { min-height: 620px; margin-block: 0; position: sticky; inset-block-start: var(--cr-espace-3); }
.cr-pub--colonne ins.adsbygoogle { min-height: 600px; }
@media (min-width: 768px) {
  .cr-pub { min-height: 270px; }
  .cr-pub ins.adsbygoogle { min-height: 250px; }
}
@media (max-width: 991.98px) {
  .cr-pub--colonne { display: none; }
}
/* Google marque les emplacements qu'il ne remplit pas : on les retire au lieu de laisser un trou */
.cr-pub:has(ins.adsbygoogle[data-ad-status="unfilled"]) { display: none; }
ins.adsbygoogle[data-ad-status="unfilled"] { display: none !important; }

/* Annonces automatiques : Google insère des div.google-auto-placed entre les blocs de la page. Elles prennent toute la
   largeur disponible et, dans une grille ou une rangée (tuiles, logos, puces, cartes), toute une ligne au lieu d'une
   case, sans jamais déborder ; mention « Publicité » comme les emplacements fixes. */
.google-auto-placed {
  clear: both;
  grid-column: 1 / -1;
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100%;
  margin-block: var(--cr-espace-4) !important;
  text-align: center;
}
:is(.cr-puces, .cr-tuiles, .cr-logos, .cr-pied__lettres, .row, .list-inline, .cr-offre__badges) > .google-auto-placed {
  flex: 0 0 100%;
  list-style: none;
}
.google-auto-placed::before {
  content: 'Publicité';
  display: block;
  margin-block-end: var(--cr-espace-1);
  font-family: var(--cr-police-texte);
  font-size: 0.75rem;
  line-height: 1.4;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--cr-texte-secondaire);
}
.google-auto-placed:has(ins.adsbygoogle[data-ad-status="unfilled"]) { display: none !important; }
:is(.cr-pied, .cr-accueil__marques, .bg-dark, .has-background-dark) .google-auto-placed::before { color: var(--cr-texte-secondaire-sur-sombre); }
.google-auto-placed iframe { max-width: 100%; }

/* hors production : cadre de test à la taille réservée */
.cr-pub__test {
  display: grid;
  place-items: center;
  min-height: 250px;
  border: 2px dashed var(--cr-bordure);
  border-radius: var(--cr-rayon);
  color: var(--cr-texte-secondaire);
  font-size: var(--cr-petit-taille);
}
.cr-pub--colonne .cr-pub__test { min-height: 600px; }

/* ------------------------------------------------------------------------------------------------------------
 * Mise en page commune
 * ---------------------------------------------------------------------------------------------------------- */
.cr-conteneur {
  width: 100%;
  max-width: var(--cr-largeur-page);
  margin-inline: auto;
  padding-inline: var(--cr-marge-page);
}
#contenu:focus { outline: none; }

/* ------------------------------------------------------------------------------------------------------------
 * En-tête commun (templates/_partials/_entete.html.twig, repris par WordPress)
 * ---------------------------------------------------------------------------------------------------------- */
.cr-entete {
  background: var(--cr-fond);
  border-block-end: 1px solid var(--rose-200);
  font-family: var(--cr-police-texte);
  font-size: 1rem;
  line-height: 1.5;
}
.cr-entete ul { list-style: none; margin: 0; padding: 0; }
.cr-entete__barre {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--cr-espace-2) var(--cr-espace-4);
  padding-block: var(--cr-espace-3);
}
.cr-entete__logo { display: block; flex: none; }
.cr-entete__logo img { display: block; width: clamp(170px, 42vw, 254px); height: auto; }

.cr-recherche {
  position: relative;
  display: flex;
  flex: 1 1 320px;
  max-width: 34rem;
  margin-inline-start: auto;
}
.cr-recherche__champ {
  flex: 1;
  min-width: 0;
  min-height: 44px;
  padding: 0.5rem 0.875rem;
  border: 1px solid var(--rose-500);
  border-inline-end: 0;
  border-radius: var(--cr-rayon) 0 0 var(--cr-rayon);
  background: var(--cr-fond);
  color: var(--cr-texte);
}
.cr-recherche__champ::placeholder { color: var(--cr-texte-secondaire); opacity: 1; }
.cr-recherche__bouton {
  display: grid;
  place-items: center;
  width: 48px;
  border: 1px solid var(--rose-500);
  border-radius: 0 var(--cr-rayon) var(--cr-rayon) 0;
  background: var(--cr-accent-2);
  color: var(--cr-accent-texte-dessus);
  cursor: pointer;
}
.cr-recherche__liste {
  position: absolute;
  inset-block-start: calc(100% + 4px);
  inset-inline: 0;
  z-index: 1050;
  max-height: min(60vh, 26rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: var(--cr-espace-1);
  background: var(--cr-fond);
  border: 1px solid transparent;
  border-radius: var(--cr-rayon-grand);
  box-shadow: var(--cr-ombre-flottante);
}
.cr-recherche__option {
  display: flex;
  align-items: center;
  gap: var(--cr-espace-3);
  min-height: 44px;
  padding: var(--cr-espace-1) var(--cr-espace-2);
  border-radius: var(--cr-rayon);
  color: var(--cr-texte);
  cursor: pointer;
}
.cr-recherche__option img { width: 48px; height: 32px; object-fit: contain; flex: none; }
.cr-recherche__option i { width: 48px; text-align: center; color: var(--cr-accent-2-texte); flex: none; }
.cr-recherche__option[aria-selected="true"] { background: var(--cr-fond-marque); }
.cr-recherche__vide { padding: var(--cr-espace-2) var(--cr-espace-3); color: var(--cr-texte-secondaire); }

.cr-entete__menu-bouton { display: none; }

.cr-menu { padding-block-end: var(--cr-espace-3); }
.cr-menu__liste {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: var(--cr-espace-1);
  background: var(--rose-200);
  border-radius: var(--cr-rayon-grand);
}
.cr-menu__lien {
  display: block;
  padding: 0.5rem 0.875rem;
  border-radius: var(--cr-rayon);
  color: var(--cr-texte);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
}
.cr-menu__lien:hover { color: var(--cr-texte); }
@media (hover: hover) {
  .cr-menu__lien:hover { background: var(--cr-fond); }
}
.cr-menu__deroulant { position: relative; }
.cr-menu__deroulant summary { list-style: none; }
.cr-menu__deroulant summary::-webkit-details-marker { display: none; }
.cr-menu__deroulant summary::after {
  content: '';
  display: inline-block;
  margin-inline-start: 0.4em;
  vertical-align: 0.15em;
  border: 0.3em solid transparent;
  border-block-start-color: currentColor;
  border-block-end: 0;
}
.cr-menu__deroulant details[open] summary { background: var(--cr-fond); }
.cr-menu__sous-liste {
  position: absolute;
  inset-block-start: calc(100% + 6px);
  inset-inline-start: 0;
  z-index: 1040;
  min-width: 17rem;
  max-height: 70vh;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: var(--cr-espace-1);
  background: var(--cr-fond);
  border: 1px solid transparent;
  border-radius: var(--cr-rayon-grand);
  box-shadow: var(--cr-ombre-flottante);
}
.cr-menu__sous-liste a {
  display: block;
  padding: 0.5rem 0.75rem;
  border-radius: var(--cr-rayon);
  color: var(--cr-texte);
  text-decoration: none;
}
@media (hover: hover) {
  .cr-menu__sous-liste a:hover { background: var(--cr-fond-marque); color: var(--cr-texte); }
}

/* mobile : logo et bouton Menu sur une ligne, recherche pleine largeur dessous, menu replié (si JavaScript) */
@media (max-width: 767.98px) {
  :root { --cr-marge-page: 1rem; }
  .cr-entete__barre { padding-block: var(--cr-espace-2) var(--cr-espace-3); }
  .cr-recherche { order: 3; flex-basis: 100%; max-width: none; margin-inline-start: 0; }
  .cr-js .cr-entete__menu-bouton {
    display: inline-flex;
    align-items: center;
    gap: var(--cr-espace-2);
    margin-inline-start: auto;
    min-height: 44px;
    /* un peu moins de marge côté icône : le bouton paraît centré */
    padding-block: 0;
    padding-inline: 0.75rem var(--cr-espace-3);
    border: 1px solid transparent;
    border-radius: var(--cr-rayon);
    background: var(--cr-fond);
    box-shadow: var(--cr-ombre-surface);
    color: var(--cr-texte);
    font-weight: 600;
    cursor: pointer;
  }
  .cr-js .cr-menu:not(.cr-menu--ouvert) { display: none; }
  .cr-menu__liste { display: block; width: 100%; padding: var(--cr-espace-2); }
  .cr-menu__lien { padding-block: 0.75rem; }
  .cr-menu__sous-liste { position: static; min-width: 0; max-height: none; box-shadow: none; margin: var(--cr-espace-1) 0 var(--cr-espace-2); }
}

/* ------------------------------------------------------------------------------------------------------------
 * Pied de page commun (templates/_partials/_pied.html.twig, repris par WordPress)
 * ---------------------------------------------------------------------------------------------------------- */
.cr-pied {
  margin-block-start: var(--cr-espace-5);
  padding-block: var(--cr-espace-5) var(--cr-espace-4);
  background: var(--cr-fond-sombre);
  color: var(--cr-texte-sur-sombre);
  font-family: var(--cr-police-texte);
  font-size: 0.9375rem;
  line-height: 1.5;
}
.cr-pied ul { list-style: none; margin: 0; padding: 0; }
.cr-pied a { color: var(--cr-lien-sur-sombre); text-decoration: none; }
@media (hover: hover) {
  .cr-pied a:hover { color: var(--cr-texte-sur-sombre); text-decoration: underline; }
  .cr-pied__lettres a:hover { background: var(--cr-accent-2); color: var(--cr-accent-texte-dessus); text-decoration: none; }
  .cr-pied__reseaux a:hover { background: var(--cr-accent-2); color: var(--cr-accent-texte-dessus); }
}
.cr-pied :focus-visible { outline-color: var(--cr-texte-sur-sombre); }
.cr-pied__colonnes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr));
  gap: var(--cr-espace-5) var(--cr-espace-4);
}
.cr-pied__titre,
.cr-pied h2.cr-pied__titre {
  margin: 0 0 var(--cr-espace-3);
  font-family: var(--cr-police-texte);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--cr-texte-sur-sombre);
}
.cr-pied__liste { display: grid; gap: var(--cr-espace-2); margin-block-end: var(--cr-espace-4) !important; }
.cr-pied__liste--deux { grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); column-gap: var(--cr-espace-4); }
.cr-pied__lettres { display: flex; flex-wrap: wrap; gap: var(--cr-espace-1); margin-block-end: var(--cr-espace-4) !important; }
.cr-pied__lettres a {
  display: grid;
  place-items: center;
  min-width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.375rem;
  background: rgb(255 255 255 / 0.08);
  color: var(--cr-texte-sur-sombre);
  font-weight: 700;
}
.cr-pied__bas {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--cr-espace-3);
  margin-block-start: var(--cr-espace-4);
  padding-block-start: var(--cr-espace-4);
  border-block-start: 1px solid rgb(255 255 255 / 0.15);
  color: var(--cr-texte-secondaire-sur-sombre);
}
.cr-pied__bas p { margin: 0; }
.cr-pied__reseaux { display: flex; gap: var(--cr-espace-2); }
.cr-pied__reseaux a {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgb(255 255 255 / 0.08);
  color: var(--cr-texte-sur-sombre);
}

/* l'en-tête et le pied de page communs ne doivent rien hériter des styles du thème WordPress (boutons en majuscules,
   champs à marges, listes à puces…) */
.cr-entete button, .cr-entete input, .cr-entete summary {
  margin: 0;
  font: inherit;
  letter-spacing: normal;
  text-transform: none;
  box-shadow: none;
  width: auto;
  height: auto;
  line-height: 1.5;
}
.cr-entete .cr-recherche__bouton { width: 48px; padding: 0; align-self: stretch; }
.cr-entete .cr-recherche__champ {
  min-height: 44px;
  padding: 0.5rem 0.875rem;
  border: 1px solid var(--rose-500);
  border-inline-end: 0;
  border-radius: var(--cr-rayon) 0 0 var(--cr-rayon);
  background: var(--cr-fond);
  color: var(--cr-texte);
  font-size: max(1rem, 16px);
}
.cr-entete .cr-menu__lien { font-size: 0.875rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; }
.cr-entete li, .cr-pied li { margin: 0; padding: 0; border: 0; }
.cr-entete li::before, .cr-pied li::before { content: none; }
.cr-entete img, .cr-pied svg { max-width: none; }
.cr-entete .cr-recherche__bouton:hover { border-color: var(--rose-500); background: var(--cr-accent-2); color: var(--cr-accent-texte-dessus); }
/* bouton de recherche enfoncé : léger retrait, comme les autres boutons */
.cr-recherche__bouton { transition-property: scale, background-color; transition-duration: 150ms; transition-timing-function: ease-out; }
@media (prefers-reduced-motion: no-preference) {
  .cr-recherche__bouton:active { scale: 0.96; }
}
/* liens dans les bandeaux sombres (Bootstrap .bg-dark côté codes promo, groupes sombres de WordPress) */
.bg-dark a:not(.cr-bouton):not(.btn):not(.wp-block-button__link),
.has-background-dark a:not(.wp-block-button__link),
.cr-sur-sombre a { color: var(--cr-lien-sur-sombre); }
/* recherche commune placée dans un contenu (accueil WordPress) */
.cr-recherche--contenu { max-width: 34rem; margin-inline: 0; }
.cr-recherche--contenu .cr-recherche__champ { margin: 0; min-height: 44px; padding: 0.5rem 0.875rem; border: 1px solid var(--rose-500); border-inline-end: 0; border-radius: var(--cr-rayon) 0 0 var(--cr-rayon); background: var(--cr-fond); color: var(--cr-texte); font-size: max(1rem, 16px); }
.cr-recherche--contenu .cr-recherche__bouton { margin: 0; width: 48px; min-height: 44px; padding: 0; border: 1px solid var(--rose-500); border-radius: 0 var(--cr-rayon) var(--cr-rayon) 0; background: var(--cr-accent-2); color: var(--cr-accent-texte-dessus); }