/* Simulateur intégrable (iframe) : mêmes couleurs que le site, mise en page compacte. */
:root {
  --beton: #f3f4f1; --papier: #ffffff; --encre: #1b2a33; --ardoise: #56636b; --filet: #d7ddda;
  --soleil: #b97d06; --soleil-doux: #fbefd3; --sauge: #2b755f; --focus: #1f5fbf; --danger: #a3341f;
  --font: "Avenir Next", Avenir, "Segoe UI Variable Text", "Segoe UI", "Helvetica Neue", system-ui, sans-serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --beton: #141b1f; --papier: #1b242a; --encre: #e6ebe8; --ardoise: #a3afb4; --filet: #2e3a41;
    --soleil: #f0b43a; --soleil-doux: #3a2f17; --sauge: #6cc3a6; --focus: #8db4ff; --danger: #f08a73;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --beton: #141b1f; --papier: #1b242a; --encre: #e6ebe8; --ardoise: #a3afb4; --filet: #2e3a41;
  --soleil: #f0b43a; --soleil-doux: #3a2f17; --sauge: #6cc3a6; --focus: #8db4ff; --danger: #f08a73;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--papier); color: var(--encre); font: 15px/1.45 var(--font); }
.w { padding: 16px; display: grid; gap: 14px; max-width: 680px; margin: 0 auto; border-top: 4px solid var(--soleil); }
.w-title { font-size: 1.12rem; line-height: 1.3; margin: 0; text-wrap: balance; }
.w-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px 14px; align-items: end; }
.w-field { display: grid; gap: 4px; position: relative; min-width: 0; }
.w-commune { grid-column: 1 / -1; }
.w-field label { font-size: 0.82rem; color: var(--ardoise); font-weight: 600; }
.w-field input, .w-field select {
  font: inherit; color: var(--encre); background: var(--beton); border: 1px solid var(--filet);
  border-radius: 6px; padding: 8px 10px; width: 100%; min-width: 0;
}
.w-field input:focus-visible, .w-field select:focus-visible, .w-submit:focus-visible, .w a:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.w-suggestions {
  position: absolute; top: 100%; left: 0; right: 0; z-index: 5; margin: 2px 0 0; padding: 4px 0; list-style: none;
  background: var(--papier); border: 1px solid var(--filet); border-radius: 6px; max-height: 210px; overflow: auto;
}
.w-suggestions li { padding: 7px 10px; cursor: pointer; }
.w-suggestions li[aria-selected="true"], .w-suggestions li:hover { background: var(--soleil-doux); }
.w-submit {
  font: 700 1rem var(--font); background: var(--encre); color: var(--papier); border: 0; border-radius: 6px;
  padding: 10px 16px; cursor: pointer;
}
.w-form.is-loading .w-submit { opacity: 0.6; cursor: progress; }
.w-error { grid-column: 1 / -1; color: var(--danger); margin: 0; font-size: 0.9rem; }
.w-out { background: var(--beton); border-radius: 8px; padding: 14px 16px; }
.w-hint { margin: 0; color: var(--ardoise); }
.w-figs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0; }
.w-figs dt { font-size: 0.8rem; color: var(--ardoise); }
.w-figs dd { margin: 2px 0 0; font-size: 1.35rem; font-weight: 700; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.w-figs .prod dd { color: var(--soleil); }
.w-figs .money dd { color: var(--sauge); }
.w-sentence { margin: 10px 0 0; font-size: 0.92rem; }
.w-more { display: inline-block; margin-top: 8px; font-weight: 700; color: var(--encre); }
.w-foot { font-size: 0.78rem; color: var(--ardoise); }
.w-foot a { color: inherit; }
@media (max-width: 420px) { .w-figs { grid-template-columns: 1fr 1fr; } .w-figs .pay { grid-column: 1 / -1; } }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }