/* Aperçu /marches pour un visiteur (apercu_resultat.py, cap du 2026-11-09) : papier chaud, gros chiffre, un seul bouton.
   Chargée par marches.html seulement. Aucun style en ligne (CSP). Les hauteurs de contrôle respectent 44 px. */
:root {
  --bord-chaud: #E8E0D2;
  --ombre-carte: 0 1px 2px rgb(58 44 20 / .08), 0 14px 28px -20px rgb(58 44 20 / .4);
  --rayon: 1.125rem;
}
body:has(.page-essai), .page-essai { background: var(--fond-chaud); }
/* Trait effilé sous « chantiers » : image de données SVG, le jeton --bleu y est recopié (une image de données ne lit pas un jeton). */
.page-essai h1 em {
  font-style: normal; white-space: nowrap;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath fill='%232457D6' d='M3 7.5C52 2.6 128 .6 196 .8c4 0 4.4 5 .6 5.4C134 7.4 66 9.6 7.6 13.4 1.2 13.8-2.4 8.2 3 7.5z'/%3E%3C/svg%3E") left bottom .05em / 100% .16em no-repeat;
}
.page-essai .page-head h1 { font-size: clamp(2.25rem, 1.5rem + 3.6vw, 3.75rem); line-height: 1.06; letter-spacing: -.025em; }

/* Une fois le résultat là : la promesse tient sur une ligne, le formulaire se replie, le résultat prend toute la largeur. */
.essai-a-resultat .page-head { margin-bottom: var(--s-2); }
.essai-a-resultat .page-head h1 { font-size: 1.0625rem; line-height: 1.3; letter-spacing: 0; font-weight: 500; }
.essai-a-resultat .essai-simple, .essai-a-resultat .page-head .lead, .essai-a-resultat .page-head .eyebrow { display: none; }
.page-essai .teaser-layout.a-resultat { display: flex; flex-direction: column; gap: 0; }
.page-essai .apercu-recherche > summary { display: none; }
.page-essai .a-resultat .apercu-recherche > summary { display: inline-flex; align-items: center; min-height: 2.75rem; cursor: pointer; color: var(--bleu); text-decoration: underline; text-underline-offset: 2px; }
.page-essai .a-resultat .teaser-aside { order: 2; position: static; }
.page-essai .a-resultat .teaser-main { order: 1; }
.page-essai .a-resultat .apercu-recherche[open] .teaser-panel { max-width: 40rem; margin-bottom: var(--s-4); }

.page-essai .teaser-result > .ess-res { margin: 0; }
.page-essai .ess-chiffre.result-summary { padding: 0; border: 0; background: none; box-shadow: none; outline: none; }
.page-essai .ess-chiffre h2 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 .625rem; margin: .25rem 0 0; }
.page-essai .ess-res { display: grid; gap: 1.25rem; width: 100%; }
.page-essai .ess-nombre { font-size: clamp(5rem, 3.5rem + 7vw, 8.5rem); line-height: 1; font-weight: 600; letter-spacing: -.04em; color: var(--bleu); }
.page-essai .ess-nombre-txt { font-size: clamp(1.5rem, 1.25rem + 1.2vw, 2.25rem); font-weight: 600; line-height: 1.12; letter-spacing: -.015em; }
.page-essai .ess-recherche { margin-top: .5rem; font-size: 1.125rem; font-weight: 500; }
.page-essai .ess-source { margin-top: .125rem; font-size: var(--fs-petit); color: var(--texte-2); }

.page-essai .ess-liste { display: grid; gap: 1.25rem; min-width: 0; }
.page-essai .ess-entier { background: var(--blanc); border-radius: var(--rayon); box-shadow: var(--ombre-carte); padding: 1.125rem; display: grid; gap: .75rem; min-width: 0; }
.page-essai .ess-offert { font-size: var(--fs-petit); font-weight: 600; color: var(--succes); }
.page-essai .ess-entier h3 { font-size: var(--fs-h3); line-height: 1.25; overflow-wrap: anywhere; }
.page-essai .ess-entier dl { display: grid; gap: .25rem; font-size: var(--fs-petit); }
.page-essai .ess-entier dl > div { display: grid; grid-template-columns: 5rem minmax(0, 1fr); gap: .5rem; }
.page-essai .ess-entier dt { color: var(--texte-2); }
.page-essai .ess-entier dd { font-weight: 500; overflow-wrap: anywhere; }
.page-essai .ess-delai { color: var(--texte-2); font-weight: 400; }
.page-essai .ess-pourquoi, .page-essai .ess-resume { font-size: var(--fs-petit); overflow-wrap: anywhere; }
.page-essai .ess-pourquoi strong { display: block; }
.page-essai .ess-ia { color: var(--texte-2); }
.page-essai .ess-lien { display: inline-flex; align-items: center; min-height: 2.75rem; color: var(--bleu); font-weight: 500; }

.page-essai .ess-verrous h3 { font-size: var(--fs-h3); margin-bottom: .5rem; }
.page-essai .ess-verrous ul { display: grid; gap: .5rem; }
.page-essai .ess-verrou { background: var(--fond-chaud-2); border-radius: .875rem; padding: .75rem .875rem; font-size: var(--fs-petit); position: relative; }
.page-essai .ess-verrou-genre { font-weight: 600; padding-right: 2rem; }
.page-essai .ess-verrou-lieu { color: var(--texte-2); padding-right: 2rem; }
/* Cadenas : image de données SVG, le jeton --texte-2 y est recopié (une image de données ne lit pas un jeton). */
.page-essai .ess-verrou::after {
  content: ""; position: absolute; top: .75rem; right: .75rem; width: 1.25rem; height: 1.25rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2356616F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='9' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center / contain no-repeat;
}
.page-essai .ess-caches { display: flex; gap: .5rem; margin-top: .5rem; }
.page-essai .ess-cache { display: block; height: .75rem; flex: 1; border-radius: .375rem; background: var(--bord-chaud); }
.page-essai .ess-cache-l { flex: 2.4; }
.page-essai .ess-reste { margin-top: .625rem; color: var(--texte-2); font-size: var(--fs-petit); }

.page-essai .ess-colonne { display: contents; }
.page-essai .ess-apporte, .page-essai .ess-renta { background: var(--blanc); border-radius: var(--rayon); box-shadow: var(--ombre-carte); padding: 1.125rem; min-width: 0; }
.page-essai .ess-apporte h3, .page-essai .ess-renta h3 { font-size: var(--fs-h3); line-height: 1.25; margin-bottom: .625rem; }
.page-essai .ess-apporte li { position: relative; padding-left: 1.625rem; }
.page-essai .ess-apporte li + li { margin-top: .5rem; }
.page-essai .ess-apporte li::before { content: ""; position: absolute; left: .125rem; top: .35em; width: .875rem; height: .4375rem; border-left: 2.5px solid var(--bleu); border-bottom: 2.5px solid var(--bleu); transform: rotate(-45deg); }
.page-essai .ess-calcul { font-size: var(--fs-petit); color: var(--texte-2); }
.page-essai .ess-calcul strong { color: var(--texte); }
.page-essai .ess-marge { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .25rem .75rem; margin-top: .75rem; font-weight: 500; }
.page-essai .ess-marge-champ { display: inline-flex; align-items: center; gap: .375rem; }
.page-essai .ess-marge input { width: 6.5rem; min-height: 2.75rem; padding: .25rem .625rem; border: 1px solid var(--bordure-champ); border-radius: .625rem; font: inherit; font-weight: 600; text-align: right; background: var(--blanc); color: var(--texte); }
.page-essai .ess-marge-res { margin-top: .625rem; font-weight: 600; font-size: 1.125rem; line-height: 1.3; }
.page-essai .ess-annuel { margin-top: .625rem; font-size: var(--fs-petit); }
.page-essai .ess-note { margin-top: .25rem; font-size: var(--fs-mini); color: var(--texte-2); }

.page-essai .ess-action {
  position: sticky; bottom: 0; z-index: 2; margin-inline: -1rem; padding: .625rem 1rem;
  background: var(--fond-chaud); border-top: 1px solid var(--bord-chaud);
}
.page-essai .ess-action p { margin-top: .375rem; font-size: var(--fs-mini); line-height: 1.25; color: var(--texte-2); text-align: center; }
.page-essai .ess-action sup { font-size: .7em; line-height: 0; }

.page-essai .ess-bouton {
  display: flex; align-items: center; justify-content: center; width: 100%; min-height: 3.5rem; padding: .625rem 1rem;
  border-radius: .875rem; background: var(--bleu); color: var(--blanc); font-weight: 600; font-size: 1.125rem; text-align: center; text-decoration: none;
  box-shadow: 0 3px 0 var(--bleu-presse); transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
}
.page-essai .ess-bouton:hover { background: var(--bleu-survol); color: var(--blanc); }
.page-essai .ess-bouton:active { transform: translateY(2px); box-shadow: 0 1px 0 var(--bleu-presse); }
.page-essai .ess-bouton:focus-visible { outline: 3px solid var(--bleu); outline-offset: 2px; }
.page-essai .ess-marge input:focus-visible { outline: 3px solid var(--bleu); outline-offset: 2px; }

@media (min-width: 64rem) {
  .page-essai .ess-res { grid-template-columns: minmax(0, 1fr) 24rem; column-gap: 3rem; align-items: start; }
  .page-essai .ess-chiffre, .page-essai .ess-liste { grid-column: 1; }
  .page-essai .ess-colonne { display: grid; gap: 1rem; grid-column: 2; grid-row: 1 / span 2; position: sticky; top: calc(var(--h-entete) + 1rem); }
  .page-essai .ess-action { position: static; margin: 0; padding: 0; background: none; border: 0; }
  .page-essai .ess-verrous ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) { .page-essai .ess-bouton { transition: none; } }
