/* Corrections après l'audit du 30.10.2026 (audits/2026-10-30-pixelge-v2.md). */

/* Petits textes sur fond crème : un seul gris olive, 5:1 sur #eae7de (il faut 4,5:1). */
.light .eyebrow,.light .section-heading>p,.ai-note p,.step-time,.steps p,
.offer-sheet .payment-note,.offer-sheet .extra-cost,.offer-sheet .support-option small,.offer-sheet .support-summary,.offer-sheet .payment-methods,
.faq-list details p,.request-copy>p:not(.eyebrow),.form-progress li,.optional,#step-count,.file-field small,
.field-feedback:not(.error),#brief-result dt,#brief-result>p:not(.eyebrow),.back-button,.studio-person span{color:#5c6450}

/* Téléphone et tablette : l'en-tête reste à l'écran avec son bouton, et s'efface au formulaire. */
@media(max-width:900px){
  html{scroll-padding-top:64px}
  .nav{position:fixed;height:60px;background:var(--bg);transition:transform .3s ease}
  .nav.at-form{transform:translateY(-100%)}
  .nav-cta{font-size:12px;gap:8px}
  /* la scène des trois univers s'arrête sous l'en-tête, pas dessous */
  .hero-scroll-ready .hero-theatre{top:72px}
}

/* La photo d'Alex : un visage qu'on reconnaît, pas une vignette. */
@media(max-width:700px){
  .studio-person{display:block}
  .studio-person img{width:160px;height:200px}
  .studio-person p{margin-top:13px}
}

/* Le texte du faux site reste à gauche du visuel, sans passer dessous. */
.built .site-copy{max-width:43%}

/* Téléphone : le cadre du faux site grandit en hauteur pour que la scène des univers remplisse l'écran
   sous l'en-tête pendant qu'elle reste en place, au lieu de laisser une bande noire vide en dessous. */
@media(max-width:900px) and (prefers-reduced-motion:no-preference){
  .hero-scroll-ready .stage-stack{aspect-ratio:auto;height:clamp(276px,calc(100svh - 240px),640px);max-height:none}
  /* environ 120 % d'écran de défilement pour passer de Dufour à Équilibre puis à Volta */
  .hero-scroll-ready .hero-scroll{height:220svh}
}

/* Moins de texte autour du hero (30.10, demande d'Alex) : la scène se passe de légendes et de commandes.
   Les éléments restent dans la page pour hero.js, mais ne sont plus affichés. */
.stage-caption,.stage-bottom,.scroll-cue{display:none!important}
.expanded-caption{justify-content:flex-end}

/* Offre clarifiée (02.11, strategie/offre.md) : garantie, détail du suivi, suite de l'offre, mention AUBE. */
.offer-sheet .payment-note{margin-bottom:8px}
.offer-sheet .guarantee{font-size:14px;line-height:1.45;color:#25271f;margin:0 0 26px}
.offer-sheet .guarantee strong{font-weight:550}
.support-detail{font-size:12px;line-height:1.55;color:#69785a;margin:10px 0 0}
.offer-next{font-size:13px;line-height:1.55;color:#56624b;margin:22px 0 0;padding-top:18px;border-top:1px solid #d6d2c6}
.project-card .project-meta p.project-note{margin-top:4px;color:#ff647b}
.project-card[id]{scroll-margin-top:72px}
.questions .guide-link{display:flex;width:max-content;max-width:100%}

/* Réalisations : les trois sites réels d'Alex, sous les exemples imaginés. */
.real-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.real-card{display:flex;flex-direction:column;align-items:flex-start}
.real-shot{display:block;width:100%;border-radius:6px;overflow:hidden;background:#d9d5ca;box-shadow:0 1px 0 #c9c4b6}
.real-shot img{display:block;width:100%;height:auto;aspect-ratio:8/5;object-fit:cover;object-position:top;transition:transform .5s ease}
.real-shot:hover img,.real-shot:focus-visible img{transform:scale(1.02)}
.real-card h3{font:500 19px/1.3 Geist,Arial,sans-serif;letter-spacing:-.3px;margin:18px 0 0}
.real-card .real-kind{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#515944;margin:6px 0 0}
.real-card p{font-size:14px;line-height:1.55;color:#56624b;margin:12px 0 0}
.real-card .real-role{font-size:12px;color:#515944;margin-top:8px}
.real-card .text-link{margin-top:auto;padding-top:14px}
@media(max-width:900px){.real-grid{grid-template-columns:1fr;gap:40px}}
@media(prefers-reduced-motion:reduce){.real-shot img{transition:none}}

/* Téléphone : les objets des univers (02.11) sont plus compacts et centrés dans leur image.
   On recentre l'image sur la zone libre à droite du texte, pour que l'objet entier reste visible. */
@media(max-width:900px){
  .built .art{left:9%;transform:scale(.72)}
}

/* Volta (électricien, 02.11) : texte droit, pas l'italique des marques de sport (audits/2026-11-02-hero-univers.md). */
.stage[data-world="commerce"] .site-copy h2 em{font-style:normal}

/* Offre et formule Être trouvé. */
.offer-copy>p+p{margin-top:16px}
.sheet-limit{font-size:12px;line-height:1.55;color:#515944;margin:12px 0 0}
.plans{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:10px}
.plans-head,.plans-foot{grid-column:1/-1}
.plans-head h3{font:450 28px/1.15 Geist,Arial,sans-serif;letter-spacing:-.8px;margin:0}
.plans-head p{font-size:15px;line-height:1.6;color:#979e8d;margin:10px 0 0;max-width:620px}
.plan{background:#1a1b19;border:1px solid #2c2e2a;padding:28px;display:flex;flex-direction:column}
.plan-strong{border-color:#ed2545}
.plan-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.plan h4{font:500 22px/1.2 Geist,Arial,sans-serif;margin:0}
.plan h4 span{display:block;font-size:12px;font-weight:400;letter-spacing:1px;text-transform:uppercase;color:#979e8d;margin-top:6px}
.plan-price{font-size:34px;line-height:1;letter-spacing:-1px;margin:0;white-space:nowrap}
.plan-price small{font-size:13px;letter-spacing:0;color:#979e8d;margin-left:4px}
.plan-launch{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#ff647b;margin:8px 0 0;text-align:right}
.plan-result{font-size:15px;line-height:1.55;color:#f1eee7;margin:16px 0 0}
.plan ul{margin:16px 0 0;padding:0 0 0 18px;font-size:14px;line-height:1.6;color:#c4c6be}
.plan li+li{margin-top:6px}
.plan-example{border-top:1px solid #55584f;margin-top:18px;padding-top:14px;color:#f1eee7;font-size:14px;line-height:1.6}
.plan-example summary{cursor:pointer}
.plan-example ul{margin-top:8px}
.plan-limits{font-size:12px;line-height:1.6;color:#8f9188;margin:16px 0 0}
.plan-caution{font-size:13px;line-height:1.55;color:#f1eee7;border-left:2px solid #ed2545;padding-left:12px;margin:16px 0 0}
.plan-choice{display:flex;gap:10px;align-items:center;font-size:14px;margin-top:auto;padding-top:20px;cursor:pointer}
.plans-foot p{font-size:13px;line-height:1.6;color:#979e8d;margin:6px 0 0}
.plans-foot .support-summary{color:#f1eee7;font-size:15px;margin:0 0 8px}
.plans-total strong{color:#f1eee7;font-weight:500}
@media(max-width:900px){.plans{grid-template-columns:1fr}.plan{padding:22px}}

.project-card .project-meta p.project-action {
  color: #b8bcb2;
  font-size: 14px;
  letter-spacing: 0;
  text-transform: none;
}
.project-film {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid #ffffff26;
}
.project-film .project-card { max-width: 420px; }
.gallery-note .text-link { margin-left: .45em; }
.plans-head[id] { scroll-margin-top: 72px; }
.plans-head .ia-proof {
  border-left: 2px solid var(--red);
  padding-left: 14px;
  margin-top: 18px;
  color: #e6e3da;
}