/* WLS Ventures SA - charte reprise du site Wix Studio d'origine (Montserrat, rouge #E42215, encre #2C2C2C) */

@font-face { font-family: "Montserrat WLS"; src: url("../fonts/montserrat-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Montserrat WLS"; src: url("../fonts/montserrat-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Montserrat WLS"; src: url("../fonts/montserrat-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Montserrat WLS"; src: url("../fonts/montserrat-900.woff2") format("woff2"); font-weight: 900; font-display: swap; }

:root {
  --rouge: #E42215;
  --rouge-fonce: #C51C10;
  --encre: #2C2C2C;
  --texte: #3A3A3A;
  --doux: #6B6B6B;
  --blanc: #FFFFFF;
  --brume: #F9F9F9;
  --gris: #949494;
  --trait: rgba(44, 44, 44, .16);
  --trait-fort: rgba(44, 44, 44, .6);
  --police: "Montserrat WLS", "Montserrat", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --marge: clamp(20px, 4vw, 58px);
  --large: 1320px;
  --rayon: clamp(24px, 2.6vw, 36px);
  --rayon-bandeau: clamp(56px, 8vw, 114px);
  --entete: 80px;
  --ease: cubic-bezier(.25, .46, .45, .94);
  --ease-fort: cubic-bezier(.86, 0, .07, 1);
  --ease-sortie: cubic-bezier(.16, 1, .3, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--police);
  font-size: 17px;
  line-height: 1.65;
  color: var(--texte);
  background: var(--blanc);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}
body.menu-ouvert { overflow: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { margin: 0; font-weight: 700; line-height: 1.08; color: var(--encre); }
p, ul, ol, figure, blockquote, dl, dd { margin: 0; }
strong { font-weight: 600; color: var(--encre); }
::selection { background: var(--rouge); color: #fff; }
:focus-visible { outline: 2px solid var(--rouge); outline-offset: 3px; }

.rouge { color: var(--rouge); }
.conteneur { width: 100%; max-width: calc(var(--large) + 2 * var(--marge)); margin-inline: auto; padding-inline: var(--marge); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.evitement { position: absolute; left: 12px; top: -80px; z-index: 300; background: var(--encre); color: #fff; padding: 10px 16px; border-radius: 4px; font-size: 14px; font-weight: 700; text-decoration: none; }
.evitement:focus { top: 12px; }

/* ---------- Typographie ---------- */
.t-hero { font-size: clamp(36px, 5.7vw, 82px); line-height: 1.02; text-transform: uppercase; letter-spacing: -.012em; }
.t-page { font-size: clamp(34px, 4.75vw, 68px); line-height: 1.05; letter-spacing: -.01em; }
.t-section { font-size: clamp(27px, 3.3vw, 48px); line-height: 1.08; text-transform: uppercase; letter-spacing: -.005em; }
.t-carte { font-size: clamp(19px, 1.75vw, 25px); line-height: 1.18; text-transform: uppercase; }
.surtitre { display: block; font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--rouge); margin-bottom: 18px; }
.chapo { font-size: clamp(18px, 1.45vw, 21px); line-height: 1.6; color: var(--encre); }
.texte { max-width: 64ch; }
.texte p + p { margin-top: 1.05em; }
.citation { font-size: clamp(22px, 2.4vw, 34px); font-weight: 600; line-height: 1.32; color: var(--encre); }
.citation .rouge { font-weight: 700; }

/* ---------- Boutons ---------- */
.fleche-courbe { width: 18px; height: 18px; fill: currentColor; flex: none; transition: transform .45s var(--ease-sortie); }
.btn {
  display: inline-flex; align-items: center; gap: 12px;
  min-height: 48px; padding: 0 26px;
  background: var(--rouge); color: #fff;
  border: 0; border-radius: 4px;
  font: 700 14px/1 var(--police); letter-spacing: .01em;
  text-decoration: none; cursor: pointer;
  transition: background-color .3s var(--ease), color .3s var(--ease);
}
.btn:hover { background: var(--rouge-fonce); }
.btn:hover .fleche-courbe, .btn-ligne:hover .fleche-courbe, .lien-fleche:hover .fleche-courbe { transform: translateX(4px); }
.btn--blanc { background: #fff; color: var(--rouge); }
.btn--blanc:hover { background: #F2F2F2; }
.btn[disabled] { opacity: .6; cursor: wait; }
.btn-ligne {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 8px 0; border-bottom: 1px solid currentColor;
  font-size: 14px; font-weight: 700; color: var(--encre); text-decoration: none;
}
.btn-ligne--blanc { color: #fff; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 32px; }

/* ---------- En-tête ---------- */
.entete {
  position: sticky; top: 0; z-index: 50;
  height: var(--entete);
  background: rgba(255, 255, 255, .94);
  -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px);
  transition: box-shadow .4s var(--ease);
}
.entete.defile { box-shadow: 0 1px 0 var(--trait); }
.entete__barre { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-inline: var(--marge); }
.entete__logo { display: block; line-height: 0; }
.entete__logo img { width: clamp(176px, 17.8vw, 257px); }
.entete__droite { display: flex; align-items: center; gap: clamp(18px, 3vw, 44px); }
.lien-fleche { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; color: var(--encre); text-decoration: none; }
.lien-fleche[aria-current="page"] { color: var(--rouge); }
.burger { width: 44px; height: 44px; margin-right: -4px; padding: 0; border: 0; background: none; cursor: pointer; display: grid; place-content: center; gap: 9px; }
.burger span { display: block; width: 34px; height: 2px; background: var(--encre); transition: width .4s var(--ease-sortie); }
.burger span:last-child { width: 22px; margin-left: auto; }
.burger:hover span:last-child { width: 34px; }
@media (max-width: 640px) { .entete__droite .lien-fleche { display: none; } }

/* ---------- Menu plein écran ---------- */
.menu { position: fixed; inset: 0; z-index: 200; visibility: hidden; }
.menu.ouvert { visibility: visible; }
.menu__voile { position: absolute; inset: 0; background: rgba(44, 44, 44, .8); opacity: 0; transition: opacity .5s var(--ease); }
.menu.ouvert .menu__voile { opacity: 1; }
.menu__panneau {
  position: absolute; inset: 0; display: flex; flex-direction: column; background: #fff;
  clip-path: inset(0 0 100% 0); transition: clip-path .75s var(--ease-fort), visibility 0s linear .75s;
}
.menu.ouvert .menu__panneau { clip-path: inset(0 0 0 0); transition: clip-path .75s var(--ease-fort); }
.menu__haut { position: absolute; top: 0; left: 0; right: 0; z-index: 3; height: var(--entete); display: flex; align-items: center; justify-content: space-between; padding-inline: var(--marge); pointer-events: none; }
.menu__haut > * { pointer-events: auto; }
.menu__haut img { width: clamp(176px, 17.8vw, 257px); }
.menu__fermer { position: relative; width: 44px; height: 44px; margin-right: -4px; border: 0; background: none; cursor: pointer; }
.menu__fermer::before, .menu__fermer::after { content: ""; position: absolute; left: 7px; right: 7px; top: 21px; height: 2px; background: var(--rouge); transform: rotate(45deg); transition: transform .5s var(--ease-sortie); }
.menu__fermer::after { transform: rotate(-45deg); }
.menu__fermer:hover::before { transform: rotate(135deg); }
.menu__fermer:hover::after { transform: rotate(45deg); }
.menu__colonnes { flex: 1; min-height: 0; display: grid; grid-template-columns: repeat(5, 1fr); list-style: none; padding: 0; }
.menu__colonnes li { display: flex; min-height: 0; }
.menu__col {
  position: relative; flex: 1; overflow: hidden; display: flex; flex-direction: column; gap: 14px;
  padding: calc(var(--entete) + 48px) clamp(18px, 2vw, 32px) 0; background: #fff; text-decoration: none;
}
.menu__colonnes li:nth-child(even) .menu__col { background: var(--brume); }
.menu__num { font-size: 13px; font-weight: 700; color: var(--gris); letter-spacing: .08em; }
.menu__titre { display: flex; align-items: flex-start; gap: 10px; font-size: clamp(16px, 1.55vw, 22.8px); font-weight: 700; line-height: 1.18; color: var(--rouge); text-transform: uppercase; }
.menu__titre .fleche-courbe { width: 20px; height: 20px; margin-top: 1px; }
.menu__col:hover .fleche-courbe { transform: translateX(4px); }
.menu__resume { font-size: 14px; line-height: 1.5; color: var(--doux); max-width: 24ch; }
.menu__col img { position: absolute; left: 0; bottom: 0; width: 100%; height: 62%; object-fit: cover; object-position: top center; transform: translateY(12%); transition: transform 1.1s var(--ease-sortie); }
.menu.ouvert .menu__col img { transform: translateY(4%); }
.menu__col:hover img { transform: translateY(0) !important; }
.menu__col[aria-current="page"] .menu__titre span { box-shadow: 0 2px 0 var(--rouge); }
.menu__bande { flex: none; min-height: 100px; background: var(--rouge); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px 24px; padding: 18px var(--marge); color: #fff; }
.menu__bande img { width: clamp(180px, 20vw, 292px); }
.menu__bande p { font-size: 14px; font-weight: 600; }
@media (max-width: 960px) {
  .menu__panneau { overflow-y: auto; }
  .menu__colonnes { flex: none; grid-template-columns: 1fr; padding-top: var(--entete); }
  .menu__col { flex-direction: row; align-items: baseline; gap: 16px; padding: 22px var(--marge); border-top: 1px solid var(--trait); background: #fff !important; }
  .menu__col img, .menu__resume { display: none; }
  .menu__titre { font-size: clamp(20px, 5.4vw, 26px); }
  .menu__bande { margin-top: auto; }
}

/* ---------- Apparitions ---------- */
.js .apparait { opacity: 0; transform: translateY(28px); transition: opacity 1.2s var(--ease), transform 1.2s var(--ease); }
.js .apparait.vu { opacity: 1; transform: none; }
.js .apparait[data-delai="1"] { transition-delay: .12s; }
.js .apparait[data-delai="2"] { transition-delay: .24s; }
.js .apparait[data-delai="3"] { transition-delay: .36s; }
.js .apparait[data-delai="4"] { transition-delay: .48s; }
.lignes .ligne { display: block; overflow: hidden; padding-bottom: .06em; margin-bottom: -.06em; }
.lignes .ligne > span { display: block; }
.js .lignes .ligne > span { transform: translateY(108%); transition: transform 1.1s var(--ease-fort); }
.js .lignes.vu .ligne > span { transform: none; }
.js .lignes.vu .ligne:nth-child(2) > span { transition-delay: .09s; }
.js .lignes.vu .ligne:nth-child(3) > span { transition-delay: .18s; }
.js .lignes.vu .ligne:nth-child(4) > span { transition-delay: .27s; }

/* ---------- Sections ---------- */
.section { padding-block: clamp(72px, 10vw, 148px); }
.section--serree { padding-block: clamp(56px, 7vw, 100px); }
.section--brume { background: var(--brume); }
.entete-section { display: grid; gap: 22px 64px; margin-bottom: clamp(40px, 5.5vw, 80px); }
@media (min-width: 960px) {
  .entete-section--duo { grid-template-columns: 1.05fr .95fr; align-items: end; }
}
.entete-section .t-section .rouge, .t-page .rouge, .t-hero .rouge { color: var(--rouge); }

.duo { display: grid; gap: clamp(36px, 6vw, 96px); }
@media (min-width: 960px) {
  .duo { grid-template-columns: 1fr 1fr; align-items: center; }
  .duo--large-gauche { grid-template-columns: 1.15fr .85fr; }
  .duo--haut { align-items: start; }
}
.image-arrondie { border-radius: var(--rayon); overflow: hidden; }
.image-arrondie img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Cartes ---------- */
.grille-3 { display: grid; gap: clamp(16px, 2vw, 28px); grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); }
.grille-2 { display: grid; gap: clamp(16px, 2vw, 28px); grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.carte {
  position: relative; display: flex; flex-direction: column; gap: 20px;
  background: #fff; border-radius: var(--rayon);
  padding: clamp(28px, 3vw, 44px);
  min-height: clamp(280px, 28vw, 420px);
}
.section:not(.section--brume) .carte { background: var(--brume); }
.carte__fleche { width: 34px; height: 34px; fill: var(--rouge); }
.carte__num { font-size: clamp(40px, 3.8vw, 54px); font-weight: 700; line-height: 1; color: var(--rouge); }
.carte__corps { margin-top: auto; display: grid; gap: 14px; }
.carte__corps p { font-size: 16px; line-height: 1.68; }

/* ---------- Bandeau rouge ---------- */
.bandeau {
  position: relative; overflow: hidden;
  margin-right: clamp(0px, 11vw, 153px);
  background: var(--rouge); color: #fff;
  border-top-right-radius: var(--rayon-bandeau);
  padding: clamp(60px, 7.5vw, 116px) var(--marge);
}
.bandeau__int { max-width: calc(var(--large) - 153px); margin-left: max(0px, calc((100vw - var(--large)) / 2 - var(--marge))); display: grid; gap: 34px; }
.bandeau p.grand { font-size: clamp(23px, 2.65vw, 38px); font-weight: 600; line-height: 1.3; max-width: 34ch; color: #fff; }
.bandeau .petit { font-size: 16px; line-height: 1.65; max-width: 60ch; color: rgba(255, 255, 255, .88); }
.carres { position: absolute; right: clamp(20px, 3.5vw, 56px); bottom: clamp(20px, 3.5vw, 48px); display: grid; grid-template-columns: repeat(5, 9px); gap: 5px; }
.carres i { width: 9px; height: 9px; background: #fff; }
.carres i.v { background: transparent; }
@media (max-width: 700px) { .carres { display: none; } }

/* ---------- Hero de l'accueil ---------- */
.hero { position: relative; height: clamp(640px, calc(100svh - var(--entete)), 940px); overflow: hidden; background: #fff; isolation: isolate; }
.hero__chaine { position: absolute; inset: 0; z-index: -3; background: url("../img/hero-chaine.webp") center 70% / cover no-repeat; opacity: .5; filter: blur(3px); transform: scale(1.04); }
.hero__chaine::after { content: ""; position: absolute; inset: 0; background: linear-gradient(#fff 0%, rgba(255,255,255,.35) 38%, rgba(255,255,255,0) 70%); }
.hero__pic { position: absolute; z-index: -2; left: 50%; bottom: 7%; width: min(38vw, 520px); translate: -50% 0; }
.hero__pic img { width: 100%; animation: respire 5s ease-in-out infinite alternate; }
.hero__nuages { position: absolute; z-index: -1; left: -4%; right: -4%; bottom: -4%; height: 46%; }
.hero__nuages img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%; }
.hero__contenu { padding-top: clamp(56px, 11vh, 132px); text-align: center; }
.hero__contenu .t-hero { margin-inline: auto; }
.hero__ligne { margin-top: clamp(18px, 2.4vh, 28px); font-size: clamp(14px, 1.2vw, 17px); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--encre); }
.hero .lignes, .hero__ligne { display: block; }
.hero__ligne { line-height: 1.5; max-width: 60ch; margin-inline: auto; text-shadow: 0 0 1px rgba(255, 255, 255, .95), 0 0 6px rgba(255, 255, 255, .9), 0 0 16px rgba(255, 255, 255, .8), 0 0 28px rgba(255, 255, 255, .55); }
@media (min-width: 960px) { .hero__ligne { max-width: none; } }
@media (max-width: 959px) { .hero__ligne br { display: none; } }
.hero__bas { position: absolute; left: 0; right: 0; bottom: clamp(26px, 6vh, 64px); display: flex; justify-content: center; }
@keyframes respire { from { transform: translateY(0); } to { transform: translateY(-22px); } }
@media (max-width: 700px) {
  .hero { height: clamp(600px, calc(100svh - var(--entete)), 760px); }
  .hero__pic { width: 118vw; bottom: 14%; }
  .hero__nuages { left: -40%; right: -40%; bottom: 0; }
  .hero__ligne { letter-spacing: .08em; padding-inline: 10px; }
}

/* ---------- Ouverture des pages intérieures ---------- */
.ouverture { padding-top: clamp(48px, 7vw, 104px); }
.ouverture__grille { display: grid; gap: 24px 64px; }
@media (min-width: 960px) { .ouverture__grille { grid-template-columns: 1.4fr .75fr; align-items: end; } }
.ouverture__image { position: relative; margin-top: clamp(40px, 5.5vw, 80px); margin-right: clamp(0px, 11vw, 153px); height: clamp(240px, 34vw, 500px); border-top-right-radius: var(--rayon-bandeau); overflow: hidden; }
.ouverture__image img { width: 100%; height: 100%; object-fit: cover; }
.fil { font-size: 13px; font-weight: 600; color: var(--doux); margin-bottom: 22px; }
.fil a { text-decoration: none; }
.fil a:hover { color: var(--rouge); }

/* ---------- Modules managerIMP ---------- */
.grille-modules { display: grid; gap: clamp(16px, 2vw, 28px); grid-template-columns: 1fr; }
@media (min-width: 640px) { .grille-modules { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .grille-modules { grid-template-columns: repeat(3, 1fr); } }
.carte--module { min-height: 0; gap: 18px; }
.carte--module .carte__corps { margin-top: 0; }
@media (min-width: 960px) { .duo--large-droite { grid-template-columns: .8fr 1.2fr; } }

/* ---------- Capture d'écran d'outil ---------- */
.capture { margin: 0; }
.capture img { width: 100%; height: auto; border-radius: calc(var(--rayon) * .7); border: 1px solid var(--trait); box-shadow: 0 40px 90px -40px rgba(0, 0, 0, .35); background: #fff; }
.capture figcaption { margin-top: 14px; font-size: 13px; color: var(--doux); }

/* ---------- Chiffres / repères ---------- */
.reperes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); border-top: 1px solid var(--trait-fort); }
.repere { padding: 30px 28px 0 0; display: grid; gap: 14px; align-content: start; }
.repere + .repere { border-left: 1px solid var(--trait); padding-left: 28px; }
@media (max-width: 760px) { .repere + .repere { border-left: 0; padding-left: 0; border-top: 1px solid var(--trait); } .repere { padding-bottom: 28px; } }
.repere__annee { font-size: clamp(52px, 6.4vw, 104px); font-weight: 700; line-height: .95; color: var(--rouge); letter-spacing: -.02em; }
.repere__titre { font-size: 15px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--encre); }
.repere p { font-size: 16px; }

/* ---------- Marques ---------- */
.marques { display: grid; gap: clamp(16px, 2vw, 28px); grid-template-columns: repeat(6, 1fr); }
.marque { grid-column: span 2; position: relative; display: flex; flex-direction: column; text-decoration: none; color: inherit; --fond: #fff; }
.marque:nth-child(-n+2) { grid-column: span 3; }
.section:not(.section--brume) .marque { --fond: #fff; }
.section--brume .marque { --fond: var(--brume); }
@media (max-width: 1000px) { .marques { grid-template-columns: 1fr 1fr; } .marque, .marque:nth-child(-n+2) { grid-column: span 1; } .marque:last-child { grid-column: 1 / -1; } }
@media (max-width: 620px) { .marques { grid-template-columns: 1fr; } .marque:last-child { grid-column: auto; } }
.marque__visuel { position: relative; aspect-ratio: 4 / 3.1; border-radius: var(--rayon); overflow: hidden; background: #e9e9e9; }
.marque:nth-child(-n+2) .marque__visuel { aspect-ratio: 16 / 10.5; }
.marque__visuel > img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-sortie); }
.marque:hover .marque__visuel > img { transform: scale(1.045); }
.marque__logo { position: absolute; left: 18px; top: 18px; width: 156px; height: 68px; background: #fff; border-radius: 16px; display: grid; place-items: center; box-shadow: 0 10px 30px -12px rgba(0,0,0,.35); }
.marque__logo img { height: var(--h, 40px); width: auto; max-width: 132px; object-fit: contain; }
@media (max-width: 620px) { .marque__logo { width: 140px; height: 62px; } .marque__logo img { height: calc(var(--h, 40px) * .9); } }
.coin { position: absolute; right: 0; bottom: 0; width: 88px; height: 88px; background: var(--fond); border-top-left-radius: 44px; }
.coin::before, .coin::after { content: ""; position: absolute; width: 26px; height: 26px; background: radial-gradient(circle at 0 0, transparent 25.5px, var(--fond) 26px); }
.coin::before { right: 0; top: -26px; }
.coin::after { left: -26px; bottom: 0; }
.rond { position: absolute; right: 10px; bottom: 10px; width: 68px; height: 68px; border-radius: 50%; background: var(--rouge); display: grid; place-items: center; transition: transform .5s var(--ease-sortie); }
.rond svg { width: 22px; height: 22px; fill: #fff; transform: rotate(-90deg); }
.marque:hover .rond { transform: rotate(45deg); }
.marque__texte { padding: 22px 6px 0; display: grid; gap: 8px; }
.marque__lieu { font-size: 12.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--doux); }
.marque__texte p { font-size: 16px; line-height: 1.6; max-width: 46ch; }

/* Success stories */
.stories { display: grid; gap: clamp(14px, 1.6vw, 24px); grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1100px) { .stories { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .stories { grid-template-columns: 1fr; } }
.story { position: relative; display: block; aspect-ratio: 369 / 512; border-radius: calc(var(--rayon) * .94); overflow: hidden; color: #fff; text-decoration: none; isolation: isolate; --fond: #fff; }
.section--brume .story { --fond: var(--brume); }
@media (max-width: 560px) { .story { aspect-ratio: 369 / 512; } }
.story > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-sortie); }
.story::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to top, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .74) 42%, rgba(0, 0, 0, .3) 62%, rgba(0, 0, 0, 0) 78%); }
.story__texte { text-shadow: 0 1px 12px rgba(0, 0, 0, .45); }
[id] { scroll-margin-top: calc(var(--entete) + 16px); }
.pied :focus-visible, .bandeau :focus-visible, .menu__bande :focus-visible, .story:focus-visible { outline-color: #fff; }
.section--brume .surtitre { color: var(--rouge-fonce); }
.menu__num { color: var(--doux) !important; }
@media (max-width: 700px) { .pied__nav a { display: inline-block; padding-block: 12px; } .story__texte p { font-size: 15.5px; } }
.story:hover > img { transform: scale(1.05); }
.story:hover .rond { transform: rotate(45deg); }
.story__texte { position: absolute; left: 0; right: 0; bottom: 0; padding: 0 clamp(20px, 2vw, 28px) clamp(20px, 2vw, 28px); display: grid; gap: 8px; }
.story__texte p { padding-right: 66px; }
.story__tag { font-size: 11.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .78); }
.story__texte h3 { color: #fff; font-size: clamp(19px, 1.7vw, 25px); text-transform: uppercase; line-height: 1.1; }
.story__texte p { font-size: 14.5px; line-height: 1.5; color: rgba(255, 255, 255, .9); }

/* Fiche marque (page Nos marques) */
.fiche { display: grid; gap: clamp(28px, 5vw, 80px); padding-block: clamp(56px, 7vw, 104px); border-top: 1px solid var(--trait); }
.fiche:first-of-type { border-top: 0; }
@media (min-width: 960px) {
  .fiche { grid-template-columns: .95fr 1.05fr; align-items: center; }
  .fiche:nth-of-type(even) .fiche__visuels { order: 2; }
}
.fiche__visuels { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.fiche__visuels img { width: 100%; height: 100%; object-fit: cover; border-radius: calc(var(--rayon) * .8); }
.fiche__visuels .grande { grid-column: 1 / -1; aspect-ratio: 16 / 11; }
.fiche__visuels .petite { aspect-ratio: 4 / 3.4; }
.fiche__logo { display: block; height: var(--hf, 60px); width: auto; max-width: 240px; object-fit: contain; object-position: left center; margin-bottom: 26px; }
.fiche__logo--noir { display: grid; place-items: center; width: max-content; height: auto; max-width: none; background: #000; border-radius: 12px; padding: 16px 22px; }
.fiche__logo--noir img { width: 190px; height: auto; }
.marque__logo--noir { background: #000; }
.marque__logo--noir img { max-width: 138px; }
em { font-style: normal; }
sup { font-size: .62em; line-height: 0; }
.fiche__faits { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 0; margin-top: 30px; border-top: 1px solid var(--trait); }
.fiche__faits div { padding: 16px 16px 0 0; }
.fiche__faits dt { font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--doux); }
.fiche__faits dd { font-size: 15.5px; font-weight: 600; color: var(--encre); margin-top: 4px; }

/* ---------- Accordéons ---------- */
.accordeons { border-top: 1px solid var(--trait-fort); }
.accordeon { border-bottom: 1px solid var(--trait-fort); }
.accordeon summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 24px; padding: 26px 0; font-size: clamp(17px, 1.5vw, 21px); font-weight: 700; color: var(--encre); text-transform: uppercase; }
.accordeon summary::-webkit-details-marker { display: none; }
.accordeon summary .num { font-size: 14px; color: var(--rouge); min-width: 26px; }
.accordeon summary::after { content: ""; margin-left: auto; width: 16px; height: 16px; flex: none; background: linear-gradient(var(--rouge), var(--rouge)) center / 16px 2px no-repeat, linear-gradient(var(--rouge), var(--rouge)) center / 2px 16px no-repeat; transition: transform .4s var(--ease-sortie); }
.accordeon[open] summary::after { transform: rotate(45deg); }
.accordeon__corps { padding: 0 0 30px 50px; max-width: 72ch; }
.accordeon__corps p + p { margin-top: 1em; }
@media (max-width: 600px) { .accordeon__corps { padding-left: 0; } }

/* ---------- Formulaire ---------- */
.carte-form { background: #fff; border-radius: 30px; padding: clamp(28px, 4.5vw, 64px); box-shadow: 0 40px 90px -40px rgba(0, 0, 0, .28); }
.formulaire { display: grid; gap: 28px 34px; }
@media (min-width: 720px) { .formulaire { grid-template-columns: 1fr 1fr; } }
.champ--large, .formulaire__pied { grid-column: 1 / -1; }
.champ label { display: block; font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--encre); margin-bottom: 6px; }
.champ input, .champ textarea, .champ select {
  width: 100%; border: 0; border-bottom: 1px solid var(--trait-fort); border-radius: 0; background: transparent;
  font: 400 17px/1.45 var(--police); color: var(--encre); padding: 10px 0;
  transition: border-color .3s var(--ease), box-shadow .3s var(--ease);
  -webkit-appearance: none; appearance: none;
}
.champ select { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23E42215' stroke-width='2'/%3E%3C/svg%3E") right 4px center no-repeat; padding-right: 24px; }
.champ textarea { min-height: 130px; resize: vertical; }
.champ input:focus, .champ textarea:focus, .champ select:focus { outline: none; border-bottom-color: var(--rouge); box-shadow: 0 1px 0 var(--rouge); }
.champ .aide { font-size: 13px; color: var(--doux); margin-top: 6px; }
.hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.formulaire__pied { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 28px; }
.formulaire__mention { font-size: 13px; line-height: 1.55; color: var(--doux); max-width: 52ch; }
.formulaire__etat { grid-column: 1 / -1; font-size: 15px; font-weight: 600; min-height: 1.5em; }
.formulaire__etat.ok { color: #1D7A3F; }
.formulaire__etat.erreur { color: var(--rouge); }

/* ---------- Pied de page ---------- */
.pied { position: relative; isolation: isolate; overflow: hidden; background: var(--rouge); color: #fff; }
.pied::before { content: ""; position: absolute; inset: 0; z-index: -1; background: url("../img/cretes-nb.webp") center 78% / cover no-repeat; mix-blend-mode: multiply; opacity: .42; }
.pied__appel { padding-block: clamp(64px, 8vw, 120px) clamp(48px, 6vw, 80px); display: grid; gap: 30px; justify-items: center; text-align: center; }
.pied__appel p { font-size: clamp(24px, 2.8vw, 40px); font-weight: 700; line-height: 1.2; text-transform: uppercase; max-width: 22ch; color: #fff; }
.pied__milieu { display: grid; justify-items: center; gap: 30px; padding-bottom: 38px; }
.pied__logo img { width: clamp(150px, 13vw, 190px); }
.pied__nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 34px; list-style: none; padding: 0; }
.pied__nav a { font-size: 12px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; text-decoration: none; padding-bottom: 3px; border-bottom: 1px solid transparent; transition: border-color .3s var(--ease); }
.pied__nav a:hover, .pied__nav a[aria-current="page"] { border-bottom-color: #fff; }
.pied__bas { border-top: 1px solid rgba(255, 255, 255, .55); padding-block: 18px 22px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; font-size: 11.5px; letter-spacing: .05em; text-transform: uppercase; }
.pied__bas a { text-decoration: none; }
.pied__bas a:hover { text-decoration: underline; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; transition-delay: 0s !important; }
  .js .apparait, .js .lignes .ligne > span { opacity: 1; transform: none; }
}