/* Accueil v3 (accueil_v3.py) : Workflow autonome, « Votre secteur », « Sécurité et confidentialité, en clair ». */
.av3-crochet { background: color-mix(in srgb, var(--accent) 52%, transparent); padding-inline: 0.15em; color: var(--texte); box-decoration-break: clone; -webkit-box-decoration-break: clone; }
/* Workflow, seul */
.av3-wf__grille { grid-template-columns: 1fr; max-width: 1100px; }
.av3-wf__t { margin: 0; font-size: clamp(1.8rem, 1.2rem + 1.6vw, 2.6rem); letter-spacing: -0.025em; line-height: 1.05; }
/* Votre secteur */
.av3-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(10px, 1.2vw, 18px); margin: var(--e-8, 48px) 0 0; padding: 0; list-style: none; }
.av3-tuile { position: relative; display: grid; gap: 8px; height: 100%; min-height: 132px; padding: 22px 56px 22px 22px; border-radius: var(--rayon); background: var(--surface); border: var(--trame, 1px) solid var(--bordure); color: var(--texte); text-decoration: none; transition: border-color var(--duree, 200ms) var(--courbe, ease), translate 260ms var(--courbe-sortie, ease), box-shadow 260ms var(--courbe, ease); }
.av3-tuile__nom { font-family: var(--police-titres); font-weight: 600; font-size: var(--t-m); letter-spacing: -0.015em; }
.av3-tuile__accroche { font-size: var(--t-s); line-height: 1.45; color: var(--texte-doux); text-wrap: pretty; }
.av3-tuile__f { position: absolute; right: 18px; top: 20px; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--fond); color: var(--accent); transition: scale 260ms var(--courbe-sortie, ease); }
.av3-tuile__f svg { width: 16px; height: 16px; }
.av3-tuile:hover, .av3-tuile:focus-visible { border-color: var(--texte); translate: 0 -3px; box-shadow: 0 14px 34px color-mix(in srgb, var(--texte) 12%, transparent); }
.av3-tuile:hover .av3-tuile__f, .av3-tuile:focus-visible .av3-tuile__f { scale: 1.12; }
.av3-tuile:focus-visible { outline: 3px solid var(--texte); outline-offset: 3px; }
/* Sécurité : le motif « cartes du service sur le ruban » (page Infrastructure de la maquette de Claude), en version statique */
.service--accueil { position: relative; margin: var(--marge-panneau) var(--marge-panneau) 0; padding: clamp(72px, 9vw, 140px) 0 clamp(56px, 6vw, 96px); border-radius: var(--rayon-panneau); overflow: clip; background: var(--fond); color: var(--texte); }
.service--accueil .service__tete h2 { max-width: 22ch; margin: 0; font-size: clamp(2.2rem, 1.2rem + 3vw, 4rem); letter-spacing: -0.035em; line-height: 1.02; }
.service--accueil .service__piste { position: relative; margin-top: clamp(40px, 6vw, 96px); }
.service__ruban { position: absolute; left: calc(-1 * var(--gouttiere) - 40px); right: calc(-1 * var(--gouttiere) - 40px); top: 34%; width: calc(100% + 2 * var(--gouttiere) + 80px); height: clamp(200px, 24vw, 340px); overflow: visible; pointer-events: none; }
.service__ruban path { fill: none; stroke-linecap: round; }
.service__ruban-halo { stroke: var(--accent); stroke-width: 16; stroke-opacity: 0.14; }
.service__ruban-a { stroke: var(--accent); stroke-width: 3; filter: drop-shadow(0 0 6px color-mix(in srgb, var(--accent) 70%, transparent)); }
.service__ruban-b { stroke: color-mix(in srgb, var(--texte) 40%, transparent); stroke-width: 1; }
.js-mouvement .service--accueil .service__ruban path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1800ms var(--courbe-sortie) 200ms; }
.js-mouvement .service--accueil.est-vu .service__ruban path { stroke-dashoffset: 0; }
.service__cartes { position: relative; margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 28px); }
.carte-service { min-height: clamp(340px, 30vw, 440px); padding: clamp(20px, 2vw, 30px); display: flex; flex-direction: column; gap: var(--e-4); border-radius: var(--rayon); background: color-mix(in srgb, var(--surface) 88%, transparent); border: var(--trame) solid color-mix(in srgb, var(--texte) 14%, transparent); transition: border-color var(--duree) var(--courbe), background-color var(--duree) var(--courbe); }
.carte-service:hover, .carte-service:focus-within { border-color: var(--accent); background: var(--surface); }
.hud { font-family: var(--police-donnees); font-size: var(--t-donnees); line-height: 1.55; letter-spacing: 0.01em; }
.carte-service__num { margin: 0; color: var(--accent); }
.carte-service__picto { width: 56px; height: 56px; }
.carte-service__picto rect { fill: color-mix(in srgb, var(--texte) 34%, transparent); transition: fill var(--duree-lente) var(--courbe); }
.carte-service__picto rect.vif { fill: var(--accent); }
.carte-service:hover .carte-service__picto rect:not(.vif) { fill: color-mix(in srgb, var(--texte) 60%, transparent); }
.carte-service__titre { margin: 0; font-size: var(--t-xl); letter-spacing: -0.03em; line-height: 1.05; text-wrap: balance; }
.carte-service p:not(.carte-service__num) { margin: 0; color: var(--texte-doux); font-size: var(--t-s); line-height: 1.5; }
.carte-service__r { color: var(--texte); font-weight: 600; }
.carte-service__puces { margin: auto 0 0; padding: 0; list-style: none; display: grid; gap: var(--e-2); font-family: var(--police-donnees); font-size: var(--t-donnees); color: var(--texte); }
.carte-service__puces li { display: flex; align-items: center; gap: var(--e-3); }
.carte-service__puces li::before { content: ""; width: 6px; height: 6px; flex: none; background: var(--accent); }
.nuit .av3-crochet { background: var(--accent); color: #101211; }
.service--accueil .av3-secu__bas { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--e-6, 24px); margin-top: clamp(32px, 4vw, 56px); }
.service--accueil .av3-secu__bas p { max-width: 70ch; margin: 0; font-size: var(--t-s); line-height: 1.5; color: var(--texte-doux); }
.service--accueil .av3-secu__bas strong { color: var(--texte); }
@media (max-width: 1100px) { .service__cartes { grid-template-columns: repeat(2, minmax(0, 1fr)); } .carte-service { min-height: 0; } }
@media (max-width: 760px) { .service__cartes { grid-template-columns: 1fr; } .service__ruban { display: none; } }
@media (prefers-reduced-motion: reduce) { .carte-service, .carte-service__picto rect { transition: none; } }
@media (max-width: 760px) { .av3-grille { grid-template-columns: 1fr; } .av3-tuile { min-height: 0; } }
@media (prefers-reduced-motion: reduce) { .av3-tuile, .av3-tuile__f { transition: none; } .av3-tuile:hover, .av3-tuile:focus-visible { translate: none; } }
/* « Démarrez vite. Gardez le contrôle. » en clair (accueil_v3.py) */
.av3-main .protections li { padding: clamp(18px, 1.8vw, 26px); border-radius: var(--rayon); background: var(--surface); border: var(--trame, 1px) solid var(--bordure); list-style: none; }
.av3-main .protections { display: grid; gap: clamp(10px, 1vw, 14px); padding: 0; }
.av3-main .protections strong { color: var(--texte); }
.av3-main .protections p, .av3-main .parcours p { color: var(--texte-doux); }
.av3-main .parcours li { border-color: var(--bordure); }
.av3-main .parcours__quand { color: var(--texte); }

/* Section #dossier : question du client (grand, entre guillemets) + promesse dessous */
.dossiers li.dossiers__paire { display: grid; grid-template-columns: 1fr; gap: 10px; }
.dossiers .dossiers__promesse { margin: 0; display: flex; align-items: center; gap: 12px; color: var(--texte); font-family: var(--police-interface); font-weight: var(--graisse-interface); font-size: clamp(1.05rem, calc(0.85rem + 0.6vw), 1.4rem); line-height: 1.3; }
.dossiers .dossiers__promesse::before { content: ""; flex: none; width: 28px; height: 3px; border-radius: 2px; background: var(--accent, #BDEE63); }
