/* Accueil de la refonte (body.fqs-accueil) : page Elementor « Accueil (refonte) ».
   Éléments natifs ciblés par leurs classes de styles locaux s-fqs-acc-* ; blocs dynamiques
   du thème (hero, rangées, Ulule, actus) par leurs propres classes. Porté de la maquette
   d'accueil (maquettes/accueil.css). Variables Elementor v4 --fqs-* uniquement. */

body.fqs-accueil { --fqs-acc-wrap: 1600px; --fqs-acc-gutter: clamp(1rem, 4vw, 3rem); background: var(--fqs-blanc); }
body.fqs-accueil .s-fqs-acc { display: flex; flex-direction: column; gap: 0; padding: 0; font-family: var(--fqs-texte); color: var(--fqs-bleu-nuit); }

/* Titre de la page : présent pour les lecteurs d'écran, masqué visuellement */
body.fqs-accueil .s-fqs-acc-h1 { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Sections : fond, rythme vertical, conteneur centré (.wrap de la maquette) */
body.fqs-accueil section[class*="s-fqs-acc-"] { display: block; padding: var(--fqs-space-section) 0 0; }
body.fqs-accueil section[class*="s-fqs-acc-"] > [class*="-in"] {
  display: flex; flex-direction: column; gap: 0; box-sizing: border-box; width: 100%; max-width: var(--fqs-acc-wrap);
  margin: 0 auto; padding: 0 var(--fqs-acc-gutter);
}
body.fqs-accueil .s-fqs-acc-engagements { padding-bottom: var(--fqs-space-section); }

/* Titres de section */
body.fqs-accueil .s-fqs-acc-univers-titre, body.fqs-accueil .s-fqs-acc-nouveautes-titre, body.fqs-accueil .s-fqs-acc-packs-titre,
body.fqs-accueil .s-fqs-acc-magazines-titre, body.fqs-accueil .fqs-section-titre {
  margin: 0 0 var(--fqs-space-lg); font-family: var(--fqs-titre); font-weight: 700; font-size: clamp(1.9rem, 3.6vw, 3rem); line-height: 1; letter-spacing: .005em; color: var(--fqs-bleu-nuit);
}
body.fqs-accueil .s-fqs-acc-packs-intro, body.fqs-accueil .s-fqs-acc-magazines-intro { max-width: 60ch; margin: calc(-1 * var(--fqs-space-md)) 0 var(--fqs-space-lg); font-size: 1.1rem; line-height: 1.55; }

/* Boutons natifs (e-button) : pilule orange, variantes par section */
body.fqs-accueil a[class*="s-fqs-acc-"][class*="-bouton"], body.fqs-accueil a[class*="s-fqs-acc-mag-"][class*="-abo"],
body.fqs-accueil .fqs-bouton, body.fqs-accueil .cine-btn {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: .75rem 1.5rem; border: 0; border-radius: var(--fqs-radius-pill);
  background: var(--fqs-orange); color: var(--fqs-bleu-nuit); font-family: var(--fqs-texte); font-weight: 600; font-size: 1rem; line-height: 1.1; text-decoration: none;
  transition: background-color .15s ease-out, color .15s ease-out;
}
body.fqs-accueil a[class*="s-fqs-acc-"][class*="-bouton"]:hover, body.fqs-accueil a[class*="s-fqs-acc-mag-"][class*="-abo"]:hover,
body.fqs-accueil .fqs-bouton:hover, body.fqs-accueil .cine-btn:hover { background: var(--fqs-blanc); color: var(--fqs-bleu-nuit); }
body.fqs-accueil .s-fqs-acc-appel-bouton:hover, body.fqs-accueil .ulule .fqs-bouton:hover { background: var(--fqs-bleu-nuit); color: var(--fqs-blanc); }
body.fqs-accueil a:focus-visible { outline: 3px solid var(--fqs-canard); outline-offset: 3px; }
body.fqs-accueil .cine a:focus-visible, body.fqs-accueil .cine button:focus-visible,
body.fqs-accueil [class*="s-fqs-acc-mag-"] a:focus-visible { outline-color: var(--fqs-orange); }

/* ---------- 1. Hero « cinéma » ---------- */
body.fqs-accueil .fqs-acc-hero, body.fqs-accueil .fqs-acc-hero .elementor-shortcode { width: 100%; }
.cine { --mx: 0; --my: 0; position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-rows: 1fr auto; background: var(--fqs-bleu-nuit); color: var(--fqs-blanc); font-family: var(--fqs-texte); }
.cine-slides { display: grid; touch-action: pan-y; }
.cine-slide { grid-area: 1 / 1; position: relative; display: grid; opacity: 0; visibility: hidden; }
.cine-slide.is-active { opacity: 1; visibility: visible; }
/* Fond : visuel agrandi, flouté, assombri, dégradé bleu nuit à gauche, grain discret */
.cine-bg { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.cine-bg img { position: absolute; inset: -12%; width: 124%; height: 124%; max-width: none; object-fit: cover; filter: blur(34px) saturate(1.25) brightness(.6); transform: translate3d(calc(var(--mx) * -14px), calc(var(--my) * -10px), 0) scale(1.06); }
.cine-bg::after { content: ""; position: absolute; inset: 0; background:
  linear-gradient(90deg, var(--fqs-bleu-nuit) 0%, color-mix(in srgb, var(--fqs-bleu-nuit) 88%, transparent) 30%, color-mix(in srgb, var(--fqs-bleu-nuit) 40%, transparent) 62%, color-mix(in srgb, var(--fqs-bleu-nuit) 15%, transparent) 100%),
  linear-gradient(0deg, color-mix(in srgb, var(--fqs-bleu-nuit) 75%, transparent) 0%, transparent 35%); }
.cine-bg::before { content: ""; position: absolute; inset: -50%; z-index: 1; opacity: .09; mix-blend-mode: overlay; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.cine-slide.is-active .cine-bg img { animation: fqs-kenburns 16s ease-in-out infinite alternate; }
@keyframes fqs-kenburns { from { scale: 1; } to { scale: 1.12; } }
.cine-slide.is-active .cine-bg::before { animation: fqs-grain .9s steps(3) infinite; }
@keyframes fqs-grain { 0% { translate: 0 0; } 33% { translate: -4% 3%; } 66% { translate: 3% -4%; } 100% { translate: 0 0; } }

/* Mobile : visuel en haut, contenu dessous */
.cine-inner { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr); align-content: center; gap: var(--fqs-space-md);
  box-sizing: border-box; width: 100%; max-width: var(--fqs-acc-wrap, 1600px); margin: 0 auto; padding: clamp(1.25rem, 3vw, 2.5rem) var(--fqs-acc-gutter, 1rem); }
.cine-content { display: flex; flex-direction: column; align-items: flex-start; gap: .75rem; max-width: 36rem; }
.cine-content > * { margin: 0; }
.cine .fqs-badge--nouveaute { background: var(--fqs-blanc); color: var(--fqs-bleu-nuit); }
.cine-title { font-family: var(--fqs-titre); font-weight: 700; font-size: clamp(2.6rem, 6.2vw, 6.25rem); line-height: .88; letter-spacing: .005em; color: var(--fqs-blanc); }
.cine-lead { font-size: clamp(1rem, 1.3vw, 1.2rem); line-height: 1.5; max-width: 40ch; }
.cine-price, .cine-price .amount { font-family: var(--fqs-texte); font-weight: 600; font-variant-numeric: tabular-nums; font-size: clamp(1.7rem, 2.4vw, 2.2rem); line-height: 1; color: var(--fqs-blanc); }
/* Prix barré du hero : 62 % du prix, jamais sous 14 px ; le montant qu'il contient hérite de sa
   taille (sans cela, .62em s'appliquait deux fois : environ 10 px). Opacité pleine sur fond sombre. */
.cine-price del { font-size: max(.62em, .875rem); margin-right: .5rem; text-decoration-thickness: 2px; color: var(--fqs-blanc); opacity: 1; }
.cine-price del .amount { font-size: inherit; }
.cine-price ins, .cine-price ins .amount { text-decoration: none; color: var(--fqs-orange); }
.cine-price .woocommerce-price-suffix { font-family: var(--fqs-texte); font-size: .45em; font-weight: 400; color: var(--fqs-blanc); }
/* Visuel : image du produit dans un cadre, ombre portée, parallaxe légère (livre détouré : plus bas) */
.cine-cover { order: -1; justify-self: center; width: min(100%, 26rem); }
.cine-cover img { display: block; width: 100%; height: auto; border-radius: var(--fqs-radius-md);
  box-shadow: 0 30px 60px color-mix(in srgb, var(--fqs-bleu-nuit) 75%, transparent), 0 10px 22px color-mix(in srgb, var(--fqs-bleu-nuit) 60%, transparent);
  transform: translate3d(calc(var(--mx) * 10px), calc(var(--my) * 8px), 0); transition: transform .25s ease-out; }
/* Transitions : fondu des fonds, entrée décalée du texte et du visuel */
.cine.is-ready .cine-slide { transition: opacity .9s ease, visibility 0s linear .9s; }
.cine.is-ready .cine-slide.is-active { transition: opacity .9s ease, visibility 0s; }
.cine-content > *, .cine-cover img { opacity: 0; translate: 0 14px; }
.cine-cover img { translate: 36px 0; }
.cine-slide.is-active .cine-content > *, .cine-slide.is-active .cine-cover img { opacity: 1; translate: 0 0; }
.cine.is-ready .cine-content > *, .cine.is-ready .cine-cover img { transition: opacity .25s ease, translate .25s ease, transform .25s ease-out; }
.cine.is-ready .cine-slide.is-active .cine-content > * { transition: opacity .5s ease, translate .6s cubic-bezier(.2, .7, .2, 1); }
.cine.is-ready .cine-slide.is-active .cine-content > :nth-child(1) { transition-delay: .35s; }
.cine.is-ready .cine-slide.is-active .cine-content > :nth-child(2) { transition-delay: .43s; }
.cine.is-ready .cine-slide.is-active .cine-content > :nth-child(3) { transition-delay: .51s; }
.cine.is-ready .cine-slide.is-active .cine-content > :nth-child(4) { transition-delay: .59s; }
.cine.is-ready .cine-slide.is-active .cine-content > :nth-child(5) { transition-delay: .67s; }
.cine.is-ready .cine-slide.is-active .cine-cover img { transition: opacity .7s ease .45s, translate .9s cubic-bezier(.2, .7, .2, 1) .45s, transform .25s ease-out; }

/* Chapitres : mobile = onglets horizontaux + barre de progression (2 ou 3 diapos) */
.cine-ui { position: relative; z-index: 3; box-sizing: border-box; width: 100%; max-width: var(--fqs-acc-wrap, 1600px); margin: 0 auto; padding: 0 var(--fqs-acc-gutter, 1rem) 1rem; }
.cine-nav { display: flex; align-items: center; gap: .5rem; }
.cine-chapters { flex: 1; display: grid; grid-template-columns: repeat(var(--chap-count, 3), minmax(0, 1fr)); gap: .4rem; }
.cine--2 .cine-chapters { --chap-count: 2; }
.cine .chap { position: relative; display: grid; align-content: start; gap: .15rem; min-height: 44px; margin: 0; padding: .45rem .5rem .7rem; text-align: left; border: 0; border-radius: var(--fqs-radius-sm);
  background: color-mix(in srgb, var(--fqs-bleu-nuit) 55%, transparent); color: var(--fqs-blanc); font-family: var(--fqs-texte); text-transform: none; letter-spacing: 0; box-shadow: none; cursor: pointer; }
.cine .chap.is-active { background: color-mix(in srgb, var(--fqs-blanc) 16%, transparent); }
.cine .chap:hover { background: color-mix(in srgb, var(--fqs-blanc) 12%, transparent); color: var(--fqs-blanc); }
.chap-thumb, .chap-label { display: none; }
.chap-text { display: grid; gap: .1rem; min-width: 0; }
.chap-short { font-weight: 600; font-size: .8rem; line-height: 1.15; }
.chap-title { font-family: var(--fqs-titre); font-weight: 700; font-size: 1rem; line-height: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chap-bar { position: absolute; left: .5rem; right: .5rem; bottom: .35rem; height: 3px; border-radius: var(--fqs-radius-pill); background: color-mix(in srgb, var(--fqs-blanc) 25%, transparent); overflow: hidden; }
.chap-fill { display: block; height: 100%; width: 0; background: var(--fqs-orange); }
/* Barre du chapitre actif (fqs-home.js) : pleine sans lecture auto (mouvement réduit) ; sinon
   animée de 0 à 100 % en 6 s, figée là où elle est en pause (bouton, survol, focus clavier). */
.chap.is-active .chap-fill { width: 100%; }
.cine.is-auto .chap.is-active .chap-fill { width: 0; animation: fqs-fill 6s linear forwards; }
.cine.is-auto.is-held .chap.is-active .chap-fill, .cine.is-auto.is-stopped .chap.is-active .chap-fill { animation-play-state: paused; }
@keyframes fqs-fill { from { width: 0; } to { width: 100%; } }
.cine .cine-pause { flex: 0 0 auto; width: 44px; height: 44px; display: grid; place-items: center; margin: 0; padding: 0; border-radius: var(--fqs-radius-pill); border: 2px solid var(--fqs-blanc); background: transparent; color: var(--fqs-blanc); box-shadow: none; cursor: pointer; }
.cine .cine-pause:hover { background: color-mix(in srgb, var(--fqs-blanc) 16%, transparent); color: var(--fqs-blanc); }
.cine-pause .ic-pause { width: .9rem; height: .9rem; box-sizing: border-box; border-left: 3px solid currentColor; border-right: 3px solid currentColor; }
.cine-pause.is-paused .ic-pause { border: none; width: 0; height: 0; border-left: .8rem solid currentColor; border-top: .55rem solid transparent; border-bottom: .55rem solid transparent; margin-left: .2rem; }

@media (min-width: 900px) {
  .cine { display: block; min-height: max(30rem, calc(100svh - 194px)); }
  .cine-slides { min-height: inherit; }
  .cine-inner { grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) minmax(0, 3fr); align-items: center; gap: clamp(1.5rem, 3vw, 3rem); min-height: inherit; padding-block: clamp(2rem, 5vh, 3.5rem); }
  .cine-cover { order: 0; width: 100%; }
  .cine-cover img { max-height: 62svh; object-fit: contain; }
  .cine-ui { position: absolute; inset: 0; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) minmax(0, 3fr); gap: clamp(1.5rem, 3vw, 3rem); align-items: center; padding-bottom: 0; pointer-events: none; }
  .cine-nav { grid-column: 3; flex-direction: column; align-items: stretch; gap: .75rem; pointer-events: auto; }
  .cine-chapters { grid-template-columns: minmax(0, 1fr); gap: .5rem; }
  .cine .chap { grid-template-columns: 52px 1fr; align-items: center; gap: .85rem; padding: .6rem .75rem .9rem; border-radius: var(--fqs-radius-md); }
  .chap-thumb { display: block; width: 52px; height: 52px; object-fit: cover; border-radius: var(--fqs-radius-sm); }
  .chap-label { display: block; font-size: .85rem; opacity: .9; }
  .chap-short { display: none; }
  .chap-title { font-size: 1.3rem; }
  .chap-bar { left: .75rem; right: .75rem; bottom: .4rem; }
  .cine-pause { align-self: flex-start; }
  /* Une seule diapo : contenu et visuel sur deux colonnes, sans chapitres */
  .cine--1 .cine-inner { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); }
}
@media (min-width: 900px) and (max-height: 800px) {
  .cine-title { font-size: clamp(2.6rem, 5vw, 4.6rem); }
  .cine-cover img { max-height: 54svh; }
}
@media (max-width: 899px) {
  .cine-title { font-size: 2.6rem; }
  .cine-lead { font-size: 1rem; }
  .cine-cover img { max-height: 40svh; width: auto; max-width: 100%; margin-inline: auto; }
}

/* Livre détouré (maquette 3D sans cadre, ombre dans l'image) : centré dans le hero, entre le
   texte et les chapitres. Taille servie : hero.php (fqs_home_cutout_sizes), à garder en accord. */
.cine-cover--detoure img { border-radius: 0; box-shadow: none; }
@media (max-width: 899px) {
  /* Hauteur fixée (50 % de l'écran), largeur tirée des proportions, réduite si l'écran est
     trop étroit : la taille ne dépend pas du fichier choisi dans le srcset. */
  .cine-cover--detoure { width: 100%; }
  .cine-cover--detoure img { height: 50svh; max-height: none; width: auto; max-width: 100%; object-fit: contain; }
}
@media (min-width: 900px) {
  /* Hauteur du livre : 75 % de la hauteur libre du hero (sous l'en-tête de 194 px, marges
     comprises, au moins 30rem), plafonnée à 44rem. Colonne centrale : 0,95 de cette hauteur
     (livre seul environ 0,8 ; pack et formats presque carrés jusqu'à 0,92), mais jamais au
     détriment des colonnes texte et chapitres (21rem au moins chacune) : faute de place, la
     colonne rétrécit et le livre avec, sans chevaucher. */
  .cine { --cine-cover-h: min(44rem, calc(max(30rem, 100svh - 194px) * .75)); --cine-cover-w: calc(var(--cine-cover-h) * .95); --cine-side-min: 21rem; }
  .cine-inner, .cine-ui, .cine--1 .cine-inner { grid-template-columns: minmax(var(--cine-side-min), 1fr) minmax(0, var(--cine-cover-w)) minmax(var(--cine-side-min), 1fr); }
  .cine-cover { justify-self: center; }
  /* Visuel de repli (image encadrée) : toute la largeur de la colonne, au moins sa taille
     d'avant (colonne 4/12 de l'ancienne grille). */
  .cine-cover img { max-height: var(--cine-cover-h); }
  .cine-cover--detoure { width: 100%; height: var(--cine-cover-h); }
  .cine-cover--detoure img { width: 100%; height: 100%; max-height: none; object-fit: contain; }
  .cine-nav { justify-self: end; width: min(100%, 22rem); }
  /* Colonne de texte plus étroite qu'avant : titre réduit, mots longs coupés. */
  .cine-title { font-size: clamp(2.4rem, 4.6vw, 5rem); overflow-wrap: break-word; hyphens: auto; }
}

/* ---------- 2. Nos univers : tuiles ---------- */
body.fqs-accueil .s-fqs-acc-tuiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--fqs-space-md); padding: 0; }
@media (min-width: 1024px) { body.fqs-accueil .s-fqs-acc-tuiles { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--fqs-space-lg); } }
body.fqs-accueil .s-fqs-acc-tuiles > a { position: relative; display: block; padding: 0; overflow: hidden; border-radius: var(--fqs-radius-lg); color: var(--fqs-blanc); text-decoration: none; isolation: isolate; }
body.fqs-accueil .s-fqs-acc-tuiles > a img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; transition: transform .3s ease-out; }
body.fqs-accueil .s-fqs-acc-tuiles > a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, var(--fqs-bleu-nuit)); opacity: .9; }
body.fqs-accueil .s-fqs-acc-tuiles > a h3 { position: absolute; left: 1rem; right: 1rem; bottom: .9rem; z-index: 1; margin: 0; font-family: var(--fqs-titre); font-weight: 700; font-size: clamp(1.25rem, 2.4vw, 2rem); line-height: 1; color: var(--fqs-blanc); }
body.fqs-accueil .s-fqs-acc-tuiles > a:hover img { transform: scale(1.04); }
body.fqs-accueil .s-fqs-acc-tuiles > a:hover h3 { color: var(--fqs-orange); }
body.fqs-accueil .s-fqs-acc-tuiles > a:focus-visible { outline: 3px solid var(--fqs-canard); outline-offset: 3px; }

/* ---------- 3 et 4. Rangées produits (carte commune) ---------- */
body.fqs-accueil .s-fqs-acc-nouveautes-tete { display: flex; flex-direction: row; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 2rem; margin-bottom: var(--fqs-space-lg); padding: 0; }
body.fqs-accueil .s-fqs-acc-nouveautes-tete .s-fqs-acc-nouveautes-titre { margin: 0; }
body.fqs-accueil a.s-fqs-acc-nouveautes-lien { display: inline-flex; align-items: center; min-height: 44px; padding: 0; background: transparent; font-weight: 600; color: var(--fqs-bleu-nuit); text-decoration: underline; text-underline-offset: .2em; }
body.fqs-accueil a.s-fqs-acc-nouveautes-lien:hover { color: var(--fqs-orange-fonce); }
body.fqs-accueil .fqs-rangee ul.products { padding: 0; }

/* ---------- 5. Nos magazines ---------- */
body.fqs-accueil .s-fqs-acc-mags { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fqs-space-lg); padding: 0; }
@media (min-width: 820px) { body.fqs-accueil .s-fqs-acc-mags { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
body.fqs-accueil .s-fqs-acc-mag-ef, body.fqs-accueil .s-fqs-acc-mag-rg {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(1.25rem, 2.5vw, 1.75rem); align-items: center;
  padding: clamp(1.5rem, 3vw, 2.25rem); border-radius: var(--fqs-radius-lg); color: var(--fqs-blanc);
}
@media (min-width: 560px) { body.fqs-accueil .s-fqs-acc-mag-ef, body.fqs-accueil .s-fqs-acc-mag-rg { grid-template-columns: minmax(120px, 38%) minmax(0, 1fr); } }
body.fqs-accueil .s-fqs-acc-mag-ef { background: var(--fqs-bleu-nuit); }
body.fqs-accueil .s-fqs-acc-mag-rg { background: var(--fqs-orange-fonce); }
body.fqs-accueil .s-fqs-acc-mag-ef-img, body.fqs-accueil .s-fqs-acc-mag-rg-img {
  display: block; width: 100%; max-width: 220px; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: top;
  border-radius: var(--fqs-radius-md); box-shadow: 0 14px 34px color-mix(in srgb, var(--fqs-bleu-nuit) 45%, transparent);
}
@media (min-width: 560px) { body.fqs-accueil .s-fqs-acc-mag-ef-img, body.fqs-accueil .s-fqs-acc-mag-rg-img { max-width: none; } }
body.fqs-accueil .s-fqs-acc-mag-ef-corps, body.fqs-accueil .s-fqs-acc-mag-rg-corps { display: flex; flex-direction: column; align-items: flex-start; gap: .4rem; padding: 0; }
body.fqs-accueil .s-fqs-acc-mag-ef-titre, body.fqs-accueil .s-fqs-acc-mag-rg-titre { margin: 0; font-family: var(--fqs-titre); font-weight: 700; font-size: clamp(1.6rem, 3vw, 2.3rem); line-height: 1; color: var(--fqs-blanc); }
body.fqs-accueil [class*="s-fqs-acc-mag-"][class*="-sous"] { margin: 0; opacity: .92; }
body.fqs-accueil [class*="s-fqs-acc-mag-"][class*="-prix"] { margin: .25rem 0 0; font-weight: 600; color: var(--fqs-orange); }
body.fqs-accueil .s-fqs-acc-mag-rg-prix { color: var(--fqs-blanc); }
body.fqs-accueil [class*="s-fqs-acc-mag-"][class*="-liste"] { display: flex; flex-direction: column; gap: .35rem; margin: .4rem 0 .9rem; padding: 0; }
body.fqs-accueil [class*="s-fqs-acc-mag-"][class*="-liste"] > p { position: relative; margin: 0; padding-left: 1.5rem; }
body.fqs-accueil [class*="s-fqs-acc-mag-"][class*="-liste"] > p::before { content: "✓"; position: absolute; left: 0; font-weight: 700; color: var(--fqs-orange); }
body.fqs-accueil .s-fqs-acc-mag-rg-liste > p::before { color: var(--fqs-blanc); }
body.fqs-accueil [class*="s-fqs-acc-mag-"][class*="-actions"] { display: flex; flex-direction: row; flex-wrap: wrap; gap: .75rem; padding: 0; }
body.fqs-accueil .s-fqs-acc-mag-rg-abo { background: var(--fqs-bleu-nuit); color: var(--fqs-blanc); }
body.fqs-accueil .s-fqs-acc-mag-rg-abo:hover { background: var(--fqs-blanc); color: var(--fqs-bleu-nuit); }
body.fqs-accueil a[class*="s-fqs-acc-mag-"][class*="-num"] {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: .75rem 1.5rem; border-radius: var(--fqs-radius-pill);
  background: transparent; box-shadow: inset 0 0 0 2px var(--fqs-blanc); color: var(--fqs-blanc); font-weight: 600; text-decoration: none;
}
body.fqs-accueil a[class*="s-fqs-acc-mag-"][class*="-num"]:hover { background: var(--fqs-blanc); color: var(--fqs-bleu-nuit); }

/* ---------- 6. Ulule ---------- */
body.fqs-accueil .fqs-acc-ulule { margin-top: var(--fqs-space-section); }
.ulule { padding-block: var(--fqs-space-section); background: var(--fqs-fond-doux); color: var(--fqs-bleu-nuit); }
.ulule-inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fqs-space-lg); align-items: center; box-sizing: border-box; width: 100%; max-width: var(--fqs-acc-wrap, 1600px); margin: 0 auto; padding: 0 var(--fqs-acc-gutter, 1rem); }
.ulule-media { overflow: hidden; border-radius: var(--fqs-radius-md); }
.ulule-media img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.ulule-body { display: flex; flex-direction: column; align-items: flex-start; gap: var(--fqs-space-sm); }
.ulule-body > * { margin: 0; }
.ulule-kicker { display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; color: var(--fqs-canard); }
.ulule-live { width: .6rem; height: .6rem; border-radius: var(--fqs-radius-pill); background: var(--fqs-canard); box-shadow: 0 0 0 4px color-mix(in srgb, var(--fqs-canard) 22%, transparent); }
.ulule-title { font-family: var(--fqs-titre); font-weight: 700; font-size: clamp(2.2rem, 4.5vw, 3.6rem); line-height: 1; color: var(--fqs-bleu-nuit); }
.ulule-progress { display: grid; gap: .6rem; width: 100%; max-width: 34rem; margin-block: .4rem .6rem; }
.ulule-progress > * { margin: 0; }
.ulule-amount { font-size: 1.05rem; }
.ulule-raised { margin-right: .35rem; font-family: var(--fqs-titre); font-weight: 700; font-size: clamp(2rem, 3.5vw, 2.6rem); line-height: 1; }
.ulule-bar { height: 10px; overflow: hidden; border-radius: var(--fqs-radius-pill); background: color-mix(in srgb, var(--fqs-bordure) 35%, transparent); }
.ulule-bar span { display: block; width: var(--p); height: 100%; border-radius: inherit; background: var(--fqs-canard); }
.ulule-stats { display: flex; flex-wrap: wrap; gap: .4rem 1.5rem; margin: 0; padding: 0; list-style: none; font-size: .95rem; }
.ulule-stats strong { margin-right: .2rem; font-family: var(--fqs-titre); font-weight: 700; font-size: 1.3rem; }
.ulule-soon { padding-top: var(--fqs-space-md); border-top: 2px solid var(--fqs-bleu-nuit); }
.ulule-soon-title { margin: 0 0 .5rem; font-family: var(--fqs-titre); font-weight: 700; font-size: 1.35rem; color: var(--fqs-bleu-nuit); }
.ulule-soon ul, .ulule--bientot .ulule-body ul { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.ulule-soon li, .ulule--bientot .ulule-body li { padding: .5rem 1rem; border-radius: var(--fqs-radius-pill); background: var(--fqs-blanc); box-shadow: inset 0 0 0 2px var(--fqs-bleu-nuit); font-weight: 600; }
.ulule--bientot .ulule-soon { padding: 0; border: 0; }
@media (min-width: 900px) {
  .ulule-inner { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--fqs-space-lg) clamp(2rem, 4vw, 4rem); }
  .ulule-inner > .ulule-soon { grid-column: 1 / -1; display: flex; align-items: center; gap: 1.5rem; }
  .ulule-inner > .ulule-soon .ulule-soon-title { margin: 0; }
  .ulule--bientot .ulule-inner { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- 7. Actus ---------- */
.actus { box-sizing: border-box; width: 100%; max-width: var(--fqs-acc-wrap, 1600px); margin: 0 auto; padding: var(--fqs-space-section) var(--fqs-acc-gutter, 1rem) 0; color: var(--fqs-bleu-nuit); }
.actus-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 2rem; margin-bottom: var(--fqs-space-lg); }
.actus-head .fqs-section-titre { margin: 0; }
.actus-all { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; color: var(--fqs-bleu-nuit); text-decoration: underline; text-underline-offset: .2em; }
.actus-all:hover { color: var(--fqs-orange-fonce); }
.actus-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fqs-space-lg); margin: 0; padding: 0; list-style: none; }
@media (min-width: 700px) { .actus-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.actu { position: relative; display: grid; align-content: start; gap: .5rem; }
.actu-img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--fqs-radius-md); background: var(--fqs-fond-doux); }
.actu-date { font-size: .9rem; font-weight: 600; color: var(--fqs-canard); }
.actu-title { margin: 0; font-family: var(--fqs-titre); font-weight: 700; font-size: clamp(1.35rem, 2vw, 1.7rem); line-height: 1; }
.actu-title a { color: var(--fqs-bleu-nuit); text-decoration: none; }
.actu-title a::after { content: ""; position: absolute; inset: 0; border-radius: var(--fqs-radius-md); }
.actu:hover .actu-title a { color: var(--fqs-orange-fonce); }
.actu-title a:focus-visible { outline: none; }
.actu-title a:focus-visible::after { outline: 3px solid var(--fqs-canard); outline-offset: 3px; }

/* ---------- 8. Bande d'appel + couvertures ---------- */
body.fqs-accueil .s-fqs-acc-appel-carte {
  display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 2.5rem;
  padding: clamp(2rem, 4vw, 3.5rem); border-radius: var(--fqs-radius-lg); background: var(--fqs-bleu-nuit); color: var(--fqs-blanc);
}
body.fqs-accueil .s-fqs-acc-appel-titre { margin: 0; font-family: var(--fqs-titre); font-weight: 700; font-size: clamp(1.9rem, 3.6vw, 3rem); line-height: 1; color: var(--fqs-blanc); }
.fqs-bande { margin-top: var(--fqs-space-lg); overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.fqs-bande-piste { display: flex; gap: 1rem; width: max-content; margin: 0; padding: 0; list-style: none; will-change: transform; animation: fqs-bande 55s linear infinite; }
.fqs-bande-piste li { flex: 0 0 auto; }
.fqs-bande-piste img { display: block; width: auto; height: 170px; border-radius: var(--fqs-radius-md); }
.fqs-bande:hover .fqs-bande-piste { animation-play-state: paused; }
@keyframes fqs-bande { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---------- 9. Newsletter (formulaire Elementor Pro) ---------- */
body.fqs-accueil .s-fqs-acc-newsletter-carte {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fqs-space-md) var(--fqs-space-lg); align-items: center;
  padding: clamp(2rem, 4.5vw, 4rem); border-radius: var(--fqs-radius-lg); background: var(--fqs-fond-doux);
}
@media (min-width: 920px) { body.fqs-accueil .s-fqs-acc-newsletter-carte { grid-template-columns: minmax(0, 1fr) minmax(0, 30rem); } }
body.fqs-accueil .s-fqs-acc-newsletter-tete { position: relative; display: flex; flex-direction: column; gap: .3rem; padding: 0 0 0 calc(72px + clamp(1rem, 2vw, 1.75rem)); min-height: 72px; justify-content: center; }
body.fqs-accueil .s-fqs-acc-newsletter-tete::before {
  content: ""; position: absolute; left: 0; top: 50%; translate: 0 -50%; width: 72px; height: 72px; border-radius: var(--fqs-radius-pill);
  background: var(--fqs-canard) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E") no-repeat center / 36px;
}
body.fqs-accueil .s-fqs-acc-newsletter-titre { margin: 0; font-family: var(--fqs-titre); font-weight: 700; font-size: clamp(1.8rem, 3.4vw, 3rem); line-height: 1; color: var(--fqs-bleu-nuit); }
body.fqs-accueil .s-fqs-acc-newsletter-texte { margin: 0; font-size: 1.1rem; }
body.fqs-accueil .fqs-acc-newsletter-form .elementor-form-fields-wrapper { display: flex; flex-wrap: wrap; gap: .75rem; margin: 0; }
body.fqs-accueil .fqs-acc-newsletter-form .elementor-field-group { margin: 0; padding: 0; }
body.fqs-accueil .fqs-acc-newsletter-form .elementor-field-type-email { flex: 1 1 14rem; }
body.fqs-accueil .fqs-acc-newsletter-form .elementor-field-type-submit { flex: 0 0 auto; width: auto; }
body.fqs-accueil .fqs-acc-newsletter-form .elementor-field-type-acceptance { order: 3; flex: 1 1 100%; }
body.fqs-accueil .fqs-acc-newsletter-form input[type="email"] {
  min-height: 52px; padding: .7rem 1.25rem; border: 2px solid var(--fqs-bleu-nuit); border-radius: var(--fqs-radius-pill); background: var(--fqs-blanc);
  font-family: var(--fqs-texte); font-size: 1.05rem; color: var(--fqs-bleu-nuit);
}
body.fqs-accueil .fqs-acc-newsletter-form input[type="email"]:focus { outline: none; box-shadow: 0 0 0 4px color-mix(in srgb, var(--fqs-bleu-nuit) 15%, transparent); }
body.fqs-accueil .fqs-acc-newsletter-form .elementor-button {
  min-height: 52px; padding: .8rem 1.7rem; border: 0; border-radius: var(--fqs-radius-pill); background: var(--fqs-orange); color: var(--fqs-bleu-nuit);
  font-family: var(--fqs-texte); font-weight: 600; font-size: 1.05rem; text-transform: none; letter-spacing: 0;
}
body.fqs-accueil .fqs-acc-newsletter-form .elementor-button:hover, body.fqs-accueil .fqs-acc-newsletter-form .elementor-button:focus { background: var(--fqs-bleu-nuit); color: var(--fqs-blanc); }
body.fqs-accueil .fqs-acc-newsletter-form .elementor-button:focus-visible { outline: 3px solid var(--fqs-canard); outline-offset: 2px; }
body.fqs-accueil .fqs-acc-newsletter-form .elementor-field-subgroup label { font-size: .95rem; color: var(--fqs-bleu-nuit); }
body.fqs-accueil .fqs-acc-newsletter-form input[type="checkbox"] { width: 1.1rem; height: 1.1rem; accent-color: var(--fqs-canard); }
body.fqs-accueil a.s-fqs-acc-newsletter-rgpd, body.fqs-accueil .s-fqs-acc-newsletter-rgpd { grid-column: -2 / -1; justify-self: start; margin: -.25rem 0 0; font-size: .92rem; color: var(--fqs-bleu-nuit); text-decoration: underline; text-underline-offset: .2em; }
body.fqs-accueil .fqs-acc-newsletter-form .elementor-message { font-family: var(--fqs-texte); }

/* ---------- 10. Ils nous font confiance ---------- */
body.fqs-accueil .s-fqs-acc-confiance-carte { display: flex; flex-direction: column; align-items: center; gap: 1.75rem; padding: clamp(2rem, 4vw, 3rem); border-radius: var(--fqs-radius-lg); background: var(--fqs-canard); color: var(--fqs-blanc); }
body.fqs-accueil .s-fqs-acc-confiance-titre { margin: 0; font-family: var(--fqs-titre); font-weight: 700; font-size: clamp(1.4rem, 2.6vw, 2rem); line-height: 1; text-align: center; color: var(--fqs-blanc); }
body.fqs-accueil .s-fqs-acc-logos { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; gap: clamp(2rem, 5vw, 4.5rem); padding: 0; }
body.fqs-accueil .s-fqs-acc-logos img { display: block; width: auto; height: auto; max-width: 210px; max-height: 64px; }
body.fqs-accueil .s-fqs-acc-logo-humano { filter: brightness(0) invert(1); } /* logo au trait sombre, passé en blanc */
body.fqs-accueil .s-fqs-acc-logos a:focus-visible { outline: 3px solid var(--fqs-blanc); outline-offset: 4px; }

/* ---------- 11. Engagements : tickets ---------- */
body.fqs-accueil .s-fqs-acc-tickets { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--fqs-space-md); padding: 0; }
@media (min-width: 768px) { body.fqs-accueil .s-fqs-acc-tickets { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--fqs-space-lg); } }
body.fqs-accueil [class*="s-fqs-acc-ticket-"]:not([class*="-titre"]):not([class*="-note"]) {
  position: relative; display: flex; flex-direction: column; justify-content: center; gap: .3rem; overflow: hidden;
  padding: 1.4rem 1.35rem 1.4rem calc(2.25rem + 42px + 1rem); min-height: 5.5rem; border-radius: var(--fqs-radius-md); background: var(--fqs-blanc);
  box-shadow: 0 8px 22px color-mix(in srgb, var(--fqs-bleu-nuit) 10%, transparent);
}
/* Perforation du ticket */
body.fqs-accueil [class*="s-fqs-acc-ticket-"]:not([class*="-titre"]):not([class*="-note"])::before {
  content: ""; position: absolute; left: .85rem; top: 0; bottom: 0; width: 7px;
  background: radial-gradient(circle, color-mix(in srgb, var(--fqs-bleu-nuit) 30%, transparent) 2px, transparent 2.5px) center / 7px 13px repeat-y;
}
/* Pictogramme */
body.fqs-accueil [class*="s-fqs-acc-ticket-"]:not([class*="-titre"]):not([class*="-note"])::after {
  content: ""; position: absolute; left: 2.25rem; top: 50%; translate: 0 -50%; width: 42px; height: 42px; background: var(--fqs-orange);
  -webkit-mask: var(--fqs-ticket-ic) no-repeat center / contain; mask: var(--fqs-ticket-ic) no-repeat center / contain;
}
body.fqs-accueil .s-fqs-acc-ticket-livraison { --fqs-ticket-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7h11v9H3zM14 10h4l3 3v3h-7z'/%3E%3Ccircle cx='7' cy='17.5' r='1.6'/%3E%3Ccircle cx='17' cy='17.5' r='1.6'/%3E%3C/svg%3E"); }
body.fqs-accueil .s-fqs-acc-ticket-paiement { --fqs-ticket-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='10' width='14' height='10' rx='2'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3'/%3E%3Ccircle cx='12' cy='15' r='1.3'/%3E%3C/svg%3E"); }
body.fqs-accueil .s-fqs-acc-ticket-offerte { --fqs-ticket-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='9' width='18' height='4' rx='1'/%3E%3Cpath d='M5 13v7h14v-7M12 9v11M12 9c-2-4-6-4-6-1.5S10 9 12 9c2 0 6 1 6-1.5S14 5 12 9'/%3E%3C/svg%3E"); }
body.fqs-accueil [class*="s-fqs-acc-ticket-"][class*="-titre"] { margin: 0; font-family: var(--fqs-titre); font-weight: 700; font-size: clamp(1.15rem, 1.6vw, 1.35rem); line-height: 1; }
body.fqs-accueil [class*="s-fqs-acc-ticket-"][class*="-note"] { margin: 0; font-size: 1rem; opacity: .75; }

/* ---------- Mouvement réduit ---------- */
@media (prefers-reduced-motion: reduce) {
  .cine-slide.is-active .cine-bg img, .cine-slide.is-active .cine-bg::before { animation: none; }
  .cine-content > *, .cine-cover img { translate: none; transform: none; }
  .fqs-bande-piste { animation: none; }
  body.fqs-accueil .s-fqs-acc-tuiles > a img { transition: none; }
}