/* ZFRR.FR, direction "cabinet de conseil en territoire rural"
   Grandes photographies des Cévennes en pleine largeur, titres en Caslon, texte en grotesque sobre.
   Vert forêt pour l'autorité, jaune genêt comme unique accent (et code couleur FRR+ de la carte). */
:root {
  --bg: #f9faf7;
  --surface: #ffffff;
  --ink: #142019;
  --muted: #59655e;
  --line: #dde2da;
  --forest: #1d3f30;
  --forest-ink: #ffffff;
  --forest-2: #2f6b4c;
  --text-accent: #1d3f30;
  --genet: #d29e0b;
  --genet-ink: #161a12;
  --slate: #4b6d8e;
  --sign: #b3261e;
  --dot-off: rgba(20, 32, 25, .15);
  --hl: #fbefc3;

  /* alias lus par la carte */
  --field: var(--forest-2);
  --gold: var(--genet);
  --sky: var(--slate);
  --card: var(--surface);
  --paper: var(--bg);

  --f-display: "Libre Caslon Display", "Libre Caslon Text", Georgia, "Times New Roman", serif;
  --f-text: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;

  --wrap: 76rem;
  --read: 44rem;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0e1411; --surface: #151d18; --ink: #e8eee9; --muted: #a0aea6; --line: #27322c;
    --forest: #1b3a2c; --forest-ink: #ffffff; --forest-2: #7fc29c; --text-accent: #93c7a8;
    --genet: #e7b833; --genet-ink: #161a12; --slate: #87aacc; --sign: #ef5f57;
    --dot-off: rgba(232,238,233,.14); --hl: #3b3315;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0e1411; --surface: #151d18; --ink: #e8eee9; --muted: #a0aea6; --line: #27322c;
  --forest: #1b3a2c; --forest-ink: #ffffff; --forest-2: #7fc29c; --text-accent: #93c7a8;
  --genet: #e7b833; --genet-ink: #161a12; --slate: #87aacc; --sign: #ef5f57;
  --dot-off: rgba(232,238,233,.14); --hl: #3b3315;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
body { margin: 0; background: var(--bg); color: var(--ink); font: 400 1.0625rem/1.7 var(--f-text); -webkit-font-smoothing: antialiased; }
img { max-width: 100%; display: block; }
a { color: var(--text-accent); text-underline-offset: .2em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--genet); outline-offset: 3px; }
[id] { scroll-margin-top: 6rem; }

.wrap { max-width: var(--wrap); margin-inline: auto; padding-inline: clamp(1rem, 4vw, 2.5rem); }
.read { max-width: var(--read); }
h1, h2, h3 { margin: 0; text-wrap: balance; }
h1, h2 { font-family: var(--f-display); font-weight: 400; letter-spacing: -.01em; line-height: 1.08; }
h1 { font-size: clamp(2.6rem, 6.4vw, 5rem); }
h2 { font-size: clamp(2rem, 4vw, 3rem); }
h3 { font: 600 1.2rem/1.3 var(--f-text); letter-spacing: -.005em; }
p { margin: 0; }
.kicker { font: 500 .8rem/1.3 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); display: flex; align-items: center; gap: .75rem; }
.kicker::before { content: ""; width: 1.75rem; height: 1px; background: currentColor; flex: none; }
.lead { font-size: clamp(1.1rem, 1.6vw, 1.3rem); line-height: 1.6; }
.muted { color: var(--muted); }
.mono { font-family: var(--f-mono); font-size: .88em; }
.small { font-size: .9rem; }
.stack { display: flex; flex-direction: column; gap: 1rem; }
.stack-lg { display: flex; flex-direction: column; gap: 2rem; }
.todo { background: var(--hl); padding: 0 .3em; font-family: var(--f-mono); font-size: .85em; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- boutons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; font: 600 .98rem/1 var(--f-text); padding: 1rem 1.4rem; border-radius: 2px; text-decoration: none; border: 1px solid transparent; cursor: pointer; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.btn::after { content: "→"; font-weight: 400; transition: transform .2s ease; }
.btn:hover::after { transform: translateX(3px); }
.btn-primary { background: var(--forest); color: var(--forest-ink); }
.btn-primary:hover { background: color-mix(in srgb, var(--forest) 82%, #000); }
.btn-accent { background: var(--genet); color: var(--genet-ink); }
.btn-accent:hover { background: color-mix(in srgb, var(--genet) 85%, #fff); }
.btn-ghost { border-color: currentColor; color: var(--text-accent); background: transparent; }
.btn-ghost:hover { background: color-mix(in srgb, var(--text-accent) 8%, transparent); }
.on-photo .btn-ghost { color: #fff; }
.on-photo .btn-ghost:hover { background: rgba(255,255,255,.12); }
.btn-sm { padding: .7rem 1rem; font-size: .9rem; }

/* ---------- en-tête ---------- */
.site-head { position: fixed; top: 0; left: 0; right: 0; z-index: 60; padding-top: env(safe-area-inset-top, 0px); color: #fff; transition: background .25s ease, color .25s ease, box-shadow .25s ease; }
.site-head.solid, .no-photo .site-head { background: var(--surface); color: var(--ink); box-shadow: 0 1px 0 var(--line); }
.site-head .wrap { display: flex; align-items: center; gap: 1.5rem; min-height: 4.75rem; position: relative; }
.brand { display: inline-flex; align-items: center; gap: .75rem; text-decoration: none; color: inherit; }
.brand b { font: 400 1.65rem/1 var(--f-display); letter-spacing: .01em; }
.brand span { font: 500 .7rem/1.3 var(--f-text); letter-spacing: .12em; text-transform: uppercase; opacity: .85; border-left: 1px solid currentColor; padding-left: .75rem; }
.nav { margin-left: auto; display: flex; align-items: center; gap: 1.6rem; font: 500 .95rem/1 var(--f-text); }
.nav a { color: inherit; text-decoration: none; padding: .5rem 0; position: relative; }
.nav a:not(.btn)::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.nav a:not(.btn):hover::after, .nav a[aria-current="page"]::after { transform: scaleX(1); }
.nav .btn { padding: .8rem 1.1rem; }
.nav .btn::after { content: none; }
.menu-btn { display: none; margin-left: auto; background: none; border: 1px solid currentColor; color: inherit; font: 500 .9rem/1 var(--f-text); padding: .65rem .95rem; border-radius: 2px; cursor: pointer; }
@media (max-width: 1020px) {
  .menu-btn { display: inline-block; }
  .nav { display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; background: var(--surface); color: var(--ink); padding: .5rem clamp(1rem, 4vw, 2.5rem) 1.25rem; box-shadow: 0 12px 24px rgba(0,0,0,.14); }
  .nav.open { display: flex; }
  .nav a:not(.btn) { padding: .95rem 0; border-bottom: 1px solid var(--line); }
  .nav a::after { display: none; }
  .nav .btn { margin-top: 1rem; }
  .brand span { display: none; }
}

/* ---------- héros photo ---------- */
.photo-hero { position: relative; color: #fff; isolation: isolate; display: flex; align-items: flex-end; min-height: clamp(34rem, 88vh, 54rem); padding-block: 8rem clamp(3rem, 7vw, 5.5rem); overflow: hidden; }
.photo-hero.short { min-height: clamp(24rem, 54vh, 32rem); padding-bottom: clamp(2.5rem, 5vw, 3.5rem); }
.photo-hero > picture, .photo-band > picture, .cta-photo > picture, .photo-hero > img, .photo-band > img, .cta-photo > img { position: absolute; inset: 0; z-index: -2; }
.photo-hero img, .photo-band img, .cta-photo img { width: 100%; height: 100%; object-fit: cover; }
.photo-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8,16,11,.6) 0%, rgba(8,16,11,.08) 26%, rgba(8,16,11,.12) 48%, rgba(8,16,11,.8) 100%), linear-gradient(90deg, rgba(8,16,11,.5) 0%, rgba(8,16,11,0) 70%); }
.photo-hero .kicker { color: rgba(255,255,255,.88); }
.photo-hero h1 { max-width: 14ch; margin-top: 1.2rem; text-shadow: 0 2px 30px rgba(0,0,0,.25); }
.photo-hero.short h1 { max-width: 22ch; font-size: clamp(2.3rem, 5vw, 3.8rem); }
.photo-hero .lead { max-width: 37rem; margin-top: 1.4rem; color: rgba(255,255,255,.93); }
.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2.2rem; }
.photo-credit { position: absolute; right: clamp(1rem, 4vw, 2.5rem); bottom: .9rem; font-size: .7rem; line-height: 1; color: rgba(255,255,255,.7); letter-spacing: .04em; }
@media (max-width: 600px) { .photo-credit { display: none; } }

/* ---------- chiffres ---------- */
.figures { background: var(--surface); border-bottom: 1px solid var(--line); }
.figures .wrap { display: grid; grid-template-columns: repeat(4, 1fr); }
.fig { padding: 2.2rem 1.5rem 2.2rem 0; display: flex; flex-direction: column; gap: .6rem; }
.fig + .fig { border-left: 1px solid var(--line); padding-left: 1.5rem; }
.fig b { font: 400 clamp(2.2rem, 3.6vw, 3.1rem)/1 var(--f-display); font-variant-numeric: lining-nums tabular-nums; color: var(--text-accent); }
.fig span { font-size: .9rem; line-height: 1.45; color: var(--muted); }
@media (max-width: 820px) { .figures .wrap { grid-template-columns: 1fr 1fr; } .fig:nth-child(3) { border-left: 0; padding-left: 0; } .fig:nth-child(n+3) { border-top: 1px solid var(--line); } }

/* ---------- sections ---------- */
.section { padding-block: clamp(4rem, 9vw, 7rem); }
.section-alt { background: var(--surface); }
.section-head { display: flex; flex-direction: column; gap: 1.1rem; margin-bottom: clamp(2rem, 4vw, 3rem); max-width: 48rem; }
.split { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 6vw, 5.5rem); align-items: center; }
.split > * { min-width: 0; }
.split.rev > :first-child { order: 2; }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; } .split.rev > :first-child { order: 0; } }
.figure-photo { position: relative; margin: 0; }
.figure-photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.figure-photo.wide img { aspect-ratio: 3 / 2; }
.figure-photo figcaption { margin-top: .7rem; font-size: .78rem; color: var(--muted); }
.figure-photo::before { content: ""; position: absolute; left: -.9rem; top: 2rem; height: 40%; width: 3px; background: var(--genet); }

/* ---------- carte ---------- */
.map-shell { display: grid; grid-template-columns: 23rem 1fr; gap: 1.5rem; align-items: start; }
.map-shell > * { min-width: 0; }
@media (max-width: 960px) { .map-shell { grid-template-columns: 1fr; } }
.panel { background: var(--surface); border: 1px solid var(--line); padding: 1.4rem; }
.search label { display: block; font: 600 .9rem/1.3 var(--f-text); margin-bottom: .55rem; }
.search-box { position: relative; }
.search input { width: 100%; font: 500 1.05rem/1.2 var(--f-text); padding: .95rem 1rem; border-radius: 2px; border: 1px solid var(--line); border-bottom: 2px solid var(--ink); background: var(--bg); color: var(--ink); }
.search input:focus { border-bottom-color: var(--genet); outline: none; }
.suggest { position: absolute; left: 0; right: 0; top: calc(100% + 2px); background: var(--surface); border: 1px solid var(--line); box-shadow: 0 16px 32px rgba(0,0,0,.12); list-style: none; margin: 0; padding: .3rem; z-index: 20; max-height: 19rem; overflow: auto; }
.suggest li { display: flex; align-items: center; gap: .6rem; padding: .55rem .6rem; cursor: pointer; font-size: .95rem; line-height: 1.25; }
.suggest li[aria-selected="true"], .suggest li:hover { background: color-mix(in srgb, var(--genet) 16%, transparent); }
.suggest .cp { margin-left: auto; font-family: var(--f-mono); font-size: .8rem; color: var(--muted); }
.swatch { width: .75rem; height: .75rem; border-radius: 50%; flex: none; display: inline-block; }
.s-a { background: var(--dot-off); border: 1px solid var(--muted); }
.s-b { background: var(--forest-2); }
.s-c { background: var(--genet); }
.s-d { background: var(--slate); }
.s-e { background: repeating-linear-gradient(45deg, var(--slate) 0 2px, transparent 2px 4px); border: 1px solid var(--slate); }
.s-f { background: repeating-linear-gradient(45deg, var(--forest-2) 0 2px, transparent 2px 4px); border: 1px solid var(--forest-2); }
.result { margin-top: 1.2rem; border-top: 1px solid var(--line); padding-top: 1.2rem; display: flex; flex-direction: column; gap: .7rem; }
.result h3 { font: 400 2rem/1.1 var(--f-display); }
.result .meta { font: 400 .8rem/1.45 var(--f-mono); color: var(--muted); }
.badge { display: inline-flex; align-items: center; gap: .5rem; font: 600 .74rem/1 var(--f-text); letter-spacing: .1em; text-transform: uppercase; padding: .5rem .7rem; border: 1px solid currentColor; width: fit-content; }
.badge-a { color: var(--muted); }
.badge-b, .badge-f { color: var(--forest-2); }
.badge-c { color: color-mix(in srgb, var(--genet) 80%, var(--ink)); }
.badge-d, .badge-e { color: var(--slate); }
.result p { font-size: .95rem; line-height: 1.55; }
.result .fine { font-size: .78rem; line-height: 1.45; color: var(--muted); }
.legend { margin-top: 1.3rem; display: grid; gap: .15rem; font-size: .88rem; }
.legend button { all: unset; display: flex; align-items: center; gap: .6rem; cursor: pointer; padding: .3rem .25rem; }
.legend button:focus-visible { outline: 2px solid var(--genet); }
.legend button[aria-pressed="false"] { opacity: .35; }
.legend .n { margin-left: auto; font-family: var(--f-mono); font-size: .78rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.map-wrap { position: relative; background: var(--surface); border: 1px solid var(--line); overflow: hidden; aspect-ratio: 1 / 1; max-height: 80vh; width: 100%; touch-action: none; }
.map-wrap canvas { display: block; width: 100%; height: 100%; cursor: grab; }
.map-wrap canvas:active { cursor: grabbing; }
.map-ctrl { position: absolute; right: .8rem; top: .8rem; display: flex; flex-direction: column; border: 1px solid var(--line); background: var(--surface); }
.map-ctrl button { width: 2.5rem; height: 2.5rem; border: 0; border-bottom: 1px solid var(--line); background: var(--surface); color: var(--ink); font: 500 1.15rem/1 var(--f-text); cursor: pointer; }
.map-ctrl button:last-child { border-bottom: 0; }
.map-ctrl button:hover { background: var(--bg); }
.map-tip { position: absolute; pointer-events: none; background: var(--ink); color: var(--bg); font: 500 .82rem/1.3 var(--f-text); padding: .4rem .6rem; white-space: nowrap; transform: translate(-50%, calc(-100% - 10px)); }
.map-source { position: absolute; left: .6rem; bottom: .6rem; max-width: calc(100% - 1.2rem); background: color-mix(in srgb, var(--surface) 90%, transparent); padding: .3rem .55rem; font-size: .72rem; line-height: 1.35; color: var(--muted); }
.map-loading { position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted); }
@media (max-width: 760px) { .map-wrap { aspect-ratio: 4 / 5; } }

/* ---------- régime ---------- */
.curve { display: grid; grid-template-columns: repeat(8, 1fr); gap: 6px; align-items: end; height: 10rem; margin-top: 2rem; border-bottom: 1px solid var(--ink); }
.curve div { background: var(--forest-2); position: relative; }
.curve div span { position: absolute; top: -1.5rem; left: 0; right: 0; text-align: center; font: 500 .78rem/1 var(--f-mono); color: var(--ink); }
.curve-x { display: grid; grid-template-columns: repeat(8, 1fr); gap: 6px; font: 400 .74rem/1.2 var(--f-mono); color: var(--muted); margin-top: .5rem; text-align: center; }
.table-scroll { overflow-x: auto; }
table.cmp { width: 100%; border-collapse: collapse; font-size: .96rem; line-height: 1.5; min-width: 40rem; border-top: 2px solid var(--ink); }
table.cmp th, table.cmp td { text-align: left; vertical-align: top; padding: 1.05rem 1.2rem 1.05rem 0; border-bottom: 1px solid var(--line); }
table.cmp thead th { font: 400 1.6rem/1.1 var(--f-display); padding-top: 1.2rem; }
table.cmp thead th:nth-child(3) { color: color-mix(in srgb, var(--genet) 75%, var(--ink)); }
table.cmp tbody th { font-weight: 600; width: 24%; font-size: .88rem; color: var(--muted); }
.cols { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); }
.cols > * { min-width: 0; }
@media (max-width: 820px) { .cols { grid-template-columns: 1fr; } }
.marks { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }
.marks li { display: grid; grid-template-columns: 1.6rem 1fr; gap: .4rem; padding: 1rem 0; border-bottom: 1px solid var(--line); line-height: 1.55; }
.marks li::before { content: ""; width: .5rem; height: .5rem; margin-top: .6rem; background: var(--forest-2); }
.marks.warn li::before { background: none; border: 1.5px solid var(--sign); transform: rotate(45deg); width: .45rem; height: .45rem; }
.marks b { font-weight: 600; }

/* ---------- bande photo ---------- */
.photo-band { position: relative; isolation: isolate; color: #fff; padding-block: clamp(5rem, 11vw, 9rem); overflow: hidden; }
.photo-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(8,16,11,.86) 0%, rgba(8,16,11,.62) 55%, rgba(8,16,11,.3) 100%); }
.photo-band .kicker { color: rgba(255,255,255,.82); }
.photo-band .split { align-items: end; }
.photo-band .copy p { color: rgba(255,255,255,.9); }
.band-card { background: var(--surface); color: var(--ink); padding: clamp(1.5rem, 3vw, 2.4rem); display: flex; flex-direction: column; gap: 1.2rem; }
.band-card .marks li { padding: .8rem 0; font-size: .96rem; }

/* ---------- offre ---------- */
.offer { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); background: var(--surface); }
.offer > * { min-width: 0; }
.offer > * + * { border-left: 1px solid var(--line); }
@media (max-width: 820px) { .offer { grid-template-columns: 1fr; } .offer > * + * { border-left: 0; border-top: 1px solid var(--line); } }
.price-card { padding: clamp(1.6rem, 3.5vw, 2.6rem); display: flex; flex-direction: column; gap: 1.1rem; position: relative; }
.price-card.feature::before { content: ""; position: absolute; top: -1px; left: -1px; right: -1px; height: 4px; background: var(--genet); }
.price-card .step { font: 500 .76rem/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.price-card h3 { font: 400 2rem/1.1 var(--f-display); }
.price { font: 400 3.6rem/1 var(--f-display); font-variant-numeric: lining-nums; }
.price small { font: 400 .92rem/1 var(--f-text); color: var(--muted); margin-left: .5rem; }
.price-plus { font-weight: 600; color: var(--text-accent); }
.price-card ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.price-card li { padding: .7rem 0 .7rem 1.4rem; border-bottom: 1px solid var(--line); position: relative; font-size: .95rem; line-height: 1.5; }
.price-card li::before { content: ""; position: absolute; left: 0; top: 1.3rem; width: .55rem; height: 1px; background: var(--ink); }
.price-card .btn { margin-top: auto; align-self: flex-start; }
.steps { list-style: none; padding: 0; margin: 0; counter-reset: s; border-top: 1px solid var(--line); }
.steps li { counter-increment: s; display: grid; grid-template-columns: 3.5rem 1fr; gap: 1rem; padding: 1.3rem 0; border-bottom: 1px solid var(--line); }
.steps li::before { content: "0" counter(s); font: 400 1.9rem/1 var(--f-display); color: color-mix(in srgb, var(--genet) 85%, var(--ink)); }
.steps h3 { margin-bottom: .3rem; }
.note { border-left: 3px solid var(--genet); padding: .2rem 0 .2rem 1.4rem; display: flex; flex-direction: column; gap: .8rem; }

/* ---------- FAQ ---------- */
.faq { border-top: 2px solid var(--ink); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; font: 500 1.1rem/1.45 var(--f-text); padding: 1.3rem 0; list-style: none; display: flex; gap: 1.5rem; justify-content: space-between; align-items: baseline; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font: 300 1.6rem/1 var(--f-text); color: var(--muted); transition: transform .2s ease; }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details > div { padding: 0 3rem 1.5rem 0; display: grid; gap: .7rem; color: var(--muted); }
.linklist { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }
.linklist li { padding: .95rem 0; border-bottom: 1px solid var(--line); line-height: 1.5; }

/* ---------- blog ---------- */
.posts { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1.25rem, 2.5vw, 2rem); }
.posts > * { min-width: 0; }
@media (max-width: 1100px) { .posts { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .posts { grid-template-columns: 1fr; } }
.post-card { display: flex; flex-direction: column; gap: .8rem; text-decoration: none; color: var(--ink); }
.post-card .ph { overflow: hidden; }
.post-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .6s ease; }
.post-card:hover img { transform: scale(1.04); }
.post-card h3 { font: 400 1.45rem/1.2 var(--f-display); }
.post-card p { font-size: .93rem; line-height: 1.55; color: var(--muted); }
.post-card .more { font-size: .88rem; font-weight: 600; color: var(--text-accent); margin-top: auto; }
.tag { font: 500 .74rem/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.photo-hero .tag { color: rgba(255,255,255,.85); text-decoration: none; }
.article-body { padding-block: clamp(3rem, 7vw, 5rem); }
.prose { display: flex; flex-direction: column; gap: 1.15rem; }
.prose > p:first-child { font-size: 1.2rem; line-height: 1.65; }
.prose h2 { font-size: clamp(1.7rem, 3vw, 2.2rem); margin-top: 1.8rem; }
.prose h3 { font-size: 1.15rem; margin-top: .8rem; }
.prose ul, .prose ol { margin: 0; padding-left: 1.3rem; display: grid; gap: .5rem; }
.prose blockquote { margin: 1rem 0; padding: 0 0 0 1.5rem; border-left: 3px solid var(--genet); font: 400 1.5rem/1.4 var(--f-display); color: var(--ink); }
.byline { font-size: .9rem; color: rgba(255,255,255,.85); }
.sources { font-size: .88rem; border-top: 1px solid var(--line); padding-top: 1.2rem; margin-top: 2.5rem; color: var(--muted); }
.sources ul { padding-left: 1.1rem; margin: .5rem 0 0; display: grid; gap: .35rem; }
.sources a { word-break: break-word; }
.aside-cta { margin-top: 3rem; background: var(--forest); color: #fff; padding: clamp(1.5rem, 3vw, 2.2rem); display: flex; flex-direction: column; gap: 1rem; }
.aside-cta h3 { font: 400 1.7rem/1.2 var(--f-display); }
.aside-cta p { color: rgba(255,255,255,.88); }
.aside-cta .btn { align-self: flex-start; }

/* ---------- appel à l'action photo ---------- */
.cta-photo { position: relative; isolation: isolate; color: #fff; padding-block: clamp(4.5rem, 10vw, 7.5rem); overflow: hidden; }
.cta-photo::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(8,16,11,.78), rgba(8,16,11,.42)); }
.cta-photo .wrap { display: flex; flex-wrap: wrap; gap: 2rem; align-items: flex-end; justify-content: space-between; }
.cta-photo h2 { max-width: 20ch; }

/* ---------- formulaires ---------- */
.form { display: grid; gap: 1.2rem; }
.form .row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
@media (max-width: 640px) { .form .row { grid-template-columns: 1fr; } }
.field { display: flex; flex-direction: column; gap: .4rem; min-width: 0; }
.field label { font-weight: 600; font-size: .88rem; }
.field input, .field select, .field textarea { font: 400 1rem/1.4 var(--f-text); padding: .85rem .9rem; border-radius: 2px; border: 1px solid var(--line); border-bottom: 2px solid var(--muted); background: var(--bg); color: var(--ink); width: 100%; }
.field input:focus, .field select:focus, .field textarea:focus { border-bottom-color: var(--genet); outline: none; }
.field textarea { min-height: 9rem; resize: vertical; }
.consent { display: grid; grid-template-columns: 1.3rem 1fr; gap: .6rem; font-size: .86rem; line-height: 1.5; color: var(--muted); }
.form-msg { font-size: .95rem; padding: .9rem 1rem; background: color-mix(in srgb, var(--forest-2) 14%, var(--surface)); }
.form-msg.err { background: color-mix(in srgb, var(--sign) 14%, var(--surface)); }
.form .btn { justify-self: start; }

/* ---------- pied de page (sombre dans les deux thèmes, par choix) ---------- */
.site-foot { background: #10241b; color: rgba(255,255,255,.72); padding-block: 4rem 2.5rem; font-size: .9rem; line-height: 1.6; }
.site-foot a { color: rgba(255,255,255,.88); }
.site-foot .brand { color: #fff; }
.foot-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 2.5rem; }
.foot-grid > * { min-width: 0; }
.foot-grid h4, .foot-grid .foot-h { margin: 0 0 .9rem; font: 500 .74rem/1 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: #fff; }
.foot-grid ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; }
.disclaimer { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.14); font-size: .8rem; color: rgba(255,255,255,.55); }
@media (max-width: 820px) { .foot-grid { grid-template-columns: 1fr; } }

/* page sans photo */
.no-photo main { padding-top: 4.75rem; }
@media (max-width: 520px) { .fig b { font-size: 1.75rem; white-space: nowrap; } .fig { padding-right: .75rem; } .fig + .fig { padding-left: .9rem; } }

/* ================= v3 : identité sans empattements, sobre et corporate ================= */
:root { --bg: #ffffff; --alt: #f2f5f2; --f-display: "Archivo", "Helvetica Neue", Arial, sans-serif; --f-text: "Archivo", "Helvetica Neue", Arial, sans-serif; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --bg: #0e1411; --alt: #131b16; } }
:root[data-theme="dark"] { --bg: #0e1411; --alt: #131b16; }
body { font-size: 1.04rem; line-height: 1.68; font-stretch: 100%; }
.section-alt { background: var(--alt); }
h1, h2 { font-family: var(--f-display); font-weight: 750; font-stretch: 112%; letter-spacing: -.025em; line-height: 1.02; }
h1 { font-size: clamp(2.5rem, 5.8vw, 4.6rem); }
h2 { font-size: clamp(1.9rem, 3.6vw, 2.8rem); }
h3 { font-weight: 700; font-stretch: 105%; letter-spacing: -.01em; }
.kicker { font: 600 .95rem/1.3 var(--f-text); letter-spacing: 0; text-transform: none; color: var(--forest-2); }
.kicker::before { content: none; }
.photo-hero .kicker, .photo-band .kicker, .cta-photo .kicker { color: #fff; opacity: .9; }
.btn { border-radius: 6px; font-weight: 650; }
.btn::after { content: none; }
.nav .btn { border-radius: 6px; }
.brand b { font: 850 1.45rem/1 var(--f-display); font-stretch: 125%; letter-spacing: -.01em; }
.brand span { letter-spacing: .02em; text-transform: none; font-size: .78rem; font-weight: 500; }
.fig b, .price, .result h3, .price-card h3, .post-card h3, .aside-cta h3, table.cmp thead th { font-family: var(--f-display); font-weight: 750; font-stretch: 112%; letter-spacing: -.02em; }
.fig b { font-size: clamp(2rem, 3.2vw, 2.7rem); }
.price { font-size: 3.1rem; }
.price-card h3 { font-size: 1.6rem; }
.result h3 { font-size: 1.7rem; }
.post-card h3 { font-size: 1.25rem; line-height: 1.25; }
table.cmp thead th { font-size: 1.35rem; }
.steps li::before { content: counter(s); font: 750 1.5rem/1 var(--f-display); font-stretch: 112%; color: var(--forest-2); }
.prose blockquote { font: 600 1.3rem/1.45 var(--f-text); font-stretch: 105%; border-left-color: var(--forest-2); }
.price-card.feature::before { background: var(--forest-2); }
.figure-photo::before { content: none; }
.figure-photo img { border-radius: 8px; }
.post-card .ph { border-radius: 8px; }
.tag, .price-card .step, .badge, .foot-grid h4, .foot-grid .foot-h { letter-spacing: .02em; text-transform: none; font-size: .85rem; }
.badge { border-radius: 999px; }
.note { border-left-color: var(--forest-2); }
.marks.warn li::before { border-radius: 2px; }

/* ================= v4 : titres à empattements (Cormorant Garamond), texte Archivo ================= */
:root { --f-display: "Cormorant Garamond", "Garamond", Georgia, serif; }
h1, h2 { font-family: var(--f-display); font-weight: 600; font-stretch: normal; letter-spacing: -.01em; line-height: 1.04; }
h1 { font-size: clamp(2.9rem, 6.6vw, 5.4rem); }
h2 { font-size: clamp(2.2rem, 4.2vw, 3.3rem); }
.fig b, .price, .result h3, .price-card h3, .post-card h3, .aside-cta h3, table.cmp thead th { font-family: var(--f-display); font-weight: 600; font-stretch: normal; letter-spacing: 0; }
.fig b { font-size: clamp(2.4rem, 3.8vw, 3.3rem); }
.price { font-size: 3.8rem; }
.price-card h3 { font-size: 2rem; }
.result h3 { font-size: 2.1rem; }
.post-card h3 { font-size: 1.6rem; line-height: 1.15; }
table.cmp thead th { font-size: 1.7rem; }
.steps li::before { font: 600 2rem/1 var(--f-display); font-stretch: normal; }
.brand b { font: 700 1.75rem/1 var(--f-display); font-stretch: normal; letter-spacing: .04em; }
.prose blockquote { font: 600 1.65rem/1.35 var(--f-display); font-stretch: normal; }
@media (max-width: 520px) { .fig b { font-size: 2rem; } }

/* ================= test d'éligibilité ================= */
.test-app { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: clamp(1.25rem, 3vw, 2.2rem); display: flex; flex-direction: column; gap: 1.5rem; min-width: 0; }
.t-head { display: flex; flex-direction: column; gap: .6rem; }
.t-count { font-size: .85rem; font-weight: 600; color: var(--forest-2); }
.t-bar { height: 4px; background: var(--line); border-radius: 4px; overflow: hidden; }
.t-bar span { display: block; height: 100%; width: 0; background: var(--forest-2); transition: width .3s ease; }
.t-q { border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.t-q legend { padding: 0; margin-bottom: 1rem; }
.t-q h2 { font-size: clamp(1.6rem, 3vw, 2.1rem); }
.t-opts { display: grid; gap: .6rem; }
.t-opt { display: grid; grid-template-columns: 1.3rem 1fr; gap: .8rem; align-items: start; padding: .95rem 1.1rem; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; line-height: 1.45; transition: border-color .15s ease, background .15s ease; }
.t-opt:hover { border-color: var(--forest-2); }
.t-opt input { margin: .2rem 0 0; accent-color: var(--forest-2); width: 1.05rem; height: 1.05rem; }
.t-opt:has(input:checked) { border-color: var(--forest-2); background: color-mix(in srgb, var(--forest-2) 8%, var(--surface)); }
.t-search input { width: 100%; font: 500 1.05rem/1.2 var(--f-text); padding: .95rem 1rem; border-radius: 6px; border: 1px solid var(--line); border-bottom: 2px solid var(--ink); background: var(--bg); color: var(--ink); }
.t-search input:focus { border-bottom-color: var(--genet); outline: none; }
.t-chosen { display: flex; flex-direction: column; gap: .5rem; min-height: 1rem; }
.t-skip { align-self: flex-start; background: none; border: 0; padding: 0; color: var(--text-accent); text-decoration: underline; cursor: pointer; font: inherit; font-size: .92rem; }
.t-nav { display: flex; justify-content: space-between; gap: .8rem; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 1.2rem; }
.t-nav .t-next { margin-left: auto; }
.t-nav .btn[disabled] { opacity: .45; cursor: not-allowed; }
.t-result { display: flex; flex-direction: column; gap: 1rem; }
.t-level { align-self: flex-start; font-weight: 700; font-size: .95rem; padding: .45rem .85rem; border-radius: 999px; color: #fff; }
.t-lvl-eligible .t-level { background: var(--forest-2); }
.t-lvl-confirmer .t-level { background: #b07d07; }
.t-lvl-non .t-level { background: var(--sign); }
.t-result h2 { font-size: clamp(1.5rem, 2.8vw, 2rem); }
.t-reco { font-weight: 500; border-left: 3px solid var(--forest-2); padding-left: 1rem; }
.t-grp h3 { font-size: 1rem; margin-bottom: .4rem; }
.t-grp ul { margin: 0; padding-left: 1.2rem; display: grid; gap: .35rem; font-size: .95rem; line-height: 1.5; }
.t-block h3 { color: var(--sign); }
.t-warn h3 { color: #a06f00; }
.t-ok h3 { color: var(--forest-2); }
.t-actions { display: flex; flex-wrap: wrap; gap: .7rem; }
.t-mail { border-top: 1px solid var(--line); padding-top: 1.5rem; }
.t-mail h3 { font-size: 1.3rem; }
.t-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.test-teaser { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: 1.2rem 2rem; align-items: center; justify-content: space-between; padding: 1.5rem 1.6rem; border: 1px solid var(--line); border-radius: 10px; background: var(--alt); }
.test-teaser > div { flex: 1 1 26rem; min-width: 0; display: flex; flex-direction: column; gap: .4rem; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .t-warn h3 { color: #e7b833; } }
:root[data-theme="dark"] .t-warn h3 { color: #e7b833; }

[hidden] { display: none !important; }

/* jauge d'éligibilité */
.t-gauge-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 1.2rem 1.8rem; }
.t-gauge { position: relative; width: 180px; height: 180px; flex: none; }
.t-gauge svg { display: block; width: 100%; height: 100%; }
.t-g-track { stroke: var(--line); }
.t-g-val { stroke: var(--forest-2); }
.t-tone-mid .t-g-val { stroke: var(--genet); }
.t-tone-low .t-g-val { stroke: var(--sign); }
.t-g-num { position: absolute; inset: 0; display: flex; align-items: baseline; justify-content: center; padding-top: 62px; font-variant-numeric: tabular-nums; }
.t-g-num b { font: 600 3.4rem/1 var(--f-display); }
.t-g-num span { font: 600 1.3rem/1 var(--f-display); margin-left: .1rem; color: var(--muted); }
.t-gauge-txt { flex: 1 1 14rem; min-width: 0; display: flex; flex-direction: column; gap: .4rem; }
.t-g-label { font-size: .85rem; font-weight: 600; color: var(--muted); }
.t-tone-low .t-gauge-txt h2 { color: var(--sign); }
.t-result .t-reco { font-size: 1.08rem; }
.t-tone-low .t-reco { border-left-color: var(--sign); }

/* ================= tableau des tarifs ================= */
.pricing { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; align-items: stretch; padding-top: .9rem; }
.pricing > * { min-width: 0; }
@media (max-width: 960px) { .pricing { grid-template-columns: 1fr; max-width: 34rem; } }
.price-col { position: relative; display: flex; flex-direction: column; gap: .9rem; padding: clamp(1.5rem, 3vw, 2.1rem); background: var(--surface); border: 1px solid var(--line); border-radius: 10px; }
.price-col.featured { border: 2px solid var(--forest-2); box-shadow: 0 18px 40px rgba(20, 32, 25, .10); }
.price-col .badge-top { position: absolute; top: -.8rem; left: 1.5rem; background: var(--forest-2); color: #fff; font-size: .78rem; font-weight: 700; padding: .3rem .7rem; border-radius: 999px; }
.price-col .step { font-size: .85rem; font-weight: 600; color: var(--muted); }
.price-col h3 { font: 600 1.55rem/1.15 var(--f-display); min-height: 5.4rem; }
.price-col .price { font: 600 3rem/1 var(--f-display); }
.price-col .price small { font: 400 .95rem/1 var(--f-text); color: var(--muted); margin-left: .4rem; }
.price-col .price-devis { font-size: 2.3rem; }
.price-note { font-size: .88rem; color: var(--muted); margin-top: -.4rem; }
.price-col ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line); }
.price-col li { padding: .65rem 0 .65rem 1.5rem; border-bottom: 1px solid var(--line); position: relative; font-size: .94rem; line-height: 1.45; }
.price-col li::before { content: ""; position: absolute; left: .1rem; top: 1rem; width: .55rem; height: .3rem; border-left: 2px solid var(--forest-2); border-bottom: 2px solid var(--forest-2); transform: rotate(-45deg); }
.price-col .btn { margin-top: auto; align-self: stretch; }
@media (max-width: 960px) { .price-col h3 { min-height: 0; } }

/* ================= Devenez expert FRR ================= */
.pros { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }
.pros > * { min-width: 0; }
@media (max-width: 1000px) { .pros { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .pros { grid-template-columns: 1fr; } }
.pro { display: flex; flex-direction: column; gap: .6rem; padding: 1.5rem; background: var(--surface); border: 1px solid var(--line); border-top: 3px solid var(--forest-2); border-radius: 8px; }
.pro h3 { font: 600 1.5rem/1.15 var(--f-display); }
#candidature h3 { font: 600 1.7rem/1.15 var(--f-display); }
#candidature select { font: 400 1rem/1.4 var(--f-text); padding: .85rem .9rem; border-radius: 2px; border: 1px solid var(--line); border-bottom: 2px solid var(--muted); background: var(--bg); color: var(--ink); width: 100%; }

/* ---------- test : bénéfice et économie d'impôt (jackpot) ---------- */
.t-money { display: flex; align-items: center; gap: .6rem; max-width: 22rem; border: 1px solid var(--line, #dde2da); border-radius: 8px; padding: .2rem .9rem; background: var(--surface); }
.t-money:focus-within { border-color: var(--genet); box-shadow: 0 0 0 3px color-mix(in srgb, var(--genet) 25%, transparent); }
.t-money input { flex: 1; min-width: 0; border: 0; background: none; font: inherit; font-size: 1.6rem; font-weight: 600; padding: .55rem 0; color: inherit; outline: none; }
.t-money span { color: var(--muted, #59655e); white-space: nowrap; }
.t-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .9rem; }
.t-chip { font: inherit; font-size: .9rem; border: 1px solid var(--line, #dde2da); background: none; color: inherit; border-radius: 999px; padding: .35rem .85rem; cursor: pointer; }
.t-chip:hover { border-color: var(--genet); background: color-mix(in srgb, var(--genet) 12%, transparent); }

.t-jackpot { position: relative; overflow: hidden; background: radial-gradient(120% 140% at 50% 0%, #2a5a43 0%, var(--forest) 55%, #10261c 100%); color: #fff; border-radius: 14px; padding: 1.6rem 1.4rem 1.3rem; margin: 0 0 1.8rem; text-align: center; border: 2px solid var(--genet); box-shadow: 0 0 0 0 rgba(231,184,51,.55); }
.t-jackpot::before { content: ""; position: absolute; inset: -50%; background: conic-gradient(from 0deg, transparent 0 20deg, rgba(231,184,51,.13) 20deg 30deg, transparent 30deg 60deg, rgba(231,184,51,.13) 60deg 70deg, transparent 70deg 110deg, rgba(231,184,51,.13) 110deg 120deg, transparent 120deg 160deg, rgba(231,184,51,.13) 160deg 170deg, transparent 170deg 210deg, rgba(231,184,51,.13) 210deg 220deg, transparent 220deg 260deg, rgba(231,184,51,.13) 260deg 270deg, transparent 270deg 310deg, rgba(231,184,51,.13) 310deg 320deg, transparent 320deg); pointer-events: none; }
.t-jackpot > * { position: relative; }
.t-jp-kicker { text-transform: uppercase; letter-spacing: .14em; font-size: .78rem; font-weight: 600; color: #f3d77a; margin: 0 0 .8rem; }
.t-jp-grid { display: grid; grid-template-columns: 1fr 1.35fr; gap: .8rem; align-items: end; }
.t-jp-cell { background: rgba(0,0,0,.18); border: 1px solid rgba(231,184,51,.35); border-radius: 10px; padding: .8rem .6rem; }
.t-jp-label { display: block; font-size: .85rem; opacity: .85; margin-bottom: .2rem; }
.t-jp-num { display: block; font-family: var(--f-display); font-weight: 700; font-size: clamp(1.9rem, 5vw, 2.6rem); line-height: 1.05; color: #ffd75e; font-variant-numeric: tabular-nums; text-shadow: 0 0 18px rgba(255,200,40,.45); white-space: nowrap; }
.t-jp-main .t-jp-num { font-size: clamp(2.4rem, 7.5vw, 3.6rem); }
.t-jp-note { font-size: .8rem; line-height: 1.5; opacity: .82; margin: 1rem auto 0; max-width: 40rem; }
@media (prefers-reduced-motion: no-preference) {
  .t-jackpot::before { animation: t-rays 14s linear infinite; }
  .t-jackpot.is-live { animation: t-pop .5s cubic-bezier(.2,1.4,.4,1) both; }
}
@keyframes t-rays { to { transform: rotate(360deg); } }
@keyframes t-pop { from { transform: scale(.85); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes t-glow { 0%,100% { box-shadow: 0 0 0 0 rgba(231,184,51,.55), 0 0 22px rgba(231,184,51,.25); } 50% { box-shadow: 0 0 0 7px rgba(231,184,51,0), 0 0 38px rgba(231,184,51,.55); } }
@keyframes t-blink { 0%,100% { color: #ffd75e; text-shadow: 0 0 18px rgba(255,200,40,.45); } 50% { color: #fff4c2; text-shadow: 0 0 30px rgba(255,215,80,.95), 0 0 6px #fff; } }
@media (max-width: 560px) { .t-jp-grid { grid-template-columns: 1fr; } }

/* incitation à recevoir le bilan */
.t-gate { border: 2px solid var(--genet); border-radius: 14px; padding: 1.4rem 1.3rem 1.5rem; background: color-mix(in srgb, var(--genet) 6%, var(--surface)); }
.t-cta-head { display: grid; grid-template-columns: auto 1fr; gap: .9rem; align-items: center; margin-bottom: .4rem; }
.t-cta-head h2 { margin: 0; font-size: clamp(1.6rem, 3.6vw, 2.1rem); line-height: 1.1; }
.t-arrow { width: 3rem; height: 3rem; border-radius: 50%; background: var(--genet); color: var(--genet-ink); display: grid; place-items: center; flex: none; }
.t-arrow svg { width: 1.5rem; height: 1.5rem; }
.t-gate-lead b { color: var(--ink); }
.t-gate .btn-accent { font-size: 1.05rem; padding-inline: 1.6rem; }
@media (prefers-reduced-motion: no-preference) {
  .t-arrow svg { animation: t-bounce 1.3s ease-in-out infinite; }
  .t-gate .btn-accent svg { animation: t-nudge 1.3s ease-in-out infinite; }
}
.t-gate .btn-accent svg { width: 1.1rem; height: 1.1rem; margin-left: .5rem; vertical-align: -.15rem; }
@keyframes t-bounce { 0%,100% { transform: translateY(-3px); } 50% { transform: translateY(4px); } }
@keyframes t-nudge { 0%,100% { transform: translateX(0); } 50% { transform: translateX(4px); } }

/* ---------- questions BOFiP ---------- */
.q-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr)); gap: 1rem; }
.q-card { display: flex; flex-direction: column; gap: .55rem; padding: 1.2rem 1.25rem 1.3rem; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--ink); text-decoration: none; transition: border-color .15s ease, transform .15s ease; }
.q-card:hover { border-color: var(--forest-2); transform: translateY(-2px); }
.q-card h3 { font-family: var(--f-display); font-weight: 600; font-size: 1.3rem; line-height: 1.2; margin: 0; }
.q-card p { margin: 0; font-size: .92rem; line-height: 1.5; color: var(--muted); }
.q-card .tag { color: var(--forest-2); }
.q-nav { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; padding-block: .5rem 0; }
.q-nav span { font-weight: 600; margin-right: .3rem; }
.q-nav a { border: 1px solid var(--line); border-radius: 999px; padding: .4rem .9rem; font-size: .9rem; text-decoration: none; color: var(--ink); }
.q-nav a:hover { border-color: var(--genet); background: color-mix(in srgb, var(--genet) 12%, transparent); }
.q-rub { scroll-margin-top: 5rem; }
.q-rub + .q-rub { padding-top: 0; }
.q-more { margin-top: 2rem; }
.related { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--line); }
.related h2 { font-size: 1.6rem; margin: 0 0 1.2rem; }
.q-rub .posts { grid-template-columns: repeat(3, 1fr); }
.related .posts { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 1100px) { .q-rub .posts { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .q-rub .posts, .related .posts { grid-template-columns: 1fr; } }

/* ---------- simulateur charges sociales ---------- */
.prose .simu { margin: 2.2rem 0 2.6rem; padding: 1.5rem 1.4rem 1.3rem; border: 2px solid var(--genet); border-radius: 14px; background: color-mix(in srgb, var(--genet) 6%, var(--surface)); }
.prose .simu h2 { margin: .2rem 0 1.2rem; font-size: clamp(1.5rem, 3.4vw, 1.9rem); }
.simu-kicker { margin: 0; font-size: .78rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: color-mix(in srgb, var(--genet) 75%, var(--ink)); }
.simu .field { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 1rem; }
.simu label { font-size: .9rem; font-weight: 600; }
.simu .t-money { max-width: none; }
.simu .t-money input { font-size: 1.35rem; }
.simu-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; }
.simu-row input { font: inherit; padding: .6rem .7rem; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--ink); width: 100%; box-sizing: border-box; }
.simu-res { display: grid; grid-template-columns: 1fr 1.3fr; gap: .8rem; margin-top: .4rem; }
.simu-res > div { background: var(--forest); color: #fff; border-radius: 10px; padding: .9rem 1rem; text-align: center; }
.simu-res span { display: block; font-size: .85rem; opacity: .85; }
.simu-res b { display: block; font-family: var(--f-display); font-size: clamp(1.7rem, 4.5vw, 2.3rem); color: #ffd75e; font-variant-numeric: tabular-nums; line-height: 1.15; }
.simu-main b { font-size: clamp(2rem, 5.5vw, 2.8rem); }
.ss-scale { margin: 1.3rem .3rem .4rem; }
.ss-bar { position: relative; display: flex; height: 10px; border-radius: 99px; overflow: visible; }
.ss-bar i { display: block; height: 100%; }
.ss-bar .z1 { width: 25%; background: var(--forest-2); border-radius: 99px 0 0 99px; }
.ss-bar .z2 { width: 45%; background: linear-gradient(90deg, var(--forest-2), var(--genet)); }
.ss-bar .z3 { width: 30%; background: var(--line); border-radius: 0 99px 99px 0; }
.ss-cursor { position: absolute; top: 50%; width: 20px; height: 20px; margin: -10px 0 0 -10px; border-radius: 50%; background: var(--surface); border: 4px solid var(--ink); transition: left .25s ease; }
.ss-ticks { position: relative; height: 1.4rem; margin-top: .45rem; font-size: .75rem; color: var(--muted); }
.ss-ticks span { position: absolute; transform: translateX(-50%); white-space: nowrap; }
.ss-ticks span:first-child { transform: none; }
.ss-ticks span:last-child { transform: translateX(-100%); }
.ss-msg { font-weight: 600; margin: .6rem 0 .2rem; }
.simu-detail, .simu-note { font-size: .85rem; color: var(--muted); margin: .3rem 0 0; }
.simu-note { margin-top: 1rem; padding-top: .8rem; border-top: 1px solid var(--line); }
@media (max-width: 600px) { .simu-row, .simu-res { grid-template-columns: 1fr; } }
@media (max-width: 820px) { .figures .fig:nth-child(3) { padding-left: 0; } }

/* ---------- analyses : sommaire, groupes, thèmes ---------- */
.toc-sec { padding-block: clamp(2rem, 4vw, 3rem) 0; }
.toc { display: grid; grid-template-columns: 1.6fr 1fr; gap: 1.2rem; }
.toc-col { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); padding: 1.3rem 1.4rem 1rem; }
.toc-head { display: flex; flex-direction: column; gap: .25rem; text-decoration: none; color: var(--ink); padding-bottom: .9rem; border-bottom: 1px solid var(--line); }
.toc-head b { font: 600 1.5rem/1.15 var(--f-display); }
.toc-head small { color: var(--muted); font-size: .85rem; }
.toc ul { list-style: none; margin: 0; padding: 0; }
.toc li a { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .65rem 0; border-bottom: 1px solid var(--line); text-decoration: none; color: var(--ink); font-size: .97rem; }
.toc li:last-child a { border-bottom: 0; }
.toc li a:hover span { color: var(--text-accent); }
.toc li em { font-style: normal; font-family: var(--f-mono); font-size: .8rem; color: var(--muted); min-width: 2ch; text-align: right; }
.group { scroll-margin-top: 4rem; }
.group-head { max-width: 46rem; margin-bottom: clamp(1.6rem, 3vw, 2.4rem); display: flex; flex-direction: column; gap: .7rem; }
.group-head h2 { margin: 0; }
.group + .group { border-top: 1px solid var(--line); }
.theme { scroll-margin-top: 5rem; padding-top: 1.6rem; margin-top: 1.6rem; border-top: 1px solid var(--line); }
.group-head + .theme { margin-top: 0; }
.theme + .theme { margin-top: clamp(2.4rem, 4vw, 3.2rem); }
.theme-head { display: grid; grid-template-columns: auto 1fr auto; gap: 1.1rem; align-items: start; margin-bottom: 1.4rem; }
.theme-n { font: 500 .85rem/1.9 var(--f-mono); color: var(--text-accent); }
.theme-head h3 { font: 600 1.55rem/1.2 var(--f-display); margin: 0 0 .3rem; }
.theme-head p { margin: 0; color: var(--muted); font-size: .95rem; max-width: 44rem; }
.theme-src { font: 500 .75rem/1.5 var(--f-mono); color: var(--muted); border: 1px solid var(--line); border-radius: 999px; padding: .3rem .7rem; white-space: nowrap; }
.posts-sm { grid-template-columns: repeat(4, 1fr); }
.posts-sm .post-card img { aspect-ratio: 16 / 10; }
.posts-sm .post-card h3 { font-size: 1.12rem; line-height: 1.28; }
.posts-sm .post-card p { font-size: .87rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 1100px) { .posts-sm { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 820px) { .toc { grid-template-columns: 1fr; } .posts-sm { grid-template-columns: repeat(2, 1fr); } .theme-head { grid-template-columns: auto 1fr; } .theme-src { grid-column: 2; justify-self: start; white-space: normal; } }
@media (max-width: 560px) { .posts-sm { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
  .posts-sm { gap: 0; }
  .posts-sm .post-card { display: grid; grid-template-columns: 92px 1fr; grid-template-rows: auto auto; column-gap: .9rem; row-gap: .25rem; padding: .9rem 0; border-bottom: 1px solid var(--line); align-items: start; }
  .posts-sm .post-card .ph { grid-row: 1 / span 2; border-radius: 6px; }
  .posts-sm .post-card img { aspect-ratio: 1 / 1; }
  .posts-sm .post-card h3 { font-size: 1.05rem; }
  .posts-sm .post-card p, .posts-sm .post-card .more { display: none; }
  .theme-head h3 { font-size: 1.35rem; }
}

/* ---------- page rendez-vous ---------- */
.rdv-steps-sec { padding-block: clamp(2.5rem, 5vw, 4rem); }
.rdv-steps-sec .wrap + .wrap { margin-top: 0; }
.rdv-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.4rem; }
.rdv-steps li { display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: start; padding: 1.4rem 1.3rem; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.rdv-n { width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--forest); color: #fff; display: grid; place-items: center; font: 600 1.1rem/1 var(--f-display); }
.rdv-steps h3 { font: 600 1.25rem/1.2 var(--f-display); margin: .2rem 0 .4rem; }
.rdv-steps p { margin: 0; font-size: .93rem; line-height: 1.55; color: var(--muted); }
.rdv-layout { display: grid; grid-template-columns: 19rem 1fr; gap: 1.6rem; align-items: start; }
.rdv-card { position: sticky; top: 5.5rem; background: var(--forest); color: #fff; border-radius: 14px; padding: 1.6rem 1.5rem 1.4rem; border: 2px solid var(--genet); }
.rdv-card .kicker { color: #f3d77a; }
.rdv-price { font: 600 clamp(2.6rem, 4vw, 3.4rem)/1 var(--f-display); margin: .5rem 0 1rem; color: #ffd75e; }
.rdv-price small { font-size: 1rem; margin-left: .4rem; color: #fff; opacity: .85; }
.rdv-facts { list-style: none; margin: 0 0 1.3rem; padding: 0; display: grid; gap: .6rem; font-size: .93rem; line-height: 1.45; }
.rdv-facts li { padding-left: 1.4rem; position: relative; opacity: .95; }
.rdv-facts li::before { content: ""; position: absolute; left: 0; top: .5em; width: .55rem; height: .55rem; border-radius: 50%; background: var(--genet); }
.rdv-facts b { color: #fff; }
.rdv-cta { width: 100%; justify-content: center; text-align: center; font-size: 1.05rem; padding-block: .9rem; }
.rdv-card .small { color: rgba(255,255,255,.8); margin: .9rem 0 0; }
.rdv-card .small a { color: #ffd75e; }
.rdv-frame { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 14px 40px rgba(0,0,0,.08); }
.rdv-frame iframe { display: block; width: 100%; height: 780px; border: 0; }
.rdv-alt { margin: .9rem 0 0; font-size: .92rem; color: var(--muted); display: flex; gap: .5rem; flex-wrap: wrap; }
.rdv-topics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; }
.rdv-topics > div { padding: 1.3rem 1.2rem; border-top: 3px solid var(--genet); background: var(--surface); border-radius: 0 0 10px 10px; }
.rdv-topics h3 { font: 600 1.25rem/1.2 var(--f-display); margin: 0 0 .5rem; }
.rdv-topics p { margin: 0; font-size: .93rem; line-height: 1.55; color: var(--muted); }
@media (max-width: 1000px) { .rdv-steps, .rdv-topics { grid-template-columns: 1fr; } .rdv-topics { grid-template-columns: 1fr 1fr; } }
@media (max-width: 820px) {
  .rdv-layout { grid-template-columns: 1fr; }
  .rdv-card { position: static; }
  /* agenda pleine largeur, bord à bord, assez haut pour le calendrier et les créneaux */
  .rdv-main { width: 100vw; margin-left: calc(50% - 50vw); }
  .rdv-frame { border-radius: 0; border-left: 0; border-right: 0; box-shadow: none; }
  .rdv-frame iframe { height: min(1100px, calc(100vh - 4rem)); min-height: 760px; }
  .rdv-alt { padding: 0 1rem; justify-content: center; }
  .rdv-topics { grid-template-columns: 1fr; }
  .hero .hero-actions .btn { width: 100%; text-align: center; justify-content: center; }
}

/* ---------- classes utilitaires (remplacent les styles en ligne) ---------- */
.kicker-light { color: rgba(255,255,255,.85); }
.wrap-full { width: 100%; }
.split-top { align-items: start; }
.mt-14 { margin-top: 1.4rem; } .mt-12 { margin-top: 1.2rem; } .mt-2 { margin-top: 2rem; } .mb-25 { margin-bottom: 2.5rem; }
.h1-sm { font-size: clamp(2.2rem, 5vw, 3.4rem); }
.foot-grid .foot-h { margin: 0 0 .9rem; font: 500 .85rem/1 var(--f-text); letter-spacing: .02em; color: rgba(255,255,255,.8); }
.curve .bar-100 { height: 100%; } .curve .bar-75 { height: 75%; opacity: .75; } .curve .bar-50 { height: 50%; opacity: .55; } .curve .bar-25 { height: 25%; opacity: .4; }
.faq-home { max-width: 52rem; }

/* ---------- barre de progression de lecture (mobile) ---------- */
.read-progress { position: fixed; top: 0; left: 0; z-index: 70; width: 100%; height: 4px; pointer-events: none; display: none; margin-top: env(safe-area-inset-top, 0px); }
.read-progress::before { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.12); }
.read-progress > span { position: absolute; left: 0; top: 0; height: 100%; width: 0; background: var(--gold); transform-origin: left; transition: width .12s linear; box-shadow: 0 0 6px color-mix(in srgb, var(--gold) 60%, transparent); }
@media (max-width: 900px) { .read-progress { display: block; } }

/* ---------- comparatif FRR vs FRR+ : balayage sur mobile ---------- */
.cmp-switch, .cmp-hint, .cmp-dots { display: none; }
@media (max-width: 700px) {
  .cmp-wrap { --lab: 34%; }
  .cmp-switch { display: flex; align-items: center; justify-content: center; gap: .55rem; margin-bottom: .9rem; }
  .cmp-tab { font: 600 .95rem/1 var(--f-body, inherit); padding: .65rem 1rem; border-radius: 999px; border: 1.5px solid var(--line); background: var(--surface); color: var(--muted); cursor: pointer; transition: background .25s, color .25s, border-color .25s, transform .25s; }
  .cmp-tab.is-on { background: var(--ink); border-color: var(--ink); color: var(--surface); transform: scale(1.04); }
  .cmp-tab-plus.is-on { background: var(--genet); border-color: var(--genet); color: var(--genet-ink, #161a12); }
  .cmp-vs { font: 700 .8rem/1 var(--f-display); letter-spacing: .08em; color: var(--genet); }
  .cmp-hint { display: flex; align-items: center; justify-content: center; gap: .5rem; margin: 0 0 1rem; font-size: .85rem; font-weight: 600; color: var(--muted); transition: opacity .4s; }
  .cmp-hand { display: inline-grid; place-items: center; width: 1.7rem; height: 1.7rem; border-radius: 50%; background: var(--genet); color: var(--genet-ink, #161a12); font-weight: 700; animation: cmp-nudge 1.4s ease-in-out infinite; }
  .cmp-wrap.seen .cmp-hint { opacity: 0; height: 0; margin: 0; overflow: hidden; }
  @keyframes cmp-nudge { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(7px); } }

  .cmp-wrap .table-scroll { position: relative; scroll-snap-type: x mandatory; scroll-padding-left: var(--lab); overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .cmp-wrap .table-scroll::-webkit-scrollbar { display: none; }
  .cmp-wrap table.cmp { table-layout: fixed; min-width: 0; width: 166%; border-collapse: separate; border-spacing: 0; }
  .cmp-wrap col.c-lab { width: 20.5%; }
  .cmp-wrap col.c-a, .cmp-wrap col.c-b { width: 39.75%; }
  .cmp-wrap table.cmp th, .cmp-wrap table.cmp td { padding: .95rem .9rem .95rem 0; font-size: .92rem; }
  .cmp-wrap table.cmp thead th { font-size: 1.35rem; scroll-snap-align: start; }
  .cmp-wrap table.cmp thead th:first-child { scroll-snap-align: none; }
  .cmp-wrap table.cmp tbody th, .cmp-wrap table.cmp thead th:first-child { position: sticky; left: 0; z-index: 2; background: var(--alt, var(--surface)); width: auto; font-size: .82rem; box-shadow: 8px 0 10px -8px rgba(0,0,0,.18); }
  .cmp-wrap table.cmp td:nth-of-type(2) { padding-left: .9rem; border-left: 2px solid color-mix(in srgb, var(--genet) 55%, transparent); }
  .cmp-wrap .cmp-span { display: block; position: sticky; left: var(--lab-px, 34vw); width: var(--val-px, 58vw); }
  .cmp-dots { display: flex; justify-content: center; gap: .45rem; margin-top: 1rem; }
  .cmp-dots i { width: .5rem; height: .5rem; border-radius: 999px; background: var(--line); transition: width .25s, background .25s; }
  .cmp-dots i.on { width: 1.4rem; background: var(--genet); }
}
@media (max-width: 700px) and (prefers-reduced-motion: reduce) { .cmp-hand { animation: none; } }
