/* « Le problème » (proposition du 4/11/2026, v3 : mise en forme de la v1, réglages de la v2) : le compte des heures vides, avec les chiffres du visiteur.
   Construction de « L'heure libérée » : titre en haut à gauche, console à barre, scène sur fine grille. */
.pb2 .pb-console{margin-top:56px}
.pb-alerte{display:inline-flex;align-items:center;gap:8px;padding:5px 12px 5px 10px;border-radius:99px;background:var(--status-dangerSoft);color:var(--status-danger);font:600 13px Lexend;white-space:nowrap}
.pb-alerte i{width:8px;height:8px;border-radius:50%;background:currentColor}
.pb-console .console-titre{margin-right:auto}

.pb-scene{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:40px;align-items:center;padding:44px 40px 36px;
 background-image:linear-gradient(var(--border-subtle) 1px,transparent 1px),linear-gradient(90deg,var(--border-subtle) 1px,transparent 1px);background-size:32px 32px;background-position:-1px -1px;position:relative}
.pb-scene::after{content:"";position:absolute;inset:0;background:radial-gradient(70% 80% at 50% 50%,rgb(255 255 255 / .55),#fff 85%);pointer-events:none}
.pb-scene>*{position:relative;z-index:1}

/* Réglages */
.pb-reglages{display:grid;gap:14px}
.pb-reglage{display:grid;gap:10px;padding:18px 20px;border-radius:20px;background:#fff;border:1px solid var(--border-subtle);box-shadow:0 10px 24px -20px rgb(23 43 70 / .35)}
.pb-reglage-tete{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font:600 15px Lexend}
.pb-reglage output{flex:none;font:800 26px Lexend;color:var(--brand-primary);font-variant-numeric:tabular-nums}
.pb-reglage small{font-size:13px;color:var(--text-secondary);line-height:1.4}
.pb-reglage input{--p:16%;-webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:9px;margin:4px 0;cursor:pointer;
 background:linear-gradient(90deg,var(--brand-primary) var(--p),var(--brand-primarySoft) var(--p))}
.pb-reglage input::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;border:3px solid var(--brand-primary);box-shadow:3px 3px 0 var(--brand-accent);transition:transform .2s var(--ressort)}
.pb-reglage input::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--brand-primary);box-shadow:3px 3px 0 var(--brand-accent)}
.pb-reglage input:active::-webkit-slider-thumb{transform:scale(1.15)}
.pb-reglage input:focus-visible{outline:3px solid var(--brand-accent);outline-offset:6px}
.pb-jours{border:1px solid var(--border-subtle)}
.pb-jours legend{float:left;width:100%;margin-bottom:10px}
.pb-jours legend+*{clear:both}
.pb-pilules{display:flex;gap:6px;padding:4px;border-radius:99px;background:var(--surface-page)}
.pb-pilules label{flex:1;position:relative}
.pb-pilules input{position:absolute;opacity:0}
.pb-pilules span{display:block;padding:9px 0;border-radius:99px;text-align:center;font:600 14px Lexend;cursor:pointer;transition:background .25s,color .25s}
.pb-pilules input:checked+span{background:var(--brand-primary);color:#fff;box-shadow:3px 3px 0 var(--brand-accent)}
.pb-pilules input:focus-visible+span{outline:3px solid var(--brand-accent);outline-offset:2px}


.pb-hypothese{margin:-14px 40px 22px;font-size:13px;color:var(--text-secondary)}

/* L'année : une colonne par semaine, une case par heure vide */
.pb-annee{margin:0;padding:22px 22px 14px;border-radius:24px;background:#fff;border:1px solid var(--border-subtle);box-shadow:0 30px 60px -44px rgb(23 43 70 / .45)}
.pb-grille{display:grid;grid-template-columns:repeat(46,minmax(0,1fr));gap:3px}
.pb-semaine{display:grid;gap:3px}
.pb-case{aspect-ratio:1;border-radius:3px;background:var(--surface-page);transition:background .3s,transform .4s var(--ressort)}
.pb-case.vide{background:rgb(180 35 24 / var(--o,1));transform:scale(1)}
.pb-case.ferme{visibility:hidden}
.pb-case.vide.neuve{animation:case-pop .45s var(--ressort) both;animation-delay:calc(var(--s) * 8ms)}
@keyframes case-pop{0%{transform:scale(0);background:var(--brand-accent)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
.pb-annee-titre{margin:0 0 14px;font:700 15px Lexend}.pb-annee-titre span{font-weight:500;font-size:13px;color:var(--text-secondary)}
.pb-annee figcaption{display:flex;justify-content:space-between;margin-top:10px;font:600 11.5px Lexend;color:var(--text-secondary)}

/* Résultats */
.pb-resultats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:0 40px 30px}
.pb-res{display:grid;gap:4px;padding:20px 22px;border-radius:22px;background:var(--surface-page);border:1px solid var(--border-subtle)}
.pb-res b{font:800 clamp(28px,3.2vw,40px)/1.05 Lexend;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.pb-res span{font-size:14px;color:var(--text-secondary);line-height:1.4}
.pb-res .pb-quand{font:600 12px Lexend;letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary)}
.pb-res-fort .pb-quand{color:#FFD9D3}
.pb-resultats{grid-template-columns:1fr 1fr 1.4fr;align-items:end}
.pb-res-fort b{font-size:clamp(36px,4.2vw,56px)}
.pb-res-fort{background:var(--status-danger);border-color:var(--status-danger);color:#fff;box-shadow:5px 5px 0 var(--dark-page)}
.pb-res-fort span{color:#FFD9D3}
.pb-res-fort>span>span{color:#fff;font-weight:600}
.pb-res-fort>span>span[data-pb="jours"]{font-weight:400;color:#FFD9D3}
.pb-res b.saute{animation:res-saute .4s var(--ressort)}
@keyframes res-saute{50%{transform:scale(1.06)}}

/* Les trois soucis, en une ligne */
.pb-soucis{list-style:none;margin:0;padding:22px 40px 30px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;border-top:1px solid var(--border-subtle)}
.pb-soucis li{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;line-height:1.45;color:var(--text-secondary)}
.pb-soucis svg{flex:none;width:38px;height:38px;padding:9px;border-radius:12px;background:var(--status-dangerSoft);color:var(--status-danger)}
.pb-soucis b{display:block;color:var(--text-primary);font:700 15px Lexend}

.pb-suite{display:inline-flex;align-items:center;gap:10px;margin-top:28px;font:600 16px Lexend;color:var(--brand-primary);text-decoration:none}
.pb-suite svg{width:34px;height:34px;padding:8px;border-radius:50%;background:var(--brand-primary);color:#fff;transform:rotate(90deg);transition:transform .3s var(--ressort)}
.pb-suite:hover svg{transform:rotate(90deg) translateX(4px)}

@media (max-width:980px){
 .pb-scene{grid-template-columns:minmax(0,1fr);padding:28px 20px}
 .pb-resultats,.pb-soucis{padding-inline:20px}
 .pb-hypothese{margin-inline:20px}
}
@media (max-width:640px){
 .pb-console .console-titre{display:none}
 .pb-hypothese{margin-inline:20px}
 .pb-grille{gap:2px}.pb-semaine{gap:2px}.pb-case{border-radius:2px}
 .pb-annee{padding:14px 12px 10px}
 .pb-resultats,.pb-soucis{grid-template-columns:minmax(0,1fr);gap:10px}
}
@media (prefers-reduced-motion:reduce){.pb-case.vide.neuve{animation:none}.pb-res b.saute{animation:none}}

/* ---------- Ouvertures de chapitre : numéro, ligne, très grand titre (toutes les sections après l'accueil) ---------- */
.chapitre{display:flex;align-items:center;gap:14px;margin:0 0 26px;font:600 14px Lexend;letter-spacing:.12em;text-transform:uppercase;color:var(--text-primary)}
.chapitre-n{display:grid;place-items:center;min-width:44px;height:30px;padding:0 10px;border-radius:99px;background:var(--brand-primary);color:#fff;letter-spacing:.02em;box-shadow:3px 3px 0 var(--brand-accent);font-variant-numeric:tabular-nums}
.chapitre::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--border-control),transparent)}
.chapitre-titre,.bloc .titre-section.chapitre-titre,.probleme .titre-section.chapitre-titre{max-width:none;font-size:clamp(52px,8.6vw,132px);line-height:.98;letter-spacing:-.055em;margin-bottom:26px}
.entete-section:has(.chapitre){max-width:none}
.entete-section:has(.chapitre) .texte{max-width:640px;font-size:clamp(17px,1.4vw,20px)}
@media (max-width:640px){.chapitre{font-size:12px;gap:10px}.chapitre-n{min-width:38px;height:26px}.bloc .titre-section.chapitre-titre,.probleme .titre-section.chapitre-titre{font-size:clamp(44px,13vw,64px)}}
@media (min-width:1081px){.probleme .entete-section:has(.chapitre){max-width:none}}

/* le fond de l'accueil s'efface en bas au lieu de s'arrêter net */
.haut-fond{-webkit-mask-image:linear-gradient(to bottom,#000 70%,transparent);mask-image:linear-gradient(to bottom,#000 70%,transparent)}

/* « Le logiciel » en refonte : bloc vide, rien à quoi se projeter */
.logiciel-attente{display:grid;place-items:center;gap:8px;min-height:340px;margin-top:10px;padding:40px;border-radius:32px;border:2px dashed var(--border-control);text-align:center;color:var(--text-secondary)}
.logiciel-attente h2{margin:0;font:800 clamp(26px,3vw,38px) Lexend;color:var(--text-primary)}
.logiciel-attente p{margin:0}
