/* WOURI ESTATE — sections éditoriales partagées par l'accueil et les pages intérieures (tuiles, règles, chiffres, avis, appel final).
   Direction artistique « Cadastre & calcaire » : calcaire, encre, olive, rouille. Gloock + Schibsted Grotesk. */
@layer layout {
  .section--dark { background: var(--encre); color: var(--calcaire); }
  .section--dark a:not(.btn) { color: var(--rouille-sur-sombre); }
  .section--dark a:not(.btn):hover { color: #fff; }
  .section--dark .eyebrow { color: var(--olive-sur-sombre); }
  .section--dark .eyebrow::before { background: var(--rouille-sur-sombre); }
  .section--dark .section__head > p { color: color-mix(in srgb, var(--calcaire) 82%, transparent); }
}
@layer components {
  .panel h2, .panel h3 { margin-block-end: var(--space-xs); }
  .callout p + p { margin-block-start: .5rem; }
}
@layer pages {
  .split { display: grid; gap: var(--space-l); align-items: center; }
  @media (min-width: 64em) {
    .split { grid-template-columns: repeat(12, 1fr); }
    .split > :first-child { grid-column: 1 / span 5; }
    .split > :last-child { grid-column: 6 / span 7; }
  }
  .tiles { display: grid; gap: var(--space-s); grid-template-columns: repeat(auto-fit, minmax(min(var(--min, 17rem), 100%), 1fr)); }
  .tile { position: relative; display: grid; gap: .4rem; align-content: start; padding: var(--space-s); background: var(--chaux); border: 1px solid var(--bordure); border-radius: var(--radius); text-decoration: none; color: var(--encre); transition: box-shadow var(--dur-3) var(--ease-out), border-color var(--dur-3) var(--ease-out), translate var(--dur-3) var(--ease-out); }
  .tile h3 { font-size: var(--step-1); line-height: 1.15; }
  .tile p { margin: 0; font-size: var(--step--1); color: var(--encre-2); }
  .stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-m) var(--space-s); margin: 0; }
  @media (min-width: 48em) {
    .stats { grid-template-columns: repeat(4, 1fr); }
  }
  .stats > div { padding-block-start: var(--space-s); border-block-start: 2px solid var(--encre); }
  .stats dd { font-family: var(--font-display); font-size: var(--step-5); line-height: 1; margin: 0 0 .3rem; }
  .stats dt { font-weight: 600; font-size: var(--step--1); color: var(--encre-2); order: 2; }
  .stats > div { display: flex; flex-direction: column; }
  .demo-note { font-size: var(--step--1); color: var(--encre-2); margin-block-start: var(--space-s); }
  .fictif-tag { display: inline-flex; align-items: center; gap: .4rem; padding: .2rem .6rem; border: 1px dashed var(--bordure-forte); border-radius: 2px; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--encre-2); margin-block-end: var(--space-s); }
  .quotes { display: grid; gap: var(--space-s); grid-template-columns: repeat(auto-fit, minmax(min(19rem, 100%), 1fr)); }
  .quote { display: grid; gap: var(--space-s); align-content: space-between; margin: 0; padding: var(--space-m); background: var(--chaux); border: 1px solid var(--bordure); border-radius: var(--radius); }
  .quote blockquote { margin: 0; font-family: var(--font-display); font-size: var(--step-1); line-height: 1.35; }
  .quote figcaption { display: flex; align-items: center; gap: .75rem; font-size: var(--step--1); }
  .avatar { display: inline-grid; place-items: center; inline-size: 2.75rem; block-size: 2.75rem; border-radius: 50%; background: var(--olive-clair); color: var(--olive-fonce); font-weight: 700; flex: none; }
  .quote cite { font-style: normal; font-weight: 700; display: block; }
  .quote small { color: var(--encre-2); }
  .cta-final { background: var(--olive-fonce); color: var(--calcaire); }
  .cta-final__grid { display: grid; gap: var(--space-l); align-items: center; }
  @media (min-width: 64em) {
    .cta-final__grid { grid-template-columns: 1.1fr 1fr; }
  }
  .cta-final h2 { font-size: var(--step-4); color: #fff; margin-block-end: var(--space-s); }
  .cta-final p { color: color-mix(in srgb, var(--calcaire) 86%, transparent); }
  .channels { display: grid; gap: var(--space-xs); margin-block-start: var(--space-m); }
  .channels .btn { justify-content: flex-start; min-block-size: 3.25rem; text-align: start; }
  .channels .btn small { display: block; font-weight: 400; opacity: .85; }
  .advisor { display: grid; grid-template-columns: auto 1fr; gap: var(--space-s); align-items: center; padding: var(--space-s); background: color-mix(in srgb, var(--calcaire) 10%, transparent); border-radius: var(--radius); }
  .advisor p { margin: 0; }
  .advisor strong { display: block; color: #fff; font-family: var(--font-display); font-weight: 400; font-size: var(--step-1); }
  .proofs3 { display: grid; gap: var(--space-xs); margin: var(--space-m) 0 0; padding: 0; list-style: none; }
  .proofs3 li { display: flex; gap: .7rem; align-items: flex-start; font-weight: 600; font-size: var(--step--1); }
  .proofs3 .icon { color: var(--olive); margin-block-start: .1rem; }
  .numlist { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-s); counter-reset: eng; }
  .numlist li { counter-increment: eng; display: grid; grid-template-columns: auto 1fr; gap: var(--space-s); align-items: baseline; padding-block: var(--space-xs); border-block-end: 1px dashed var(--bordure-forte); font-weight: 600; font-size: var(--step-0); }
  .numlist li::before { content: counter(eng, decimal-leading-zero); font-family: var(--font-display); font-size: var(--step-2); color: var(--rouille); }
  .tz-grid { display: grid; gap: var(--space-m); }
  @media (min-width: 64em) {
    .tz-grid { grid-template-columns: 1fr 1.4fr; align-items: start; }
  }
  .form-split { display: grid; gap: var(--space-l); }
  @media (min-width: 64em) {
    .form-split { grid-template-columns: 1fr 1.3fr; align-items: start; }
  }
  /* Anti-arnaque */
  .verif-list { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-xs); counter-reset: v; }
  .verif-list > li { counter-increment: v; display: grid; grid-template-columns: auto 1fr; gap: .25rem var(--space-s); align-items: start; padding: var(--space-s); background: var(--chaux); border: 1px solid var(--bordure); border-radius: var(--radius); transition: background-color var(--dur-3), border-color var(--dur-3); }
  .verif-list > li:has(input:checked) { background: var(--olive-clair); border-color: var(--olive); }
  .verif-list .check { font-size: var(--step-0); font-weight: 700; align-items: flex-start; grid-column: 1 / -1; }
  .verif-list .check::before { content: counter(v); font-family: var(--font-display); font-weight: 400; font-size: var(--step-2); color: var(--rouille); min-inline-size: 1.4ch; line-height: 1; }
  .verif-list details { grid-column: 1 / -1; margin-inline-start: 3.9rem; font-size: var(--step--1); }
  .verif-list summary { color: var(--rouille-fonce); font-weight: 600; min-block-size: 2rem; display: flex; align-items: center; }
  .verif-list details p { margin-block-start: .4rem; max-inline-size: 62ch; color: var(--encre-2); }
  .progress-row { display: grid; gap: .4rem; padding: var(--space-s); background: var(--chaux); border: 1px solid var(--bordure); border-radius: var(--radius); margin-block-end: var(--space-s); }
  .progress-row progress { inline-size: 100%; block-size: .8rem; }
  .progress-row p { margin: 0; font-weight: 700; }
  .signals { list-style: none; padding: 0; margin: 0; display: grid; gap: .6rem; grid-template-columns: repeat(auto-fit, minmax(min(17rem, 100%), 1fr)); }
  .signals li { display: flex; gap: .7rem; align-items: flex-start; padding: .8rem .9rem; background: var(--chaux); border: 1px solid var(--bordure); border-inline-start: 4px solid var(--erreur); border-radius: var(--radius); font-weight: 600; font-size: var(--step--1); }
  .signals .icon { color: var(--erreur); margin-block-start: .1rem; }
  .gloss { display: grid; gap: 0; margin: 0; }
  .gloss > div { display: grid; gap: .1rem var(--space-m); padding: .8rem 0; border-block-end: 1px dashed var(--bordure-forte); }
  @media (min-width: 48em) {
    .gloss > div { grid-template-columns: 14rem 1fr; }
  }
  .gloss dt { font-weight: 700; }
  .gloss dd { margin: 0; color: var(--encre-2); max-inline-size: 62ch; }
  .team { display: grid; gap: var(--space-m) var(--space-s); grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); }
  .member { display: grid; gap: .6rem; align-content: start; }
  .member h3 { font-size: var(--step-1); }
  .member .role { font-weight: 600; font-size: var(--step--1); color: var(--olive); margin: 0; }
  .member .meta { margin: 0; font-size: var(--step--1); color: var(--encre-2); }
  .member blockquote { margin: 0; font-size: var(--step--1); border-inline-start: 2px solid var(--rouille); padding-inline-start: .75rem; color: var(--encre); font-style: normal; }
  .timeline-h { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; border-inline-start: 2px dashed var(--bordure-forte); margin-inline-start: .4rem; }
  .timeline-h li { position: relative; display: grid; gap: .1rem; padding: 0 0 var(--space-m) var(--space-m); }
  .timeline-h li::before { content: ""; position: absolute; inset-inline-start: -6px; inset-block-start: .45rem; inline-size: 10px; block-size: 10px; background: var(--rouille); }
  .timeline-h b { font-family: var(--font-display); font-weight: 400; font-size: var(--step-2); line-height: 1.1; }
  .offices { display: grid; gap: var(--space-s); grid-template-columns: repeat(auto-fit, minmax(min(19rem, 100%), 1fr)); }
  .office { display: grid; gap: .6rem; align-content: start; padding: var(--space-m); background: var(--chaux); border: 1px solid var(--bordure); border-radius: var(--radius); }
  .office h3 { font-size: var(--step-2); }
  .office address { font-style: normal; font-size: var(--step--1); color: var(--encre-2); }
  .office dl { display: grid; grid-template-columns: auto 1fr; gap: .15rem var(--space-s); margin: 0; font-size: var(--step--1); }
  .office dt { font-weight: 700; }
  .office dd { margin: 0; }
  .example { padding: var(--space-s) var(--space-m); background: var(--chaux); border: 1px dashed var(--bordure-forte); border-radius: var(--radius); }
  /* sections sombres : surcharges (la couche components passe après layout) */
  .section--dark .eyebrow, .page-hero--dark .eyebrow, .cta-final .eyebrow, .site-footer .eyebrow { color: var(--olive-sur-sombre); }
  .section--dark .eyebrow::before, .page-hero--dark .eyebrow::before, .cta-final .eyebrow::before { background: var(--rouille-sur-sombre); }
  .section--dark a:not(.btn):not(.link-action), .page-hero--dark a:not(.btn):not(.link-action) { color: var(--rouille-sur-sombre); }
  .section--dark a:not(.btn):not(.link-action):hover { color: #fff; }
  .section--dark .section__head > p, .page-hero--dark .lead { color: color-mix(in srgb, var(--calcaire) 84%, transparent); }
  .section--dark h2, .section--dark h3 { color: #fff; }
  .advisor .portrait { inline-size: 6.5rem; background: color-mix(in srgb, var(--calcaire) 14%, var(--encre)); border-color: color-mix(in srgb, var(--calcaire) 35%, transparent); }
  .advisor .portrait::after { background-image: linear-gradient(var(--rouille-sur-sombre), var(--rouille-sur-sombre)), linear-gradient(var(--rouille-sur-sombre), var(--rouille-sur-sombre)), linear-gradient(var(--rouille-sur-sombre), var(--rouille-sur-sombre)), linear-gradient(var(--rouille-sur-sombre), var(--rouille-sur-sombre)); }
  .member .portrait { max-inline-size: 15rem; }
  .split--map, .split--gest, .split--fees, .split--hist, .split--srv { align-items: start; }
  @media (min-width: 64em) {
    .split--fees > :first-child, .split--fees > :last-child { grid-column: span 6; }
    .split--hist > :first-child { grid-column: 1 / span 7; }
    .split--hist > :last-child { grid-column: 9 / span 4; }
    .split--srv > :first-child { grid-column: 1 / span 7; }
    .split--srv > :last-child { grid-column: 9 / span 4; }
  }
  .u-mt-xs { margin-block-start: var(--space-2xs); }
  .office dd a, .office address a { display: inline-block; padding-block: .3rem; }
  .tiles--scam { --min: 16rem; }
  .tile__no { font-family: var(--font-display); font-size: var(--step-3); color: var(--erreur); line-height: 1; }
  .tile .ctrl { color: var(--olive-fonce); }
  .tile p strong { color: var(--encre); }
  .checklist { list-style: none; padding: 0; margin: 0; display: grid; gap: .7rem; }
  .checklist li { display: flex; gap: .7rem; align-items: flex-start; }
  .checklist .icon { color: var(--olive-sur-sombre); margin-block-start: .15rem; }
  .panel--dark { background: color-mix(in srgb, var(--calcaire) 8%, var(--encre)); border-color: color-mix(in srgb, var(--calcaire) 30%, transparent); color: var(--calcaire); }
  .panel--dark .eyebrow { color: var(--olive-sur-sombre); }
  .px-big { font-family: var(--font-display); font-size: var(--step-5); line-height: 1.05; color: #fff; margin: 0 0 var(--space-xs); }
  .toc--hero { display: block; align-self: end; }
  .verif-form { display: grid; gap: var(--space-s); padding: var(--space-m); background: var(--chaux); border: 1px solid var(--bordure); border-radius: var(--radius); box-shadow: inset 0 3px 0 var(--olive); }
  .verif-form__row { display: flex; flex-wrap: wrap; gap: .6rem; }
  .verif-form__row input { flex: 1 1 15rem; }
  .link-btn { display: inline; border: 0; padding: 0; background: none; color: var(--rouille-fonce); font-weight: 600; text-decoration: underline; text-underline-offset: .2em; min-block-size: 2rem; }
  .link-btn:hover { color: var(--rouille); }
  .agence-quote { align-self: end; font-family: var(--font-display); font-size: var(--step-1); line-height: 1.3; }
  .agence-quote .u-small { font-family: var(--font-text); }
  .partners { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--space-s); grid-template-columns: repeat(auto-fit, minmax(min(18rem, 100%), 1fr)); }
  .partners li { display: grid; gap: .3rem; padding: var(--space-s) var(--space-m); background: var(--chaux); border: 1px solid var(--bordure); border-inline-start: 4px solid var(--olive); border-radius: var(--radius); }
  .partners span { color: var(--encre-2); font-size: var(--step--1); }
  .numlist--cols { grid-template-columns: 1fr; }
  @media (min-width: 48em) {
    .numlist--cols { grid-template-columns: 1fr 1fr; column-gap: var(--space-l); }
  }
  .team .member { align-content: start; }
  /* contact */
  .statut--card { color: var(--encre-2); margin: 0; font-size: var(--step--1); font-weight: 600; }
  .statut--card .statut__dot { background: var(--gris); box-shadow: 0 0 0 2px color-mix(in srgb, var(--gris) 25%, transparent); }
  .statut--card[data-open="1"] .statut__dot { background: var(--olive); box-shadow: 0 0 0 2px color-mix(in srgb, var(--olive) 25%, transparent); }
  .statut--card[data-open="1"] { color: var(--olive-fonce); }
  .office .link-action { justify-self: start; }
  .u-flow > li + li { margin-block-start: .5rem; }
}
@layer utilities {
  .u-mt-l { margin-block-start: var(--space-l) !important; }
  .u-flow > * + * { margin-block-start: var(--space-s); }
  @media print {
    .verif-list .check input { appearance: auto; }
  }
}
