/* ==========================================================================
   site.css — mises en page propres au site ALT Domicile.
   Uniquement des tokens de design-system.css (design.md §0 règle 1).
   ========================================================================== */

/* ============ EN-TÊTE (design.md §5.5) ============ */
.site-header{ position:sticky; top:0; z-index:50; background:#fff; }
.site-header > .container{ padding-inline:0; }
.navbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; height:60px; padding:0 16px 0 12px;
  background:#fff; transition:all var(--t-base); }
.brand{ display:flex; align-items:center; gap:10px; min-width:0; flex:none; }
.logo{ display:block; height:44px; width:auto; max-width:118px; object-fit:contain; }
.logo-reserve{ display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; flex:none;
  border:1px dashed var(--c-muted); border-radius:var(--r-sm); font:400 9px/1 var(--font-mono); color:var(--c-muted); }
.brand__text{ display:flex; flex-direction:column; }
.brand__name{ font-family:var(--font-heading); font-size:18px; line-height:22px; letter-spacing:-0.02em; color:var(--c-ink); white-space:nowrap; }
.brand__baseline{ font-size:12px; line-height:16px; color:var(--c-muted); white-space:nowrap; }
.navbar__menu{ display:none; }
.navbar__actions{ display:flex; align-items:center; gap:8px; }
.navbar__tel{ display:inline-flex; align-items:center; justify-content:center; gap:6px; width:40px; height:40px; flex:none;
  border-radius:var(--r-pill); background:var(--c-primary-light); color:var(--c-primary); transition:background var(--t-base); }
.navbar .btn--sm{ height:36px; padding:0 12px; font-size:12px; font-weight:700; border-radius:var(--r-sm); } /* petit CTA mobile */
.burger{ width:40px; height:40px; flex:none; border:0; background:transparent; border-radius:var(--r-pill); position:relative; cursor:pointer; }
.burger span{ position:absolute; left:12px; width:16.5px; height:1.5px; border-radius:2px; background:var(--c-ink); transition:transform var(--t-base), opacity var(--t-base); }
.burger span:nth-child(1){ top:15px; } .burger span:nth-child(2){ top:19.5px; } .burger span:nth-child(3){ top:24px; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(4.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-4.5px) rotate(-45deg); }
html:not(.js) .burger{ display:none; }

/* Textes masqués visuellement selon la largeur (toujours lus par les lecteurs d'écran) */
@media (max-width:479px){
  .brand--logo .brand__text{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
  .brand--sans-logo .logo-reserve{ display:none; }
}
@media (max-width:639px){
  .brand__baseline{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
}
@media (max-width:1279px){
  .navbar__tel-num{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
}

/* Menu mobile plein écran (design.md §5.5) */
.menu-mobile{ position:fixed; top:60px; left:0; right:0; bottom:0; z-index:49; overflow-y:auto; background:#fff;
  padding:8px 16px 32px; display:flex; flex-direction:column; gap:32px; }
.menu-mobile__nav a{ display:flex; justify-content:space-between; align-items:center; padding:16px 0; border-bottom:1px solid var(--c-border);
  font-family:var(--font-heading); font-size:26px; line-height:1.2; letter-spacing:-0.025em; }
.menu-mobile__nav a[aria-current="page"]{ color:var(--c-primary); }
.menu-mobile__actions{ display:flex; flex-direction:column; gap:12px; }
.menu-mobile__actions .btn{ width:100%; }
.menu-mobile__horaires{ font-size:14px; color:var(--c-muted); text-align:center; }
body.menu-ouvert{ overflow:hidden; }

@media (min-width:1024px){
  .site-header{ background:transparent; height:var(--header-h); pointer-events:none; }
  .site-header > .container{ padding-inline:var(--gutter); }
  .navbar{ pointer-events:auto; height:72px; margin-top:8px; padding:0 16px; gap:16px; border-radius:var(--r-sm); box-shadow:var(--sh-2); }
  .navbar .btn--sm{ height:40px; padding:8px 16px; font-size:16px; font-weight:500; border-radius:var(--r-btn); }
  .navbar__menu{ display:flex; align-items:center; }
  .navbar__menu a{ display:flex; align-items:center; height:48px; padding:0 8px; border-radius:var(--r-sm);
    font-size:16px; white-space:nowrap; transition:background var(--t-base); }
  .navbar__menu a:hover,.navbar__menu a[aria-current="page"]{ background:var(--c-gray-100); }
  .navbar__tel:hover{ background:var(--c-primary-light); }
  .burger,.menu-mobile{ display:none !important; }
  .site-header[data-scrolled="true"] .navbar{ height:56px; margin-top:0; border-radius:0 0 var(--r-sm) var(--r-sm);
    background:rgba(255,255,255,.95); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); box-shadow:var(--sh-8); }
  .site-header[data-scrolled="true"] .logo,.site-header[data-scrolled="true"] .logo-reserve{ height:40px; }
}
@media (min-width:1024px) and (max-width:1279px){
  .brand--logo .brand__text{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
  .brand--sans-logo .logo-reserve{ display:none; }
  .brand__baseline{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
}
@media (min-width:1280px){
  .navbar{ gap:24px; }
  .navbar__menu a{ padding:0 10px; }
  .navbar__tel{ width:auto; height:48px; padding:0 10px; border-radius:var(--r-sm); background:transparent; color:var(--c-ink); font-weight:500; }
  .navbar__tel .icone{ color:var(--c-primary); }
  .navbar__tel:hover{ background:var(--c-gray-100); }
}

/* Le contenu remonte sous l'en-tête (design.md §5.5) */
main{ margin-top:calc(-1 * var(--header-h)); }

/* ============ ACCUEIL : OUVERTURE (design.md §6.1 et §5.14) ============ */
.hero{ position:relative; background:var(--c-bg); padding-bottom:var(--section-y); }
.hero__grid{ display:grid; grid-template-columns:1fr; }
.hero__content{ display:flex; flex-direction:column; justify-content:space-between; gap:40px; padding:96px 6px 0; }
.hero__lead{ margin-top:18px; }
.hero .actions{ margin-top:28px; }
.hero__trust{ display:flex; align-items:center; gap:12px; font-size:14px; line-height:20px; color:var(--c-muted-3); }
.hero__trust .icone{ flex:none; color:var(--c-green); }
.hero__trust strong{ display:block; font-weight:500; color:var(--c-ink); }
.hero__visual{ position:relative; margin-top:32px; padding-inline:6px; }
.hero__visual picture,.hero__reserve{ display:none; }
.engagements{ display:flex; flex-direction:column; padding:20px; border-radius:var(--r-xl); background:#fff; }
.engagements li{ display:grid; grid-template-columns:auto 1fr; column-gap:16px; padding:16px 0; border-bottom:1px solid var(--c-border); }
.engagements li:first-child{ padding-top:4px; } .engagements li:last-child{ padding-bottom:4px; border-bottom:0; }
.engagements .number{ grid-row:span 2; }
.engagements__titre{ font-family:var(--font-heading); font-size:22px; line-height:1.2; letter-spacing:-0.02em; }
.engagements__texte{ font-size:14px; line-height:20px; color:var(--c-ink-80); }
@media (max-width:639px){ .hero .actions .btn{ width:100%; } }
/* Le H1 de context.md tient sur 4 lignes imposées (<br>) : plus larges que les 480 px de design.md avec Newsreader. */
.hero .h-hero{ max-width:none; }
@media (min-width:1024px){
  .hero{ min-height:100vh; min-height:100dvh; padding-bottom:0; }
  .hero__grid{ grid-template-columns:1fr 1fr; min-height:inherit; }
  .hero__content{ padding:160px 24px 80px 0; }
  .hero__visual{ position:absolute; top:0; right:0; bottom:0; width:50vw; margin:0; padding:0; overflow:hidden;
    border-bottom-left-radius:var(--r-hero); background:var(--c-cream); }
  .hero__visual picture{ display:block; }
  /* Ancrée en haut à droite : quand l'emplacement rétrécit, seul le côté gauche est rogné (les visages restent visibles) */
  .hero__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:right top; }
  .hero__reserve{ display:flex; position:absolute; inset:0; align-items:flex-start; justify-content:center; padding:128px 40px 0; }
  .hero__glass{ position:absolute; left:60px; right:60px; bottom:80px; max-width:560px; padding:8px; border-radius:var(--r-2xl);
    background:rgba(233, 233, 233, 0.4); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
}
@media (min-width:1280px){ .hero__content{ padding-right:40px; } }

/* ============ ACCUEIL : TARIFS ET COMPARATIF ============ */
.tarifs-grid{ display:grid; gap:24px; grid-template-columns:1fr; }
@media (min-width:1024px){ .tarifs-grid{ grid-template-columns:5fr 7fr; align-items:start; } }
.compare-card{ display:flex; flex-direction:column; gap:16px; padding:24px; background:#fff; border:1px solid var(--c-border-card); border-radius:var(--r-lg); }
.compare-card__sub{ font-size:14px; line-height:20px; color:var(--c-muted); }
.compare-card__synthese{ font-size:16px; line-height:24px; font-weight:500; }
.compare-card__source{ display:flex; flex-wrap:wrap; align-items:center; gap:4px 16px; font-size:12px; line-height:18px; color:var(--c-muted); }
.compare-card__source a{ display:inline-flex; align-items:center; gap:4px; color:var(--c-primary); font-size:14px; font-weight:500; }
.compare-card__source a:hover{ text-decoration:underline; }
/* Encart d'honnêteté : un seul grand coin arrondi (signature design.md §1.8) */
.encart{ padding:20px 24px; background:var(--c-yellow); border-bottom-left-radius:var(--r-quote); font-size:14px; line-height:22px; color:var(--c-ink); }
.encart strong{ font-weight:600; }
.encart--lg{ font-size:16px; line-height:26px; padding:24px 28px; }

/* ============ UTILITAIRES ============ */
@media (min-width:1024px){ .nowrap-lg{ white-space:nowrap; } }
/* Première section d'une page sans en-tête de page (FAQ) : passe sous l'en-tête collant */
.page-top{ padding-top:calc(var(--header-h) + 48px); }
@media (min-width:1024px){ .page-top{ padding-top:calc(var(--header-h) + 80px); } }
.trust__icone{ flex:none; color:var(--c-primary); }
.form-note--haut{ margin:0 0 24px; }
@media (min-width:768px){ .form-actions__suite{ margin-left:auto; } }
.form-page__intro .checklist{ margin-top:-8px; }
.section--green .prose,.section--green .lead{ color:rgba(255,255,255,.8); }

/* ============ PIED DE PAGE : contenu ALT (design.md §5.21) ============ */
.footer-top{ display:flex; flex-direction:column; gap:48px; }
@media (min-width:1024px){ .footer-top{ display:grid; grid-template-columns:2fr 3fr; gap:48px; } }
.footer-brand{ display:flex; flex-direction:column; gap:20px; max-width:440px; }
.footer-brand__logo{ display:inline-flex; align-items:center; gap:10px; align-self:flex-start; }
.footer-brand__name{ font-family:var(--font-heading); font-size:24px; line-height:1.2; letter-spacing:-0.02em; }
.footer-brand__text{ font-size:14px; line-height:22px; color:var(--c-muted-3); }
@media (max-width:639px){ .footer-nav{ grid-auto-flow:dense; } .footer-nav > div:nth-child(2){ grid-column:span 2; } }
.sap-badge{ display:flex; align-items:center; gap:12px; }
.sap-badge__icon{ flex:none; padding-right:12px; border-right:1px solid var(--c-border); box-sizing:content-box; color:var(--c-green); }
.sap-badge__text{ display:flex; flex-direction:column; font-size:12px; line-height:16px; font-weight:500; color:var(--c-green); }
.sap-badge__text strong{ font-size:14px; line-height:20px; font-weight:700; }

/* ============ ZONE D'INTERVENTION ============ */
.zone-intro{ display:flex; flex-direction:column; gap:24px; }
@media (min-width:1024px){ .zone-intro{ flex-direction:row; justify-content:space-between; align-items:flex-end; gap:48px; }
  .zone-intro .commune-search{ flex:0 1 545px; } }
.commune-search{ display:flex; flex-direction:column; gap:8px; max-width:545px; }
.commune-search__label{ font-size:14px; font-weight:500; }
.commune-search__field{ position:relative; display:flex; gap:8px; }
.commune-search__field > .icone{ position:absolute; left:16px; top:14px; color:var(--c-muted); pointer-events:none; }
.commune-search .input{ padding-left:44px; }
.commune-search__result{ min-height:24px; font-size:16px; line-height:24px; }
.commune-search__result a{ text-decoration:underline; }
.js .commune-search__submit{ display:none; }
.section--green .commune-search__result{ color:rgba(255,255,255,.85); }
.section--green .commune-search__label{ color:#fff; }
.sectors{ display:grid; gap:24px; grid-template-columns:1fr; }
@media (min-width:768px){ .sectors{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .sectors{ grid-template-columns:repeat(3,1fr); }
  .sectors > .sector-card:nth-child(4){ transform:rotate(-2.5deg); }
  .sectors > .sector-card:nth-child(6){ transform:rotate(1.9deg); }
  .sectors > .sector-card:nth-child(4):hover,.sectors > .sector-card:nth-child(6):hover,
  .sectors > .sector-card:nth-child(4):focus-within,.sectors > .sector-card:nth-child(6):focus-within,
  .sectors > .sector-card.is-match{ transform:rotate(0); } }
.sector-card{ min-height:0; justify-content:flex-start; gap:24px; transition:transform var(--t-base), background var(--t-base), border-radius var(--t-base); }
.sector-card:nth-child(5n+1) .ribbon{ --ribbon:var(--c-yellow); }
.sector-card:nth-child(5n+2) .ribbon{ --ribbon:var(--c-blue); }
.sector-card:nth-child(5n+3) .ribbon{ --ribbon:var(--c-mint); }
.sector-card:nth-child(5n+4) .ribbon{ --ribbon:var(--c-purple); }
.sector-card:nth-child(5n+5) .ribbon{ --ribbon:var(--c-primary); }
.sector-card__head{ display:flex; flex-direction:column; gap:12px; }
.sector-card__top{ display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:31px; }
.sector-card .number{ color:var(--c-blue); }
.sector-card__title a:hover{ text-decoration:underline; text-underline-offset:4px; }
.sector-card .mono-label{ color:rgba(255,255,255,.6); }
.sector-card__communes{ display:flex; flex-wrap:wrap; font-size:14px; line-height:24px; color:rgba(255,255,255,.8); }
.sector-card__communes li:not(:last-child)::after{ content:",\00a0"; }
.sector-card__communes li.is-match{ color:var(--c-ink); background:var(--c-yellow); padding:0 4px; border-radius:2px; }
.sector-card__communes li.is-match::after{ content:""; }
.sector-card__link{ margin-top:auto; align-self:flex-start; }
.sector-card.is-match{ background:var(--c-green); border-bottom-right-radius:var(--r-sig); }
.sector-card.is-match .dogear{ opacity:1; }
.zone-fin{ margin-top:44px; font-size:16px; line-height:26px; color:rgba(255,255,255,.85); }
.zone-fin a{ color:#fff; text-decoration:underline; }

/* ============ ACCUEIL : COMMENT ÇA SE PASSE (design.md §5.10) ============ */
.process{ display:grid; gap:24px; grid-template-columns:1fr; }
@media (min-width:1024px){ .process{ grid-template-columns:7fr 5fr; align-items:stretch; } }
.process__visual{ display:none; }
@media (min-width:1024px){ .process__visual{ display:block; position:relative; min-height:544px; border-radius:var(--r-lg); overflow:hidden; } }
.visual{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:48px; overflow:hidden;
  opacity:0; transition:opacity var(--t-base); }
.visual.is-active{ opacity:1; }
.visual--1{ background:var(--c-yellow); } .visual--2{ background:var(--c-blue); }
.visual--3{ background:var(--c-purple); } .visual--4{ background:var(--c-peach); }
.visual__num{ position:absolute; top:24px; left:32px; font-family:var(--font-number); font-size:96px; line-height:1; letter-spacing:-0.05em; color:var(--c-ink); opacity:.12; }
.visual .shard{ right:0; bottom:0; width:240px; }
.visual__glass{ position:relative; z-index:1; width:min(400px,100%); padding:8px; border-radius:var(--r-2xl);
  background:rgba(255,255,255,.4); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.visual__card{ display:flex; flex-direction:column; gap:12px; padding:28px; border-radius:var(--r-xl); background:#fff; }
.visual__icon{ width:48px; height:48px; color:var(--c-primary); }
.visual__big{ font-family:var(--font-heading); font-size:32px; line-height:1.1; letter-spacing:-0.025em; }
.visual__small{ font-size:14px; line-height:20px; color:var(--c-muted-3); }
.step__visual{ position:relative; display:flex; overflow:hidden; margin:0 20px 16px; padding:16px; border-radius:var(--r-sm); }
.step__visual .visual__glass{ width:100%; }
.step__visual .visual__card{ padding:16px; flex-direction:row; align-items:center; gap:14px; }
.step__visual .visual__icon{ width:32px; height:32px; flex:none; }
.step__visual .visual__big{ font-size:22px; }
.step__visual .shard{ right:0; bottom:0; width:120px; }
@media (min-width:1024px){ .step__visual{ display:none; } }
.process + .cta-banner{ margin-top:var(--section-y); }

/* Étapes en version courte (pages secteur) */
.steps-short{ display:grid; gap:8px; grid-template-columns:1fr; counter-reset:none; }
@media (min-width:640px){ .steps-short{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1024px){ .steps-short{ grid-template-columns:repeat(4,1fr); } }
.steps-short .card-info{ height:100%; }

/* ============ AVIS ============ */
.avis-resume{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; font-size:16px; }
.avis-resume strong{ font-family:var(--font-heading); font-size:26px; font-weight:400; }
.avis-lien{ margin-top:32px; }
.avis-lien a{ display:inline-flex; align-items:center; gap:6px; color:var(--c-primary); font-weight:600; }
.avis-lien a:hover{ text-decoration:underline; }

/* ============ EN-TÊTES DES PAGES INTÉRIEURES ============ */
.page-hero{ position:relative; overflow:hidden; background:var(--c-bg); padding:calc(var(--header-h) + 48px) 0 var(--section-y); }
@media (min-width:1024px){ .page-hero{ padding-top:calc(var(--header-h) + 80px); } }
.page-hero > .container{ position:relative; z-index:1; }
.page-hero__inner{ display:flex; flex-direction:column; align-items:flex-start; max-width:760px; }
.page-hero__inner > .eyebrow{ margin-bottom:28px; }
.page-hero__inner > .lead,.page-hero__inner > .page-hero__text{ margin-top:18px; }
.page-hero__inner > .actions{ margin-top:28px; }
.page-hero__inner > .breadcrumb{ margin-bottom:24px; }
.page-hero .lead{ max-width:600px; }
.page-hero--center .page-hero__inner{ margin-inline:auto; align-items:center; text-align:center; }
.page-hero--center .lead{ margin-inline:auto; }
.page-hero--gray{ background:var(--c-gray); }
.page-hero--cool{ background:var(--c-cool-gray); }
.page-hero--split .container{ display:grid; gap:40px; grid-template-columns:1fr; }
@media (min-width:1024px){ .page-hero--split .container{ grid-template-columns:7fr 5fr; align-items:center; gap:64px; } }
@media (max-width:639px){ .page-hero .actions .btn{ width:100%; } }
.page-hero .shard--tr{ width:min(520px,55vw); }

/* ============ LE MÉNAGE ============ */
.media-mark{ position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:12px; color:var(--c-ink); }
.media-mark .icone{ width:72px; height:72px; }
.media-mark .number{ color:var(--c-ink); opacity:.5; }
.card-product__media .shard{ right:0; bottom:0; width:200px; }
.limites{ margin-top:0; }

/* ============ TARIFS ============ */
.tarifs-hero-card{ width:100%; max-width:480px; margin:40px auto 0; text-align:left; }
.credit{ display:grid; gap:40px; grid-template-columns:1fr; }
@media (min-width:1024px){ .credit{ grid-template-columns:5fr 7fr; gap:64px; align-items:center; } }
.credit-visual{ display:flex; flex-direction:column; gap:20px; padding:32px; border-radius:var(--r-lg); background: #fff; }
.credit-visual__row{ display:flex; flex-direction:column; gap:4px; }
.credit-visual .mono-label{ color:rgba(0, 0, 0, 0.6); }
.credit-visual__big{ font-family:var(--font-heading); font-size:44px; line-height:1.05; letter-spacing:-0.025em; color:#000; }
@media (min-width:1024px){ .credit-visual__big{ font-size:56px; } }
.credit-visual__big.accent{ color:var(--c-primary); }
.credit-visual__arrow{ color:var(--c-primary); transform:rotate(90deg); }
.credit-visual__note{ font-size:14px; line-height:20px; color:rgba(0, 0, 0, 0.8); }
/* Avance immédiate : mentions exigées par l'URSSAF (étapes, conditions, lien impots.gouv.fr) */
.avance__titre{ margin-bottom:20px; }
.avance-infos{ display:grid; gap:8px; grid-template-columns:1fr; margin-top:8px; }
@media (min-width:1024px){ .avance-infos{ grid-template-columns:repeat(2,1fr); } }
.avance a{ color:var(--c-primary); text-decoration:underline; overflow-wrap:anywhere; }
.avance .card-info:hover a{ color:#fff; }
.calc{ display:flex; flex-direction:column; gap:32px; }
.calc__form{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; }
.calc__form fieldset{ border:0; margin:0; padding:0; min-width:0; display:flex; flex-direction:column; gap:12px; }
.calc__form legend{ padding:0; margin-bottom:12px; font-size:14px; font-weight:500; }
.js .calc__submit{ display:none; }
.calc__results .card-info{ background:var(--c-bg-alt); height:100%; }
.calc__results .card-info:hover{ background:var(--c-green); }
.calc__value{ font-family:var(--font-heading); font-size:32px; line-height:1.1; letter-spacing:-0.025em; font-variant-numeric:tabular-nums; }
@media (min-width:1024px){ .calc__value{ font-size:36px; } }
.calc__results .card-info--accent{ background:var(--c-primary-tint); }
.calc__footer{ display:flex; flex-direction:column; gap:20px; align-items:flex-start; }
@media (min-width:1024px){ .calc__footer{ flex-direction:row; justify-content:space-between; align-items:center; } }
.calc__note{ font-size:14px; line-height:20px; color:var(--c-muted); max-width:600px; }
.compare-wrap{ display:flex; flex-direction:column; gap:24px; }
.compare--complet .compare__model{ font-family:var(--font-heading); font-size:18px; line-height:1.2; }
@media (max-width:767px){
  .compare--complet thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); }
  .compare--complet,.compare--complet tbody,.compare--complet tr,.compare--complet th,.compare--complet td{ display:block; width:100%; }
  .compare--complet tr{ padding:16px 0; border-bottom:1px solid var(--c-border-row); }
  .compare--complet tbody th{ padding:0 0 8px; border:0; font-size:20px; }
  .compare--complet td{ display:flex; justify-content:space-between; gap:16px; padding:4px 0; border:0; text-align:right; }
  .compare--complet td::before{ content:attr(data-label); flex:none; max-width:55%; text-align:left; font-weight:400; color:var(--c-muted); }
  .compare--complet tr.is-highlight{ padding:16px 12px; border-radius:var(--r-sm); background:var(--c-primary-tint); }
  .compare--complet tr.is-highlight th,.compare--complet tr.is-highlight td{ background:none; border-radius:0; }
}
.methode{ display:flex; flex-direction:column; gap:16px; }
.methode h3{ font-family:var(--font-heading); font-size:28px; line-height:1.15; letter-spacing:-0.025em; }
.methode ul{ display:flex; flex-direction:column; gap:8px; }
.methode li{ position:relative; padding-left:20px; font-size:16px; line-height:26px; color:var(--c-ink-80); }
.methode li::before{ content:""; position:absolute; left:0; top:10px; width:6px; height:6px; border-radius:2px; background:var(--c-primary); }

/* ============ PAGES SECTEUR ============ */
.communes-card{ display:flex; flex-direction:column; gap:16px; padding:24px; border-radius:var(--r-lg); background:#fff; }
.communes-list{ columns:2; column-gap:24px; }
.communes-list li{ break-inside:avoid; padding:10px 0; border-bottom:1px solid var(--c-border); font-size:14px; line-height:20px; }
.secteur-texte{ display:grid; gap:40px; grid-template-columns:1fr; }
@media (min-width:1024px){ .secteur-texte{ grid-template-columns:7fr 5fr; gap:64px; align-items:start; } }
.secteur-texte .prose{ max-width:620px; color:var(--c-ink-80); }

/* ============ QUI SOMMES-NOUS (design.md §7.4) ============ */
.apropos-texte{ display:flex; flex-direction:column; gap:20px; max-width:800px; margin-top:28px; color:var(--c-text-about); }
.apropos-photo{ display:flex; flex-direction:column; align-items:center; gap:12px; margin-top:44px; }
.apropos-photo img{ width:240px; height:240px; object-fit:cover; border-radius:var(--r-lg); }
.apropos-photo figcaption{ font-size:14px; color:var(--c-muted); }
.rejoindre-bloc{ display:flex; flex-direction:column; align-items:center; gap:28px; text-align:center; }

/* ============ CONTACT ET REJOINDRE (design.md §7.6) ============ */
.form-page{ position:relative; overflow:clip; background:var(--c-gray); padding:calc(var(--header-h) + 48px) 0 var(--section-y); }
@media (min-width:1024px){ .form-page{ padding-top:calc(var(--header-h) + 80px); } }
.form-page__grid{ display:grid; gap:40px; grid-template-columns:1fr; }
@media (min-width:1024px){ .form-page__grid{ grid-template-columns:5fr 7fr; gap:64px; align-items:start; } }
.form-page__intro{ display:flex; flex-direction:column; gap:24px; }
@media (min-width:1024px){ .form-page__intro{ position:sticky; top:128px; } }
.form-page__intro .prose{ color:var(--c-muted-3); }
.direct{ display:flex; flex-direction:column; gap:12px; }
.direct li{ display:flex; align-items:center; gap:12px; font-size:16px; line-height:24px; }
.direct__puce{ display:flex; align-items:center; justify-content:center; width:32px; height:32px; flex:none; border-radius:50%;
  background:var(--c-primary); color:#fff; }
.direct a{ font-weight:500; }
.direct a:hover{ text-decoration:underline; }
.js [data-etapes] .form-step:not(.is-current){ display:none; }
.js [data-etapes] .form-step + .form-step{ margin-top:0; }
html:not(.js) .stepper,html:not(.js) [data-etape-precedente],html:not(.js) [data-etape-suivante]{ display:none; }

/* ============ MERCI ET 404 ============ */
.page-hero--message .page-hero__inner{ max-width:640px; }
.liens-utiles{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-top:32px; }

/* ============ PAGES LÉGALES (design.md §7.8) ============ */
.legal-head{ background:var(--c-yellow-article); padding:calc(var(--header-h) + 48px) 0 32px; }
@media (min-width:1024px){ .legal-head{ padding-top:calc(var(--header-h) + 64px); } }
.legal-head .breadcrumb{ margin-bottom:24px; }
.legal-head .breadcrumb a{ color:var(--c-ink); text-decoration:underline; }
.legal-head .lead{ margin-top:18px; max-width:560px; }
.legal-body{ background:var(--c-bg); padding:48px 0 var(--section-y); }
.legal-grid{ display:grid; gap:40px; grid-template-columns:1fr; }
@media (min-width:1024px){ .legal-grid{ grid-template-columns:200px minmax(0,706px); gap:80px; } .toc{ position:sticky; top:128px; align-self:start; } }
@media (max-width:1023px){ .toc{ display:none; } }
.legal{ max-width:706px; font-size:16px; line-height:1.75; color:var(--c-ink-80); }
@media (min-width:1024px){ .legal{ font-size:17px; } }
.legal h2{ margin:0 0 16px; font-size:30px; line-height:1.1; letter-spacing:-0.025em; color:var(--c-ink); }
@media (min-width:1024px){ .legal h2{ font-size:37px; } }
.legal section + section{ margin-top:48px; }
.legal h3{ margin:28px 0 8px; font-size:22px; line-height:1.2; color:var(--c-ink); }
.legal p + p,.legal p + ul,.legal ul + p{ margin-top:12px; }
.legal ul{ display:flex; flex-direction:column; gap:6px; }
.legal ul li{ position:relative; padding-left:20px; }
.legal ul li::before{ content:""; position:absolute; left:0; top:.75em; width:6px; height:6px; border-radius:2px; background:var(--c-primary); }
.legal a{ color:var(--c-primary); text-decoration:underline; }
.legal strong{ font-weight:600; color:var(--c-ink); }
.legal dl{ display:grid; grid-template-columns:1fr; gap:4px 24px; margin:0; }
@media (min-width:640px){ .legal dl{ grid-template-columns:200px 1fr; } }
.legal dt{ font-weight:600; color:var(--c-ink); }
.legal dd{ margin:0 0 8px; }
.notice{ margin-bottom:32px; padding:16px 20px; border-radius:var(--r-lg); background:var(--c-primary-light); color:var(--c-ink); font-size:15px; line-height:22px; }
.modele{ margin-top:16px; padding:20px 24px; border-radius:var(--r-lg); background:#fff; font-size:15px; line-height:1.7; }