/* ============================================================================
   light.css - charte graphique « pages claires » Acronet (ile claire, look lylcash)
   ----------------------------------------------------------------------------
   Reutilisable sur n'importe quelle page : envelopper le contenu dans
   <div class="pd-fiche" data-bs-theme="light"> ... </div>
   Zone de contenu riche (harmonisation des icones) : classe .pd-desc a l'interieur.

   Composants dispo : .pd-card (card blanche) . .pd-dark (encart sombre) .
   .pd-details-title (titre section/card) . .pd-muted (texte secondaire) .
   .pd-ico (icone no-shrink) . .pd-accent-danger (lisere rouge) .
   .pd-why (liste a coches) . .pd-flow (timeline verticale) . .btn-acro-ink (bouton bleu) .
   FAQ (.acr-faq*) . .pd-badge-compat (badge plateforme)
   ============================================================================ */

/* ===== Socle : tokens redefinis en clair + fond solide ===== */
.pd-fiche{
	/* Tokens REDÉFINIS localement : gris-bleu clair lylcash, texte bleu-nuit, accent rouge charte */
	--primary-lightest-rgb:209,219,228; --primary-darkest-rgb:4,23,43; --primary-dark-rgb:16,53,89;
	--primary-medium-rgb:25,74,122; --secondary-medium-rgb:246,10,54; --white-rgb:255,255,255;
	--btn-border-radius:.5rem;
	/* tokens sémantiques réutilisés par la description (HTML BO) -> version claire */
	--surface-card:rgba(255,255,255,1); --surface-card-hover:rgba(209,219,228,.35);
	--glass-border:rgba(209,219,228,.75); --text-primary:rgba(4,23,43,1); --text-secondary:rgba(16,53,89,.78);
	--primary-fluo:#046fb4;
	/* Fond SOLIDE clair (le body Acronet est sombre : un rgba translucide virerait au bleu foncé) */
	background:#e8edf1;
	color:rgba(var(--primary-darkest-rgb),1);
}
.pd-fiche-sec{padding:3rem 0;position:relative}
/* Vue large facon lylcash (.cms-content + .w-fill) : contenu jusqu'a 95em, gouttiere fine, au lieu du .container Bootstrap (max ~1320px) */
.pd-fiche .container{max-width:95em;width:calc(100% - 1rem)}
.pd-fiche a:not(.btn){color:rgba(var(--primary-medium-rgb),1)}
.pd-fiche .text-muted{color:rgba(var(--primary-dark-rgb),.8)!important}
.pd-fiche h2{color:rgba(var(--primary-darkest-rgb),1)}

/* ===== Composants « inline -> classe » (remplacent les style="" repetes) ===== */
.pd-fiche .pd-card{background:var(--surface-card);border:1px solid var(--glass-border)}
.pd-fiche .pd-accent-danger{border-left:4px solid #ef4444}
.pd-fiche .pd-muted{color:var(--text-secondary)}
.pd-fiche .pd-ico{flex:0 0 auto}
.pd-fiche .pd-badge-compat{background:var(--surface-card);border:1px solid var(--glass-border);color:var(--text-primary);font-size:.85rem}

/* Chips de réassurance lisibles sur fond clair */
.pd-fiche .hero-stat-chip{background:rgba(209,219,228,.35);border:1px solid rgba(209,219,228,.85);color:rgba(var(--primary-dark-rgb),.92)}
.pd-fiche .hero-stat-chip i{color:rgba(var(--primary-medium-rgb),1)}
/* Petits ecrans (P30 et assimiles ~360px) : les 3 chips de reassurance doivent
   tenir sur UNE ligne. Valeurs calibrees par mesure : a 360px de large la ligne
   reclame 371px en typo d'origine ; a .5rem elle retombe a 318px pour 336 dispo. */
@media(max-width:499.98px){
	.pd-fiche .v3-hero-stats{flex-wrap:nowrap;gap:.16rem}
	.pd-fiche .v3-hero-stats .hero-stat-chip{font-size:.5rem;padding:.28rem .32rem;gap:.2rem}
	.pd-fiche .v3-hero-stats .hero-stat-chip i{font-size:.45rem}
}
/* Palier supplementaire pour les tres petits ecrans (<=360px) */
@media(max-width:360px){
	.pd-fiche .v3-hero-stats{gap:.14rem}
	.pd-fiche .v3-hero-stats .hero-stat-chip{font-size:.45rem;padding:.26rem .28rem}
}
/* Bande FAQ pleine largeur (si utilisee) */
.pd-fiche .acr-band{background:rgba(209,219,228,.4);border-color:rgba(209,219,228,.7)}
.pd-fiche .acr-band-inner{max-width:1100px}

/* ===== Titre de section « facon lylcash » : icone + libelle sobre a 1.15rem + filet ===== */
.pd-fiche .pd-details-title{display:flex;align-items:center;gap:.6rem;font-size:1.15rem;font-weight:800;line-height:1.35;margin:0 0 1.1rem;padding-bottom:.75rem;border-bottom:1px solid rgba(var(--primary-lightest-rgb),.9)}
.pd-fiche .pd-details-title svg{flex-shrink:0;color:rgba(var(--primary-medium-rgb),.7)}
/* Variante encart sombre (filet discret ; le texte passe blanc via .pd-dark h2) */
.pd-fiche .pd-dark .pd-details-title{border-bottom-color:rgba(255,255,255,.16)}

/* Harmonisation : toutes les icones decoratives de la zone .pd-desc (SVG + Font Awesome) en bleu-acier discret */
.pd-fiche .pd-desc :where(i[class*="fa-"],svg){color:rgba(var(--primary-medium-rgb),.7)!important}
/* Exception encarts sombres : ton clair pour rester lisible sur le fond navy */
.pd-fiche .pd-desc .pd-dark :where(i[class*="fa-"],svg){color:rgba(214,228,242,.92)!important}

/* Description en fiche LARGE : grilles de cartes en 3 colonnes (au lieu de 2 etirees) */
@media(min-width:992px){.pd-fiche .pd-desc .row.g-3 > [class*="col-"]{flex:0 0 auto;width:33.3333%}}

/* ===== Liste « a coches » : lignes separees par un filet ===== */
.pd-fiche .pd-why{margin:0;padding:0;list-style:none}
.pd-fiche .pd-why li{display:flex;gap:.65rem;padding:.7rem 0;border-bottom:1px solid rgba(var(--primary-lightest-rgb),.6)}
.pd-fiche .pd-why li:first-child{padding-top:0}
.pd-fiche .pd-why li:last-child{padding-bottom:0;border-bottom:0}
.pd-fiche .pd-why i{margin-top:.15rem;flex:0 0 auto}

/* ===== Timeline verticale (pastilles + filet) sur fond sombre ===== */
.pd-fiche .pd-flow{margin:0;padding:0;list-style:none;position:relative}
.pd-fiche .pd-flow li{position:relative;padding:0 0 1.35rem 1.6rem}
.pd-fiche .pd-flow li:last-child{padding-bottom:0}
.pd-fiche .pd-flow li::before{content:"";position:absolute;left:.31rem;top:.55rem;bottom:-.15rem;width:2px;background:rgba(255,255,255,.16)}
.pd-fiche .pd-flow li:last-child::before{display:none}
.pd-fiche .pd-flow li::after{content:"";position:absolute;left:0;top:.35rem;width:.72rem;height:.72rem;border-radius:50%;background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.14)}
.pd-fiche .pd-flow-step{display:block;font-weight:700;color:#fff;line-height:1.3}
.pd-fiche .pd-flow-sub{color:rgba(255,255,255,.72);font-size:.9rem}

/* ===== Bouton bleu plein : fort contraste, lisible sur card blanche ET encart sombre ===== */
.pd-fiche .btn-acro-ink{background:#2a72c0;border:none;color:#fff;font-weight:600;font-size:.9rem;padding:.75rem 2rem;border-radius:50px;transition:all .3s ease;box-shadow:0 4px 18px rgba(47,128,214,.4)}
.pd-fiche .btn-acro-ink:hover{background:#215fa6;color:#fff;transform:translateY(-2px);box-shadow:0 8px 26px rgba(47,128,214,.5)}

/* ===== FAQ dans la fiche claire : override du theme sombre injecte par acr_faq() -> cartes blanches lisibles + etats ===== */
.pd-fiche .acr-faq{max-width:none;margin:0;gap:.6rem}
.pd-fiche .acr-faq-title{max-width:none;margin:0 0 1.1rem;font-size:1.15rem;font-weight:800;line-height:1.35;padding-bottom:.75rem;border-bottom:1px solid rgba(var(--primary-lightest-rgb),.9);gap:.6rem;color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .acr-faq-item{background:#fff;border:1px solid rgba(var(--primary-lightest-rgb),.85);border-radius:.7rem;transition:border-color .2s,box-shadow .2s}
.pd-fiche .acr-faq-item:hover{border-color:rgba(var(--primary-medium-rgb),.4)}
.pd-fiche .acr-faq-item[open]{border-color:rgba(var(--primary-medium-rgb),.55);box-shadow:0 6px 18px rgba(16,53,89,.09)}
.pd-fiche .acr-faq-item>summary{color:rgba(var(--primary-darkest-rgb),1);padding:.95rem 1.1rem}
.pd-fiche .acr-faq-item>summary::after{opacity:1;color:rgba(var(--primary-medium-rgb),1)}
.pd-fiche .acr-faq-a{color:rgba(var(--primary-dark-rgb),.82);opacity:1}

/* ===== Encarts SOMBRES (typo blanche) pour alterner le rythme, facon lylcash ===== */
.pd-fiche .pd-dark{background:linear-gradient(135deg,rgba(var(--primary-darkest-rgb),1) 0%,rgba(var(--primary-dark-rgb),1) 100%);color:#fff;border:0!important}
.pd-fiche .pd-dark h2,.pd-fiche .pd-dark h3,.pd-fiche .pd-dark strong{color:#fff}
.pd-fiche .pd-dark .pd-dark-sub{color:rgba(255,255,255,.78)}
.pd-fiche .pd-dark code{color:#fff;background:rgba(255,255,255,.12)}

/* ============================================================================
   Catalogue clair (boutique + categorie) - methode lylcash : sidebar categories
   a gauche + grille de cartes produit a droite. Classes : .bq-topbar/-left/-right/
   -count (en-tete) . .bq-filter-btn-mobile + .bq-mobile-panel (filtres mobile) .
   .pd-cat-title . .pd-cat-side (sidebar) . .pd-prod-card (carte produit)
   ============================================================================ */
/* Topbar : titre + compteur a gauche, tri a droite, bouton « Filtrer » en mobile.
   Le bouton est un FRERE de .bq-topbar-right : il reste visible quand celle-ci
   passe en display:none sous 992px. */
.pd-fiche .bq-topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.6rem;padding-bottom:1rem;border-bottom:1px solid rgba(var(--primary-lightest-rgb),.8)}
.pd-fiche .bq-topbar-left{display:flex;flex-direction:column;gap:.15rem}
.pd-fiche .pd-cat-title{font-size:clamp(1.6rem,1.2rem + 1.4vw,2.4rem);font-weight:800;color:rgba(var(--primary-darkest-rgb),1);margin:0;line-height:1.1}
.pd-fiche .bq-topbar-count{font-size:.9rem;color:rgba(var(--primary-dark-rgb),.7);font-weight:600}
.pd-fiche .bq-topbar-right{display:flex;align-items:center;gap:.5rem}
.pd-fiche .bq-topbar-right select{background:#fff;border:1px solid var(--glass-border);border-radius:.6rem;padding:.5rem 1rem;color:rgba(var(--primary-darkest-rgb),1);font-family:inherit;font-weight:600;font-size:.9rem;cursor:pointer}
.pd-fiche .bq-topbar-right select:focus{outline:2px solid rgba(var(--primary-medium-rgb),.6);outline-offset:1px}
/* Bouton « Filtrer » : masque par defaut, revele sous 992px (cf. media query plus bas) */
.pd-fiche .bq-filter-btn-mobile{display:none;align-items:center;gap:.4rem;padding:.5rem .95rem;background:rgba(var(--primary-darkest-rgb),1);color:#fff;border:none;border-radius:.6rem;font-family:inherit;font-size:.85rem;font-weight:600;cursor:pointer;white-space:nowrap}
.pd-fiche .bq-filter-btn-mobile:hover{background:rgba(var(--primary-dark-rgb),1)}

/* Sidebar categories - arbre ACCORDEON type lylcash (override du theme sombre global .sidebar-area .cat).
   Carte = MA .pd-card -> on neutralise la carte interne du widget. Etat actif = rouge charte. */
.pd-fiche .pd-cat-side .sidebar-area .widget{background:transparent;border:0;padding:0;margin:0}
.pd-fiche .pd-cat-side .sidebar-area .widget h4{color:rgba(var(--primary-darkest-rgb),1)!important;font-size:1.15rem;font-weight:800;margin:0 0 .7rem;padding-bottom:.6rem;border-bottom:1px solid rgba(var(--primary-lightest-rgb),.9)}
.pd-fiche .pd-cat-side .cat .pd-cat-tree,.pd-fiche .pd-cat-side .cat .pd-cat-tree ul{list-style:none;margin:0;padding:0}
/* Tous les li (y compris ceux de ul.niveau-2) : neutralise le fond/padding sombre
   herite de theme.css (.cat ul li), tres visible dans le panneau de filtres clair. */
.pd-fiche .pd-cat-side .cat .pd-cat-tree li{background:transparent;padding:0;margin:0 0 .1rem}
.pd-fiche .pd-cat-side .cat .pd-cat-tree a{display:block;padding:.55rem .7rem;border-radius:.5rem;color:rgba(var(--primary-dark-rgb),.92)!important;font-weight:600;font-size:.95rem;text-decoration:none;transition:background .15s,color .15s}
.pd-fiche .pd-cat-side .cat .pd-cat-tree a:hover{background:rgba(var(--primary-lightest-rgb),.5);color:rgba(var(--primary-darkest-rgb),1)!important}
.pd-fiche .pd-cat-side .cat .pd-cat-tree .pd-cat-all a i{margin-right:.5rem;font-size:.8rem;color:rgba(var(--primary-medium-rgb),.7)}
/* accordeon (details/summary) : clic sur le nom = naviguer, clic sur +/- = deplier */
.pd-fiche .pd-cat-side details.pd-acc > summary{list-style:none;display:flex;align-items:center;gap:.35rem;cursor:pointer;border-radius:.5rem;padding-right:.35rem}
.pd-fiche .pd-cat-side details.pd-acc > summary::-webkit-details-marker{display:none}
.pd-fiche .pd-cat-side details.pd-acc > summary .pd-acc-lbl{flex:1 1 auto}
.pd-fiche .pd-cat-side details.pd-acc > summary::after{content:"+";flex:0 0 auto;width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem;line-height:1;color:rgba(var(--primary-medium-rgb),.85);border-radius:.35rem;background:rgba(var(--primary-lightest-rgb),.5)}
.pd-fiche .pd-cat-side details.pd-acc[open] > summary::after{content:"\2212"}
.pd-fiche .pd-cat-side details.pd-acc > summary:hover{background:rgba(var(--primary-lightest-rgb),.35)}
/* sous-categories indentees */
.pd-fiche .pd-cat-side .cat .pd-cat-tree ul.niveau-2{margin:.15rem 0 .45rem .55rem;padding-left:.55rem;border-left:2px solid rgba(var(--primary-lightest-rgb),.9)}
.pd-fiche .pd-cat-side .cat .pd-cat-tree ul.niveau-2 a{font-size:.9rem;font-weight:500;padding:.42rem .7rem}
/* etat actif : UNIQUEMENT la couleur du texte (fonce + gras). Aucun aplat de
   fond : le rouge charte comme tout fond colore alourdissaient la sidebar. */
.pd-fiche .pd-cat-side .cat .pd-cat-tree li.active > a,
.pd-fiche .pd-cat-side .cat .pd-cat-tree summary.active .pd-acc-lbl{background:transparent;color:rgba(var(--primary-darkest-rgb),1)!important;font-weight:700}

/* Grille produit : 1 col (mobile) -> 2 (tablette) -> 3 (PC), bien reparties (1fr).
   Avec 1 seul produit la card reste compacte (1/3 de largeur, non etiree). */
.pd-fiche .pd-prod-grid{display:grid;grid-template-columns:1fr;gap:1.4rem;align-items:stretch}
@media(min-width:576px){.pd-fiche .pd-prod-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:992px){.pd-fiche .pd-prod-grid{grid-template-columns:repeat(3,1fr)}}
/* Carte produit claire */
.pd-fiche .pd-prod-card{position:relative;background:#fff;border:1px solid var(--glass-border);border-radius:1rem;overflow:hidden;height:100%;display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}
.pd-fiche .pd-prod-card:hover{box-shadow:0 12px 32px rgba(16,53,89,.13);transform:translateY(-3px)}
.pd-fiche .pd-prod-media{position:relative;display:block;aspect-ratio:1/1;background:#fff;overflow:hidden;border-bottom:1px solid rgba(var(--primary-lightest-rgb),.6)}
.pd-fiche .pd-prod-media img{width:100%;height:100%;object-fit:contain;padding:1.1rem}
.pd-fiche .pd-prod-media .badge{position:absolute;top:.8rem;left:.8rem;z-index:2}
.pd-fiche .pd-prod-body{padding:1rem 1.1rem .6rem;flex:1 1 auto;display:flex;flex-direction:column;gap:.45rem}
.pd-fiche .pd-prod-title{font-size:1.05rem;font-weight:700;margin:0;line-height:1.25}
.pd-fiche .pd-prod-title a{color:rgba(var(--primary-darkest-rgb),1);text-decoration:none}
.pd-fiche .pd-prod-title a:hover{color:rgba(var(--primary-medium-rgb),1)}
.pd-fiche .pd-prod-price{display:flex;align-items:baseline;gap:.45rem;flex-wrap:wrap;margin-top:.1rem}
.pd-fiche .pd-prod-price .now{font-size:1.45rem;font-weight:900;color:rgba(var(--primary-darkest-rgb),1);letter-spacing:-.02em;line-height:1}
.pd-fiche .pd-prod-price .ht{font-size:.75rem;color:rgba(var(--primary-dark-rgb),.7);font-weight:600}
.pd-fiche .pd-prod-price del{font-size:.9rem;color:var(--pd-red-ink);font-weight:600}
.pd-fiche .pd-prod-recap{font-size:.85rem;color:rgba(var(--primary-dark-rgb),.75);line-height:1.5;margin:.1rem 0 0}
/* Padding lateral minimal : avec .8rem les 2 badges ne tiennent pas cote a cote
   en 3 colonnes PC et retombent en escalier. */
.pd-fiche .pd-prod-foot{margin-top:auto;padding:.55rem .1rem .85rem;display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;border-top:1px solid rgba(var(--primary-lightest-rgb),.5)}
.pd-fiche .pd-prod-foot .badge{background:rgba(209,219,228,.4);border:1px solid rgba(209,219,228,.85);color:rgba(var(--primary-dark-rgb),.92);font-weight:500}
/* Encart d'info SECONDAIRE : widget dans sa PROPRE card, sous les categories.
   En mobile la sidebar passe apres la grille : il ne precede jamais les produits. */
.pd-fiche .pd-cat-side .bq-encart{font-size:.85rem;line-height:1.55;color:rgba(var(--primary-dark-rgb),.85)}
.pd-fiche .pd-cat-side .bq-encart h4 i{color:rgba(var(--primary-medium-rgb),.75);font-size:.85rem;margin-right:.2rem}
.pd-fiche .pd-cat-side .bq-encart p{margin:0 0 .55rem}
.pd-fiche .pd-cat-side .bq-encart-cta{display:inline-flex;align-items:center;gap:.4rem;font-weight:700;font-size:.85rem;text-decoration:none;color:rgba(var(--primary-medium-rgb),1)!important;padding:0!important}
.pd-fiche .pd-cat-side .bq-encart-cta:hover{color:rgba(var(--primary-darkest-rgb),1)!important;background:transparent!important;gap:.55rem}
.pd-fiche .pd-cat-side .bq-encart-cta i{font-size:.75rem;transition:transform .15s}

/* Etat vide */
.pd-fiche .bq-empty{background:var(--surface-card);border:1px solid var(--glass-border);border-radius:1rem;padding:2.5rem 1.5rem;text-align:center;color:rgba(var(--primary-dark-rgb),.85)}
.pd-fiche .bq-empty h2{color:rgba(var(--primary-darkest-rgb),1)}

/* ===== Scroll infini : loader, erreur explicite, bouton de repli, fin de liste ===== */
.pd-fiche .bq-loader{display:flex;flex-direction:column;align-items:center;gap:.6rem;padding:2.5rem}
.pd-fiche .bq-loader[hidden],.pd-fiche .bq-load-error[hidden],.pd-fiche .bq-load-more[hidden],.pd-fiche .bq-end-msg[hidden]{display:none}
.pd-fiche .bq-spinner{width:28px;height:28px;border:3px solid rgba(var(--primary-lightest-rgb),1);border-top-color:rgba(var(--secondary-medium-rgb),1);border-radius:50%;animation:bqSpin .6s linear infinite}
@keyframes bqSpin{to{transform:rotate(360deg)}}
.pd-fiche .bq-loader-text{font-size:.85rem;color:rgba(var(--primary-dark-rgb),.7)}
.pd-fiche .bq-load-error{margin-top:1.5rem;padding:1rem;border-radius:.75rem;background:rgba(var(--secondary-medium-rgb),.08);border:1px solid rgba(var(--secondary-medium-rgb),.3);color:rgba(var(--primary-darkest-rgb),1);text-align:center;font-size:.9rem}
.pd-fiche .bq-load-error button,.pd-fiche .bq-load-more button{font-family:inherit;font-weight:600;cursor:pointer;border-radius:.6rem}
.pd-fiche .bq-load-error button{background:rgba(var(--secondary-medium-rgb),1);color:#fff;border:none;padding:.4rem .9rem;margin-left:.4rem}
.pd-fiche .bq-load-more{display:flex;justify-content:center;margin-top:1.75rem}
.pd-fiche .bq-load-more button{background:#fff;color:rgba(var(--primary-darkest-rgb),1);border:1px solid var(--glass-border);padding:.7rem 1.6rem;font-size:.9rem}
.pd-fiche .bq-load-more button:hover{background:rgba(209,219,228,.4)}
.pd-fiche .bq-end-msg{text-align:center;padding:2rem;font-size:.85rem;color:rgba(var(--primary-dark-rgb),.55);font-weight:500}
.pd-fiche .bq-sentinel{height:1px}

/* ===== Panneau de filtres mobile (tiroir + fond) ===== */
body.bq-noscroll{overflow:hidden}
.pd-fiche .bq-mobile-backdrop{position:fixed;inset:0;z-index:9998;background:rgba(4,23,43,.5)}
.pd-fiche .bq-mobile-backdrop[hidden],.pd-fiche .bq-mobile-panel[hidden]{display:none}
.pd-fiche .bq-mobile-panel{position:fixed;top:0;left:0;bottom:0;width:min(88vw,360px);z-index:9999;background:#fff;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 0 40px rgba(4,23,43,.3)}
.pd-fiche .bq-mobile-panel-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem;border-bottom:1px solid rgba(var(--primary-lightest-rgb),.8);color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .bq-mobile-panel-close{background:none;border:none;font-size:1.6rem;line-height:1;color:rgba(var(--primary-darkest-rgb),1);cursor:pointer;width:2.25rem;height:2.25rem;display:flex;align-items:center;justify-content:center;border-radius:.4rem}
.pd-fiche .bq-mobile-panel-close:hover{background:rgba(var(--primary-lightest-rgb),.5)}
.pd-fiche .bq-mobile-panel-body{flex:1 1 auto;overflow-y:auto;padding:1.1rem 1.25rem 2rem}
.pd-fiche .bq-mobile-panel-h{font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:rgba(var(--primary-dark-rgb),.75);margin:0 0 .6rem}
.pd-fiche .bq-mobile-panel-body select{width:100%;padding:.6rem .75rem;border:1px solid var(--glass-border);border-radius:.6rem;font-family:inherit;font-size:.9rem;font-weight:600;color:rgba(var(--primary-darkest-rgb),1);background:#fff;margin-bottom:1.4rem}
.pd-fiche .bq-mobile-panel-body .sidebar-area{margin:0}

/* ===== Bascule mobile a 992px : la sidebar disparait, le bouton « Filtrer » apparait.
   Aligne sur le breakpoint Bootstrap lg utilise par .d-none.d-lg-block cote markup,
   pour qu'aucune colonne fantome ne subsiste en tablette. ===== */
@media(max-width:991.98px){
	.pd-fiche .bq-filter-btn-mobile{display:flex}
	.pd-fiche .bq-topbar-right{display:none}
}


/* ============================================================================
   BLOG CLAIR - refonte editoriale du 2026-07-22
   ----------------------------------------------------------------------------
   Aligne sur la charte boutique : meme fond, meme encre, meme filet de titre,
   sidebar A GAUCHE comme .pd-cat-side. Aucune couleur ni police nouvelle.
   Parti pris editorial :
     - une UNE horizontale (le dernier article) puis une grille plus dense ;
     - un SURTITRE typographique (tiret + rubrique en petites capitales espacees
       + date) qui remplace le chip a icone et la pastille posee sur la photo ;
     - page article recentree, sans colonne laterale, avec « A lire ensuite ».
   ========================================================================= */

/* Le blog utilise EXACTEMENT la meme largeur de page que /boutique : il herite
   donc de .pd-fiche .container (95em), sans plafond specifique. */

/* ----- Gabarit : sidebar a gauche, contenu a droite (comme la boutique) ----- */
/* Le CONTENU est premier dans le DOM (mobile et robots le lisent en premier) ;
   la sidebar n'est ramenee a gauche qu'en desktop, par placement de grille. */
.pd-blog-layout{display:grid;gap:2rem;grid-template-columns:1fr}
@media(min-width:992px){
	.pd-blog-layout{grid-template-columns:17.5rem minmax(0,1fr);gap:2.5rem;align-items:start}
	.pd-blog-layout>.pd-blog-aside{grid-column:1;grid-row:1}
	.pd-blog-layout>.pd-blog-main{grid-column:2;grid-row:1}
}

/* ----- En-tete de section (reprend le filet de .bq-topbar) ----- */
.pd-fiche .pd-blog-head{margin-bottom:1.75rem;padding-bottom:1.1rem;border-bottom:1px solid rgba(var(--primary-lightest-rgb),.9)}
.pd-fiche .pd-blog-head h1{margin:0;font-size:clamp(2rem,4.5vw,2.9rem);font-weight:800;line-height:1.05;letter-spacing:-.02em;color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-blog-intro{margin:.85rem 0 0;max-width:46em;font-size:1.02rem;line-height:1.6;color:rgba(var(--primary-dark-rgb),.8)}
.pd-fiche .pd-blog-count{margin:.85rem 0 0;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(var(--primary-medium-rgb),.85)}

/* ----- SIGNATURE : le surtitre. Tiret plein + rubrique capitalisee + date. ----- */
.pd-fiche .pd-eyebrow{display:flex;align-items:center;flex-wrap:wrap;gap:.55rem;margin:0 0 .7rem;font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;line-height:1.4}
.pd-fiche .pd-eyebrow::before{content:"";flex:0 0 auto;width:1.4rem;height:2px;border-radius:2px;background:rgba(var(--primary-medium-rgb),.9)}
.pd-fiche .pd-eyebrow a{color:rgba(var(--primary-medium-rgb),1);text-decoration:none}
.pd-fiche .pd-eyebrow a:hover{color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-eyebrow time{font-weight:600;letter-spacing:.06em;color:rgba(var(--primary-dark-rgb),.72)}
.pd-fiche .pd-eyebrow time::before{content:"\00b7";margin-right:.55rem;color:rgba(var(--primary-dark-rgb),.5)}
/* Variante « a la une » : le seul endroit ou le rouge de charte apparait. */
.pd-fiche .pd-eyebrow-lead::before{background:rgba(var(--secondary-medium-rgb),1)}
.pd-fiche .pd-eyebrow-flag{color:var(--pd-red-ink)}
.pd-fiche .pd-eyebrow-flag::after{content:"\00b7";margin-left:.55rem;color:rgba(var(--primary-dark-rgb),.5)}

/* ----- Carte article ----- */
.pd-fiche .pd-post{display:flex;flex-direction:column;overflow:hidden;background:var(--surface-card);border:1px solid var(--glass-border);border-radius:.85rem;transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease}
.pd-fiche .pd-post:hover{transform:translateY(-3px);border-color:rgba(var(--primary-medium-rgb),.3);box-shadow:0 14px 34px rgba(16,53,89,.11)}
.pd-fiche .pd-post-media{display:block;overflow:hidden;aspect-ratio:16/10;background:rgba(var(--primary-lightest-rgb),.5)}
.pd-fiche .pd-post-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.3,1)}
.pd-fiche .pd-post:hover .pd-post-media img{transform:scale(1.05)}
.pd-fiche .pd-post-body{display:flex;flex-direction:column;flex:1 1 auto;padding:1.15rem 1.25rem 0}
.pd-fiche .pd-post-title{margin:0;font-size:1.06rem;font-weight:700;line-height:1.35;letter-spacing:-.005em}
.pd-fiche .pd-post-title a{color:rgba(var(--primary-darkest-rgb),1);text-decoration:none}
.pd-fiche .pd-post:hover .pd-post-title a{color:rgba(var(--primary-medium-rgb),1)}
.pd-fiche .pd-post-excerpt{margin:.6rem 0 0;font-size:.89rem;line-height:1.6;color:rgba(var(--primary-dark-rgb),.75)}
.pd-fiche .pd-post-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:1.15rem;padding:.85rem 1.25rem;border-top:1px solid rgba(var(--primary-lightest-rgb),.75)}
.pd-fiche .pd-post-more{font-size:.82rem;font-weight:700;color:rgba(var(--primary-medium-rgb),1);text-decoration:none;white-space:nowrap}
.pd-fiche .pd-post-more i{margin-left:.4rem;font-size:.75rem;transition:transform .25s ease}
.pd-fiche .pd-post:hover .pd-post-more i{transform:translateX(4px)}
.pd-fiche .pd-post-stats{display:flex;align-items:center;gap:.9rem;font-size:.76rem;color:rgba(var(--primary-dark-rgb),.72)}
.pd-fiche .pd-post-stats i{margin-right:.3rem;color:rgba(var(--primary-medium-rgb),.6)}

/* ----- La UNE : bandeau horizontal, image a gauche -----
   Les enfants sont places EXPLICITEMENT. En placement automatique le pied
   tombait en colonne 1, donc sous la seule photo (mesure : x=1, largeur 601
   pour une carte de 1176). Ici la photo occupe la colonne 1 sur toute la
   hauteur, et le pied vient se ranger sous l extrait, dans la colonne 2. */
.pd-fiche .pd-post-lead{margin-bottom:1.6rem}
/* Les porteurs de microdonnees (<time>, auteur, publisher) sont des enfants
   DIRECTS de l article : en grille ils recevaient de vraies cellules, dont un
   <time> de 79px de haut qui creusait un vide dans la colonne de droite. On les
   sort du flux sans les masquer, pour qu ils restent lisibles par les robots. */
.pd-fiche .pd-post{position:relative}
.pd-fiche .pd-post>time,
.pd-fiche .pd-post>span[itemprop="author"],
.pd-fiche .pd-post>div[itemprop="publisher"]{position:absolute;top:0;left:0;width:0;height:0;overflow:hidden;pointer-events:none}
@media(min-width:768px){
	.pd-fiche .pd-post-lead{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);grid-template-rows:1fr auto;align-items:stretch}
	.pd-fiche .pd-post-lead>.pd-post-media{grid-column:1;grid-row:1 / span 2;aspect-ratio:auto;height:100%}
	.pd-fiche .pd-post-lead>.pd-post-body{grid-column:2;grid-row:1;justify-content:center;padding:1.9rem 1.9rem 0}
	.pd-fiche .pd-post-lead>.pd-post-foot{grid-column:2;grid-row:2;margin-top:1.6rem;padding:.95rem 1.9rem 1.4rem;border-top:0}
	.pd-fiche .pd-post-lead .pd-post-title{font-size:1.5rem;line-height:1.25}
	.pd-fiche .pd-post-lead .pd-post-excerpt{font-size:.95rem;margin-top:.75rem}
}

/* ----- Grille des articles suivants ----- */
.pd-blog-grid{display:grid;gap:1.4rem;grid-template-columns:1fr}
@media(min-width:576px){.pd-blog-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1200px){.pd-blog-grid{grid-template-columns:repeat(3,1fr)}}

/* ----- Sidebar (calquee sur .pd-cat-side de la boutique) ----- */
.pd-fiche .pd-sticky{position:sticky;top:1rem}
.pd-fiche .pd-side{display:grid;gap:1.25rem}
.pd-fiche .pd-side-widget{padding:1.25rem;background:var(--surface-card);border:1px solid var(--glass-border);border-radius:.85rem}
.pd-fiche .pd-side-title{margin:0 0 .9rem;padding-bottom:.75rem;border-bottom:1px solid rgba(var(--primary-lightest-rgb),.9);font-size:.74rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-side-cats{list-style:none;margin:0;padding:0}
.pd-fiche .pd-side-cats li+li{border-top:1px solid rgba(var(--primary-lightest-rgb),.6)}
.pd-fiche .pd-side-cats a{display:block;padding:.6rem 0;font-size:.9rem;font-weight:600;color:rgba(var(--primary-dark-rgb),.85);text-decoration:none;transition:color .2s ease,padding-left .2s ease}
.pd-fiche .pd-side-cats a:hover{padding-left:.35rem;color:rgba(var(--primary-medium-rgb),1)}
.pd-fiche .pd-side-cats a.active{color:rgba(var(--primary-darkest-rgb),1);font-weight:700}
.pd-fiche .pd-side-posts{display:grid;gap:1rem}
.pd-fiche .pd-side-post{display:flex;align-items:flex-start;gap:.8rem}
.pd-fiche .pd-side-thumb{flex:0 0 auto;display:block;width:60px;height:60px;object-fit:cover;border-radius:.5rem}
.pd-fiche .pd-side-post-title{display:block;margin:0 0 .25rem;font-size:.84rem;font-weight:600;line-height:1.35}
.pd-fiche .pd-side-post-title a{color:rgba(var(--primary-darkest-rgb),1);text-decoration:none}
.pd-fiche .pd-side-post-title a:hover{color:rgba(var(--primary-medium-rgb),1)}
.pd-fiche .pd-side-post-date{display:block;font-size:.7rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgba(var(--primary-dark-rgb),.72)}

/* ----- Page article : gabarit 2/3 (lecture) + 1/3 (sidebar) -----
   Pleine largeur assumee : pas de colonne de lecture etroite, pas de carte qui
   retrecit le texte. Le contenu occupe toute sa colonne ; la respiration vient
   de la typographie et du rythme vertical, pas de paddings interieurs.
   En mobile la sidebar retombe naturellement sous l'article (ordre du DOM). */
.pd-read-layout{display:grid;gap:2.5rem;grid-template-columns:1fr}
@media(min-width:992px){
	.pd-read-layout{grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:3.5rem;align-items:start}
}
.pd-read{max-width:none;margin:0}
.pd-fiche .pd-read-title{margin:0 0 1rem;font-size:clamp(1.75rem,3.6vw,2.6rem);font-weight:800;line-height:1.12;letter-spacing:-.02em;color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-read-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.4rem;margin:0 0 1.8rem;padding:0;list-style:none;font-size:.8rem;color:rgba(var(--primary-dark-rgb),.75)}
.pd-fiche .pd-read-meta li{display:flex;align-items:center;gap:.4rem}
.pd-fiche .pd-read-meta i{color:rgba(var(--primary-medium-rgb),.8)}
/* Visuel de tete : banniere pleine largeur de colonne, format cinema. */
.pd-fiche .pd-read-cover{margin:0 0 2.6rem;border-radius:.9rem;overflow:hidden;background:rgba(var(--primary-lightest-rgb),.5)}
.pd-fiche .pd-read-cover img{display:block;width:100%;height:100%;object-fit:cover}
@media(min-width:992px){.pd-fiche .pd-read-cover{aspect-ratio:21/9}}

/* Corps redactionnel : pleine largeur de colonne, typo agrandie pour tenir la
   longueur de ligne. Aucun max-width : c'est le choix editorial demande. */
.pd-fiche .pd-article-body{font-size:1.09rem;line-height:1.8;color:rgba(var(--primary-dark-rgb),.93)}
.pd-fiche .pd-article-body>*:first-child{margin-top:0}
.pd-fiche .pd-article-body p{margin:0 0 1.2rem}
.pd-fiche .pd-article-body .lead{font-size:1.16rem;line-height:1.62;font-weight:500;color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-article-body h2{margin:2.6rem 0 1rem;font-size:1.5rem;font-weight:800;line-height:1.25;letter-spacing:-.015em;color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-article-body h3{margin:2rem 0 .7rem;font-size:1.12rem;font-weight:700;line-height:1.35;color:rgba(var(--primary-medium-rgb),1)}
.pd-fiche .pd-article-body h4{margin:1.6rem 0 .6rem;font-size:1rem;font-weight:700;color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-article-body ul{margin:0 0 1.2rem;padding-left:1.25rem}
.pd-fiche .pd-article-body li{margin-bottom:.55rem}
.pd-fiche .pd-article-body ul li::marker{color:rgba(var(--primary-medium-rgb),.75)}
/* Puces numerotees : pastille chiffree. Un <ol> decrit une SEQUENCE (des etapes),
   le numero porte donc une information : on lui donne un vrai statut visuel au
   lieu du chiffre nu du navigateur. Chiffres sur deux positions (01, 02...). */
.pd-fiche .pd-article-body ol{list-style:none;counter-reset:acr-etape;margin:0 0 1.35rem;padding-left:0}
.pd-fiche .pd-article-body ol>li{position:relative;counter-increment:acr-etape;margin-bottom:.85rem;padding-left:3rem;line-height:1.7}
.pd-fiche .pd-article-body ol>li::before{
	content:counter(acr-etape,decimal-leading-zero);
	position:absolute;left:0;top:.1rem;
	display:flex;align-items:center;justify-content:center;
	width:2rem;height:2rem;border-radius:.55rem;
	background:rgba(var(--primary-medium-rgb),.1);
	color:rgba(var(--primary-medium-rgb),1);
	font-size:.76rem;font-weight:800;font-style:normal;letter-spacing:.02em;line-height:1}
/* Listes imbriquees : on revient a des puces simples, pas de pastille. */
.pd-fiche .pd-article-body ol ol,.pd-fiche .pd-article-body ol ul,.pd-fiche .pd-article-body ul ol{margin-top:.6rem}
.pd-fiche .pd-article-body ol ul{list-style:disc;padding-left:1.25rem}
.pd-fiche .pd-article-body ol ul li::before{content:none}
.pd-fiche .pd-article-body strong{font-weight:700;color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-article-body a{color:rgba(var(--primary-medium-rgb),1);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.pd-fiche .pd-article-body img{max-width:100%;height:auto;border-radius:.6rem}
/* Filet bleu-acier : le rouge de charte reste reserve aux badges editoriaux. */
.pd-fiche .pd-article-body blockquote{margin:2.2rem 0;padding:.15rem 0 .15rem 1.6rem;border-left:3px solid rgba(var(--primary-medium-rgb),1);font-size:1.14rem;line-height:1.65;font-style:italic;color:rgba(var(--primary-darkest-rgb),.86)}
.pd-fiche .pd-article-body blockquote strong{color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-article-body blockquote p:last-child{margin-bottom:0}
/* theme.css dessine deja une coche en background-image SVG (inversee en blanc
   pour le fond sombre). Sans la neutraliser, un content: "\f00c" ajoutait un
   SECOND marqueur : d ou le double chevron. On remet donc tout a plat ici. */
.pd-fiche .pd-article-body ul.tik-list{list-style:none;margin:0 0 1.35rem;padding-left:0;width:auto}
.pd-fiche .pd-article-body ul.tik-list li{position:relative;display:block;margin-bottom:.6rem;padding-left:2rem;font-size:inherit;line-height:1.7}
.pd-fiche .pd-article-body ul.tik-list li::before{
	content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;
	background-image:none;filter:none;margin:0;
	position:absolute;left:0;top:.28rem;
	display:flex;align-items:center;justify-content:center;
	width:1.25rem;height:1.25rem;border-radius:50%;
	background-color:rgba(var(--primary-medium-rgb),.1);
	color:rgba(var(--primary-medium-rgb),1);
	font-size:.62rem;line-height:1}

/* Encadres redactionnels (remplacent les style="" ecrits dans le HTML des articles) */
.pd-fiche .pd-note{margin:2rem 0;padding:1.3rem 1.5rem;border:1px solid var(--glass-border);border-radius:.8rem;background:rgba(255,255,255,.75);font-size:.97rem}
.pd-fiche .pd-note>*:last-child{margin-bottom:0}
.pd-fiche .pd-note-accent{border-left:3px solid rgba(var(--primary-medium-rgb),1)}
.pd-fiche .pd-note-title{margin:0 0 .8rem;font-size:.72rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:rgba(var(--primary-medium-rgb),1)}
.pd-fiche .pd-note-src{margin:.8rem 0 0;font-size:.83rem;line-height:1.55;color:rgba(var(--primary-dark-rgb),.72)}
.pd-fiche .pd-article-cta{margin:2.8rem 0;text-align:center}

/* Pied d'article */
.pd-fiche .pd-article-foot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1.25rem;margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid rgba(var(--primary-lightest-rgb),.9)}
.pd-fiche .pd-kw-label{margin:0 0 .6rem;font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:rgba(var(--primary-dark-rgb),.72)}
.pd-fiche .pd-kw-list{display:flex;flex-wrap:wrap;gap:.4rem}
.pd-fiche .pd-kw{display:inline-block;padding:.3rem .7rem;border-radius:50px;background:rgba(var(--primary-lightest-rgb),.55);font-size:.76rem;font-weight:600;color:rgba(var(--primary-dark-rgb),.85);text-decoration:none;transition:background .2s ease,color .2s ease}
.pd-fiche .pd-kw:hover{background:rgba(var(--primary-medium-rgb),.12);color:rgba(var(--primary-medium-rgb),1)}
.pd-fiche .pd-like{display:inline-flex;align-items:center;gap:.6rem;padding:.6rem 1.15rem;border:1px solid rgba(var(--primary-lightest-rgb),.95);border-radius:50px;background:var(--surface-card);font-size:.83rem;font-weight:700;color:rgba(var(--primary-dark-rgb),.9);cursor:pointer;transition:border-color .2s ease,background .2s ease}
.pd-fiche .pd-like i{color:rgba(var(--secondary-medium-rgb),1)}
.pd-fiche .pd-like:hover:not(:disabled){border-color:rgba(var(--secondary-medium-rgb),.55);background:rgba(var(--secondary-medium-rgb),.05)}
.pd-fiche .pd-like:disabled{opacity:.55;cursor:default}
.pd-fiche .pd-like-badge{min-width:1.4rem;padding:.1rem .45rem;border-radius:50px;background:rgba(var(--primary-lightest-rgb),.8);font-size:.75rem;color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-share{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:1rem;margin-top:2rem;padding-top:1.5rem;border-top:1px solid rgba(var(--primary-lightest-rgb),.9)}
.pd-fiche .pd-share-title{margin:0;font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:rgba(var(--primary-dark-rgb),.72)}
.pd-fiche .pd-share-links{display:flex;gap:.55rem}
.pd-fiche .pd-share-links a{display:inline-flex;align-items:center;justify-content:center;width:2.3rem;height:2.3rem;border-radius:50%;background:var(--surface-card);border:1px solid var(--glass-border);color:rgba(var(--primary-dark-rgb),.85);text-decoration:none;transition:background .2s ease,color .2s ease,transform .2s ease}
.pd-fiche .pd-share-links a:hover{background:rgba(var(--primary-medium-rgb),1);border-color:rgba(var(--primary-medium-rgb),1);color:#fff;transform:translateY(-2px)}

/* ----- « A lire ensuite » : pleine largeur, SOUS les deux colonnes ----- */
.pd-next{margin:3.5rem 0 0;padding-top:2.2rem;border-top:1px solid rgba(var(--primary-lightest-rgb),.9)}
.pd-fiche .pd-next-title{margin:0 0 1.4rem;font-size:.74rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:rgba(var(--primary-dark-rgb),.72)}
.pd-next-grid{display:grid;gap:1.4rem;grid-template-columns:1fr}
@media(min-width:576px){.pd-next-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:992px){.pd-next-grid{grid-template-columns:repeat(4,1fr)}}

/* ----- Sidebar d'article : promotion boutique ----- */
.pd-fiche .pd-side-prod{display:flex;align-items:center;gap:.85rem;padding:.65rem 0;text-decoration:none}
.pd-fiche .pd-side-prods>.pd-side-prod+.pd-side-prod{border-top:1px solid rgba(var(--primary-lightest-rgb),.6)}
.pd-fiche .pd-side-prod-img{flex:0 0 auto;width:60px;height:60px;object-fit:contain;background:#fff;border:1px solid rgba(var(--primary-lightest-rgb),.8);border-radius:.5rem;padding:.2rem}
.pd-fiche .pd-side-prod-name{display:block;margin:0 0 .2rem;font-size:.84rem;font-weight:600;line-height:1.35;color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-side-prod:hover .pd-side-prod-name{color:rgba(var(--primary-medium-rgb),1)}
.pd-fiche .pd-side-prod-price{display:block;font-size:.8rem;font-weight:700;color:rgba(var(--primary-medium-rgb),1)}
.pd-fiche .pd-side-prod-price del{margin-right:.35rem;font-weight:500;color:rgba(var(--primary-dark-rgb),.72)}
.pd-fiche .pd-side-cta{display:block;margin-top:1rem;padding:.7rem 1rem;border-radius:.6rem;background:rgba(var(--primary-darkest-rgb),1);color:#fff;font-size:.82rem;font-weight:700;text-align:center;text-decoration:none;transition:background .2s ease}
.pd-fiche .pd-side-cta:hover{background:rgba(var(--primary-medium-rgb),1);color:#fff}
.pd-fiche .pd-side-note{margin:0;font-size:.85rem;line-height:1.55;color:rgba(var(--primary-dark-rgb),.75)}

/* Pagination : SCOPEE (la regle .pagination de theme.css sert aussi a l'accueil
   et a la boutique, elle doit rester sombre). */
.pd-fiche .pagination{--bs-pagination-color:rgba(var(--primary-dark-rgb),.9);--bs-pagination-bg:var(--surface-card);--bs-pagination-border-color:var(--glass-border);--bs-pagination-hover-color:rgba(var(--primary-medium-rgb),1);--bs-pagination-hover-bg:rgba(var(--primary-lightest-rgb),.6);--bs-pagination-hover-border-color:var(--glass-border);--bs-pagination-focus-bg:rgba(var(--primary-lightest-rgb),.6);--bs-pagination-active-bg:rgba(var(--primary-medium-rgb),1);--bs-pagination-active-border-color:rgba(var(--primary-medium-rgb),1);--bs-pagination-active-color:#fff}

/* Accessibilite : focus visible et mouvement reduit respecte. */
.pd-fiche a:focus-visible,.pd-fiche button:focus-visible{outline:2px solid rgba(var(--primary-medium-rgb),1);outline-offset:2px;border-radius:.3rem}
@media(prefers-reduced-motion:reduce){
	.pd-fiche .pd-post,.pd-fiche .pd-post-media img,.pd-fiche .pd-post-more i,.pd-fiche .pd-side-cats a,.pd-fiche .pd-share-links a{transition:none}
	.pd-fiche .pd-post:hover{transform:none}
	.pd-fiche .pd-post:hover .pd-post-media img{transform:none}
}


/* ============================================================================
   PASSE DE CONTRASTE - 2026-07-22 (audit WCAG mesure, pages claires seulement)
   ----------------------------------------------------------------------------
   Tout est scope sous .pd-fiche : le theme sombre du reste du site est intact.
   Seuils vises : 4.5 pour le texte, 3.0 pour les elements non textuels.
   Alphas minimaux mesures sur rgba(16,53,89,a) : 0.68 sur blanc, 0.70 sur #e8edf1.
   ========================================================================= */

/* Rouge « encre » pour le TEXTE rouge sur fond clair : le rouge de charte
   (#F60A36) ne donne que 4.19 sur blanc, celui-ci donne 5.09. Le rouge de
   charte reste utilise tel quel pour le decoratif (filets, bordures, puces). */
.pd-fiche{--pd-red-ink:#DC0930}

/* --- BLOCKQUOTE : theme.css lui donne un fond « dark-glass » (gradient
   rgba(25,35,64,.4)) via un selecteur d element. Ma regle ne redefinissait que
   la couleur du texte : encre foncee sur fond sombre = illisible. On neutralise
   le fond et le guillemet decoratif dans le contexte clair. */
.pd-fiche blockquote{background:none;border-radius:0}
.pd-fiche blockquote::before{content:none}
.pd-fiche .pd-article-body blockquote{background:none}

/* --- LIENS-BOUTONS : `.pd-fiche a:not(.btn)` pese (0,3,1) a cause du :not()
   et ecrasait la couleur des boutons, d ou du bleu fonce sur fond rouge, en
   plus du soulignement herite de .pd-article-body a. On rend la main au
   systeme de boutons (variables --btn-color / --btn-color-hover de theme.css)
   plutot que de figer une couleur en dur. */
.pd-fiche a.btn-slide,
.pd-fiche .pd-article-body a.btn-slide{color:var(--btn-color,#fff);text-decoration:none}
/* Le rouge de charte ne donne que 4.19 avec du texte blanc. Sur les pages
   claires uniquement, le fond du CTA rouge descend au rouge encre (5.09 : AA).
   L identite visuelle est conservee, le theme sombre n est pas touche. */
.pd-fiche a.btn-primo{--btn-bg:var(--pd-red-ink)}
.pd-fiche a.btn-slide:hover,
.pd-fiche .pd-article-body a.btn-slide:hover{color:var(--btn-color-hover,#fff)}
/* Boutons pleins « maison » (fond fonce) : texte blanc, jamais souligne. */
.pd-fiche a.btn-acro-ink,
.pd-fiche a.pd-side-cta,
.pd-fiche .pd-article-body a.btn-acro-ink,
.pd-fiche .pd-article-body a.pd-side-cta{color:#fff;text-decoration:none}
.pd-fiche a.btn-acro-ink:hover,
.pd-fiche a.pd-side-cta:hover,
.pd-fiche .pd-article-body a.btn-acro-ink:hover{color:#fff}

/* --- ENCARTS SOMBRES : un lien nu y heritait du bleu fonce illisible. */
.pd-fiche .pd-dark a:not(.btn-slide):not(.btn-acro-ink){color:rgba(214,228,242,.95);text-decoration-color:rgba(214,228,242,.5)}
.pd-fiche .pd-dark a:not(.btn-slide):not(.btn-acro-ink):hover{color:#fff}
/* --- SIGNATURE : encart SOMBRE dans une page claire ------------------------
   Rompt le rythme du fond gris-bleu et ancre l identite Acronet. Reutilise le
   degrade de .pd-dark ; on ne redefinit ici que ce qui appartient au widget.
   Contrastes mesures sur le fond navy #04172B : titre et texte blancs 18.06 et
   14.4, CTA inverse (fond blanc / encre navy) 18.06. */
/* Le fond DOIT etre redeclare ici : .pd-fiche .pd-side-widget (fond blanc) et
   .pd-fiche .pd-dark ont la meme specificite (0,2,0) et le widget est declare
   plus bas dans le fichier, donc il l emportait -> texte blanc sur fond blanc.
   Ce selecteur (0,3,0) tranche. */
.pd-fiche .pd-side-widget.pd-dark{background:linear-gradient(135deg,rgba(var(--primary-darkest-rgb),1) 0%,rgba(var(--primary-dark-rgb),1) 100%);border-color:transparent;color:#fff}
.pd-fiche .pd-side-widget.pd-dark .pd-side-title{color:#fff;border-bottom-color:rgba(255,255,255,.2)}
.pd-fiche .pd-side-widget.pd-dark .pd-side-note{color:rgba(255,255,255,.85)}
.pd-fiche .pd-side-widget.pd-dark a.pd-side-cta{background:#fff;color:rgba(var(--primary-darkest-rgb),1)}
.pd-fiche .pd-side-widget.pd-dark a.pd-side-cta:hover{background:rgba(var(--primary-lightest-rgb),1);color:rgba(var(--primary-darkest-rgb),1)}