/* Le menu de le site (20/10/2026) : copie du menu « route » de permis-online.be (po-route.css, 1.67.4),
   ramenée à un cours et aux couleurs de la marque. Mêmes classes que le .be (préfixe por-) pour comparer les
   deux feuilles ligne à ligne ; ce qui est propre au site d’origine est signalé « CEL ».
   Palette : navy #0F1830, jaune de signalisation (#FFDC72 → #FFC629 → #F5B60E, texte navy dessus), bleu d'action
   #1A56C9, ambre #7A5200 pour un texte d'accent sur fond clair. */

:root {
  --cel-navy: #0f1830; --cel-navy-2: #16223a; --cel-jaune: #ffc629; --cel-jaune-clair: #ffdc72; --cel-jaune-fonce: #f5b60e;
  --cel-ambre: #7a5200; --cel-bleu: #1a56c9; --cel-bleu-fonce: #123e8c; --cel-texte: #1b2333; --cel-gris: #5b6478;
  --cel-bord: #e1e6ef; --cel-fond: #f3f5f9;
  --cel-police: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --cel-titre: 'Archivo Black', 'Arial Black', sans-serif;
  --por-hd: 81px; --cel-tete-h: var(--por-hd);
  --por-navy: #0f1830; --por-bleu: #1a56c9; --por-ambre: #7a5200; --por-ic: #b98300;
  --por-j1: #ffdc72; --por-j2: #ffc629; --por-j3: #f5b60e;
  --por-jaune: linear-gradient(135deg, #ffdc72, #ffc629 55%, #f5b60e);
  --por-ombre-j: rgba(245, 182, 14, .32);
  --por-gris: #5b6478; --por-gris2: #475569; --por-ligne: #e6eaf2; --por-ease: cubic-bezier(.2, .8, .2, 1);
}

/* CEL : une ancre (#…) ne se cache jamais sous le bandeau fixe. */
html { scroll-padding-top: calc(var(--por-hd) + 16px); }

/* CEL : le lien d'évitement, invisible tant qu'il n'a pas le focus clavier (imprimé par cel-site.php). */
.cel-evitement {
  position: absolute; left: 12px; top: -60px; z-index: 1000006;
  background: var(--cel-navy); color: #fff !important; padding: 10px 16px; border-radius: 10px;
  font: 700 15px/1.2 var(--cel-police); text-decoration: none !important;
}
.cel-evitement:focus { top: 12px; outline: 3px solid var(--cel-jaune); outline-offset: 2px; }

/* CEL : le logo (losange, « Code » en Archivo Black, « en ligne » en Plus Jakarta Sans), aussi lu par le pied de page. */
.cel-logo { display: inline-flex; align-items: center; gap: 11px; text-decoration: none !important; flex: none; color: inherit; }
.cel-logo .cel-marque { display: block; flex: none; }
.cel-logo-mots { display: flex; flex-direction: column; line-height: .92; }
.cel-logo-1 { font-family: var(--cel-titre); font-weight: 400; font-size: 24px; letter-spacing: -.01em; color: var(--cel-navy); }
.cel-logo-2 { font-family: var(--cel-police); font-weight: 700; font-size: 15px; letter-spacing: .01em; margin-top: 2px; color: #3a4766; }
.cel-logo-sombre .cel-logo-1 { color: #fff; }
.cel-logo-sombre .cel-logo-2 { color: var(--cel-jaune); }
a.cel-logo:focus-visible { outline: 3px solid var(--cel-bleu); outline-offset: 4px; border-radius: 8px; }

/* ─── Le bandeau ─── */
.por-defs{position:absolute;width:0;height:0;overflow:hidden}
.por,.por *,.por-pan,.por-pan *,.por-feuille,.por-feuille *,.por-tiroir,.por-tiroir *,.por-palette,.por-palette *{box-sizing:border-box;font-family:var(--cel-police);-webkit-font-smoothing:antialiased;letter-spacing:0;text-transform:none}
.por a,.por-pan a,.por-feuille a,.por-tiroir a,.por-palette a{text-decoration:none!important;color:inherit}
.por button,.por-pan button,.por-feuille button,.por-tiroir button,.por-palette button{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;box-shadow:none;text-transform:none;letter-spacing:0;min-height:0}
.por-ico{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}
.por :focus-visible,.por-pan :focus-visible,.por-feuille :focus-visible,.por-tiroir :focus-visible,.por-palette :focus-visible{outline:3px solid rgba(26,86,201,.55);outline-offset:2px;border-radius:12px}
.por-spacer{height:var(--por-hd)}
.por{position:fixed;top:0;left:0;right:0;width:100%;height:var(--por-hd);background:rgba(255,255,255,.96);-webkit-backdrop-filter:saturate(1.4) blur(12px);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid transparent;z-index:10000;transition:border-color .25s,box-shadow .25s;color:var(--por-navy);font-family:var(--cel-police)}
.por.scrolled{border-bottom-color:#eef1f6;box-shadow:0 6px 24px rgba(8,14,40,.06)}
.admin-bar .por{top:32px}
@media (max-width:782px){.admin-bar .por{top:46px}}
.por-in{position:relative;max-width:1352px;height:100%;margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:22px}
/* CEL : le logo de la marque à la place du logo « carte » belge (la règle .por * ne doit pas lui ôter Archivo Black) */
.por .por-logo{padding:4px 2px;border-radius:8px}
.por .cel-logo .cel-logo-1{font-family:var(--cel-titre);font-weight:400;letter-spacing:-.01em}
.por .cel-logo .cel-logo-2{font-family:var(--cel-police);font-weight:700;letter-spacing:.01em}
.por .por-logo .cel-marque{width:44px;height:44px}
.por-route{position:relative;display:flex;align-items:center;height:54px;padding:5px;margin:0 auto;border-radius:999px;background:var(--por-navy);box-shadow:0 12px 30px rgba(15,24,48,.24),inset 0 0 0 1px rgba(255,255,255,.06)}
.por-tag{position:relative;overflow:hidden;display:flex;align-items:center;height:44px;padding:0 18px;border-radius:999px;color:var(--por-navy)!important;font-size:15px;font-weight:800;white-space:nowrap;background:var(--por-jaune);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 4px 12px var(--por-ombre-j);margin-right:6px}
.por-tag::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.6) 50%,transparent 65%);transform:translateX(-120%);animation:por-reflet 1.4s .8s var(--por-ease) 1 forwards;pointer-events:none}
@keyframes por-reflet{to{transform:translateX(120%)}}
.por-curseur{position:absolute;top:5px;left:0;height:44px;width:0;border-radius:999px;background:#fff;box-shadow:0 6px 16px rgba(0,0,0,.18);opacity:0;transition:transform .32s var(--por-ease),width .32s var(--por-ease),opacity .2s;pointer-events:none;z-index:0}
.por-route.por-actif-r .por-curseur{opacity:1}
.por-voie{position:relative;z-index:1;display:flex;align-items:center;gap:9px;height:44px;padding:0 19px;border-radius:999px;color:#fff!important;font-size:15px;font-weight:700;white-space:nowrap;transition:color .22s}
.por-voie.por-on{color:var(--por-navy)!important}
.por-anneau{position:relative;width:24px;height:24px;display:grid;place-items:center;flex:none}
.por-anneau .por-ico{width:18px;height:18px}
.por-voie.por-on .por-anneau .por-ico{stroke:var(--por-ic)}
.por-cercle{position:absolute;inset:0;width:24px;height:24px;transform:rotate(-90deg);display:none}
.por-cercle circle{fill:none;stroke-width:2.4}
.por-cercle .por-fond{stroke:rgba(255,255,255,.22)}
.por-cercle .por-plein{stroke:url(#por-degrade);stroke-linecap:round;transition:stroke-dashoffset .6s var(--por-ease)}
.por-voie.por-on .por-cercle .por-fond{stroke:#e5eaf3}
.por-voie.por-entame .por-cercle{display:block}
.por-voie.por-entame .por-anneau .por-ico{width:13px;height:13px}
.por-pilules{display:none}
.por-chercher{position:relative;z-index:1;display:grid;place-items:center;width:44px;height:44px;border-radius:999px;color:#fff!important;margin-left:2px;transition:background .2s}
.por-chercher:hover{background:rgba(255,255,255,.12)!important}
.por-chercher .por-ico{width:19px;height:19px}
.por-droite{position:relative;display:flex;align-items:center;gap:22px;flex:none}
.por-lien{position:relative;display:flex;align-items:center;gap:6px;height:var(--por-hd);font-size:15px;font-weight:700;color:var(--por-navy)!important;cursor:pointer;white-space:nowrap}
.por-lien:hover,.por-lien:focus-within{color:var(--por-bleu)!important}
.por-lien > .por-ico{width:14px;height:14px;stroke-width:2.4;transition:transform .2s}
.por-res:hover > .por-ico,.por-res:focus-within > .por-ico{transform:rotate(180deg)}
.por-res-pan{position:absolute;top:calc(var(--por-hd) - 8px);right:-12px;width:620px;white-space:normal;padding:14px;background:#fff;border:1px solid var(--por-ligne);border-radius:20px;box-shadow:0 26px 60px rgba(8,14,40,.18);opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s var(--por-ease);color:var(--por-navy);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 12px;cursor:default;z-index:10002}
.por-res:hover .por-res-pan,.por-res:focus-within .por-res-pan{opacity:1;visibility:visible;transform:none}
.por-res-col{display:flex;flex-direction:column}
.por-res-col p{margin:4px 10px!important;padding:0!important;font-size:10.5px;font-weight:800;letter-spacing:.09em!important;text-transform:uppercase!important;color:var(--por-gris)}
.por-res-col a{display:block;padding:9px 10px;border-radius:12px}
.por-res-col a b{display:block;font-size:14px;font-weight:800;color:var(--por-navy)}
.por-res-col a span{display:block;font-size:12.5px;color:var(--por-gris);font-weight:600;margin-top:1px;line-height:1.35}
.por-res-col a:hover{background:#f3f6fb}
.por-res-col a:hover b{color:var(--por-bleu)}
.por .por-astuce{grid-column:1/-1;display:flex;align-items:center;gap:10px;margin-top:6px;padding:10px 12px;border-radius:12px;background:#f6f8fc;font-size:13px;font-weight:600;color:var(--por-gris2);text-align:left}
.por .por-astuce:hover{background:#eef3ff;color:var(--por-bleu)}
.por .por-astuce .por-ico{width:18px;height:18px}
.por kbd,.por-palette kbd{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;border-radius:6px;background:#fff;border:1px solid #d8dfea;border-bottom-width:2px;font:700 11.5px/1 var(--cel-police);color:var(--por-gris2)}
.por-cta-place{display:none}
.por-connexion{font-size:14px;font-weight:700;color:var(--por-bleu)!important;white-space:nowrap}
.por-connexion:hover{text-decoration:underline!important;text-underline-offset:3px}
.por-m-cta,.por-m-cours,.por-burger,.por-feuille,.por-voile{display:none}
.por-fil{position:absolute;left:0;right:0;bottom:-1px;height:4px;background:#eef1f6;pointer-events:none}
.por-fil[hidden]{display:none}
.por-fil i{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--por-jaune);border-radius:0 4px 4px 0;transition:width .8s var(--por-ease)}
.por-fil em{position:absolute;top:50%;left:0;transform:translate(-2px,-50%);font-style:normal;font-size:11px;font-weight:800;color:var(--por-navy);background:var(--por-jaune);padding:3px 8px;border-radius:99px;box-shadow:0 4px 10px var(--por-ombre-j);white-space:nowrap;transition:left .8s var(--por-ease)}

/* ─── La fiche du cours (ordinateur, au survol de la voie) ─── */
.por-pan{position:fixed;top:calc(var(--por-hd) + 9px);left:50%;width:840px;margin-left:-420px;background:#fff;border-radius:24px;border:1px solid var(--por-ligne);box-shadow:0 34px 80px rgba(8,14,40,.22);opacity:0;visibility:hidden;transform:translateY(10px) scale(.985);transform-origin:50% 0;transition:opacity .2s,transform .26s var(--por-ease),visibility .2s;z-index:10001;color:var(--por-navy)}
.por-pan.por-ouvert{opacity:1;visibility:visible;transform:none}
.por-pan::before{content:"";position:absolute;top:-9px;left:var(--por-pointe,50%);width:16px;height:16px;margin-left:-8px;background:#fff;border-left:1px solid var(--por-ligne);border-top:1px solid var(--por-ligne);transform:rotate(45deg);transition:left .32s var(--por-ease)}
.por-pan-vue{overflow:hidden;border-radius:24px}
.por-fiche{display:none}
.por-fiche.por-on{display:block;animation:por-entre .3s var(--por-ease)}
@keyframes por-entre{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.por-f-haut{display:grid;grid-template-columns:312px 1fr;gap:26px;padding:24px 24px 18px}
.por-f-media{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:16/10;background:radial-gradient(120% 90% at 85% 0%,rgba(255,198,41,.28),rgba(255,198,41,0) 55%),linear-gradient(160deg,#16223a,#0f1830 70%);box-shadow:0 10px 24px rgba(8,14,40,.18)}
/* CEL : à la place de la vidéo du .be, la route et le losange de la marque, dessinés en ligne */
.por-f-dessin{position:absolute;inset:0;display:block}
.por-f-route{position:absolute;left:0;right:0;bottom:0;width:100%;height:100%;display:block}
.por-f-losange{position:absolute;left:50%;top:10%;width:34%;transform:translateX(-50%);filter:drop-shadow(0 10px 18px rgba(0,0,0,.35))}
.por-f-losange .cel-marque{display:block;width:100%;height:auto}
.por-gratuit{position:absolute;left:10px;top:10px;z-index:2;background:#fff;color:var(--por-navy);font-size:11px;font-weight:800;letter-spacing:.07em!important;text-transform:uppercase!important;padding:5px 10px;border-radius:99px;box-shadow:0 4px 12px rgba(0,0,0,.2)}
.por-f-tx{min-width:0}
.por-f-kick{font-size:11.5px;font-weight:800;letter-spacing:.09em!important;text-transform:uppercase!important;color:var(--por-bleu);margin:2px 0 6px!important;padding:0!important;line-height:1.3}
.por-f-titre{font-family:var(--cel-titre)!important;font-weight:400;font-size:26px;line-height:1.08;margin:0 0 10px!important;padding:0!important;letter-spacing:-.01em!important;color:var(--por-navy)}
.por-faits{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 16px!important;padding:0!important;list-style:none!important}
.por-faits li{margin:0!important;padding:5px 10px!important;font-size:12.5px;font-weight:700;color:var(--por-gris2);background:#f3f6fb;border-radius:99px;line-height:1.3;list-style:none!important}
.por-faits li::before,.por-faits li::marker{content:none;display:none}
.por-faits li b{color:var(--por-navy)}
.por-btn{display:inline-flex;align-items:center;gap:10px;height:50px;padding:0 22px;border-radius:15px;color:var(--por-navy)!important;font-weight:800;font-size:15.5px;background:var(--por-jaune);box-shadow:0 10px 22px var(--por-ombre-j),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 0 rgba(122,82,0,.16);transition:transform .15s,box-shadow .15s}
.por-btn:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(245,182,14,.4),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 0 rgba(122,82,0,.16)}
.por-btn .por-ico{width:18px;height:18px;stroke-width:2.6}
.por-suite{margin:10px 0 0!important;padding:0!important;font-size:13px;font-weight:600;color:var(--por-gris);line-height:1.4}
.por-suite b{color:var(--por-navy);font-weight:700}
.por-progres{display:flex;align-items:center;gap:10px;margin-top:10px;font-size:12.5px;font-weight:700;color:var(--por-gris)}
.por-barre{width:160px;height:6px;border-radius:6px;background:#eef1f6;overflow:hidden;flex:none}
.por-barre i{display:block;height:100%;width:0;background:var(--por-jaune);border-radius:6px;transition:width .8s var(--por-ease)}
.por-aussi{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:0 24px 18px}
.por-aussi > span{font-size:12.5px;font-weight:700;color:var(--por-gris);margin-right:2px}
.por-aussi a{font-size:13px;font-weight:700;padding:7px 12px;border-radius:99px;background:#f3f6fb;border:1px solid #e7ecf4;transition:.15s;color:var(--por-navy)}
.por-aussi a:hover{border-color:var(--por-bleu);color:var(--por-bleu);background:#fff}
.por-jourj{display:flex;align-items:center;gap:14px;min-height:66px;padding:12px 24px;border-top:1px solid #eef1f6;background:#fafbfd;transition:background .3s}
.por-jj-ic{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#fff;border:1px solid #edf0f6;color:var(--por-gris2)}
.por-jj-ic .por-ico{width:19px;height:19px}
.por-jj-tx{flex:1;min-width:0;font-size:13.5px;line-height:1.45;color:var(--por-gris2)}
.por-jj-tx b{color:var(--por-navy)}
.por-choix{display:inline-flex;flex-wrap:wrap;gap:6px;margin-left:8px;vertical-align:middle}
.por .por-choix button,.por-pan .por-choix button{font-size:12.5px;font-weight:700;padding:6px 11px;border-radius:99px;background:#fff;border:1px solid #dfe5ee;color:var(--por-navy);transition:.15s}
.por-pan .por-choix button:hover{border-color:var(--por-j3);color:var(--por-ambre)}
.por-changer{font-size:12px;font-weight:700;color:var(--por-gris);text-decoration:underline;margin-left:6px;cursor:pointer}
.por-jourj.por-bientot{background:linear-gradient(90deg,#fff8e1,#fffcf2)}
.por-jourj.por-bientot .por-jj-ic{background:var(--por-jaune);color:var(--por-navy);border:0;box-shadow:0 6px 14px var(--por-ombre-j)}
.por-btn-2{flex:none;display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:12px;font-size:14px;font-weight:800;color:var(--por-navy)!important;background:#fff;border:1.5px solid #ffe08a;white-space:nowrap;transition:.15s}
.por-btn-2:hover{border-color:var(--por-j3);background:#fffbeb}
.por-btn-2 .por-ico{width:17px;height:17px;stroke-width:2.6}
.por-jj{display:inline-grid;place-items:center;height:22px;padding:0 8px;margin-right:6px;border-radius:7px;background:var(--por-navy);color:#fff;font-size:11.5px;font-weight:800;vertical-align:1px}
.por-f-action{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.por-f-action .por-suite,.por-f-action .por-progres{flex-basis:100%;margin-top:2px!important}
.por-btn-sec{display:inline-flex;align-items:center;gap:9px;height:50px;padding:0 18px 0 15px;border-radius:15px;background:#fff;border:1.5px solid var(--por-navy);color:var(--por-navy)!important;font-size:15.5px;font-weight:800;white-space:nowrap;transition:background .15s,color .15s}
.por-btn-sec .por-ico{width:20px;height:20px;stroke:var(--por-ic);stroke-width:2.2}
@media (hover:hover){
  .por-btn-sec:hover{background:var(--por-navy);color:#fff!important}
  .por-btn-sec:hover .por-ico{stroke:var(--por-j1)}
}

/* ─── La recherche ─── */
.por-palette-voile{position:fixed;inset:0;background:rgba(10,16,34,.42);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:.2s;z-index:1000004}
.por-palette{position:fixed;top:11vh;left:50%;width:680px;margin-left:-340px;max-height:74vh;display:flex;flex-direction:column;background:#fff;border-radius:22px;box-shadow:0 40px 90px rgba(8,14,40,.35);opacity:0;visibility:hidden;transform:translateY(-8px) scale(.985);transition:.22s var(--por-ease);z-index:1000005;overflow:hidden;color:var(--por-navy)}
html.por-cherche .por-palette-voile,html.por-cherche .por-palette{opacity:1;visibility:visible;transform:none}
html.por-cherche .por-palette{transition-property:opacity,transform}
.por-p-champ{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid #eef1f6}
.por-p-champ > .por-ico{width:22px;height:22px;color:var(--por-bleu)}
.por-palette .por-p-champ input{flex:1;min-width:0;border:0!important;outline:0!important;box-shadow:none!important;background:none!important;font-size:18px;font-weight:600;color:var(--por-navy);padding:0 0 0 2px!important;margin:0;height:auto;-webkit-appearance:none;appearance:none;border-radius:0!important;text-indent:0!important}
.por-p-champ input::placeholder{color:#94a3b8}
.por-p-champ input::-webkit-search-cancel-button{-webkit-appearance:none;display:none}
.por-palette .por-p-fermer{font-size:12px;font-weight:700;color:var(--por-gris)}
.por-p-corps{overflow:auto;padding:8px 10px 12px;overscroll-behavior:contain}
.por-p-grp{margin:10px 10px 4px!important;padding:0!important;font-size:10.5px;font-weight:800;letter-spacing:.09em!important;text-transform:uppercase!important;color:var(--por-gris)}
.por-p-grp .por-p-eff{float:right;font-size:11.5px;font-weight:700;letter-spacing:0!important;text-transform:none!important;color:var(--por-bleu)}
.por-p-res{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:14px;cursor:pointer}
.por-p-res.por-sel{background:#f1f5ff}
.por-vig{flex:none;width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:#f3f6fb;color:var(--por-gris2);overflow:hidden}
.por-vig img{width:34px;height:34px;object-fit:contain;max-width:none}
.por-vig.por-theo{background:var(--por-navy);color:var(--por-j2)}
.por-vig.por-examen{background:#fff8e1;color:var(--por-ambre)}
.por-vig.por-obs{background:#eef3ff;color:var(--por-bleu)}
.por-vig .por-ico{width:19px;height:19px}
.por-p-res .por-p-tx{flex:1;min-width:0}
.por-p-res .por-p-tx b{display:block;font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--por-navy)}
.por-p-res .por-p-tx span{display:block;font-size:12.5px;font-weight:600;color:var(--por-gris);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.por-p-res mark{background:none;color:var(--por-bleu);padding:0}
.por-p-res .por-fleche{flex:none;width:18px;height:18px;color:#94a3b8;opacity:0}
.por-p-res.por-sel .por-fleche{opacity:1;color:var(--por-bleu)}
.por-p-res.por-p-pas .por-p-tx b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.3}
.por-vig.por-num-s{background:#eef3ff;color:var(--por-bleu);font-size:14px;font-weight:800}
.por-p-res.por-p-ici .por-p-tx span{color:var(--por-bleu);font-weight:800}
.por-p-sugg{display:flex;flex-wrap:wrap;gap:8px;padding:4px 10px 8px}
.por-palette .por-p-sugg button{font-size:13.5px;font-weight:700;padding:8px 13px;border-radius:99px;background:#f3f6fb;border:1px solid #e7ecf4;color:var(--por-navy)}
.por-palette .por-p-sugg button:hover{border-color:var(--por-bleu);color:var(--por-bleu);background:#fff}
.por-p-vide{padding:26px 16px;text-align:center;color:var(--por-gris);font-weight:600;font-size:14px}
.por-p-pied{display:flex;gap:16px;padding:10px 18px;border-top:1px solid #eef1f6;background:#fafbfd;font-size:12px;font-weight:600;color:var(--por-gris)}
.por-p-pied span{display:flex;align-items:center;gap:6px}
.por-tiroir{display:none}
html.por-verrou,html.por-verrou body{overflow:hidden}

/* ─── Dans le cours (ordinateur) : le bloc blanc du cours, ses pilules, le bouton de la barre du cours ─── */
body.por-cours .por-tag{display:none}
body.por-cours .por-voie.por-ici{background:#fff;color:var(--por-navy)!important;box-shadow:0 6px 16px rgba(0,0,0,.18);padding:0 8px 0 16px;gap:10px}
body.por-cours .por-voie.por-ici .por-anneau .por-ico{stroke:var(--por-ic);width:18px;height:18px}
body.por-cours .por-voie.por-ici .por-cercle{display:none!important}
body.por-cours .por-voie.por-ici .por-pilules{display:flex;align-items:center;gap:6px}
body.por-cours .por-voie.por-ici .por-pilules:not(:empty)::before{content:"";width:1px;height:20px;background:#dfe5ee;margin:0 4px 0 2px}
.por .por-pil{display:flex;align-items:center;gap:5px;height:34px;padding:0 10px 0 12px;border-radius:999px;background:#eef3ff;color:var(--por-bleu);font-size:14px;font-weight:800;white-space:nowrap;cursor:pointer;transition:background .15s}
.por .por-pil:hover,.por .por-pil[aria-expanded="true"]{background:#e0eaff}
.por-pil .por-ico{width:15px;height:15px;stroke-width:2.6;transition:transform .2s}
.por-pil[aria-expanded="true"] > .por-ico:last-child{transform:rotate(180deg)}
body.por-cours .por-res,body.por-cours .por-reu{display:none}
.por-cta-place .pc-tb-cta,.por-m-cours .pc-tb-cta{display:inline-flex!important;align-items:center;justify-content:center;gap:8px;margin:0!important;height:46px;padding:0 20px!important;border-radius:14px!important;font-family:var(--cel-police)!important;font-size:15px!important;font-weight:800!important;letter-spacing:0!important;text-transform:none!important;line-height:1!important;white-space:nowrap;color:var(--por-navy)!important;background:var(--por-jaune)!important;box-shadow:0 8px 20px var(--por-ombre-j),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 0 rgba(122,82,0,.16)!important;border:0!important;text-decoration:none!important;transform:none}
.por-cta-place .pc-tb-cta:hover{transform:translateY(-1px)}
.por-cta-place .pc-tb-cta.pc-tb-compte,.por-m-cours .pc-tb-cta.pc-tb-compte{color:var(--por-navy)!important;background:#fff!important;border:1.5px solid #dfe5ee!important;box-shadow:none!important}
.por-cta-place .pc-tb-cs,.por-m-cours .pc-tb-cl{display:none!important}
.por-cta-place .pc-tb-cl,.por-m-cours .pc-tb-cs{display:inline!important}
body.por-cours .por-cta-place{display:flex;align-items:center}
/* la barre du cours de cel-cours : masquée, ses panneaux s'ouvrent sous le bandeau (filet : html.por-secours) */
html:not(.por-secours) body.por-cours .po-cours .pc-topbar,html:not(.por-secours) body.por-cours .pc-topbar{position:fixed!important;top:var(--por-hd)!important;left:0!important;right:0!important;height:0!important;min-height:0!important;padding:0!important;margin:0!important;border:0!important;background:none!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;z-index:10001!important}
html:not(.por-secours) body.por-cours .pc-topbar-in{display:none!important}
html:not(.por-secours) body.por-cours .pc-topgap{display:none!important}
html:not(.por-secours) body.por-cours .pc-topbar .pc-tb-panel{top:10px!important}
html.por-secours body.por-cours .pc-topbar.fixe{top:var(--por-hd)!important}
.admin-bar.por-cours .pc-topbar{margin-top:32px!important}
.por-pct{font-size:13px;font-weight:800;color:var(--por-ambre);white-space:nowrap}
.por-pct:empty{display:none}
.por-etat{display:inline-flex;align-items:center;gap:4px;margin-left:8px;padding:3px 9px 3px 5px;border-radius:99px;font-size:12px;font-weight:800;line-height:1;background:#eef1f6;color:var(--por-gris2);white-space:nowrap}
.por-etat i{display:block;width:12px;height:12px;border-radius:50%;border:2px solid #aeb9cb;box-sizing:border-box}
.por-etat em{font-style:normal}
.por .por-pil .por-etat .por-ico,.por-bas .por-etat .por-ico{width:12px;height:12px;stroke:var(--por-navy);stroke-width:3.2}
.por-etat-ok{background:var(--por-jaune);color:var(--por-navy)}
@media (min-width:1024px){
  .por-fil{display:none!important}
  body.por-cours .por-voie.por-ici{margin-right:10px}
}
@media (min-width:1024px) and (max-width:1279px){.por-pil .por-etat em{display:none}.por-pil .por-etat{padding:3px;margin-left:6px}}

/* ─── « Réussir ton code » (ordinateur) ─── */
.por-lien.por-reu{position:static;color:var(--por-navy)!important}
.por-reu-pil{display:flex;align-items:center;gap:7px;height:44px;padding:0 12px 0 11px;border-radius:14px;background:linear-gradient(90deg,#fff8e1,#fffcf2);border:1px solid #ffe08a;transition:border-color .15s,box-shadow .15s}
.por-reu-t{font-size:15px;font-weight:800;color:var(--por-navy);white-space:nowrap}
.por-reu-pil .por-reu-ic{width:20px;height:20px;stroke:var(--por-ic);stroke-width:2.2}
.por-reu-pil .por-reu-fl{width:14px;height:14px;stroke:var(--por-ambre);stroke-width:2.6;transition:transform .2s}
.por-reu:hover .por-reu-pil,.por-reu:focus-within .por-reu-pil{border-color:var(--por-j3);box-shadow:0 6px 16px rgba(245,182,14,.2)}
.por-reu:hover .por-reu-fl,.por-reu:focus-within .por-reu-fl{transform:rotate(180deg)}
.por-reu-pan{position:absolute;top:calc(var(--por-hd) - 8px);right:-12px;width:880px;max-width:calc(100vw - 40px);padding:12px;background:#fff;border:1px solid var(--por-ligne);border-radius:22px;box-shadow:0 26px 60px rgba(8,14,40,.18);opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s var(--por-ease);color:var(--por-navy);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;white-space:normal;cursor:default;z-index:10002}
.por-reu-pan[data-n="2"]{width:600px;grid-template-columns:repeat(2,minmax(0,1fr))}
.por-reu-pan[data-n="1"]{width:320px;grid-template-columns:minmax(0,1fr)}
.por-reu:hover .por-reu-pan,.por-reu:focus-within .por-reu-pan{opacity:1;visibility:visible;transform:none}
.por-reu-carte{display:flex;flex-direction:column;align-items:flex-start;padding:16px;border-radius:16px;background:#f6f8fc;border:1px solid #edf0f6;color:var(--por-navy)!important;transition:background .15s,border-color .15s,box-shadow .15s}
.por-reu-tete{display:flex;align-items:center;gap:11px;margin:0 0 10px}
.por-reu-vig{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--por-navy);color:var(--por-j2)}
.por-reu-vig .por-ico{width:20px;height:20px;stroke-width:2.1}
.por-reu-tete b{font-size:16px;font-weight:800;line-height:1.2;color:var(--por-navy)}
.por-reu-tx{display:block;font-size:13.5px;font-weight:600;line-height:1.45;color:var(--por-gris2);margin:0 0 12px}
.por-reu-gar{display:inline-flex;align-items:center;gap:6px;padding:5px 11px 5px 8px;border-radius:99px;background:#fff4cc;color:var(--por-ambre);font-size:12.5px;font-weight:800;line-height:1.25;white-space:nowrap;margin:0 0 14px}
.por-reu-gar .por-ico{width:15px;height:15px;stroke-width:2.4}
.por-reu-carte[data-v="passer"] .por-reu-gar{background:#eaf1ff;color:var(--por-bleu)}
.por-reu-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;height:46px;margin-top:auto;padding:0 14px 0 16px;border-radius:13px;background:var(--por-navy);color:#fff;font-size:14.5px;font-weight:800;white-space:nowrap;box-shadow:0 8px 18px rgba(15,24,48,.18);transition:background .15s}
.por-reu-btn .por-ico{width:18px;height:18px;stroke-width:2.6}
@supports (grid-template-rows:subgrid){
  .por-reu-pan{grid-template-rows:repeat(4,auto);row-gap:0}
  .por-reu-pan .por-reu-carte{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:0;justify-items:start}
  .por-reu-pan .por-reu-tete,.por-reu-pan .por-reu-tx,.por-reu-pan .por-reu-gar{align-self:start}
  .por-reu-pan .por-reu-btn{align-self:end}
}
@media (hover:hover){
  .por-reu-carte:hover{background:#fff;border-color:#d7e2f5;box-shadow:0 12px 26px rgba(8,14,40,.08)}
  .por-reu-carte:hover .por-reu-btn{background:#1d2b4f}
}
.por-res-pro{display:flex;grid-column:1/-1;align-items:center;gap:10px;padding:9px 10px;border-radius:12px;color:var(--por-navy)}
.por-res-pro .por-ico{width:19px;height:19px;color:var(--por-gris2)}
.por-res-pro b{display:block;font-size:14px;font-weight:800}
.por-res-pro span span{display:block;font-size:12.5px;font-weight:600;color:var(--por-gris);margin-top:1px}
.por-res-pro:hover{background:#f3f6fb}
.por-res-pro:hover b{color:var(--por-bleu)}
/* « Connexion » partout ; entre 1024 et 1239 px hors cours, la barre est pleine : la porte passe en tête de Ressources. */
.por-res-cnx{display:none}
@media (min-width:1024px) and (max-width:1239px){
  .por[data-por-mode="site"] .por-droite > .por-connexion.por-cnx-visiteur{display:none}
  .por[data-por-mode="site"] .por-res-cnx{display:flex;grid-column:1/-1;align-items:center;gap:10px;padding:9px 10px;margin-bottom:4px;border-radius:12px;background:#eef4ff;color:var(--por-navy)}
  .por-res-cnx .por-ico{width:19px;height:19px;color:var(--por-bleu)}
  .por-res-cnx b{display:block;font-size:14px;font-weight:800}
  .por-res-cnx span span{display:block;font-size:12.5px;font-weight:600;color:var(--por-bleu)}
}
@media (min-width:1024px) and (max-width:1279px){
  .por-reu-pil{gap:6px;padding:0 12px 0 9px}
  .por-reu-t{display:grid;font-size:13.5px;line-height:1.1;text-align:left}
  .por-reu-pil .por-reu-fl{display:none}
}
@media (max-width:1180px) and (min-width:1024px){
  .por-in{gap:12px}
  .por .por-logo .cel-marque{width:40px;height:40px}
  .por .por-logo .cel-logo-1{font-size:22px}
  .por .por-logo .cel-logo-2{font-size:14px}
  .por-voie{padding:0 13px}
  .por-tag{padding:0 12px}
  .por-droite{gap:14px}
}

/* ─── Le téléphone et la tablette (moins de 1024 px) ─── */
@media (max-width:1023px){
  :root{--por-hd:65px}
  .por-in{padding:0 10px;gap:8px}
  .por-route,.por-droite,.por-pan,.por-res-pan{display:none}
  .por-m-cta{white-space:nowrap;display:flex;flex-direction:column;justify-content:center;margin-left:auto;height:46px;padding:0 14px 0 16px;border-radius:14px;color:var(--por-navy)!important;text-align:left;line-height:1.08;background:var(--por-jaune);box-shadow:0 6px 16px var(--por-ombre-j),inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 0 rgba(122,82,0,.16)}
  .por-m-cta[hidden]{display:none}
  .por-m-cta small{font-size:9px;font-weight:800;letter-spacing:.08em!important;text-transform:uppercase!important;opacity:.9}
  .por-m-cta b{display:flex;align-items:center;gap:5px;font-size:15.5px;font-weight:800}
  .por-m-cta .por-ico{width:15px;height:15px;stroke-width:2.8;transition:transform .25s}
  .por-m-cta[aria-expanded="true"] .por-ico{transform:rotate(180deg)}
  html.por-revient .por-m-cta#porMCta{display:none}
  .por-burger{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:#eef2f8!important;flex:none;color:var(--por-navy)}
  .por-burger .por-ico{width:22px;height:22px;stroke-width:2.4}
  .por-burger .por-bx{display:none}
  .por-burger[aria-expanded="true"] .por-bx{display:block}
  .por-burger[aria-expanded="true"] .por-b3{display:none}
  .por-voile{display:block;position:fixed;inset:0;background:rgba(10,16,34,.45);opacity:0;visibility:hidden;transition:.25s;z-index:1000002}
  .por-voile.por-ouvert{opacity:1;visibility:visible}
  .por-feuille{display:block;position:fixed;left:0;right:0;bottom:0;z-index:1000003;max-height:92vh;overflow:auto;overscroll-behavior:contain;background:#fff;border-radius:26px 26px 0 0;padding:10px 16px calc(22px + env(safe-area-inset-bottom));transform:translateY(105%);visibility:hidden;transition:transform .34s var(--por-ease),visibility .34s;box-shadow:0 -20px 50px rgba(8,14,40,.25);touch-action:pan-y;color:var(--por-navy)}
  .por-feuille.por-ouvert{transform:none;visibility:visible}
  .por-feuille.por-glisse{transition:none}
  .por-poignee{width:44px;height:5px;border-radius:5px;background:#dfe5ee;margin:0 auto 14px}
  .por-faux-champ{display:flex!important;align-items:center;gap:10px;width:100%;height:46px;padding:0 14px!important;margin:0 0 16px!important;border-radius:14px!important;background:#f3f6fb!important;border:1px solid #e7ecf4!important;color:#7b879b!important;font-size:15px!important;font-weight:600!important;text-align:left}
  .por-faux-champ .por-ico{width:19px;height:19px;color:var(--por-bleu)}
  .por-feuille-titre{font-family:var(--cel-titre)!important;font-weight:400;font-size:23px;line-height:1.12;margin:0 0 5px!important;padding:0!important;letter-spacing:-.01em!important;color:var(--por-navy)}
  .por-feuille-sous{font-size:14px;color:var(--por-gris);margin:0 0 16px!important;padding:0!important;font-weight:600;line-height:1.4}
  .por-chaussee{position:relative;border-radius:22px;background:var(--por-navy);padding:4px 14px;box-shadow:0 14px 30px rgba(15,24,48,.25)}
  .por-chaussee::before,.por-chaussee::after{content:"";position:absolute;top:16px;bottom:16px;width:3px;border-radius:3px;background:rgba(255,255,255,.45)}
  .por-chaussee::before{left:7px}
  .por-chaussee::after{right:7px}
  .por-m-voie{position:relative;display:flex;align-items:center;gap:14px;padding:15px 8px;color:#fff!important}
  .por-pic{position:relative;flex:none;width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:var(--por-jaune);box-shadow:0 6px 14px var(--por-ombre-j)}
  .por-pic .por-ico{width:22px;height:22px;stroke:var(--por-navy);stroke-width:2.2}
  .por-m-tx{flex:1;min-width:0}
  .por-m-tx b{display:block;font-size:17px;font-weight:800;color:#fff}
  .por-m-sous{display:block;font-size:13px;font-weight:600;color:rgba(255,255,255,.72);margin-top:2px}
  .por-m-sous.por-rep{color:var(--por-j1)}
  .por-m-voie .por-fl{width:22px;height:22px;stroke:rgba(255,255,255,.85);stroke-width:2.6}
  .por-mj{display:block;height:5px;border-radius:5px;background:rgba(255,255,255,.18);margin-top:8px;overflow:hidden}
  .por-mj i{display:block;height:100%;width:0;background:var(--por-jaune);transition:width .8s var(--por-ease)}
  .por-m-bientot{display:flex;align-items:center;gap:12px;margin:14px 0 0;padding:13px 14px;border-radius:16px;background:linear-gradient(90deg,#fff8e1,#fffcf2);border:1px solid #ffe08a;color:var(--por-navy)}
  .por-m-bientot .por-jj-ic{background:var(--por-jaune);color:var(--por-navy);border:0}
  .por-m-bientot .por-m-btx{flex:1;font-size:13.5px;line-height:1.4;color:var(--por-gris2);font-weight:600}
  .por-m-bientot .por-m-btx b{display:block;color:var(--por-navy);font-size:14.5px}
  .por-m-bientot .por-ico.por-fl{width:20px;height:20px;color:var(--por-ambre);stroke-width:2.6}
  .por-feuille-pied{text-align:center;margin:16px 0 0!important;padding:0!important;font-size:13px;font-weight:600;color:var(--por-gris)}
  /* CEL : les chapitres du cours dans la feuille (un seul cours : la feuille choisit le chapitre) */
  .por-feuille .por-t-lab{margin:18px 4px 8px}
  .por-f-chaps{background:#fff;border:1px solid var(--por-ligne);border-radius:18px;overflow:hidden}
  .por-f-chap{display:flex;align-items:center;gap:12px;min-height:52px;padding:8px 12px;border-top:1px solid #eef1f6;color:var(--por-navy)!important}
  .por-f-chap:first-child{border-top:0}
  .por-f-chap:active{background:#f6f8fc}
  .por-f-chap .por-num{width:32px;height:32px;border-radius:10px;background:var(--por-navy);color:#fff;font-size:13.5px}
  .por-f-chap.por-fini .por-num{background:var(--por-jaune);color:var(--por-navy)}
  .por-f-chap-t{flex:1;min-width:0;font-size:15px;font-weight:800;line-height:1.25}
  .por-f-chap-n{flex:none;padding:3px 8px;border-radius:99px;background:#eef1f6;color:var(--por-gris2);font-size:12px;font-weight:800;white-space:nowrap}
  .por-f-chap.por-ici-c{background:#fffbeb}
  .por-f-chap.por-ici-c .por-f-chap-n{background:var(--por-jaune);color:var(--por-navy)}
  /* le tiroir */
  .por-tiroir{display:block;position:fixed;top:var(--por-hd);left:0;right:0;bottom:0;overflow:auto;overscroll-behavior:contain;background:#f6f8fc;padding:14px 16px 40px;z-index:1000001;opacity:0;visibility:hidden;transform:translateY(-8px);transition:.22s var(--por-ease);color:var(--por-navy)}
  .admin-bar .por-tiroir{top:calc(var(--por-hd) + 46px)}
  .por-tiroir.active{opacity:1;visibility:visible;transform:none}
  .por-tiroir .por-faux-champ{margin:0!important;background:#fff!important}
  .por-t-lab{margin:16px 4px 8px!important;padding:0!important;font-size:11px;font-weight:800;letter-spacing:.09em!important;text-transform:uppercase!important;color:var(--por-bleu)}
  .por-t-cnx{margin:2px 2px 12px!important;padding:0!important;text-align:center;font-size:14.5px;font-weight:600;line-height:1.4;color:var(--por-gris2)}
  .por-tiroir .por-faux-champ + .por-t-cnx{margin-top:8px!important}
  .por-t-cnx a{display:inline-block;padding:8px 2px;font-weight:800;color:var(--por-bleu)!important;text-decoration:underline!important;text-underline-offset:3px;text-decoration-color:rgba(26,86,201,.35)!important}
  .por-chaussee.por-petite .por-m-voie{padding:11px 8px}
  .por-chaussee.por-petite .por-pic{width:40px;height:40px;border-radius:13px}
  .por-chaussee.por-petite .por-m-tx b{font-size:16px}
  .por-tiroir button.por-m-voie{width:100%;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .por-tiroir .por-m-voie .por-fl{transition:transform .22s var(--por-ease)}
  .por-tiroir .por-m-voie[aria-expanded="true"] .por-fl{transform:rotate(180deg)}
  .por-m-plus{display:grid;gap:8px;padding:0 8px 14px}
  .por-m-plus[hidden]{display:none}
  .por-tiroir .por-m-plus .por-btn{justify-content:center;width:100%;height:48px;padding:0 16px;border-radius:14px;font-size:15.5px}
  .por-m-sec{display:flex;align-items:center;justify-content:center;gap:9px;height:48px;padding:0 16px;border-radius:14px;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.4);color:#fff!important;font-size:15.5px;font-weight:800;white-space:nowrap}
  .por-m-sec .por-ico{width:20px;height:20px;stroke:var(--por-j1);stroke-width:2.2}
  .por-m-sec:active{background:rgba(255,255,255,.16)}
  .por-m-som{display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;font-size:14px;font-weight:700;color:rgba(255,255,255,.85)!important}
  .por-m-som .por-ico{width:15px;height:15px;stroke-width:2.6}
  .por-t-reu{margin:12px 0 0;border-radius:18px;background:linear-gradient(90deg,#fff8e1,#fffcf2);border:1px solid #ffe08a;color:var(--por-navy)}
  .por-t-reu > summary{display:flex;align-items:center;gap:12px;min-height:64px;padding:10px 14px 10px 12px;list-style:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .por-t-reu > summary::-webkit-details-marker{display:none}
  .por-t-reu > summary::marker{content:""}
  .por-reu-pic{position:relative;flex:none;width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:var(--por-jaune);box-shadow:0 6px 14px var(--por-ombre-j)}
  .por-reu-pic .por-ico{width:22px;height:22px;stroke:var(--por-navy);stroke-width:2.2}
  .por-reu-st{flex:1;min-width:0}
  .por-reu-st b{display:block;font-size:16px;font-weight:800;line-height:1.25;color:var(--por-navy)}
  .por-reu-st > span{display:block;font-size:12.5px;font-weight:600;line-height:1.35;color:var(--por-gris2);margin-top:2px}
  .por-t-reu > summary .por-reu-fl{flex:none;width:20px;height:20px;stroke:var(--por-ambre);stroke-width:2.6;transition:transform .22s var(--por-ease)}
  .por-t-reu[open] > summary .por-reu-fl{transform:rotate(180deg)}
  .por-t-reu-l{display:grid;gap:8px;padding:0 8px 8px}
  .por-t-reu .por-reu-carte{padding:14px;background:#fff;border-color:#f3e6bf}
  .por-t-reu .por-reu-tete{margin-bottom:8px}
  .por-t-reu .por-reu-vig{width:36px;height:36px;border-radius:11px}
  .por-t-reu .por-reu-vig .por-ico{width:19px;height:19px}
  .por-t-reu .por-reu-tx{margin-bottom:10px}
  .por-t-reu .por-reu-gar{margin-bottom:12px}
  .por-t-reu .por-reu-btn{height:46px}
  .por-t-liste{background:#fff;border:1px solid var(--por-ligne);border-radius:16px;overflow:hidden}
  .por-t-liste a{display:block;padding:12px 14px;border-top:1px solid #eef1f6}
  .por-t-liste a:first-child{border-top:0}
  .por-t-liste b{display:block;font-size:15px;font-weight:800;color:var(--por-navy)}
  .por-t-res{display:grid;grid-template-columns:1fr 1fr}
  .por-t-res a{border-top:1px solid #eef1f6}
  .por-t-res a:nth-child(-n+2){border-top:0}
  .por-t-res a:nth-child(odd){border-right:1px solid #eef1f6}
  .por-t-res b{font-size:14px;font-weight:700}
  .por-t-pro{margin:16px 0 0}
  .por-t-pro summary{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;background:#fff;border:1px solid var(--por-ligne);font-size:15px;font-weight:800;list-style:none;cursor:pointer}
  .por-t-pro summary::-webkit-details-marker{display:none}
  .por-t-pro summary::marker{content:""}
  .por-t-pro summary .por-ico{width:19px;height:19px}
  .por-t-pro summary .por-ico:last-child{margin-left:auto;width:16px;height:16px;transition:transform .2s}
  .por-t-pro[open] summary .por-ico:last-child{transform:rotate(180deg)}
  .por-t-pro .por-t-liste{margin-top:8px}
  /* la recherche, plein écran */
  .por-palette{top:0;left:0;right:0;bottom:0;width:auto;margin:0;max-height:none;border-radius:0}
  .por-p-champ{padding:12px 14px;padding-top:calc(12px + env(safe-area-inset-top))}
  .por-palette .por-p-champ input{font-size:17px}
  .por-p-pied{display:none}
  /* dans le cours : le bouton de la barre du cours dans le bandeau */
  body.por-cours .por-m-cta{display:none!important}
  body.por-cours .por-m-cours{display:flex;align-items:center;gap:6px;margin-left:auto;min-width:0}
  .por-m-cours .por-pil{height:44px;padding:0 10px 0 11px;border-radius:14px;background:#fff;border:1.5px solid #dfe5ee;color:var(--por-navy);font-size:14px}
  .por-m-cours .por-pil .por-ico{stroke:var(--por-bleu)}
  .por-m-cours .pc-tb-cta{height:44px;padding:0 13px!important;font-size:14px!important}
  .por-m-cours .pc-tb-compte .pc-tb-cl{display:inline!important}
  .por-m-cours .pc-tb-compte .pc-tb-cs{display:none!important}
  .por-fil em{display:none}
  .por-reu{display:none}
}
/* Une seule mesure commande la ligne du téléphone (--por-h) : logo, bouton et bouton du menu ont la même hauteur. */
@media (max-width:1023px){
  .por-in{--por-h:clamp(34px,calc((100vw - 40px)/8.25),46px);gap:10px}
  .por .por-logo{padding:2px 0;gap:calc(var(--por-h)*.2)}
  .por .por-logo .cel-marque{width:calc(var(--por-h)*.92);height:calc(var(--por-h)*.92)}
  .por .por-logo .cel-logo-1{font-size:calc(var(--por-h)*.48)}
  .por .por-logo .cel-logo-2{font-size:calc(var(--por-h)*.31)}
  .por-m-cta{height:var(--por-h);padding:0 calc(var(--por-h)*.26);border-radius:calc(var(--por-h)*.28)}
  .por-m-cta b{font-size:calc(var(--por-h)*.34);gap:calc(var(--por-h)*.1)}
  .por-m-cta small{font-size:calc(var(--por-h)*.2)}
  .por-m-cta .por-ico{width:calc(var(--por-h)*.3);height:calc(var(--por-h)*.3)}
  .por-burger{width:var(--por-h);height:var(--por-h);border-radius:calc(var(--por-h)*.29)}
  .por-burger .por-ico{width:calc(var(--por-h)*.48);height:calc(var(--por-h)*.48)}
  body.por-cours .por-m-cours{gap:6px}
  .por-m-cours .por-pil{height:var(--por-h);padding:0 calc(var(--por-h)*.22);gap:calc(var(--por-h)*.1);font-size:calc(var(--por-h)*.33);border-radius:calc(var(--por-h)*.3)}
  .por-m-cours .por-pil .por-ico{width:calc(var(--por-h)*.36);height:calc(var(--por-h)*.36)}
  .por-m-cours .pc-tb-cta{height:var(--por-h)!important;padding:0 calc(var(--por-h)*.26)!important;font-size:calc(var(--por-h)*.33)!important;border-radius:calc(var(--por-h)*.28)!important}
}
.por-pl-court{display:none}
html.por-serre1 .por-m-cours .por-pl-long{display:none}
html.por-serre1 .por-m-cours .por-pl-court{display:inline}
html.por-serre2 .por-m-cours .por-pil span{display:none}
html.por-serre2 .por-m-cours .por-pil{padding:0 calc(var(--por-h)*.2)}
html.por-serre3 .por-in{gap:6px}
html.por-serre3 .por-m-cours .pc-tb-cta,html.por-serre3 .por-m-cta{padding:0 calc(var(--por-h)*.18)!important}
html.por-serre3 .por-m-cours .pc-tb-cta{font-size:calc(var(--por-h)*.29)!important}
html.por-serre3 .por-m-cta b{font-size:calc(var(--por-h)*.3)}
/* CEL : dernier palier, le losange seul (comme la pastille du .be sous 345 px) */
html.por-serre3 .por .por-logo .cel-logo-mots{display:none}
@media (prefers-reduced-motion:reduce){.por *,.por *::before,.por *::after,.por-pan,.por-pan *,.por-feuille,.por-feuille *,.por-tiroir,.por-palette{animation:none!important;transition:none!important}}

/* ─── Le sommaire du cours (ordinateur : sous la pilule ; téléphone : feuille ouverte par la barre du bas) ─── */
.por-som{position:fixed;top:calc(var(--por-hd) + 10px);left:50%;width:880px;margin-left:-440px;max-height:calc(100vh - var(--por-hd) - 30px);display:flex;flex-direction:column;background:#fff;border-radius:24px;border:1px solid var(--por-ligne);box-shadow:0 34px 80px rgba(8,14,40,.22);opacity:0;visibility:hidden;transform:translateY(10px) scale(.985);transform-origin:50% 0;transition:opacity .2s,transform .26s var(--por-ease),visibility .2s;z-index:1000003;overflow:hidden;color:var(--por-navy);font-family:var(--cel-police)}
.por-som *{box-sizing:border-box;font-family:inherit;letter-spacing:0;text-transform:none}
.por-som a{text-decoration:none!important;color:inherit}
.por-som button{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;box-shadow:none;min-height:0}
.por-som.por-ouvert{opacity:1;visibility:visible;transform:none}
.por-som .por-poignee{display:none}
.por-som-tete{display:flex;align-items:center;gap:16px;padding:14px 20px 12px;border-bottom:1px solid #eef1f6;flex:none}
/* CEL : un seul cours, son nom à la place des onglets des trois cours du .be */
.por-som-nom{display:flex;align-items:center;gap:9px;flex:none;height:40px;padding:0 16px 0 12px;border-radius:999px;background:var(--por-navy);color:#fff;font-size:14px;font-weight:800;white-space:nowrap}
.por-som-nom .por-ico{width:17px;height:17px;stroke:var(--por-j2)}
.por-som-etat{margin:0!important;padding:0!important;font-size:13px;font-weight:700;color:var(--por-gris);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.por-som-etat b{color:var(--por-ambre)}
.por-som-hub{font-size:13.5px;font-weight:800;color:var(--por-bleu)!important;white-space:nowrap}
.por-som-hub:hover{text-decoration:underline!important}
.por-som-ligne{display:contents}
.por-som-corps{display:grid;grid-template-columns:310px 1fr;min-height:0;flex:1}
.por-som-chaps{position:relative;overflow:auto;padding:10px;border-right:1px solid #eef1f6;max-height:460px;overscroll-behavior:contain}
.por-som .por-som-chap{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border-radius:12px;text-align:left;transition:background .12s}
.por-som .por-som-chap:hover{background:#f6f8fc}
.por-som .por-som-chap.por-on{background:#eef3ff}
.por-num{flex:none;width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font-size:12.5px;font-weight:800;background:#f1f4f9;color:var(--por-gris2)}
.por-som-chap.por-on .por-num{background:var(--por-bleu);color:#fff}
.por-som-chap.por-fini .por-num{background:var(--por-jaune);color:var(--por-navy)}
.por-som-ctit{flex:1;min-width:0;font-size:13.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.por-som-cn{flex:none;font-size:12px;font-weight:700;color:var(--por-gris)}
.por-som-lecs{overflow:auto;padding:12px 14px;max-height:460px;overscroll-behavior:contain}
.por-som-ct{margin:2px 8px 10px!important;padding:0!important;font-size:15px;font-weight:800;line-height:1.3;color:var(--por-navy)}
.por-som-ct span{display:block;font-size:10.5px;font-weight:800;letter-spacing:.09em!important;text-transform:uppercase!important;color:var(--por-gris);margin-bottom:2px}
.por-som-lec{display:flex;align-items:center;gap:12px;padding:10px;border-radius:13px;transition:background .12s}
.por-som-lec:hover{background:#f6f8fc}
.por-st{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;border:2px solid #dbe2ec;color:var(--por-navy)}
.por-st .por-ico{width:14px;height:14px;stroke-width:3}
.por-som-lec.por-fait .por-st{background:var(--por-jaune);border:0}
.por-som-lec.por-ici-l{background:#eef3ff}
.por-som-lec.por-ici-l .por-st{border-color:var(--por-bleu);background:#fff}
.por-som-lec.por-ici-l .por-st::after{content:'';width:10px;height:10px;border-radius:50%;background:var(--por-bleu)}
.por-som-t{flex:1;min-width:0}
.por-som-t b{display:block;font-size:14px;font-weight:700;line-height:1.3;color:var(--por-navy)}
.por-som-t span{display:block;font-size:12px;font-weight:600;color:var(--por-gris);margin-top:1px}
.por-som-lec.por-ici-l .por-som-t span{color:var(--por-bleu);font-weight:800}
.por-som-d{flex:none;font-size:12px;font-weight:700;color:var(--por-gris)}
.por-som-pied{display:none}
@media (max-width:1023px){
  .por-som{top:auto;bottom:0;left:0;right:0;width:auto;margin:0;max-height:88vh;border-radius:26px 26px 0 0;border:0;transform:translateY(105%);transition:transform .34s var(--por-ease),visibility .34s,opacity .2s;box-shadow:0 -20px 50px rgba(8,14,40,.25);padding-bottom:env(safe-area-inset-bottom)}
  .por-som.por-ouvert{transform:none}
  .por-som .por-poignee{display:block;width:44px;height:5px;border-radius:5px;background:#dfe5ee;margin:10px auto 12px;flex:none}
  .por-som-tete{flex-direction:column;align-items:stretch;gap:8px;padding:0 16px 10px;border-bottom:1px solid #eef1f6}
  .por-som-nom{align-self:flex-start}
  .por-som-ligne{display:flex;align-items:center;justify-content:space-between;gap:12px}
  .por-som-ligne .por-som-etat{flex:1;min-width:0;white-space:normal;padding:0 2px!important}
  .por-som .por-som-ligne .por-som-hub-h{display:inline;flex:none;font-size:13px}
  .por-som-corps{display:flex;flex-direction:column;position:relative;min-height:0;flex:1;overflow:hidden}
  .por-som-lecs{display:none}
  .por-som-chaps{display:block;flex:1;min-height:0;max-height:none;overflow-y:auto;padding:10px 12px 26px;border:0;-webkit-overflow-scrolling:touch}
  .por-som-corps::after{content:"";position:absolute;left:0;right:0;bottom:0;height:26px;background:linear-gradient(rgba(255,255,255,0),#fff);pointer-events:none}
  .por-acc{border:1px solid transparent;border-radius:18px;transition:background .2s,border-color .2s}
  .por-acc + .por-acc{margin-top:4px}
  .por-acc.por-open{background:#f4f7fc;border-color:#e2e8f3}
  .por-som .por-som-chap{display:flex;width:100%;min-height:60px;padding:10px 12px;gap:12px;border-radius:14px;text-align:left}
  .por-som .por-som-chap:hover{background:none}
  .por-som-chap .por-num{width:38px;height:38px;border-radius:12px;font-size:15px;background:var(--por-navy);color:#fff}
  .por-acc.por-open .por-som-chap .por-num{background:var(--por-bleu);color:#fff}
  .por-acc.por-open .por-som-chap.por-fini .por-num,.por-som-chap.por-fini .por-num{background:var(--por-jaune);color:var(--por-navy)}
  .por-som-cw{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
  .por-som-cw small{display:block;font-size:10.5px;font-weight:800;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;color:var(--por-gris)}
  .por-acc.por-open .por-som-cw small{color:var(--por-bleu)}
  .por-som-cw .por-som-ctit{font-size:15.5px;font-weight:800;line-height:1.25;white-space:normal}
  .por-som .por-som-cn{flex:none;padding:3px 8px;border-radius:99px;background:#eef1f6;color:var(--por-gris2);font-size:12px;font-weight:800}
  .por-acc.por-open .por-som-cn{background:#fff}
  .por-acc-fl{flex:none;width:18px;height:18px;stroke:var(--por-gris);stroke-width:2.6;transition:transform .2s}
  .por-acc.por-open .por-acc-fl{transform:rotate(180deg);stroke:var(--por-bleu)}
  .por-acc-l{position:relative;padding:0 10px 12px 40px}
  .por-acc-l .por-som-lec{position:relative;margin-top:8px;padding:11px 12px;border-radius:14px;background:#fff;border:1px solid #e6ebf3;box-shadow:0 1px 2px rgba(15,23,42,.04)}
  .por-acc-l .por-som-lec::before,.por-acc-l .por-som-lec::after{content:"";position:absolute;left:-10px;width:2px;background:#cdd8e8;z-index:0}
  .por-acc-l .por-som-lec::before{top:-10px;height:calc(50% + 10px)}
  .por-acc-l .por-som-lec:first-child::before{top:-21px;height:calc(50% + 21px)}
  .por-acc-l .por-som-lec::after{top:50%;bottom:-1px}
  .por-acc-l .por-som-lec:last-child::after{display:none}
  .por-acc-l .por-som-lec .por-st{position:absolute;left:-19px;top:50%;margin-top:-10px;width:20px;height:20px;box-sizing:border-box;border:2px solid #c3cfe0;background:#fff;z-index:1}
  .por-acc-l .por-som-lec .por-st .por-ico{width:11px;height:11px}
  .por-acc-l .por-som-lec.por-fait .por-st{border:0;background:var(--por-jaune)}
  .por-acc-l .por-som-lec.por-ici-l{background:#eef3ff;border-color:#cfe0ff}
  .por-acc-l .por-som-lec.por-ici-l .por-st{border-color:var(--por-bleu);background:#fff}
  .por-acc-l .por-som-lec.por-ici-l .por-st::after{width:8px;height:8px}
  .por-acc-l .por-som-t b{font-size:14px}
  .por-som-pied{display:flex;justify-content:space-between;align-items:center;padding:10px 16px 14px;border-top:1px solid #eef1f6;flex:none}
  .por-som-pied .por-som-hub{display:none}
  .por-som .por-som-x{margin-left:auto;font-size:13.5px;font-weight:800;color:var(--por-gris)}
}
@media (min-width:1024px){.por-som .por-som-hub-h{display:inline}}
@media (prefers-reduced-motion:reduce){.por-som,.por-som *{transition:none!important;animation:none!important}}

/* ─── La barre du bas (téléphone) : leçons, sommaire du cours, articles ─── */
.por-bas{display:none}
@media (max-width:1023px){
  .por-pct{display:none}
  html.por-bas-on .por-bas{display:flex;align-items:center;gap:2px;position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:9990;height:54px;min-height:0;margin:0;padding:0 5px 0 6px;border:1px solid rgba(255,255,255,.7);border-radius:27px;background:linear-gradient(180deg,rgba(255,255,255,.62),rgba(255,255,255,.38));-webkit-backdrop-filter:blur(18px) saturate(190%);backdrop-filter:blur(18px) saturate(190%);color:var(--por-navy);box-shadow:0 12px 32px rgba(15,23,42,.2),0 2px 6px rgba(15,23,42,.08),inset 0 1px 1px rgba(255,255,255,.95),inset 0 -1px 1px rgba(255,255,255,.35);isolation:isolate;overflow:hidden;text-align:left;cursor:default;font-family:var(--cel-police);-webkit-tap-highlight-color:transparent;letter-spacing:0;text-transform:none}
  html.por-bas-on .por-bas::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;background:radial-gradient(120% 90% at 18% -30%,rgba(255,255,255,.75),rgba(255,255,255,0) 55%),radial-gradient(80% 120% at 100% 130%,rgba(255,255,255,.35),rgba(255,255,255,0) 60%)}
  .por-bas *{box-sizing:border-box}
  .por-bas-ouvrir{flex:1;min-width:0;display:flex;align-items:center;gap:8px;height:44px;margin:0;padding:0 4px 0 8px;border:0;border-radius:22px;background:none;box-shadow:none;color:var(--por-navy);text-align:left;cursor:pointer;font:inherit;-webkit-tap-highlight-color:transparent}
  .por-bas-ouvrir:active,.por-bas-cherche:active{background:rgba(255,255,255,.55)}
  .por-bas-ic{flex:none;display:grid;place-items:center}
  .por-bas-ic .por-ico{width:21px;height:21px;stroke:var(--por-navy);stroke-width:2.3}
  .por-bas-tx{flex:0 1 auto;min-width:0;display:flex;flex-direction:column;gap:0}
  .por-bas-tx small{display:block;font-size:11px;font-weight:700;line-height:1.15;color:#5b6478;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .por-bas-tx b{display:flex;align-items:center;gap:6px;min-width:0;font-size:15px;font-weight:800;line-height:1.15;color:var(--por-navy)}
  .por-bas-tx b > span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .por-bas-fl{flex:none;width:13px;height:13px;stroke:#7a8294;stroke-width:2.8;margin-left:2px}
  .por-bas .por-etat{flex:none;background:rgba(15,24,48,.08);color:var(--por-navy)}
  .por-bas .por-etat i{border-color:rgba(15,24,48,.35)}
  .por-bas .por-etat-ok{background:var(--por-jaune);color:var(--por-navy)}
  .por-bas-cherche{flex:none;display:grid;place-items:center;width:40px;height:44px;margin:0;padding:0;border:0;border-radius:22px;background:none;box-shadow:none;color:var(--por-navy);cursor:pointer;-webkit-tap-highlight-color:transparent}
  .por-bas-cherche .por-ico{width:21px;height:21px;stroke:var(--por-navy);stroke-width:2.3}
  .por-bas-suiv{flex:none;display:flex;align-items:center;justify-content:center;gap:5px;height:44px;padding:0 12px 0 14px;border-radius:22px;background:var(--por-jaune);color:var(--por-navy)!important;font-size:14px;font-weight:800;white-space:nowrap;text-decoration:none!important;box-shadow:0 4px 12px var(--por-ombre-j),inset 0 1px 0 rgba(255,255,255,.45)}
  .por-bas-suiv:active{transform:scale(.97)}
  .por-bas-suiv .por-ico{width:17px;height:17px;stroke:var(--por-navy);stroke-width:2.8}
  .por-bas-suiv-l{display:none}
  .por-bas-s1 .por-bas-fl{display:none}
  .por-bas-s2 .por-bas-suiv{width:44px;padding:0}
  .por-bas-s2 .por-bas-suiv-c,.por-bas-s2 .por-bas-suiv-l{display:none!important}
  html.por-bas-on body{padding-bottom:calc(78px + env(safe-area-inset-bottom))!important}
  /* le tchat (cel-tchat) : son bouton aux visages de l'équipe dans la barre, la bulle flottante s'efface */
  .por-bas-tchat{position:relative;flex:none;display:flex;align-items:center;height:44px;margin:0;padding:0 5px;border:0;border-radius:22px;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .por-bas-tchat:active{background:rgba(255,255,255,.55)}
  .por-bas-tchat img{display:block;width:25px;height:25px;max-width:none;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.95);margin-left:-10px;box-shadow:0 1px 3px rgba(15,23,42,.18)}
  .por-bas-tchat img:first-child{margin-left:0}
  .por-bas-tchat .por-ico{width:22px;height:22px;stroke:var(--por-navy);stroke-width:2.2}
  .por-bas-bdg{position:absolute;top:3px;right:1px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#ef4444;color:#fff;font-size:11px;font-weight:800;line-height:14px;display:grid;place-items:center;border:2px solid #fff;box-shadow:0 2px 6px rgba(239,68,68,.45)}
  .por-bas-bdg[hidden]{display:none}
  html.por-bas-on #ld-chat-root #ld-bubble{display:none!important}
  html.por-tchat-ouvert .por-bas{display:none!important}
}
.por-visages-tch{position:absolute;right:-1px;bottom:4px;width:17px;height:17px;border-radius:50%;display:grid;place-items:center;background:var(--por-bleu);border:2px solid #fff;box-shadow:0 2px 5px rgba(8,14,40,.35);pointer-events:none}
.por-visages-tch.por-en-ligne{background:#16a34a}
.por-visages-tch svg{display:block;width:9px;height:9px;fill:#fff;stroke:none}
@media (max-width:389px){.por-bas-tchat img{width:23px;height:23px}}
/* un menu ouvert fait taire le tchat (le .be, et la classe cel-verrou que cel-tchat écoute) */
html.por-verrou #ld-chat-root,html.por-menu-ouvert #ld-chat-root{visibility:hidden!important;pointer-events:none!important}
.por-palette .por-p-tchat{display:flex;align-items:center;gap:12px;width:calc(100% - 20px);margin:14px 10px 6px;padding:12px 14px;border-radius:16px;background:#f1f6ff;border:1px solid #dbe7ff;text-align:left;color:var(--por-navy)}
.por-p-tchat .por-ico{flex:none;width:24px;height:24px;stroke:var(--por-bleu)}
.por-p-tchat b{display:block;font-size:14.5px;font-weight:800}
.por-p-tchat span span{display:block;font-size:12.5px;font-weight:600;color:var(--por-gris);margin-top:1px}
.por-som-tchat{display:none}
@media (max-width:1023px){
  html.por-tchat-pret .por-som .por-som-tchat{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px;border-radius:12px;background:#f1f6ff;border:1px solid #dbe7ff;font-size:13.5px;font-weight:800;color:var(--por-navy)}
  .por-som-tchat .por-ico{width:18px;height:18px;stroke:var(--por-bleu)}
}
@media (max-width:479px){.por-avec-suiv .por-etat em{display:none}.por-avec-suiv .por-etat{padding:3px;margin-left:6px}}
@media (max-width:389px){html.por-bas-on .por-bas{left:8px;right:8px;padding:0 4px}.por-bas-ouvrir{gap:6px;padding:0 2px 0 6px}.por-bas-cherche{width:36px}.por-bas-suiv{padding:0 10px 0 12px;font-size:13px;gap:4px}.por-bas-s2 .por-bas-suiv{width:42px}}
@media (max-width:359px){.por-bas-tx b{font-size:14px}}
@media (max-width:339px){.por-bas .por-etat em{display:none}.por-bas .por-etat{padding:3px}}
@media (min-width:560px) and (max-width:1023px){.por-bas-suiv-l{display:inline}.por-bas-suiv-c{display:none}}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){@media (max-width:1023px){html.por-bas-on .por-bas{background:rgba(255,255,255,.97)}}}
/* Firefox sur Android (constat du .be, 08/10/2026) : env(safe-area-inset-bottom) y vaut la barre de navigation tant que
   la barre d'adresse est affichée ; la barre du bas flottait trop haut puis sautait. Sur Firefox seulement, pas d'env(). */
@supports (-moz-appearance:none){@media (max-width:1023px){html.por-bas-on .por-bas{bottom:12px!important}}}

/* Les passages de la leçon et les intertitres des articles : la cible d'une recherche ne passe jamais sous le bandeau. */
html .pc-body h2[id^="s-"],html #quiz,html #por-quiz,html #por-panneaux,html.por-art-on main h2[id]{scroll-margin-top:calc(var(--por-hd) + 18px)}
@keyframes por-cible{0%,35%{background-color:#fff4cc;box-shadow:0 0 0 10px #fff4cc}100%{background-color:rgba(255,244,204,0);box-shadow:0 0 0 10px rgba(255,244,204,0)}}
.por-cible{animation:por-cible 1.8s ease-out;border-radius:6px}
@media (prefers-reduced-motion:reduce){.por-cible{animation:none}}

/* ─── La barre du bas des articles, sur téléphone (le .be l'a sur ses articles RankPress) ─── */
.por-bas-suiv-x{display:none}
@media (max-width:767px){
  .por-bas-art.por-bas-s1 .por-bas-suiv .por-ico{display:none}
  .por-bas-art.por-bas-s1 .por-bas-suiv{padding:0 12px}
  .por-bas-art.por-bas-s2 .por-bas-suiv{width:auto;padding:0 14px}
  .por-bas-art.por-bas-s2 .por-bas-suiv-x{display:inline!important}
  .por-som-art .por-som-tete{padding:0 18px 12px}
  .por-art-tt{margin:0!important;padding:0!important}
  .por-art-tt b{display:block;font-size:17px;font-weight:800;line-height:1.25;color:var(--por-navy)}
  .por-art-tt span{display:block;margin-top:2px;font-size:12.5px;font-weight:700;color:var(--por-gris)}
  .por-som-art .por-som-chaps{padding:8px 10px 26px}
  .por-som-art .por-art-p{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:9px 10px;border-radius:14px;text-align:left}
  .por-som-art .por-art-p + .por-art-p{margin-top:2px}
  .por-som-art .por-art-p .por-num{width:30px;height:30px;border-radius:10px;font-size:13px}
  .por-art-pt{flex:1;min-width:0}
  .por-art-pt b{display:block;font-size:14.5px;font-weight:700;line-height:1.3;color:var(--por-navy)}
  .por-art-pt small{display:block;margin-top:2px;font-size:12px;font-weight:800;line-height:1.2;color:var(--por-bleu)}
  .por-art-pt small:empty{display:none}
  .por-som-art .por-art-p.por-ici-l{background:#eef3ff}
  .por-som-art .por-art-p.por-ici-l .por-num{background:var(--por-bleu);color:#fff}
  .por-som-art .por-art-p.por-ici-l .por-art-pt b{font-weight:800}
  .por-som-art .por-art-p.por-lu .por-num{background:#e8eefb;color:var(--por-bleu)}
  .por-som-art .por-art-p.por-lu .por-art-pt b{color:var(--por-gris2)}
  .por-art-grp{margin:16px 8px 8px!important;padding:0!important;font-size:11px;font-weight:800;letter-spacing:.08em!important;text-transform:uppercase!important;color:var(--por-gris)}
  .por-som .por-art-carte{display:flex;align-items:center;gap:12px;margin:0 2px 8px;padding:12px;border-radius:16px;border:1px solid #e6ebf3;background:#fff;color:var(--por-navy)}
  .por-art-vig{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#eef3ff}
  .por-art-vig .por-ico{width:21px;height:21px;stroke:var(--por-bleu);stroke-width:2.2}
  .por-som .por-art-carte.por-art-offre{background:linear-gradient(90deg,#fff8e1,#fffcf2);border-color:#ffe08a}
  .por-art-offre .por-art-vig{background:var(--por-jaune);box-shadow:0 6px 14px var(--por-ombre-j)}
  .por-art-offre .por-art-vig .por-ico{stroke:var(--por-navy)}
  .por-art-t{flex:1;min-width:0}
  .por-art-t b{display:block;font-size:14.5px;font-weight:800;line-height:1.25;color:var(--por-navy)}
  .por-art-t span{display:block;margin-top:2px;font-size:12.5px;font-weight:600;line-height:1.35;color:var(--por-gris2)}
  .por-art-carte .por-fleche{flex:none;width:18px;height:18px;stroke:var(--por-gris);stroke-width:2.4}
}

/* ─── Le bandeau des pages de vente (aucune tant que tout est gratuit) ─── */
.por.por-vente .por-in{justify-content:space-between}
.por-v-droite{display:flex;align-items:center;gap:22px;margin-left:auto;flex:none}
.por-v-cta{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 18px 0 22px;border-radius:14px;background:var(--por-jaune);color:var(--por-navy)!important;font-size:15px;font-weight:800;white-space:nowrap;text-decoration:none!important;box-shadow:0 6px 16px var(--por-ombre-j),inset 0 1px 0 rgba(255,255,255,.45)}
.por-v-cta .por-ico{width:18px;height:18px;stroke:var(--por-navy);stroke-width:2.6}
body.por-vente-page #offre{scroll-margin-top:calc(var(--por-hd) + 8px)}
@media (max-width:1023px){.por-v-droite{gap:14px}.por-v-cta{height:44px;padding:0 13px 0 16px;font-size:14.5px}}

@media print {
  .por, .por-spacer, .por-bas, .por-pan, .por-feuille, .por-tiroir, .por-palette, .por-palette-voile, .por-som, .por-voile, .cel-evitement { display: none !important; }
}