/* Simulateur CFE (calcul-cfe.html). Tous les styles de la page vivent ici.
   Les valeurs viennent des propriétés personnalisées définies dans tokens.css. */

.cfe-page{
  --cfe-primary:var(--color-ink);
  --cfe-accent:var(--color-brand);
  --cfe-ink:var(--color-ink-strong);
  --cfe-muted:var(--color-ink-muted);
  --cfe-line:var(--color-border);
  --cfe-soft:var(--color-brand-tint);
  --cfe-grey:var(--color-surface-muted);
  --cfe-radius:var(--radius-lg);
  --cfe-radius-sm:var(--radius-md);
  font-family:Poppins,"Poppins Fallback",Arial,sans-serif;
  color:var(--cfe-ink);
  font-size:var(--text-body);
  line-height:var(--leading-body);
}
.cfe-page *,.cfe-page *::before,.cfe-page *::after{box-sizing:border-box}
.cfe-wrap{width:min(1160px,100% - 2 * var(--space-4));margin-inline:auto}
.cfe-hero{background:linear-gradient(180deg,#f5fbf9,#fff);padding:calc(var(--space-9) + 36px) 0 var(--space-8)}
.cfe-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:var(--space-7);align-items:start}
.cfe-eyebrow{margin:0;font-size:var(--text-small);font-weight:var(--weight-semibold);letter-spacing:.06em;text-transform:uppercase;color:var(--cfe-muted)}
.cfe-hero h1{margin:var(--space-2) 0 var(--space-3);font-size:var(--text-h1);line-height:var(--leading-heading);font-weight:var(--weight-bold);color:var(--cfe-primary)}
.cfe-lead{margin:0;max-width:46ch;color:var(--cfe-muted);font-size:var(--text-body-lg)}
.cfe-ticks{list-style:none;margin:var(--space-5) 0 0;padding:0;display:grid;gap:var(--space-2);font-weight:var(--weight-medium);color:var(--cfe-primary)}
.cfe-ticks li{padding-left:var(--space-5);position:relative}
.cfe-ticks li::before{content:"";position:absolute;left:0;top:.45em;width:14px;height:8px;border-left:3px solid #00856a;border-bottom:3px solid #00856a;transform:rotate(-45deg)}

.cfe-sim{background:#fff;border:1px solid var(--cfe-line);border-radius:var(--cfe-radius);box-shadow:var(--shadow-2);padding:var(--space-5);min-height:440px}
.cfe-step[hidden],.cfe-result[hidden],.cfe-prog[hidden],.cfe-back[hidden]{display:none}
.cfe-prog{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);font-size:var(--text-small);color:var(--cfe-muted);min-height:44px}
.cfe-prog-bar{flex:1;height:6px;border-radius:var(--radius-pill);background:var(--cfe-line);overflow:hidden}
.cfe-prog-bar span{display:block;height:100%;background:var(--cfe-accent);transition:width .2s}
.cfe-back{background:none;border:0;padding:0 var(--space-2) 0 0;min-height:44px;font:inherit;font-weight:var(--weight-semibold);color:var(--cfe-primary);cursor:pointer}
.cfe-back:focus-visible,.cfe-btn:focus-visible,.cfe-link:focus-visible,.cfe-field:focus-visible{outline:3px solid var(--cfe-accent);outline-offset:2px}
.cfe-sim h2{margin:var(--space-1) 0 var(--space-4);font-size:var(--text-h3);line-height:var(--leading-snug);font-weight:var(--weight-bold);color:var(--cfe-primary)}
.cfe-sim h2:focus{outline:none}
.cfe-sim fieldset{border:0;margin:0;padding:0;min-width:0}
.cfe-sim legend{padding:0;margin:0 0 var(--space-3);font-size:var(--text-h3);line-height:var(--leading-snug);font-weight:var(--weight-bold);color:var(--cfe-primary)}
.cfe-sim legend.is-sub{margin-top:var(--space-5);font-size:var(--text-body)}
.cfe-field{display:block;width:100%;min-height:54px;border:1.5px solid var(--cfe-primary);border-radius:var(--cfe-radius-sm);padding:0 var(--space-4);font:inherit;font-size:var(--text-body);color:var(--cfe-ink);background:#fff}
.cfe-combo{position:relative}
.cfe-list{list-style:none;margin:var(--space-1) 0 0;padding:0;border:1px solid var(--cfe-line);border-radius:var(--cfe-radius-sm);overflow:hidden;background:#fff}
.cfe-list[hidden]{display:none}
.cfe-list li{display:flex;justify-content:space-between;gap:var(--space-3);min-height:48px;align-items:center;padding:0 var(--space-4);border-top:1px solid var(--cfe-line);cursor:pointer}
.cfe-list li:first-child{border-top:0}
.cfe-list li[aria-selected="true"],.cfe-list li:hover{background:var(--cfe-soft)}
.cfe-list small{color:var(--cfe-muted)}
.cfe-hint{margin:var(--space-2) 0 0;font-size:var(--text-small);color:var(--cfe-muted)}
.cfe-error{margin:var(--space-2) 0 0;font-size:var(--text-small);color:#a3231a;font-weight:var(--weight-medium)}
.cfe-error:empty{display:none}
.cfe-opts{display:grid;gap:var(--space-2)}
.cfe-opts.is-two{grid-template-columns:1fr 1fr}
.cfe-opts .cfe-opt.is-full{grid-column:1 / -1}
.cfe-opt{position:relative;display:block}
.cfe-opt input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.cfe-opt span{display:flex;align-items:center;min-height:52px;padding:var(--space-2) var(--space-4);border:1.5px solid var(--cfe-line);border-radius:var(--cfe-radius-sm);font-weight:var(--weight-medium);background:#fff}
.cfe-opt input:checked+span{border-color:var(--cfe-primary);background:var(--cfe-soft);box-shadow:inset 0 0 0 1px var(--cfe-primary)}
.cfe-opt input:focus-visible+span{outline:3px solid var(--cfe-accent);outline-offset:2px}
.cfe-btn{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;margin-top:var(--space-4);padding:var(--space-2) var(--space-5);border:0;border-radius:var(--cfe-radius-sm);background:var(--cfe-accent);color:var(--cfe-primary);font:inherit;font-weight:var(--weight-bold);text-align:center;text-decoration:none;cursor:pointer}
.cfe-btn.is-ghost{background:#fff;border:1.5px solid var(--cfe-primary);margin-top:var(--space-3)}
.cfe-sim h2.cfe-now{margin:0;font-size:var(--text-body);font-weight:var(--weight-regular);color:var(--cfe-ink)}
.cfe-now{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-3);flex-wrap:wrap;padding:var(--space-3) var(--space-4);border-radius:var(--cfe-radius-sm);background:var(--cfe-grey)}
.cfe-now b{font-size:var(--text-h3);color:var(--cfe-primary);font-variant-numeric:tabular-nums;white-space:nowrap}
.cfe-headline{margin:var(--space-4) 0 var(--space-1);font-size:var(--text-body-lg);font-weight:var(--weight-semibold);line-height:var(--leading-snug);color:var(--cfe-primary)}
.cfe-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2);margin:var(--space-5) 0 var(--space-4)}
.cfe-card{position:relative;border:1.5px solid var(--cfe-line);border-radius:var(--radius-md);padding:var(--space-3);text-align:center}
.cfe-card.is-best{border-color:#00a07d;background:var(--cfe-soft)}
.cfe-card strong{display:block;color:var(--cfe-primary)}
.cfe-card small{display:block;color:var(--cfe-muted);font-size:var(--text-small);line-height:var(--leading-snug)}
.cfe-card b{display:block;margin-top:2px;font-size:var(--text-h3);color:var(--cfe-primary);font-variant-numeric:tabular-nums}
.cfe-card b.is-range{font-size:var(--text-body);line-height:var(--leading-snug)}
.cfe-badge{position:absolute;top:-11px;left:50%;transform:translateX(-50%);padding:2px var(--space-2);border-radius:var(--radius-pill);background:var(--cfe-primary);color:#fff;font-size:var(--text-small);font-weight:var(--weight-semibold);white-space:nowrap}
.cfe-why{list-style:none;margin:var(--space-3) 0 0;padding:0;display:grid;gap:var(--space-1);font-size:var(--text-small)}
.cfe-why li{padding-left:var(--space-4);position:relative}
.cfe-why li::before{content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;border-radius:50%;background:var(--cfe-accent)}
.cfe-refine{margin-top:var(--space-4);padding-top:var(--space-3);border-top:1px solid var(--cfe-line)}
.cfe-refine label{display:block;font-size:var(--text-small);font-weight:var(--weight-semibold);color:var(--cfe-primary);margin-bottom:var(--space-1)}
.cfe-refine .cfe-field{min-height:48px;border-color:var(--cfe-line)}
.cfe-link{display:block;width:100%;margin-top:var(--space-2);min-height:44px;background:none;border:0;font:inherit;font-weight:var(--weight-semibold);color:var(--cfe-primary);text-decoration:underline;cursor:pointer}
.cfe-fine{margin:var(--space-3) 0 0;font-size:var(--text-small);line-height:var(--leading-body);color:var(--cfe-muted)}
.cfe-fine a{color:var(--cfe-primary)}
.cfe-status{min-height:1.4em;margin:var(--space-1) 0 0;text-align:center;font-size:var(--text-small);color:var(--color-ink);font-weight:var(--weight-medium)}

.cfe-explain{max-width:68ch;margin:var(--space-8) auto 0;padding-bottom:var(--space-8)}
.cfe-explain h2{margin:var(--space-7) 0 var(--space-3);font-size:var(--text-h2);line-height:var(--leading-snug);font-weight:var(--weight-bold);color:var(--cfe-primary)}
.cfe-explain h2:first-child{margin-top:0}
.cfe-explain h3{margin:var(--space-5) 0 6px;font-size:var(--text-body-lg);font-weight:var(--weight-semibold);color:var(--cfe-primary)}
.cfe-explain p,.cfe-explain li{font-size:var(--text-body);line-height:var(--leading-body)}
.cfe-explain p{margin:0 0 var(--space-3)}
.cfe-explain a{color:var(--cfe-primary);text-decoration:underline}
.cfe-table-wrap{overflow-x:auto;margin:0 0 var(--space-4)}
.cfe-table{width:100%;min-width:var(--table-min,430px);border-collapse:collapse;font-size:var(--text-small);font-variant-numeric:tabular-nums}
.cfe-table th,.cfe-table td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--cfe-line);text-align:right;white-space:nowrap}
.cfe-table th:first-child,.cfe-table td:first-child{text-align:left;white-space:normal}
.cfe-table thead th{color:var(--cfe-primary);font-weight:var(--weight-semibold);border-bottom:2px solid var(--cfe-primary)}
.cfe-table caption{caption-side:bottom;padding-top:var(--space-2);text-align:left;font-size:var(--text-small);color:var(--cfe-muted)}
.cfe-faq details{border-bottom:1px solid var(--cfe-line)}
.cfe-faq summary{min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-2) 0;font-weight:var(--weight-semibold);color:var(--cfe-primary);cursor:pointer;list-style:none}
.cfe-faq summary::-webkit-details-marker{display:none}
.cfe-faq summary::after{content:"+";font-size:var(--text-h3);font-weight:var(--weight-regular);flex:0 0 auto}
.cfe-faq details[open] summary::after{content:"–"}
.cfe-faq details p{margin:0 0 var(--space-4)}
.cfe-sources{padding-left:var(--space-4);font-size:var(--text-small)}
.cfe-sources li{margin-bottom:var(--space-1);line-height:var(--leading-body)}
.cfe-cta{margin:var(--space-7) 0 0;border-radius:var(--cfe-radius);background:var(--cfe-primary);color:#fff;padding:var(--space-6);display:flex;gap:var(--space-4);align-items:center;justify-content:space-between;flex-wrap:wrap}
.cfe-cta p{margin:0;color:#fff;font-weight:var(--weight-semibold);font-size:var(--text-body-lg);max-width:34ch;line-height:var(--leading-snug)}
.cfe-cta .cfe-btn{width:auto;margin:0}

@media(max-width:900px){
  .cfe-grid{grid-template-columns:1fr;gap:var(--space-5)}
  .cfe-hero{padding:calc(var(--space-8) + 28px) 0 var(--space-6)}
  .cfe-ticks{display:none}
  .cfe-cards{grid-template-columns:1fr}
  .cfe-card{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:var(--space-2);text-align:left}
  .cfe-card b{margin:0;grid-column:2;grid-row:1 / span 2}
  .cfe-card b.is-range{font-size:var(--text-body);line-height:var(--leading-snug)}
.cfe-badge{left:auto;right:12px;transform:none}
  .cfe-sim{padding:var(--space-4);min-height:0}
  .cfe-cta .cfe-btn{width:100%}
}
@media(prefers-reduced-motion:reduce){.cfe-prog-bar span{transition:none}}