.site-header nav>a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}.site-header nav>a:hover{color:#007e91}.header-cta{display:inline-flex;align-items:center;justify-content:center}.footer-contact>a:not(.footer-email){min-height:44px;display:inline-flex;align-items:center;gap:10px;font-size:14px}.merchant-photo{background:#083b43;border-radius:14px;overflow:hidden;box-shadow:12px 12px 0 #f1e8d9}.merchant-photo .crop{width:100%;aspect-ratio:859/510}.merchant-photo .crop img{top:calc(var(--y) / var(--h) * -100%)}.merchant-photo>p{padding:22px;color:#edf7f5;font-size:15px;text-align:center}.merchant-intro{grid-template-columns:1.2fr 1fr;gap:45px}.merchant-intro h1{font-size:clamp(40px,4vw,61px)}.offer-group-title{margin-top:35px!important}.offer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.two-offers{grid-template-columns:repeat(2,1fr)}.offer-card{border:1px solid #ccdfdf;border-radius:10px;padding:26px;display:flex;flex-direction:column;background:#fff}.offer-card h4{font:700 21px/1.3 Georgia,serif;margin:0}.offer-price{font:600 40px/1.2 "Segoe UI",sans-serif;color:#075668;margin-top:24px!important}.offer-price span{font-size:13px;color:#4e626b;margin-left:8px;font-weight:400}.offer-condition{font-size:12px;font-weight:650;color:#755119;background:#fff2d9;border-radius:5px;padding:7px 10px;align-self:flex-start;margin-top:12px!important}.offer-card ul{font-size:14px;padding-left:20px;color:#3b5361;flex:1;margin:25px 0 15px}.offer-card li{margin:9px 0}.combined-offer{margin-top:30px;padding:30px;border-radius:12px;background:#0c3c43;color:#fff;display:grid;grid-template-columns:1.3fr 1fr;gap:40px;align-items:center}.combined-offer .kicker{color:#f9b480}.combined-offer>div>p:last-child{color:#c5dddf}.combined-offer .offer-card{color:#08143e}.terms-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:35px}.terms-grid h3{font-size:22px}.terms-grid p{font-size:14px;color:#4e626b}.dashboard-teaser{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.dashboard-teaser>div{background:#fff;padding:28px;border-radius:10px;border:1px solid #d7e6e5}.dashboard-teaser span{font:34px Georgia,serif;color:#007e8e}.dashboard-teaser h3{margin-top:16px;font-size:24px}.dashboard-teaser p{font-size:15px;color:#4e626b}.participation-steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:32px 0}.participation-steps li{border-top:3px solid #f58a42;padding-top:17px}.participation-steps strong,.participation-steps span{display:block}.participation-steps span{font-size:14px;color:#4e626b;margin-top:8px}.merchant-faq{max-width:940px}.merchant-faq details{padding:18px 0;border-bottom:1px solid #cddedf}.merchant-faq summary{font-weight:650;cursor:pointer;font-size:16px}.merchant-faq p{margin-top:15px;color:#435d69;font-size:15px}.merchant-faq summary:focus-visible{outline:3px solid #e87924;outline-offset:6px}.contact-direct{border-left:1px solid #b7d6d2;padding:30px}.contact-direct h2{font-size:35px}.contact-direct>a{display:block;overflow-wrap:anywhere;text-decoration:underline;color:#006b7a;font-size:19px;margin:18px 0}.contact-direct p:last-child{font-size:15px;color:#4e626b}.contact-layout{display:grid;grid-template-columns:1.7fr 1fr;gap:60px;align-items:start}.form-intro{margin:24px 0;color:#4e626b;max-width:700px;font-size:16px}#participation-form{display:grid;gap:20px}#participation-form label,#message-preview label{display:block;font-size:14px;font-weight:600}#participation-form label>span:not(:last-child),#participation-form label>span{font-size:12px;font-weight:400}#participation-form input:not([type=checkbox]),#participation-form select,#participation-form textarea,#message-preview textarea{display:block;width:100%;min-height:46px;border:1px solid #abc5cb;border-radius:5px;padding:11px 12px;font:400 16px/1.5 "Segoe UI",sans-serif;color:#143248;background:white;margin-top:7px;resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}#participation-form .checkbox-label{display:flex;align-items:flex-start;gap:12px;font-weight:400}#participation-form .checkbox-label span{font-size:14px}#contact-nouvelles{width:20px;height:20px;flex-shrink:0;margin-top:3px;accent-color:#007e91}#participation-form [hidden],[hidden]{display:none!important}.contact-aside{background:#eef5f3;border-radius:12px;padding:30px}.contact-aside h3{font-size:26px}.contact-aside ol{padding-left:20px;color:#3a5964;font-size:15px}.contact-aside li{padding-left:5px;margin:17px 0}.contact-aside>p:not(.kicker){font-size:14px;color:#526670}.contact-aside>a{display:flex;margin-top:16px}#message-preview{border:2px solid #1c8e86;border-radius:12px;padding:28px;margin-top:35px;background:#f6fbf9}#message-preview h3{font-size:25px}#message-preview p{font-size:14px;margin:10px 0 18px}#message-preview label{margin-top:18px}#message-preview textarea{font-size:14px}#copy-status{min-height:24px}.content-page input:focus-visible,.content-page textarea:focus-visible,.content-page select:focus-visible{outline:3px solid #df842f;outline-offset:3px}
@media(max-width:1000px){.contact-layout{gap:32px;grid-template-columns:1.5fr 1fr}.offer-grid{gap:15px}.offer-card{padding:22px}.merchant-intro{gap:30px}.site-header nav>a{font-size:13px}}
@media(max-width:900px){.site-header nav>a{padding:10px 6px}.site-header .header-cta{display:none}.contact-layout{grid-template-columns:1fr}.contact-aside{max-width:700px}.offer-grid{grid-template-columns:1fr}.two-offers{grid-template-columns:1fr 1fr}.offer-card ul{margin:18px 0}.combined-offer{gap:22px}.dashboard-teaser{gap:15px}.dashboard-teaser>div{padding:20px}.merchant-intro{grid-template-columns:1fr}.merchant-photo{max-width:650px}.merchant-photo .crop{aspect-ratio:859/510}.merchant-photo .crop img{top:calc(var(--y) / var(--h) * -100%)}}
@media(max-width:600px){.two-offers,.combined-offer,.terms-grid,.dashboard-teaser,.participation-steps,.form-row{grid-template-columns:1fr}.combined-offer{padding:24px}.contact-direct{border-left:0;border-top:1px solid #b7d6d2;padding:22px 0 0}.contact-intro h1{font-size:40px}.contact-aside{padding:24px}#message-preview{padding:22px}.offer-price{font-size:36px}.participation-steps{gap:25px}}

/* Navigation des rubriques Commerces : liens présentés comme des touches. */
.page-jumps.merchant-jumps{gap:12px;padding-top:18px;padding-bottom:18px;background:#f4f8f6;justify-content:flex-start;}
.page-jumps.merchant-jumps a{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:11px 21px;border:1px solid #8bafab;border-bottom:3px solid #799d99;border-radius:9px;background:#fff;color:#075668;font-size:16px;font-weight:650;line-height:1.3;text-align:center;box-shadow:0 3px 0 #dce8e4;transition:background .15s,box-shadow .15s,transform .15s;}
.page-jumps.merchant-jumps a:hover{background:#e3f1ec;border-color:#347c77;box-shadow:0 4px 0 #c6ddd5;text-decoration:none;transform:translateY(-1px);}
.page-jumps.merchant-jumps a:active{transform:translateY(2px);box-shadow:none;}
.page-jumps.merchant-jumps a:last-child{background:#b9430c;border-color:#97350a;color:#fff;box-shadow:0 3px 0 #ecd5c7;}
.page-jumps.merchant-jumps a:last-child:hover{background:#a83c0a;}
.page-jumps.merchant-jumps a:focus-visible{outline:3px solid #075668;outline-offset:4px;}
@media(max-width:600px){.page-jumps.merchant-jumps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}.page-jumps.merchant-jumps a{font-size:16px;padding:11px 10px;}.page-jumps.merchant-jumps a:last-child{grid-column:1/-1;}}
@media(prefers-reduced-motion:reduce){.page-jumps.merchant-jumps a{transition:none;transform:none;}}

/* Premier écran : en-tête de 90 px, introduction souple, puis navigation.
   La hauteur minimale laisse le contenu grandir sur les écrans courts. */
@media(min-width:901px){
  .merchant-opening{min-height:calc(100vh - 90px);min-height:calc(100svh - 90px);display:grid;grid-template-rows:auto 1fr auto;}
  .merchant-opening .merchant-intro{padding-top:clamp(24px,3.5vh,54px);padding-bottom:clamp(24px,3.5vh,54px);}
}

/* Intitulés des rubriques Commerces, au-dessus des grands titres. */
.content-page:has(.merchant-opening) .page-section .kicker{
  font-size:15px;
  font-weight:700;
  letter-spacing:.12em;
}

/* Le titre des deux parcours tient sur une ligne sur ordinateur. */
.merchant-paths-heading{max-width:none;}
@media(min-width:901px){
  .content-page .merchant-paths-heading h2{font-size:clamp(26px,2.9vw,43px);white-space:nowrap;}
}

/* Explication du produit à ImpAct, puis trois étapes pour le client. */
.impact-explained .impact-summary{color:#075668;margin-bottom:16px;}
.impact-explained .impact-steps{padding-left:24px;margin:24px 0;}
.impact-explained .impact-steps li{margin:14px 0;color:#405969;}
.impact-explained .impact-steps li::marker{color:#087480;font-weight:700;}
.impact-explained .impact-bonus{font-size:15px;font-style:italic;}

/* Étiquette fournie par Stéphane, entre l’explication et les étapes. */
.impact-explained .impact-sticker{display:block;width:130px;max-width:100%;height:auto;margin:16px auto;}

/* Lien de participation à la suite de la dernière phrase de chaque offre. */
.path-card .offer-inline-link{display:inline;color:#00677a;font-weight:600;text-decoration:underline;text-underline-offset:3px;}
.path-card .offer-inline-link:hover{color:#003f49;}

/* L’intitulé et sa flèche restent ensemble, même en fin de phrase. */
.path-card .offer-inline-link{display:inline-block;white-space:nowrap;}
/* Illustration animée du transfert des XP, sans vidéo ni script. */
.merchant-ticket-animation{position:relative;width:300px;max-width:100%;margin:22px auto;overflow:hidden;border-radius:12px;background:#081326;isolation:isolate;}
.merchant-ticket-animation img{display:block;width:100%;height:auto;}
.ticket-xp-flight{position:absolute;left:35%;top:30%;color:#fff5b3;font:700 18px/1 Georgia,serif;text-shadow:0 0 5px #ffbc36,0 0 12px #ff8c00;opacity:0;pointer-events:none;animation:merchant-ticket-xp 4.8s ease-in-out infinite;}
.ticket-xp-flight:nth-of-type(2){animation-delay:-1.6s;}
.ticket-xp-flight:nth-of-type(3){animation-delay:-3.2s;}
.ticket-card-glow{position:absolute;left:61%;top:29%;width:26%;height:30%;border-radius:50%;background:radial-gradient(ellipse,#ffd97955,transparent 70%);pointer-events:none;animation:merchant-card-glow 4.8s ease-in-out infinite;}
@keyframes merchant-ticket-xp{
  0%,12%{left:35%;top:30%;opacity:0;transform:scale(.65) rotate(-10deg);}
  25%{opacity:1;}
  48%{left:53%;top:26%;opacity:1;transform:scale(1) rotate(0);}
  78%{left:70%;top:43%;opacity:1;transform:scale(.85) rotate(8deg);}
  92%,100%{left:72%;top:45%;opacity:0;transform:scale(.3) rotate(8deg);}
}
@keyframes merchant-card-glow{0%,100%{opacity:.2;transform:scale(.95);}65%{opacity:.9;transform:scale(1.08);}}
@media(prefers-reduced-motion:reduce){.ticket-xp-flight{animation:none;display:none;}.ticket-card-glow{animation:none;opacity:.3;}}

/* Ticket XP : promesse, parcours du client et intérêt pour le commerce. */
.xp-path .ticket-summary{color:#075668;margin-bottom:16px;}
.xp-path .ticket-benefit{color:#075668;font-weight:600;margin:20px 0;}

/* Let the two offer cards shrink to the phone width, including the ticket art. */
.two-paths > .path-card{min-width:0;}
@media(max-width:360px){
  .two-paths > .path-card{padding:20px;}
  .path-card .offer-inline-link{font-size:15px;}
}

/* Repère de la page active, sans agrandir les touches du menu. */
.site-header #navigation>a[aria-current="page"]{color:#075b48}
.site-header #navigation>a[aria-current="page"]::before{background:#e1f3ec;border-color:#73a592;box-shadow:inset 0 1px 3px #16543920}
.site-header #navigation>a[href="grandes-enseignes/"][aria-current="page"]{color:#7a3e10}
.site-header #navigation>a[href="grandes-enseignes/"][aria-current="page"]::before{background:#fff0db;border-color:#d19a58;box-shadow:inset 0 1px 3px #78441120}

/* Deux aperçus discrets à côté de la participation au pilote. */
.merchant-intro .merchant-pilot-actions{display:grid;grid-template-columns:minmax(0,max-content) minmax(130px,1fr) 94px;gap:18px;align-items:center;}
.merchant-pilot-actions>.solid-link{min-width:0;}
.merchant-path-miniatures{display:contents;}
.merchant-path-miniatures img{display:block;object-fit:contain;height:auto;}
.merchant-path-miniatures .merchant-impact-mini{width:130px;justify-self:center;}
.merchant-path-miniatures .merchant-xp-mini{width:94px;border-radius:3px;box-shadow:0 3px 10px #073b4220;}
@media(max-width:600px){
 .merchant-intro .merchant-pilot-actions{grid-template-columns:minmax(0,max-content) minmax(76px,1fr) 54px;gap:12px;}
 .merchant-pilot-actions>.solid-link{padding:12px;font-size:14px;}
 .merchant-path-miniatures .merchant-impact-mini{width:76px;}
 .merchant-path-miniatures .merchant-xp-mini{width:54px;}
}

/* La rubrique commence au bord de l’écran, sans fragment du menu précédent. */
.content-page #parcours{scroll-margin-top:0;}
@media(min-width:901px){
 .content-page #parcours{padding-top:28px;padding-bottom:32px;min-height:100vh;min-height:100svh;}
 #parcours .merchant-paths-heading{margin-bottom:20px;}
 #parcours .merchant-paths-heading .kicker{margin-bottom:8px;}
 #parcours .merchant-paths-heading h2{white-space:normal;}
 #parcours .path-card{padding:24px;display:flow-root;}
 #parcours .path-tag{margin-bottom:8px;}
 #parcours .path-card h3{margin-bottom:12px;}
 #parcours .impact-sticker{float:right;width:100px;margin:16px 0 12px 18px;}
 #parcours .impact-steps{margin:18px 0;}
 #parcours .impact-steps li{margin:10px 0;}
 #parcours .impact-bonus{clear:both;}
 #parcours .merchant-ticket-animation{float:right;width:170px;margin:18px 0 12px 20px;}
 #parcours .ticket-benefit{margin:18px 0 12px;}
 #parcours .path-card ul{margin:16px 0;}
 #parcours .path-card .example{clear:both;margin-top:18px;padding-top:16px;}
 #parcours .status-note{margin-top:18px;}
}

/* En caisse : une rubrique complète par écran sur ordinateur. */
@media(min-width:901px){
 .content-page #en-caisse{scroll-margin-top:0;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding-top:clamp(28px,5vh,60px);padding-bottom:clamp(28px,5vh,60px);}
 #en-caisse .section-heading{margin-bottom:0;max-width:none;}
 #en-caisse .section-heading h2{white-space:nowrap;}
 #en-caisse .journey-steps{margin:28px 0;gap:28px 40px;}
 #en-caisse>.text-link{align-self:flex-start;}
}

/* Le badge accompagne le titre et laisse les quatre étapes alignées. */
#en-caisse .section-heading{display:grid;grid-template-columns:minmax(0,1fr) 140px;column-gap:28px;align-items:center;}
#en-caisse .section-heading>.kicker,#en-caisse .section-heading>h2,#en-caisse .section-heading>p{grid-column:1;}
#en-caisse .participation-impact-badge{grid-column:2;grid-row:1 / 4;display:block;width:140px;max-width:100%;height:auto;align-self:center;}
@media(min-width:901px){
 #en-caisse .journey-steps{margin:clamp(28px,5vh,60px) 0;row-gap:clamp(48px,10vh,140px);}
}
@media(max-width:900px){
 #en-caisse .section-heading{grid-template-columns:minmax(0,1fr) 90px;column-gap:16px;}
 #en-caisse .participation-impact-badge{width:90px;}
 #en-caisse .section-heading>p:last-child{grid-column:1 / -1;}
 #en-caisse .participation-impact-badge{grid-row:1 / 3;}
}

/* Badge rapproché au-dessus de la participation, sans décaler les étapes. */
@media(min-width:901px){
 #en-caisse .section-heading{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;min-height:170px;}
 #en-caisse .section-heading>.kicker,#en-caisse .section-heading>h2,#en-caisse .section-heading>p{grid-column:1 / -1;}
 #en-caisse .section-heading>.kicker{grid-row:1;}
 #en-caisse .section-heading>h2{grid-row:2;}
 #en-caisse .section-heading>p:last-child{grid-row:3;}
 #en-caisse .participation-impact-badge{width:170px;grid-column:2;justify-self:center;}
}
@media(min-width:901px) and (max-width:1100px){
 #en-caisse .participation-impact-badge{width:150px;justify-self:end;}
}
@media(max-width:900px){#en-caisse .participation-impact-badge{width:100px;}#en-caisse .section-heading{grid-template-columns:minmax(0,1fr) 100px;}}

#en-caisse .client-prototype-link{margin-top:12px;}
.client-prototype-link a{display:inline-block;white-space:nowrap;color:#00677a;text-decoration:underline;text-underline-offset:3px;}
@media(max-width:430px){#en-caisse .client-prototype-link{font-size:clamp(10px,3vw,13px);}}

@media(max-width:360px){.xp-path a[data-ticket-pilot="scan-client"]{white-space:normal;}}

.impact-explained .impact-visibility{clear:both;margin-top:16px;}

.impact-topup{margin-top:26px;background:#eef6f4;border-color:#b3d5cc;}
.impact-topup .impact-topup-price{font-size:clamp(20px,2.3vw,28px);color:#075668;}

/* Les deux parcours et le forfait complet sont visibles ensemble. */
.content-page #forfaits { scroll-margin-top: 0; }
#forfaits .all-offers-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
#forfaits .all-offers-grid .offer-card { padding: 14px 18px; min-width: 0; border-top: 4px solid #188273; }
#forfaits .all-offers-grid .offer-xp { border-top-color: #cd681e; background: #fffaf4; }
#forfaits .all-offers-grid .offer-complete { border-top-color: #766399; background: #f7f4fb; }
#forfaits .offer-category { font-size: 12px; font-weight: 700; color: #075668; line-height: 1.3; margin-bottom: 6px; }
#forfaits .offer-xp .offer-category { color: #974305; }
#forfaits .offer-complete .offer-category { color: #614583; }
#forfaits .offer-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
#forfaits .offer-card-heading h4 { font-size: 19px; }
#forfaits .offer-card-heading .offer-price { font-size: 28px; margin: 0 !important; white-space: nowrap; }
#forfaits .offer-card-heading .offer-price span { margin-left: 4px; font-size: 12px; }
#forfaits .all-offers-grid .offer-condition { margin-top: 6px !important; padding: 3px 7px; font-size: 12px; }
#forfaits .offer-highlight { font-size: 14px; line-height: 1.4; margin-top: 8px; }
#forfaits .offer-actions { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 6px; }
#forfaits .offer-actions > .text-link { flex-shrink: 0; font-size: 14px; min-height: 32px; padding: 5px 0; }
#forfaits .offer-details { font-size: 14px; }
#forfaits summary { cursor: pointer; color: #075668; }
#forfaits summary:focus-visible { outline: 3px solid #df842f; outline-offset: 3px; }
#forfaits .offer-details ul { margin: 12px 0 0; line-height: 1.45; }
#forfaits .offer-details li { margin: 7px 0; }
#forfaits .offer-actions:has(details[open]) { flex-wrap: wrap; }
#forfaits .offer-actions details[open] { flex-basis: 100%; }
#forfaits .offer-terms { font-size: 13px; }
#forfaits .offer-terms .terms-grid { margin-top: 16px; }
#forfaits .impact-topup { margin-top: 16px; }
@media(min-width:901px) {
  .content-page #forfaits { padding-top: 0; padding-bottom: 0; }
  #forfaits .all-offers-screen { min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; gap: 10px; padding: 12px 0; }
  #forfaits .section-heading { max-width: none; margin: 0; }
  #forfaits .section-heading .kicker { margin-bottom: 5px; }
  #forfaits .section-heading h2 { font-size: clamp(30px,2.8vw,40px); }
  #forfaits .section-heading > p:last-child { font-size: 13px; line-height: 1.4; margin-top: 7px; }
  #forfaits .impact-topup { display: grid; grid-template-columns: minmax(0,1fr) auto; column-gap: 22px; row-gap: 5px; padding: 12px 18px; margin: 0; align-items: center; }
  #forfaits .impact-topup h3 { font-size: 21px; margin: 0; }
  #forfaits .impact-topup > p:not(.impact-topup-price) { grid-column: 1; font-size: 14px; line-height: 1.4; margin: 0; }
  #forfaits .impact-topup .impact-topup-price { grid-column: 2; grid-row: 1; font-size: 21px; line-height: 1.2; margin: 0; white-space: nowrap; }
  #forfaits .impact-topup > a { grid-column: 2; grid-row: 2; font-size: 14px; min-height: 32px; padding: 4px 0; }
}
@media(min-width:901px) and (max-width:1150px) {
  #forfaits .offer-card-heading { flex-wrap: wrap; gap: 3px; }
  #forfaits .offer-card-heading h4 { font-size: 18px; }
  #forfaits .all-offers-grid .offer-card { padding: 12px; }
}
@media(max-width:900px) { #forfaits .all-offers-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } #forfaits .offer-card-heading { flex-wrap: wrap; } #forfaits .offer-terms { margin-top: 18px; } }
@media(max-width:600px) { #forfaits .all-offers-grid { grid-template-columns: 1fr; } #forfaits .offer-actions > .text-link, #forfaits .offer-details summary { min-height: 44px; display: inline-flex; align-items: center; } }

/* Petit éventail des cartes originales, à côté du nom du parcours XP. */
#forfaits .offer-xp .offer-category, #forfaits .offer-complete .offer-category { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
#forfaits .offer-card-fan { position: relative; display: inline-block; flex: 0 0 62px; width: 62px; height: 34px; }
#forfaits .offer-card-fan img { position: absolute; left: 18px; bottom: 0; width: 25px; height: 34px; object-fit: cover; border-radius: 3px; box-shadow: 0 2px 4px #30201340; transform-origin: 50% 100%; animation: offer-card-fan 5s ease-in-out infinite; transform: translateX(var(--shift)) rotate(var(--angle)); }
#forfaits .offer-card-fan img:nth-child(1) { --shift: -12px; --angle: -23deg; --spread: -29deg; z-index: 1; }
#forfaits .offer-card-fan img:nth-child(2) { --shift: 0px; --angle: 0deg; --spread: 0deg; z-index: 3; }
#forfaits .offer-card-fan img:nth-child(3) { --shift: 12px; --angle: 23deg; --spread: 29deg; z-index: 2; }
@keyframes offer-card-fan { 0%, 100% { transform: translateX(var(--shift)) rotate(var(--angle)); } 50% { transform: translate(var(--shift), -2px) rotate(var(--spread)); } }
@media(prefers-reduced-motion: reduce) { #forfaits .offer-card-fan img { animation: none; } }

/* La recharge appartient aux offres ImpAct, avant les forfaits du jeu. */
#forfaits .all-offers-grid > .impact-topup { grid-column: 1 / -1; }
#forfaits .offer-category { font-size: 14px; }
#forfaits .offer-card-heading h4 { font-size: 22px; }
#forfaits .offer-card-heading .offer-price { font-size: 34px; }
#forfaits .offer-card-heading .offer-price span { font-size: 14px; }
#forfaits .all-offers-grid .offer-condition { font-size: 13px; }
#forfaits .offer-highlight, #forfaits .offer-details, #forfaits .offer-actions > .text-link { font-size: 16px; }
#forfaits .offer-terms { font-size: 15px; }
@media(min-width:901px) {
  #forfaits .section-heading > p:last-child { font-size: 15px; }
  #forfaits .impact-topup h3 { font-size: 23px; }
  #forfaits .impact-topup .impact-topup-price { font-size: 23px; }
  #forfaits .impact-topup > p:not(.impact-topup-price), #forfaits .impact-topup > a { font-size: 16px; }
  #forfaits .offer-card-heading { flex-wrap: wrap; gap: 3px 10px; }
}
@media(min-width:1200px) and (min-height:800px) {
  #forfaits .all-offers-screen { gap: 18px; }
  #forfaits .all-offers-grid { gap: 18px; }
  #forfaits .all-offers-grid .offer-card { padding: 20px 22px; }
  #forfaits .offer-highlight, #forfaits .offer-details, #forfaits .offer-actions > .text-link { font-size: 17px; }
  #forfaits .offer-card-heading h4 { font-size: 24px; }
  #forfaits .offer-card-heading .offer-price { font-size: 38px; }
}
@media(max-width:900px) { #forfaits .all-offers-grid { grid-template-columns: 1fr; } }

/* Sur les portables bas, resserrer les espaces sans réduire les caractères. */
@media(min-width:901px) and (max-height:700px) {
 #forfaits .all-offers-screen { padding: 8px 0; gap: 6px; }
 #forfaits .all-offers-grid { gap: 8px; }
 #forfaits .all-offers-grid .offer-card { padding: 10px 18px; }
 #forfaits .impact-topup { padding: 10px 18px; }
 #forfaits .offer-actions { padding-top: 2px; }
}

/* Décor Halloween des affiches Ticket XP, avec un voile pour la lecture. */
#forfaits .all-offers-grid .offer-xp {
 background-color:#fff0d6;
 background-image:linear-gradient(100deg,rgba(255,246,225,.91) 0%,rgba(255,239,210,.76) 46%,rgba(255,218,160,.22) 100%),url('assets/decor-offres-ticket-xp.png');
 background-size:cover;
 background-position:center 85%;
 border-color:#b67b46;
 border-top-color:#ef9d46;
 color:#38263e;
}
#forfaits .offer-xp .offer-category,
#forfaits .offer-xp .offer-card-heading .offer-price,
#forfaits .offer-xp .offer-actions>.text-link,
#forfaits .offer-xp .offer-details summary { color:#76390b; }
#forfaits .offer-xp .offer-card-heading h4,
#forfaits .offer-xp .offer-highlight,
#forfaits .offer-xp .offer-details ul { color:#38263e; }
#forfaits .offer-xp .offer-card-heading .offer-price span { color:#564052; }
#forfaits .offer-xp .offer-condition { color:#5c310c; background:#ffe3b5; }
#forfaits .offer-xp .offer-details[open] { background:#fff9efed; border-radius:8px; padding:10px 12px; }
#forfaits .offer-xp a:focus-visible,#forfaits .offer-xp summary:focus-visible { outline-color:#76390b; }

/* Repère orange animé pour le parcours à ImpAct. */
#en-caisse .section-heading > .kicker {
 color:#c94a00;
 animation:impact-title-glow 2.6s ease-in-out infinite;
}
@keyframes impact-title-glow {
 0%,100% { opacity:1; text-shadow:0 0 0 transparent; }
 50% { opacity:.78; text-shadow:0 0 12px #ff951c80; }
}
@media(prefers-reduced-motion:reduce) {
 #en-caisse .section-heading > .kicker { animation:none; }
}

/* Éventails plus lisibles et ouverture plus ample dans les offres. */
#forfaits .offer-card-fan { flex-basis:90px; width:90px; height:44px; }
#forfaits .offer-card-fan img { left:29px; width:32px; height:44px; filter:brightness(1.65) saturate(1.18); box-shadow:0 2px 5px #25142c80,0 0 5px #ffc46a70; animation-name:offer-card-fan-wide; animation-duration:4.5s; }
#forfaits .offer-card-fan img:nth-child(1) { --shift:-14px; --open-shift:-23px; --angle:-18deg; --spread:-38deg; }
#forfaits .offer-card-fan img:nth-child(2) { --shift:0px; --open-shift:0px; --angle:0deg; --spread:0deg; }
#forfaits .offer-card-fan img:nth-child(3) { --shift:14px; --open-shift:23px; --angle:18deg; --spread:38deg; }
@keyframes offer-card-fan-wide {
 0%,100% { transform:translateX(var(--shift)) rotate(var(--angle)); }
 50% { transform:translate(var(--open-shift),-7px) rotate(var(--spread)); }
}
#forfaits .offer-xp .offer-card-heading,
#forfaits .offer-xp .offer-highlight,
#forfaits .offer-xp .offer-actions { background:#fff5e1d9; border-radius:6px; }
#forfaits .offer-xp .offer-card-heading { padding:2px 7px; margin-inline:-7px; }
#forfaits .offer-xp .offer-highlight { padding:3px 7px; margin-inline:-7px; }
#forfaits .offer-xp .offer-actions { padding:3px 7px; margin-inline:-7px; }
#forfaits .offer-xp .offer-category { color:#592706; text-shadow:0 1px 2px #fff4de; }
@media(prefers-reduced-motion:reduce) { #forfaits .offer-card-fan img { animation:none; } }

/* Cimetière lumineux : image nette, sans voile global ni désaturation. */
#forfaits .all-offers-grid .offer-xp {
 background-image:url('assets/decor-offres-halloween-lumineux-v2.png');
 background-color:#392176;
 background-position:center center;
 border-color:#db903b;
 color:#fff4e5;
}
#forfaits .offer-xp .offer-category {
 color:#fff2d0; text-shadow:0 1px 3px #1b0d32;
}
#forfaits .offer-xp .offer-card-heading,
#forfaits .offer-xp .offer-highlight,
#forfaits .offer-xp .offer-actions { background:#20103dc9; }
#forfaits .offer-xp .offer-card-heading h4,
#forfaits .offer-xp .offer-highlight,
#forfaits .offer-xp .offer-details ul { color:#fff4e5; }
#forfaits .offer-xp .offer-card-heading .offer-price,
#forfaits .offer-xp .offer-actions>.text-link,
#forfaits .offer-xp .offer-details summary { color:#ffd18a; }
#forfaits .offer-xp .offer-card-heading .offer-price span { color:#fff0df; }
#forfaits .offer-xp .offer-details[open] { background:#211239f5; }
#forfaits .offer-xp a:focus-visible,#forfaits .offer-xp summary:focus-visible { outline-color:#ffcd75; }

/* Forfait mixte : moitié ImpAct claire, moitié Ticket XP Halloween. */
#forfaits .all-offers-grid .offer-complete {
 background-color:#fff8ed;
 background-image:linear-gradient(to right,#fff8ed 0%,#fff8ed 50%,transparent 50%,transparent 100%),url('assets/decor-offres-halloween-lumineux-v2.png');
 background-size:cover;
 background-position:center;
 border-color:#bb895e;
}
#forfaits .offer-complete .offer-category { color:#76390b; }
#forfaits .offer-complete .offer-card-heading h4 { color:#38263e; }
#forfaits .offer-complete .offer-card-heading .offer-price { color:#ffd18a; text-shadow:0 1px 4px #20103d; background:#20103dc9; border-radius:6px; padding:0 5px; }
#forfaits .offer-complete .offer-card-heading .offer-price span { color:#fff0df; }
#forfaits .offer-complete .offer-highlight { background:#fff8edef; color:#38263e; padding:3px 7px; margin-inline:-7px; border-radius:6px; }
#forfaits .offer-complete .offer-details summary { color:#76390b; }
#forfaits .offer-complete .offer-actions>.text-link { color:#ffd18a; background:#20103dc9; border-radius:6px; padding-inline:6px; }
#forfaits .offer-complete .offer-details[open] { background:#fff8edf5; color:#38263e; border-radius:8px; padding:10px 12px; }
#forfaits .offer-complete .offer-card-heading h4 { background:#fff8ed; border-radius:4px; padding-right:4px; }

/* Capture du tableau réel de démonstration dans sa présentation. */
#tableau .section-heading { max-width:none; margin-bottom:18px; }
#tableau .merchant-dashboard-preview { max-width:1100px; margin:0 auto; }
#tableau .merchant-dashboard-preview img { display:block; width:100%; height:auto; border:1px solid #cdb99f; border-radius:12px; box-shadow:0 8px 22px #35251b26; }
#tableau .page-actions { justify-content:center; margin-top:18px; }
#tableau>.fine-print { text-align:center; margin-top:12px; }
@media(min-width:901px) {
 #tableau { min-height:100svh; display:flex; flex-direction:column; justify-content:center; padding-top:24px; padding-bottom:24px; }
 #tableau .section-heading h2 { white-space:nowrap; font-size:clamp(26px,2.8vw,40px); }
 #tableau .merchant-dashboard-preview { width:min(100%,calc((100svh - 260px)*1.96)); }
}

/* Dernier écran Commerces : le titre ouvre la section dès l'arrivée. */
.content-page #participer { scroll-margin-top:0; }
@media(min-width:901px) {
 .content-page #participer { min-height:0; padding-top:28px; padding-bottom:24px; display:flex; flex-direction:column; align-items:flex-start; }
 #participer .section-heading { max-width:900px; margin-bottom:0; }
 #participer .section-heading h2 { margin-top:0; }
 #participer .participation-steps { width:100%; margin:clamp(32px,7vh,64px) 0 36px; gap:32px; }
 #participer .participation-steps li { padding-top:22px; }
 #participer>.solid-link { align-self:flex-start; }
}

@media(min-width:901px) { #participer + .page-section { padding-top:24px; } }
