@charset "UTF-8";
/* PTC — le module « Budget & financement », SA FORME, écrite une seule fois.

   CE QUE CETTE FEUILLE EST. Le composant partagé par les deux surfaces :
   la vue Budget de /app/ et les trois pages publiques qui le montent en mode
   invité (/construire/budget/, /construire/financement/, /construire/ptz/).
   Elle porte les 39 classes que le seul `ptc-budget.js` emploie —
   familles `fin-*`, `dem-*`, `sf-*`, plus `btotal`, `amt` et `fs-b`.

   D'OÙ ELLE VIENT, ET POURQUOI (convergence demandée par Déb le 10/09/2026).
   Ces règles vivaient dans le <style> inline de /app/index.html. Le module
   monté sur une page publique y arrivait donc NU : 29 classes sans une seule
   règle, et les quatre étapes du classeur affichées en même temps. Le
   correctif du 07/09 avait rhabillé les pages ; il laissait le vrai défaut
   entier — une seule surface définissait le composant.

   CE QUI N'EST PAS ICI, ET CE N'EST PAS UN OUBLI. `.prixbox`, `.pl-go`,
   `.proc` et `.stage` RESSEMBLENT à des classes du module, et le balayage
   des 23 vues au navigateur les donnait même pour telles. Le comptage des
   émetteurs a tranché l'inverse : le code de l'application les produit
   lui-même — fourchette indicative, surface totale, actions d'étape,
   procédures — dans des chemins que ces vues n'exécutaient pas. Un rendu
   n'est qu'un échantillon ; on ne conclut pas d'un écran non ouvert.
   Ce sont des NOMS PARTAGÉS entre deux objets, la dette qui reste ouverte.

   LES SÉLECTEURS NE SONT PAS CLOISONNÉS, et c'est voulu. Les 39 classes ne
   paraissent nulle part ailleurs — ni dans les 287 pages du site, ni dans un
   autre module, ni dans le balisage de l'app. Les cloisonner sous
   `[data-ptc-budget]` aurait relevé leur spécificité, donc risqué de changer
   ce qui gagne dans l'application. Ne toucher ni aux sélecteurs ni aux
   déclarations est la seule façon de garantir un rendu identique.

   L'ADAPTATION À L'HÔTE PUBLIC vit dans `ptc-budget-invite.css` : le
   vocabulaire général (`.btn`, `.card`, `.chip`, les champs) que
   l'application définit chez elle et qu'une page publique doit fournir.
   C'est la composition qui diffère, jamais le composant. */
.btotal{position:sticky;bottom:88px;background:var(--navy);color:#fff;border-radius:14px;padding:14px 18px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 6px 20px rgba(26,45,74,.3);}

.btotal .t{font-family:'Fraunces',serif;font-size:1.15rem;font-weight:700;color:var(--coral);}

.sf-prem--essai{background:#e7f4ec;color:#1d6b3f;border-color:#bfe0cb}

/* ===== Finances — suivi financier ===== */
.sf-loan{font-size:.84rem;color:var(--mut,var(--muted,#647080));margin:10px 0 12px}
.sf-loan b{color:var(--navy)}

.sf-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:8px}

.sf-tile{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff}

.sf-tile .t{font-size:.66rem;text-transform:uppercase;letter-spacing:.04em;color:var(--mut,var(--muted,#647080));font-weight:700}

.sf-track{height:8px;background:#eef0f3;border-radius:999px;overflow:hidden;margin:10px 0 4px}

.sf-cap{font-size:.76rem;color:var(--mut,var(--muted,#647080));margin-bottom:14px}
.sf-cap b{color:var(--navy)}

.sf-act{border:1px solid #f2c8b7;border-radius:14px;overflow:hidden;margin-bottom:14px}

.sf-act-h{background:#fff7f2;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #f6dccd}

.sf-act-h .amt{font-family:'Fraunces',serif;font-weight:700;font-size:1.25rem;color:var(--navy);white-space:nowrap}

.sf-act-b{padding:12px 14px}

.sf-ok{display:flex;gap:8px;align-items:flex-start;font-size:.84rem;color:#14543f;margin-bottom:10px}

.sf-ok svg{flex:0 0 auto;margin-top:2px}

/* Finances — les 3 temps, enroulés sauf celui en cours */
/* Le classeur d'étapes vit dans /assets/ptc-classeur.css (composant partagé, Déb 29/08/2026). */
.ptc-classeur__panneau .fs-b>.card{border:0;padding:0;margin-top:0}

.fin-propre{display:flex;align-items:center;gap:8px;font-size:.86rem;color:var(--navy);background:var(--ice);border-radius:11px;padding:10px 12px;margin-bottom:10px;cursor:pointer}

.fin-propre input{width:17px;height:17px;accent-color:var(--coral)}

.fin-offre,.fin-docz{border-top:1px solid var(--line);margin-top:12px;padding-top:12px}

.fin-offre>b,.fin-docz>b{color:var(--navy)}

.fin-cout{margin:10px 0 0;background:var(--ice);border:1px solid #d4e5f4;border-radius:11px;padding:9px 12px;font-size:.86rem;color:var(--navy)}

.fin-cout b{color:var(--coral-dark)}

.fin-cout-in{background:var(--cream);border:1px solid var(--line);border-radius:12px;padding:11px 13px;margin-bottom:12px}

.fin-cout-in label{display:block;font-size:.8rem;font-weight:700;color:var(--navy);margin-bottom:5px}

.fin-cout-in input{width:100%;max-width:220px;border:1.5px solid var(--line);border-radius:10px;padding:9px 11px;font:inherit;background:#fff}

.dem-apport{background:var(--ice);border:1px solid #d4e5f4;border-radius:12px;padding:11px 13px;margin-bottom:12px}

.dem-apport>b{color:var(--navy)}

.dem-h{display:flex;gap:8px;align-items:center;margin-bottom:8px;flex-wrap:wrap}

.dem-b{flex:1;min-width:130px;border:1.5px solid var(--line);border-radius:9px;padding:8px 10px;font:inherit;font-weight:700;color:var(--navy);background:#fff}

.dem-s{border:1.5px solid var(--line);border-radius:9px;padding:8px 9px;font:inherit;font-size:.82rem;background:#fff;color:var(--navy)}

.dem-cout{margin:8px 0 0;font-size:.85rem;color:var(--navy)}
.dem-cout b{color:var(--coral-dark)}

.dem-do{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}

.sf-tbl tr.dem-best td{background:var(--ok-bg,var(--green-bg,#eaf7f2))}

.sf-prem{display:inline-block;margin-left:7px;font-size:.6rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.34);border-radius:999px;padding:1px 7px;vertical-align:middle}

.sf-doc .sf-prem{background:#fdece3;border-color:#f2c8b7;color:var(--coral-dark)}

.sf-scroll{overflow-x:auto;margin-top:10px}

.sf-tbl{width:100%;border-collapse:collapse;font-size:.85rem;min-width:560px}

.sf-tbl th{text-align:left;font-size:.66rem;text-transform:uppercase;letter-spacing:.03em;color:var(--mut,var(--muted,#647080));font-weight:800;padding:0 8px 6px;white-space:nowrap}

.sf-tbl td{padding:9px 8px;border-top:1px solid var(--line);vertical-align:middle}

/* `.stage` nu n’est émis que par ce module — la famille `.stage-picker`,
   `.stage-options`, `.stage-btn` des pages d’achat porte des noms DIFFÉRENTS.
   Sa règle était restée dans le <style> de l’application : elle rentre. */
.sf-tbl .stage b{color:var(--navy,#1a2d4a)}
.sf-tbl .amt{font-weight:700;color:var(--navy);white-space:nowrap}

.sf-row-do{display:flex;gap:6px;flex-wrap:wrap;align-items:center}

.sf-pill{font-size:.66rem;font-weight:800;border-radius:999px;padding:2px 9px;white-space:nowrap}

.sf-p-ok{color:var(--ok,var(--green,#18705a));background:var(--ok-bg,var(--green-bg,#eaf7f2))}
.sf-p-due{color:var(--coral-dark);background:#fdece3}
.sf-p-soon{color:var(--mut,var(--muted,#647080));background:#eef0f3}

.sf-doc{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;font-weight:700;border-radius:8px;padding:5px 9px;border:1px solid var(--line);background:#fff;color:var(--navy);cursor:pointer}

.sf-doc:hover{border-color:#bfd0e0;background:#fbfcfe}

.sf-note{margin:12px 0 0;background:var(--ice);border:1px solid #d4e5f4;border-radius:12px;padding:10px 12px;font-size:.79rem;color:var(--navy)}
.sf-note b{color:var(--coral-dark)}

.sf-empty{border:1px dashed #cbd5e1;border-radius:12px;padding:14px;color:var(--mut,var(--muted,#647080));font-size:.85rem;background:#fbfcfe}

.sf-marche{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0 4px}

.sf-marche input{width:150px;border:1.5px solid var(--line);border-radius:9px;padding:8px 10px}

.sf-letter{margin-top:10px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:12px}

.sf-letter textarea{width:100%;min-height:190px;border:1px solid var(--line);border-radius:9px;padding:10px;font:inherit;font-size:.82rem;resize:vertical}


/* La question qui ouvre le financement : elle commande ce qui s'affiche ensuite. */
.fin-mode{background:#fff;border:2px solid var(--navy);border-radius:14px;padding:15px 17px;margin:0 0 14px}

.fin-mode > b{color:var(--navy);font-size:.95rem}

.fin-mode .chips{display:flex;gap:8px;flex-wrap:wrap}

.fin-mode .chip{border:1.5px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:8px 15px;font-family:'Poppins',sans-serif;font-size:.82rem;font-weight:700;cursor:pointer}

.fin-mode .chip:hover{border-color:var(--coral)}

/* CE QUI S'IMPRIME EST LA SYNTHÈSE, PAS LE SITE AUTOUR (17/09/2026). Le bouton
   « Imprimer ma synthèse indicative » appelle window.print() : sans ces règles, le
   lecteur emporte l'en-tête, le fil d'Ariane, le rail de parcours et le pied de page
   avant d'arriver à ses chiffres. On masque le mobilier de navigation, rien d'autre —
   le contenu reste entier, y compris les avertissements qui l'accompagnent. */
@media print{
  .site-header,.ptc-parcours,.breadcrumbs,.ptc-jalons,footer,.btn-ghost,.ptc-tiroir{display:none !important}
  details.adv{display:block !important}
  details.adv>summary{list-style:none}
  body{background:#fff}
}
