/* Site La Vitrinerie : CSS de la maquette (sites/studio/maquette/style.css), adaptée à WordPress en fin de fichier.
   Couleurs et polices : theme.json (presets), reprises ici sous les noms de la maquette. */
:root{
  --fond:var(--wp--preset--color--fond); --blanc:var(--wp--preset--color--surface); --encre:var(--wp--preset--color--encre); --doux:var(--wp--preset--color--doux);
  --rouge:var(--wp--preset--color--accent); --rouge-fonce:var(--wp--preset--color--accent-fonce); --creme:var(--wp--preset--color--sur-accent);
  --kraft:var(--wp--preset--color--touche); --kraft-clair:var(--wp--preset--color--touche-claire); --filet:var(--wp--preset--color--filet); --erreur:#9B1C1C;
  --titre:var(--wp--preset--font-family--titre); --texte:var(--wp--preset--font-family--texte);
  --page:min(1180px,100% - 32px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fond);color:var(--encre);font:400 17px/1.6 var(--texte)}
img,svg{display:block;max-width:100%}
a{color:var(--rouge);text-underline-offset:3px}
a:hover{color:var(--rouge-fonce)}
:focus-visible{outline:3px solid var(--encre);outline-offset:3px}
h1,h2,h3{font-family:var(--titre);font-weight:400;line-height:1.08;margin:0;text-wrap:balance}
h1{font-size:clamp(40px,7vw,84px);letter-spacing:-.01em}
h2{font-size:clamp(30px,4.4vw,52px)}
h3,.h3{font-size:clamp(22px,2.4vw,28px)}
p{margin:0}
.page{width:var(--page);margin-inline:auto}
.evitement{position:absolute;left:-999px;top:8px;background:var(--encre);color:var(--creme);padding:10px 16px;z-index:50}
.evitement:focus{left:8px}
.section{padding-block:clamp(64px,10vw,128px)}
.section + .section{border-top:1px solid var(--filet)}
.chapo{font-size:clamp(18px,1.6vw,21px);color:var(--doux);max-width:58ch}
.pile > * + *{margin-top:20px}

/* Boutons */
.logo svg{flex:none}
.entete .btn{white-space:nowrap}
.deux-col > *{min-width:0}
.btn{text-align:center;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;border-radius:3px;font:600 16px/1.2 var(--texte);text-decoration:none;border:2px solid var(--rouge);cursor:pointer;transition:background-color .15s,color .15s,border-color .15s}
.btn-plein{background:var(--rouge);color:var(--creme)}
.btn-plein:hover{background:var(--encre);border-color:var(--encre);color:var(--creme)}
.btn-trait{background:transparent;color:var(--encre);border-color:var(--encre)}
.btn-trait:hover{background:var(--encre);color:var(--creme)}
.actions{display:flex;flex-wrap:wrap;gap:12px}

/* En-tête : la vitre (verre dépoli, seul vrai effet vitre de la page) */
.entete{position:sticky;top:0;z-index:20;background:rgba(251,248,243,.78);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);border-bottom:1px solid rgba(43,26,22,.08)}
.entete .page{display:flex;align-items:center;gap:16px;min-height:68px}
.logo{min-height:44px;display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--encre);font:400 23px/1 var(--titre);white-space:nowrap}
.nav{margin-left:auto;display:none}
.nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.nav a{display:block;padding:10px 12px;color:var(--encre);text-decoration:none;font-weight:600;font-size:15px;border-radius:3px}
.nav a:hover,.nav a[aria-current="page"]{color:var(--rouge)}
.nav a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:2px}
.entete-actions{margin-left:auto;display:flex;gap:8px;align-items:center}
.entete .btn{min-height:44px;padding:8px 16px;font-size:15px}
.btn-menu{background:transparent;border:2px solid var(--encre);color:var(--encre)}
.long{display:none}
.menu-mobile{display:none;border-top:1px solid var(--filet);background:var(--fond)}
.menu-mobile.ouvert{display:block}
.menu-mobile ul{list-style:none;margin:0;padding:8px 0 16px}
.menu-mobile a{display:block;padding:14px 0;font:400 24px/1.2 var(--titre);color:var(--encre);text-decoration:none;border-bottom:1px solid var(--filet)}
@media (max-width:459px){
  .entete .page{gap:8px}
  .entete .logo{font-size:17px;gap:8px}
  .entete .logo svg{width:28px;height:28px}
  .entete .btn{padding:8px 11px}
}
@media (max-width:359px){.entete .logo span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}}
@media (min-width:420px){.long{display:inline}.court{display:none}}
@media (min-width:1024px){.nav{display:block}.entete-actions{margin-left:8px}.btn-menu{display:none}.menu-mobile{display:none!important}}

/* Accueil : héros avec l'arche vitrée */
.heros{padding-block:clamp(40px,7vw,96px) clamp(56px,8vw,112px)}
.heros .page{display:grid;gap:48px;align-items:center}
@media (min-width:960px){.heros .page{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}.heros h1{font-size:clamp(44px,5vw,68px)}.heros .pile{position:sticky;top:110px}}
.heros .chapo strong{color:var(--encre)}
.heros .page > *{min-width:0}

/* Configurateur de l'accueil : le visiteur voit son site se construire */
.config{background:var(--blanc);border:1px solid var(--filet);border-radius:10px;padding:clamp(16px,2.4vw,24px);display:grid;gap:16px}
.config form{display:grid;gap:14px}
.config label.titre-champ,.config .legende{display:block;font-weight:600;font-size:15px;margin-bottom:6px}
.puces{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.puces label{position:relative;display:flex;flex-direction:column;justify-content:center;min-height:48px;padding:8px 14px;border:1.5px solid var(--filet);border-radius:8px;cursor:pointer;font-weight:600;font-size:15px;line-height:1.2;background:var(--fond)}
.puces label small{font-weight:400;font-size:12px;color:var(--doux)}
.puces input{position:absolute;opacity:0;pointer-events:none}
@media (max-width:480px){.config .puces{grid-template-columns:1fr;gap:6px}.config .puces label{flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;min-height:44px}.choix-resa .puces{grid-template-columns:repeat(3,minmax(0,1fr))}.choix-resa .puces label{justify-content:center;text-align:center;font-size:14px}}
.puces label:has(input:checked){border-color:var(--rouge);background:var(--blanc);box-shadow:inset 0 0 0 1px var(--rouge)}
.puces label:has(input:focus-visible){outline:3px solid var(--encre);outline-offset:2px}
.interrupteur{display:flex;align-items:center;gap:12px;min-height:44px;font-weight:600;cursor:pointer}
.interrupteur input{appearance:none;width:46px;height:28px;border-radius:999px;background:#CDBFB1;position:relative;cursor:pointer;flex:none;transition:background-color .15s}
.interrupteur input::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;transition:transform .15s}
.interrupteur input:checked{background:var(--rouge)}
.interrupteur input:checked::after{transform:translateX(18px)}
.ecran{border:1px solid var(--filet);border-radius:10px;overflow:hidden;max-height:min(520px,70vh);overflow-y:auto;overscroll-behavior:contain}
.ecran-barre{display:flex;gap:6px;align-items:center;padding:8px 12px;background:#EFE7DC;font-size:12px;color:var(--doux)}
.ecran-barre i{width:8px;height:8px;border-radius:50%;background:#CDBFB1}
.config .btn{width:100%}

/* Cartes des modèles avec un vrai aperçu */
.carte-modele .ecran{max-height:340px;overflow:hidden;border:0;border-radius:0;border-bottom:1px solid var(--filet);pointer-events:none}

/* Barre du bas sur téléphone */
.barre-mobile{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(251,248,243,.86);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--filet)}
.barre-mobile .btn{width:100%}
.barre-mobile[hidden]{display:none}
body.avec-barre{padding-bottom:76px}
@media (min-width:1024px){.barre-mobile{display:none!important}body.avec-barre{padding-bottom:0}}

/* Apparitions discrètes */
.js .apparait{opacity:0;transform:translateY(14px);transition:opacity .5s ease,transform .5s ease}
.js .apparait.vu{opacity:1;transform:none}

/* Formulaires */
input[type=text],input[type=email],input[type=tel],input[type=url],textarea,select{width:100%;min-height:48px;padding:12px 14px;border:1.5px solid #8A7A72;border-radius:3px;background:var(--blanc);color:var(--encre);font:400 16px/1.4 var(--texte)}
textarea{min-height:120px;resize:vertical}
input:focus,textarea:focus,select:focus{outline:3px solid rgba(126,34,34,.35);outline-offset:0;border-color:var(--rouge)}
.champ{display:grid;gap:6px}
.champ label,.legende{font-weight:600}
.aide{font-size:14px;color:var(--doux)}
.champ.invalide input,.champ.invalide textarea{border-color:var(--erreur)}
.erreur{display:none;color:var(--erreur);font-size:14px;font-weight:600}
.champ.invalide .erreur{display:flex;gap:6px;align-items:center}
.erreur::before{content:"!";display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--erreur);color:#fff;font-size:12px}
.formulaire{display:grid;gap:22px;max-width:640px}
.choix{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.choix label{display:flex;gap:10px;align-items:center;min-height:52px;padding:10px 14px;border:1.5px solid var(--filet);border-radius:3px;background:var(--blanc);cursor:pointer;font-weight:600}
.choix input:checked + span{color:var(--rouge)}
.choix label:has(input:checked){border-color:var(--rouge)}
.case{display:flex;gap:10px;align-items:flex-start}
.case input{width:22px;height:22px;margin-top:2px;accent-color:var(--rouge)}
.confirmation{display:none;padding:28px;border:2px solid var(--encre);background:var(--blanc)}
.confirmation.visible{display:block}
.vo-envoye .formulaire{display:none}.vo-envoye .confirmation{display:block}
.vo-piege{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.envoi-erreur{margin:0 0 16px;padding:12px 16px;border-left:4px solid var(--erreur);background:var(--blanc);color:var(--encre);font-weight:600}

/* Comment ça marche : les durées comme des cotes (repris de la piste B) */
.etapes{list-style:none;margin:48px 0 0;padding:0;display:grid;gap:40px}
@media (min-width:800px){.etapes{grid-template-columns:repeat(3,1fr);gap:32px}}
.duree{font:400 clamp(36px,4.2vw,56px)/1 var(--titre);display:block;white-space:nowrap}
.etapes li:last-child .duree{color:var(--rouge)}
.cote{display:block;position:relative;height:14px;margin:14px 0 16px;border-left:2px solid var(--encre);border-right:2px solid var(--encre)}
.cote::before{content:"";position:absolute;left:0;right:0;top:6px;border-top:2px solid var(--encre)}

/* Tarifs */
.tarifs{display:grid;gap:20px;margin-top:48px}
@media (min-width:900px){.tarifs{grid-template-columns:repeat(3,1fr)}}
.formule{display:flex;flex-direction:column;gap:16px;padding:28px;background:var(--blanc);border:1px solid var(--filet);border-radius:4px}
.formule.mise-en-avant{border:2px solid var(--encre)}
.formule h2{font-size:26px}
.prix{font:400 52px/1 var(--titre)}
.prix small{font:600 16px/1 var(--texte);color:var(--doux)}
.etiquette{align-self:flex-start;background:var(--kraft);color:var(--encre);font-weight:600;font-size:14px;padding:4px 10px;border-radius:2px}
.formule ul{margin:0;padding-left:20px}
.formule .btn{margin-top:auto}
.note{font-size:14px;color:var(--doux);margin-top:20px}

/* Listes à filets */
.liste-filets{list-style:none;margin:40px 0 0;padding:0;display:grid;column-gap:48px}
@media (min-width:800px){.liste-filets{grid-template-columns:1fr 1fr}}
.liste-filets li{padding:20px 0;border-top:1px solid var(--filet)}
.liste-filets strong{display:block;font:400 22px/1.2 var(--titre);margin-bottom:4px}

/* Bandeau de garanties */
.garanties{background:var(--kraft-clair);border-radius:4px;padding:clamp(28px,4vw,48px);display:grid;gap:24px}
@media (min-width:900px){.garanties{grid-template-columns:1fr 1.4fr;align-items:start}}
.garanties ol{margin:0;padding-left:22px;display:grid;gap:10px}

/* Modèles (aperçu accueil) */
.modeles-apercu{display:grid;gap:20px;margin-top:40px}
@media (min-width:900px){.modeles-apercu{grid-template-columns:repeat(3,1fr)}}
.carte-modele{display:block;text-decoration:none;color:var(--encre);background:var(--blanc);border:1px solid var(--filet);border-radius:4px;overflow:hidden}
.carte-modele:hover{border-color:var(--encre)}
.carte-modele .corps{padding:18px 20px 22px;display:grid;gap:6px}
.carte-modele .promesse{color:var(--doux)}
.carte-modele .lien{color:var(--rouge);font-weight:600}

/* FAQ */
.faq{margin-top:32px;max-width:800px}
.faq details{border-top:1px solid var(--filet)}
.faq details:last-child{border-bottom:1px solid var(--filet)}
.faq summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;position:relative;font:400 21px/1.3 var(--titre)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:16px;font:400 28px/1 var(--texte);color:var(--rouge)}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 0 22px;max-width:65ch;color:var(--doux)}

/* Dernier appel */
.appel{background:var(--encre);color:var(--creme);border-radius:4px;padding:clamp(32px,6vw,72px);display:grid;gap:24px;justify-items:start}
.appel .btn-plein{border-color:var(--creme);background:var(--creme);color:var(--encre)}
.appel .btn-plein:hover{background:transparent;color:var(--creme)}

/* Visualiseur */
.onglets{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px}
.onglets button,.appareils button{min-height:44px;padding:8px 16px;border:1.5px solid var(--encre);background:transparent;color:var(--encre);font:600 15px/1 var(--texte);border-radius:3px;cursor:pointer}
.onglets button[aria-selected="true"],.appareils button[aria-pressed="true"]{background:var(--encre);color:var(--creme)}
.outils{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;margin-top:20px}
.appareils{display:none;gap:8px}
@media (min-width:1024px){.appareils{display:flex}}
.pastilles{display:flex;gap:10px;align-items:center}
.pastilles button{width:44px;height:44px;border-radius:50%;border:3px solid var(--blanc);box-shadow:0 0 0 1.5px #8A7A72;cursor:pointer}
.pastilles button[aria-pressed="true"]{box-shadow:0 0 0 3px var(--encre)}
.scene{margin-top:24px;background:var(--kraft-clair);border-radius:4px;padding:clamp(12px,3vw,32px);display:grid;place-items:center;overflow:hidden}
.cadre{background:var(--blanc);border:8px solid var(--encre);border-radius:14px;overflow:hidden;width:100%;transition:width .3s}
.cadre iframe{display:block;border:0;width:100%;height:640px;transform-origin:0 0}
.desc-modele{margin-top:24px;display:grid;gap:12px;max-width:65ch}

/* Pages intérieures */
.entete-page{padding-block:clamp(48px,7vw,96px) 0}
.entete-page .chapo{margin-top:20px}
.etapes-num{counter-reset:e;list-style:none;padding:0;margin:32px 0 0;display:grid;gap:0}
.etapes-num li{counter-increment:e;display:grid;grid-template-columns:56px 1fr;gap:16px;padding:22px 0;border-top:1px solid var(--filet)}
.etapes-num li::before{content:counter(e);font:400 40px/1 var(--titre);color:var(--rouge)}
.deux-col{display:grid;gap:48px}
@media (min-width:900px){.deux-col{grid-template-columns:1fr 1fr;align-items:start}}
.portrait{aspect-ratio:4/5;background:var(--kraft-clair);border:1px dashed #B9A48B;display:grid;place-items:center;color:var(--doux);font-weight:600;border-radius:4px;max-width:420px}

/* Pied de page */
.pied{border-top:1px solid var(--filet);padding-block:48px 32px;margin-top:clamp(64px,10vw,128px)}
.pied .page{display:grid;gap:28px}
@media (min-width:800px){.pied .page{grid-template-columns:1.2fr 1fr 1fr}}
.pied ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.pied a{color:var(--encre)}
.mentions{font-size:14px;color:var(--doux)}
.maquette-note{background:var(--encre);color:var(--creme);font-size:13px;text-align:center;padding:6px 12px}
.maquette-note a{color:var(--creme)}

@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.groupe-resa{display:flex;flex-wrap:wrap}

/* Fonds alternés : crème, kraft avec grain de papier, brun encre */
.fond-kraft{background-color:var(--kraft-clair);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .17 0 0 0 0 .1 0 0 0 0 .08 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E")}
.fond-encre{background:var(--encre);color:var(--creme)}
.fond-encre .cote{border-color:var(--creme)}
.fond-encre .cote::before{border-color:var(--creme)}
.fond-encre .etapes li:last-child .duree{color:var(--kraft)}
.fond-kraft .garanties{background:var(--blanc)}
.section.fond-encre,.section.fond-kraft,.fond-kraft + .section,.fond-encre + .section,.section + .fond-kraft,.section + .fond-encre{border-top:0}
.activites-intro{padding-bottom:clamp(24px,4vw,48px)}

/* Bandes d'activité : photo d'ambiance + téléphone qui montre le modèle */
.bande{padding-block:clamp(48px,8vw,104px)}
.bande-grille{display:grid;gap:clamp(40px,6vw,80px);align-items:center}
.bande-grille > *{min-width:0}
@media (min-width:900px){.bande-grille{grid-template-columns:1.1fr .9fr}.bande-grille.inverse .bande-visuel{order:2}}
.bande-visuel{position:relative;padding-bottom:48px;padding-right:clamp(48px,10vw,96px)}
.bande-grille.inverse .bande-visuel{padding-right:0;padding-left:clamp(48px,10vw,96px)}
.bande-visuel img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:10px}
.telephone{position:absolute;right:0;bottom:0;width:clamp(150px,30%,210px);aspect-ratio:9/17;border:7px solid var(--encre);border-radius:26px;overflow:hidden;background:var(--encre)}
.bande-grille.inverse .telephone{right:auto;left:0}
.telephone .apercu{width:360px;height:680px;overflow:hidden;pointer-events:none;transform:scale(var(--k,.5));transform-origin:0 0}
.titre-activite{font-size:clamp(40px,5vw,64px)}
.metiers{font-weight:600;color:var(--rouge)}
.atouts{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.atouts li{display:flex;gap:10px;align-items:baseline}
.atouts li::before{content:"";flex:none;width:9px;height:9px;background:var(--rouge);transform:translateY(-1px)}

/* Échelle typographique unique (rapport 1,25 sur une base de 17 px).
   Hiérarchie : titre de page > titre de section > titre de bloc > texte. */
:root{--t-texte:17px;--t-chapo:clamp(18px,1.4vw,20px);--t-bloc:clamp(21px,1.8vw,24px);--t-3:clamp(26px,2.6vw,32px);--t-section:clamp(30px,3.4vw,42px);--t-page:clamp(38px,5vw,60px)}
h1{font-size:var(--t-page)}
.heros h1{font-size:var(--t-page)}
h2{font-size:var(--t-section)}
h3,.h3,.formule h2{font-size:var(--t-bloc)}
.chapo{font-size:var(--t-chapo)}
.titre-activite{font-size:var(--t-section)}
.duree{font-size:var(--t-3)}
.prix{font-size:clamp(34px,3.4vw,42px)}
.garanties .prix{font-size:var(--t-3)!important}
.liste-filets strong{font-size:var(--t-bloc)}
.faq summary{font-size:var(--t-bloc)}
.menu-mobile a{font-size:var(--t-bloc)}
.etapes-num li::before{font-size:var(--t-3)}

/* Fond « vitré » des en-têtes de page : un verre clair traversé de deux reflets */
.fond-vitre{background-color:#F6F0E6;background-image:linear-gradient(112deg,transparent 0 58%,rgba(255,255,255,.7) 58% 63%,transparent 63% 66%,rgba(255,255,255,.45) 66% 67.5%,transparent 67.5%),linear-gradient(180deg,#F1E8DA 0%,var(--fond) 100%);padding-bottom:clamp(56px,8vw,104px);border-bottom:1px solid var(--filet)}
.fond-vitre + .section{border-top:0}
.fond-encre a{color:var(--kraft)}
.fond-encre .aide{color:#D8C8B6}

/* Portrait */
.portrait-photo{width:100%;max-width:400px;height:auto;aspect-ratio:1;object-fit:cover;border-radius:10px}
/* Aperçu du configurateur : hauteur fixe, sans défilement intérieur (le doigt fait toujours défiler la page) */
.config .ecran{height:520px;max-height:none;overflow:hidden;position:relative}
.config .ecran::after{content:"";position:absolute;left:0;right:0;bottom:0;height:56px;background:linear-gradient(transparent,var(--blanc));pointer-events:none}

/* Blog */
.filtres{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:32px}
.filtres button{min-height:44px;padding:8px 16px;border:1.5px solid var(--encre);background:transparent;color:var(--encre);font:600 15px/1 var(--texte);border-radius:999px;cursor:pointer}
.filtres button[aria-pressed="true"]{background:var(--encre);color:var(--creme)}
.rubrique{display:inline-block;padding:4px 10px;border-radius:999px;font-size:13px;font-weight:600;line-height:1.3}
.r-site{background:#F3DEDB;color:#6A1D1D}
.r-google{background:#DDE8E1;color:#1E4A35}
.r-guides{background:var(--kraft);color:var(--encre)}
.article-une{display:grid;gap:14px;padding:clamp(24px,4vw,48px);background:var(--encre);color:var(--creme);border-radius:10px;text-decoration:none;margin-bottom:24px}
.article-une h2{color:var(--creme);max-width:22ch}
.article-une p{max-width:60ch;color:#E9DCCB}
.article-une:hover h2{text-decoration:underline;text-underline-offset:6px}
.articles{display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.carte-article{display:flex;flex-direction:column;gap:10px;align-items:flex-start;padding:24px;background:var(--blanc);border:1px solid var(--filet);border-radius:10px;text-decoration:none;color:var(--encre);transition:border-color .15s}
.carte-article:hover{border-color:var(--encre)}
.carte-article:hover h3{text-decoration:underline;text-underline-offset:4px}
.carte-article p{color:var(--doux);font-size:16px}
.meta{font-size:14px;color:var(--doux);margin-top:auto}
.article-une .meta{color:#D8C8B6}
.carte-article[hidden],.article-une[hidden]{display:none}
/* Article */
.lecture{max-width:720px}
.entete-page .lecture > * + *{margin-top:18px}
.auteur{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--doux)}
.auteur img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.texte-article{padding-block:clamp(40px,6vw,72px)}
.texte-article > * + *{margin-top:20px}
.texte-article h2{font-size:var(--t-3);margin-top:40px}
.texte-article ul{padding-left:20px;display:grid;gap:10px}
.texte-article p,.texte-article li{font-size:18px;line-height:1.7}
.texte-article blockquote{margin:32px 0;padding:8px 0 8px 24px;border-left:4px solid var(--rouge);font:400 var(--t-bloc)/1.35 var(--titre)}
.encadre-demo{margin-top:48px!important;padding:28px;background:var(--kraft-clair);border-radius:10px;display:grid;gap:14px;justify-items:start}
.encadre-demo h2{margin-top:0!important}
.article-une .rubrique{justify-self:start}
.section h2 + .articles{margin-top:32px}
/* Pagination du blog */
.pagination{margin-top:40px}
.pagination ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center}
.pagination a,.pag-off{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 12px;border-radius:999px;text-decoration:none;font-weight:600;color:var(--encre)}
.pagination a{border:1.5px solid var(--filet);background:var(--blanc)}
.pagination a:hover{border-color:var(--encre)}
.pagination a[aria-current="page"]{background:var(--encre);border-color:var(--encre);color:var(--creme)}
.pag-off{color:#A8988C}
h1 .aide{font:400 var(--t-chapo) var(--texte);vertical-align:middle}
@media (max-width:480px){.pagination .mot{display:none}}
.pag-resume{display:none;font-weight:600;padding:0 8px}
@media (max-width:400px){.pagination .pag-num{display:none}.pagination .pag-resume{display:block}}
.pagination a,.pag-off{gap:6px}

/* Nuanciers à 4 bandes (fond, texte, accent, surface) */
.couleurs{display:flex;flex-wrap:wrap;gap:8px}
.bouton-couleurs{padding:3px;border:2px solid transparent;border-radius:10px;background:var(--blanc);cursor:pointer;box-shadow:0 0 0 1px var(--filet);min-height:44px}
.bouton-couleurs[aria-pressed="true"]{border-color:var(--encre);box-shadow:none}
.nuancier{display:flex;width:56px;height:36px;border-radius:7px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.nuancier i{flex:1}
.mini-couleurs{display:flex;flex-wrap:wrap;gap:6px}
.mini-couleurs .nuancier{width:34px;height:20px;border-radius:5px}
/* Galerie des modèles */
.galerie-modeles{display:grid;gap:20px;margin-top:28px;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.carte-galerie{display:grid;grid-template-columns:110px minmax(0,1fr);gap:18px;align-items:center;padding:18px;background:var(--blanc);border:1px solid var(--filet);border-radius:12px}
.carte-galerie.conseille{border:2px solid var(--rouge)}
.carte-galerie .telephone{position:relative;width:110px;right:auto;bottom:auto;border-width:5px;border-radius:18px}
.carte-galerie .pile > * + *{margin-top:10px}
.carte-galerie .btn{min-height:44px;padding:8px 14px;font-size:15px}
.badge{display:inline-block;background:var(--rouge);color:var(--creme);font-size:12px;font-weight:600;padding:3px 9px;border-radius:999px}
.conseilles{font-size:15px;color:var(--doux)}
.outils + .outils{margin-top:12px}
.config select{width:100%}
@media (max-width:480px){.config .couleurs{gap:6px}.config .nuancier{width:44px;height:32px}}
@media (max-width:400px){.config .couleurs{gap:5px}.config .nuancier{width:34px}}

/* Styles de couleurs en pastilles rondes */
.pastille{display:inline-block;width:22px;height:22px;border-radius:50%;flex:none}
.bouton-style{display:inline-flex;align-items:center;gap:8px;min-height:44px;min-width:44px;justify-content:center;padding:6px;border:2px solid transparent;border-radius:999px;background:var(--blanc);cursor:pointer;box-shadow:0 0 0 1px var(--filet);font:600 14px/1 var(--texte);color:var(--encre)}
.bouton-style .pastille{width:28px;height:28px}
.bouton-style[aria-pressed="true"]{border-color:var(--encre);box-shadow:none}
.styles-nommes .bouton-style{padding:6px 14px 6px 6px}
.config .couleurs{gap:6px}
/* Galerie façon boutique de thèmes */
.galerie-themes{display:grid;gap:clamp(28px,4vw,48px) clamp(20px,3vw,32px);grid-template-columns:repeat(auto-fill,minmax(min(100%,380px),1fr))}
.carte-theme{display:grid;gap:16px;text-decoration:none;color:var(--encre)}
.vignette{position:relative;border-radius:12px;background:var(--kraft-clair);padding:18px 18px 0;overflow:hidden;aspect-ratio:16/11;box-shadow:0 0 0 1px var(--filet);transition:box-shadow .2s}
.vignette img:first-child{width:100%;height:auto;border-radius:8px 8px 0 0;box-shadow:0 2px 14px rgba(43,26,22,.18);display:block}
.vignette-tel{position:absolute;right:16px;bottom:-30px;width:26%;height:auto;border:5px solid #1a1a1a;border-radius:18px;box-shadow:0 8px 24px rgba(43,26,22,.28);background:#1a1a1a}
.carte-theme:hover .vignette,.carte-theme:focus-visible .vignette{box-shadow:0 0 0 2px var(--encre)}
.carte-theme.conseille .vignette{box-shadow:0 0 0 2px var(--rouge)}
.carte-theme-texte{display:grid;gap:8px}
.ligne-titre{display:flex;align-items:center;gap:10px}
.carte-theme:hover h2{text-decoration:underline;text-underline-offset:4px}
.styles-ligne{display:flex;align-items:center;gap:6px}
.styles-ligne .aide{margin-left:6px}
/* Fiche d'un modèle */
.fiche-titre{display:grid;gap:24px;align-items:end;margin-top:12px}
@media (min-width:900px){.fiche-titre{grid-template-columns:1fr auto}}
.reglages{display:flex;flex-wrap:wrap;gap:20px 40px;align-items:flex-start}
.reglages .legende{margin-bottom:8px;font-weight:600}
.seulement-grand{display:none}
@media (min-width:1024px){.seulement-grand{display:block}.seulement-grand .appareils{display:flex}}
.autres-themes{display:grid;gap:16px;margin-top:28px;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr))}
.mini-theme{display:grid;gap:8px;text-decoration:none;color:var(--encre);font-weight:600}
.mini-theme img{width:100%;height:auto;border-radius:8px;box-shadow:0 0 0 1px var(--filet)}
.mini-theme:hover span{text-decoration:underline}
.fiche-entete{padding-bottom:clamp(32px,4vw,48px)}.fiche-entete + .section{padding-top:clamp(28px,4vw,40px)}.fiche-entete h1{font-size:var(--t-section)}

/* Harmonie : le rouge est réservé aux actions (boutons, liens) ; le reste passe à l'encre ou au kraft */
.badge{background:var(--encre);color:var(--creme)}
.carte-theme.conseille .vignette{box-shadow:0 0 0 2px var(--encre)}
.atouts li::before{background:var(--kraft);box-shadow:inset 0 0 0 1.5px var(--encre)}
.metiers{color:var(--encre)}
.etapes li:last-child .duree{color:inherit;text-decoration:underline;text-decoration-color:var(--kraft);text-decoration-thickness:5px;text-underline-offset:8px}
.etapes-num li::before{color:var(--encre)}
.texte-article blockquote{border-left-color:var(--kraft)}
.puces label:has(input:checked){border-color:var(--encre);box-shadow:inset 0 0 0 1px var(--encre)}
.choix label:has(input:checked){border-color:var(--encre)}
.choix input:checked + span{color:inherit}
/* Échelle d'espacements unique */
:root{--esp-section:clamp(56px,8vw,112px);--esp-entete:clamp(40px,6vw,80px)}
.section,.bande{padding-block:var(--esp-section)}
.entete-page{padding-top:var(--esp-entete)}
.fond-vitre{padding-bottom:var(--esp-section)}
.heros{padding-block:var(--esp-entete) var(--esp-section)}
.pied{margin-top:var(--esp-section)}
/* Bascule mois / année */
.bascule{display:inline-flex;gap:4px;padding:4px;margin-top:28px;border-radius:999px;background:var(--blanc);box-shadow:0 0 0 1px var(--filet)}
.bascule button{min-height:44px;padding:8px 18px;border:0;border-radius:999px;background:transparent;font:600 15px/1 var(--texte);color:var(--encre);cursor:pointer}
.bascule button[aria-pressed="true"]{background:var(--encre);color:var(--creme)}
.bascule .offert{font-weight:400;font-size:13px;opacity:.85}
.bascule + .tarifs{margin-top:24px}
/* Valider ma démo */
.valider-grille{display:grid;gap:40px;align-items:start}
@media (min-width:960px){.valider-grille{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}.recap-prix{position:sticky;top:96px}}
.recap-modele{display:grid;grid-template-columns:140px 1fr;gap:16px;align-items:center;padding:14px;background:var(--blanc);border:1px solid var(--filet);border-radius:10px}
.recap-modele img{width:100%;height:auto;border-radius:6px}
.choix-formule{grid-template-columns:1fr}
.choix-formule label{align-items:flex-start}
.recap-prix{display:grid;gap:14px;padding:28px;background:var(--blanc);border:2px solid var(--encre);border-radius:12px}
.recap-lignes{margin:0;padding-left:18px;display:grid;gap:6px}
.liste-simple{margin:0;padding-left:20px;display:grid;gap:10px}
/* 404 : la vitre cassée */
.page-404 .deux-col{align-items:center}
.code-404{font:400 var(--t-3)/1 var(--titre);color:var(--doux);letter-spacing:.1em}
.vitre-cassee{width:100%;max-width:400px;height:auto;justify-self:center}
input[type=radio],input[type=checkbox]{accent-color:var(--encre)}

/* ===== Accueil v3 (27/10/2026) : le travail d'abord ===== */
.surtitre{font-weight:600;font-size:15px;color:var(--doux)}
.heros-v3 .page{display:grid;gap:clamp(36px,5vw,56px);align-items:center}
@media (min-width:960px){.heros-v3 .page{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)}.heros-v3 .pile{position:static}}
.heros-v3 h1{font-size:clamp(38px,1rem + 3.4vw,64px)}
.heros-prix{font-size:16px;color:var(--doux);max-width:52ch}
.heros-prix strong{color:var(--encre)}
.vitrine-heros{position:relative;margin:0;padding:0 0 clamp(36px,5vw,56px) clamp(56px,9vw,110px)}
.vh-ordi{border-radius:10px;overflow:hidden;background:var(--blanc);box-shadow:0 0 0 1px var(--filet),0 18px 50px rgba(43,26,22,.16)}
.vh-ordi img{width:100%;height:auto}
.vh-tel{position:absolute;left:0;bottom:0;width:clamp(110px,27%,190px);height:auto;border:6px solid #1a1a1a;border-radius:22px;background:#1a1a1a;box-shadow:0 14px 36px rgba(43,26,22,.3)}
.vitrine-heros figcaption{position:absolute;right:0;bottom:0;font-size:13px;color:var(--doux);max-width:calc(100% - clamp(140px,32%,220px));text-align:right}
/* Ligne de preuves : quatre faits vérifiables, sans chiffre inventé */
.preuves{border-block:1px solid var(--filet);background:var(--blanc)}
.preuves ul{list-style:none;margin:0 auto;padding:22px 0;display:grid;gap:16px 32px;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.preuves li{font-size:15px;color:var(--doux);line-height:1.45}
.preuves strong{display:block;color:var(--encre);font:400 19px/1.25 var(--titre);margin-bottom:2px}
.preuves + .section{border-top:0}
/* Galerie de l'accueil : quatre colonnes, la 8e case pour le sur mesure */
.tete-ligne{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:end;justify-content:space-between}
.tete-ligne .chapo{margin-top:12px}
.lien-fort{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:600;color:var(--encre);text-decoration:underline;text-underline-offset:.3em}
.filtres-liens{gap:4px 24px;margin:28px 0 24px}
.filtres-liens button{min-height:44px;padding:8px 2px;border:0;border-bottom:2px solid transparent;border-radius:0;background:none;color:var(--doux)}
.filtres-liens button[aria-pressed="true"]{background:none;color:var(--encre);border-bottom-color:var(--rouge)}
@media (hover:hover) and (pointer:fine){.filtres-liens button:hover{color:var(--encre)}}
.accueil-modeles .galerie-themes{grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:36px 24px}
.accueil-modeles .vignette{aspect-ratio:16/11;padding:12px 12px 0}
.accueil-modeles .carte-theme-texte .aide{font-size:15px}
/* Essai : texte à gauche, configurateur à droite */
.essai-grille{display:grid;gap:40px;align-items:start}
@media (min-width:960px){.essai-grille{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}.essai-texte{position:sticky;top:110px}}
.essai-texte .atouts{margin-top:28px}
/* Dernier appel en couleur d'accent : jamais une bande sombre collée au pied */
.appel-accent{background:var(--rouge)}
.appel-accent .btn-plein{background:var(--creme);border-color:var(--creme);color:var(--encre)}
@media (hover:hover) and (pointer:fine){.appel-accent .btn-plein:hover{background:var(--encre);border-color:var(--encre);color:var(--creme)}}
/* Téléphone : boutons de même largeur, aperçu du téléphone plus petit */
@media (max-width:599px){
  .heros-v3 .actions{display:grid}
  .heros-v3 .actions .btn{width:100%}
  .vitrine-heros{padding-left:64px;padding-bottom:40px}
  .vitrine-heros figcaption{position:static;max-width:none;text-align:left;margin-top:8px;padding-left:0}
}
.carte-sur-mesure .vignette{display:grid;place-items:center;padding:24px;background:var(--encre);color:var(--creme);font:400 var(--t-bloc)/1.3 var(--titre);text-align:center}
.carte-sur-mesure .vignette p{max-width:20ch}
/* Retouches après captures : titres des cartes alignés, pastilles plus petites, vitrine plus grande */
.carte-theme{align-content:start}
.accueil-modeles .styles-ligne{gap:4px;flex-wrap:wrap}
.accueil-modeles .styles-ligne .pastille{width:16px;height:16px}
@media (min-width:960px){.heros-v3 .page{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.heros-v3 h1{font-size:clamp(40px,1rem + 2.6vw,58px)}}
@media (max-width:599px){
  .vitrine-heros{padding-bottom:0}
  .vitrine-heros figcaption{margin-left:62px;min-height:3em}
}
/* Vitrine du premier écran : le téléphone ne recouvre que le bord du navigateur ; la légende passe sous l'ensemble */
.vitrine-heros{padding:0 0 0 25%;margin-bottom:44px}
.vh-tel{width:27%}
.vitrine-heros figcaption{position:absolute;top:calc(100% + 12px);left:0;right:0;max-width:none;margin:0;min-height:0;text-align:right}
@media (max-width:599px){.vitrine-heros{padding:24px 0 0 26%}.vh-tel{width:30%}.vitrine-heros figcaption{text-align:left}}
/* Téléphone : la galerie de l'accueil en deux colonnes compactes (8 grandes cartes allongeaient la page de 1 600 px) */
@media (max-width:599px){
  .accueil-modeles .galerie-themes{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}
  .accueil-modeles .vignette{padding:8px 8px 0;border-radius:8px}
  .accueil-modeles .vignette-tel{display:none}
  .accueil-modeles .carte-theme{gap:10px}
  .accueil-modeles .carte-theme-texte{gap:4px}
  .accueil-modeles .carte-theme-texte .aide{font-size:14px;line-height:1.4}
  .accueil-modeles .styles-ligne .pastille{display:none}
  .accueil-modeles .styles-ligne .aide{margin-left:0}
  .carte-sur-mesure .vignette{padding:12px;font-size:16px}
}
/* Téléphone : un seul bord pour le texte de la page (20 px) et un seul dans les cadres (24 px) */
@media (max-width:599px){
  :root{--page:min(1180px,100% - 40px)}
  .config,.formule,.garanties,.appel,.recap-prix,.encadre-demo,.confirmation{padding:24px}
}
/* Mouvement, avec parcimonie (27/10/2026). 1) La frise se trace étape par étape : la cote s'allonge, puis le texte
   arrive ; ça raconte l'ordre des étapes. 2) Le téléphone du premier écran glisse en place une fois au chargement.
   Rien si l'appareil demande moins d'animations (app.js ne pose alors pas la classe « apparait »). */
.duree{white-space:normal}
@media (prefers-reduced-motion:no-preference){
  .vh-tel{animation:tel-arrive .8s cubic-bezier(.22,.8,.3,1) .25s both}
  @keyframes tel-arrive{from{opacity:0;transform:translateY(24px)}}
}
@media (max-width:599px){.config,.formule{padding:23px}.formule.mise-en-avant{padding:22px}}
legend.legende{padding:0}

/* Frise « Comment ça marche » v2 (27/10/2026, « compliqué de comprendre ») : ce qui se passe en titre, le délai
   en petite étiquette, un trait qui relie les numéros. Le trait se trace, puis chaque étape arrive dans l'ordre. */
.frise{list-style:none;margin:48px 0 0;padding:0;display:grid;gap:36px;position:relative}
.frise li{position:relative;display:grid;gap:8px;align-content:start;padding-left:64px}
.frise-num{position:absolute;left:0;top:0;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--creme);color:var(--encre);font:400 22px/1 var(--titre)}
.frise li:last-child .frise-num{background:var(--kraft)}
.frise::before{content:"";position:absolute;left:21px;top:22px;bottom:22px;width:2px;background:rgba(248,238,221,.35);transform-origin:top}
.frise-delai{font-weight:600;font-size:15px;color:var(--kraft)}
.frise h3{font-size:var(--t-bloc);color:var(--creme)}
.frise li > p:last-child{color:#E9DCCB;max-width:40ch}
@media (min-width:800px){
  .frise{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
  .frise li{padding-left:0;padding-top:68px}
  .frise::before{left:22px;right:calc((100% - 80px) / 3 - 22px);top:21px;bottom:auto;width:auto;height:2px;transform-origin:left}
}
.frise.apparait{opacity:1;transform:none}
.frise.apparait::before{transform:scaleY(0);transition:transform 1.1s cubic-bezier(.22,.8,.3,1)}
@media (min-width:800px){.frise.apparait::before{transform:scaleX(0)}}
.frise.apparait li{opacity:0;transform:translateY(10px);transition:opacity .45s ease,transform .45s ease}
.frise.apparait li:nth-child(2){transition-delay:.4s}
.frise.apparait li:nth-child(3){transition-delay:.8s}
.frise.apparait.vu::before,.frise.apparait.vu li{opacity:1;transform:none}
/* Téléphone : un segment de trait par étape, qui s'arrête au dernier numéro */
@media (max-width:799px){
  .frise::before{display:none}
  .frise li:not(:last-child)::before{content:"";position:absolute;left:21px;top:50px;bottom:-30px;width:2px;margin-bottom:-6px;background:rgba(248,238,221,.35);transform-origin:top;transition:transform .5s ease}
  .frise.apparait li:not(:last-child)::before{transform:scaleY(0);transition-delay:inherit}
  .frise.apparait.vu li::before{transform:none}
}

/* Configurateur : le vrai modèle en réduit (cadre de 520 px, sans défilement intérieur : le doigt fait défiler la page) */
.ecran-vrai{position:relative;height:520px;overflow:hidden;background:var(--blanc)}
.ecran-vrai iframe{display:block;border:0;transform-origin:0 0;pointer-events:none;background:var(--blanc)}
@media (max-width:479px){.config .ecran-vrai{height:560px}}
/* Choix de la vue de l'aperçu (ordinateur ou téléphone), seulement là où les deux ont un sens */
.vue-apercu{display:flex;gap:4px 20px;margin-bottom:-6px}
.vue-apercu button{min-height:44px;padding:8px 2px;border:0;border-bottom:2px solid transparent;background:none;font:600 15px/1 var(--texte);color:var(--doux);cursor:pointer}
.vue-apercu button[aria-pressed="true"]{color:var(--encre);border-bottom-color:var(--rouge)}
@media (max-width:459px){.vue-apercu{display:none}}
.ecran-vrai{background:#EFE7DC}
/* Page Modèles et fiche (28/10/2026) : filtres sur une ligne au téléphone, « autres modèles » en deux colonnes */
@media (max-width:599px){
  .filtres-liens{gap:4px 16px}
  .filtres-liens button{font-size:15px}
  .autres-themes{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}
  .mini-theme{font-size:15px}
}
.styles-ligne{flex-wrap:wrap}
.carte-theme{min-width:0}
@media (max-width:359px){.filtres-liens{gap:4px 12px}.filtres-liens button{font-size:14px}}

/* ===== Tarifs v3 (28/10/2026) : les cartes disent pour qui, un tableau de ce qui est compris, la frise d'après ===== */
.pour-qui{color:var(--doux)}
.visuel-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.tableau-defile{margin-top:32px;overflow-x:auto}
.comparatif{width:100%;border-collapse:collapse;font-size:16px;min-width:520px}
.comparatif th,.comparatif td{padding:14px 16px;border-bottom:1px solid var(--filet);text-align:left;vertical-align:top}
.comparatif thead th{font:400 var(--t-bloc)/1.2 var(--titre);border-bottom:2px solid var(--encre);vertical-align:bottom}
.comparatif thead th small{display:block;font:600 15px/1.4 var(--texte);color:var(--doux)}
.comparatif tbody th{font-weight:600;width:34%}
.comparatif td{color:var(--doux)}
.comparatif td[colspan]{color:var(--encre)}
.comparatif .oui::before{content:"";display:inline-block;width:10px;height:10px;margin-right:8px;background:var(--encre)}
.comparatif .non{color:var(--doux)}
/* Téléphone : le tableau devient une liste (une ligne = un titre puis la valeur) */
@media (max-width:599px){
  .comparatif{min-width:0}
  .comparatif thead{display:none}
  .comparatif tr{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px;padding:14px 0;border-bottom:1px solid var(--filet)}
  .comparatif th,.comparatif td{padding:0;border:0}
  .comparatif tbody th{grid-column:1 / -1;width:auto}
  .comparatif td:not([colspan])::before{content:attr(data-formule);display:block;font-size:14px;font-weight:600;color:var(--encre)}
  .comparatif td[colspan]{grid-column:1 / -1}
}
.option-resa{display:grid;gap:32px;padding:clamp(24px,4vw,48px);background:var(--blanc);border-radius:4px}
@media (min-width:900px){.option-resa{grid-template-columns:1fr 1.4fr;align-items:start}}
.option-resa .prix{font-size:clamp(34px,3.4vw,42px)}
.option-resa .surtitre{margin-bottom:-8px}
@media (max-width:599px){.option-resa{padding:24px}}
.comparatif tr > :first-child{padding-left:0}

/* ===== Pages intérieures v3 du site (28/10/2026) : en-tête compact à deux colonnes, sans reflets ===== */
.entete-v3{padding-bottom:var(--esp-entete);border-bottom:1px solid var(--filet)}
.entete-v3 + .section{border-top:0}
.entete-v3 h1{font-size:clamp(34px,1rem + 2.6vw,54px)}
.entete-v3__grille,.apropos-grille{display:grid;gap:36px;align-items:center}
@media (min-width:960px){.entete-v3__grille{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr)}.apropos-grille{grid-template-columns:minmax(0,1fr) auto}}
.faits{margin:0;display:grid;gap:0;background:var(--blanc);border:1px solid var(--filet);border-radius:4px}
.faits > div{padding:18px 24px}
.faits > div + div{border-top:1px solid var(--filet)}
.faits dt{font-weight:600;font-size:15px;color:var(--doux)}
.faits dd{margin:2px 0 0;font:400 var(--t-bloc)/1.25 var(--titre)}
.faits small{display:block;font:400 15px/1.4 var(--texte);color:var(--doux);margin-top:2px}
.cartes-2{display:grid;gap:20px;margin-top:32px}
@media (min-width:800px){.cartes-2{grid-template-columns:1fr 1fr}}
.carte-simple{padding:28px;background:var(--blanc);border:1px solid var(--filet);border-top:3px solid var(--rouge);border-radius:4px;display:grid;gap:10px;align-content:start}
@media (max-width:599px){.carte-simple{padding:23px}}
.carte-simple p{color:var(--doux)}
/* Frise à 5 étapes : en colonnes sur grand écran seulement */
@media (min-width:800px) and (max-width:1179px){.frise--5{grid-template-columns:1fr;gap:28px}.frise--5 li{padding-top:0;padding-left:64px}.frise--5::before{display:none}}
@media (min-width:1180px){.frise--5{grid-template-columns:repeat(5,minmax(0,1fr));gap:28px}.frise--5::before{right:calc((100% - 112px) / 5 - 22px)}}
.devis-grille{display:grid;gap:40px;align-items:start}
@media (min-width:960px){.devis-grille{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.devis-texte{position:sticky;top:110px}}
.devis-grille .formulaire{margin-top:0!important}
/* À propos */
.apropos-photo{width:min(100%,340px);height:auto;aspect-ratio:1;object-fit:cover;border-radius:4px}
.parcours{list-style:none;margin:36px 0 0;padding:0;display:grid;gap:28px}
@media (min-width:800px){.parcours{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}}
.parcours li{display:grid;gap:8px;align-content:start;padding-top:18px;border-top:2px solid var(--encre)}
.parcours .frise-delai{color:var(--rouge)}
.parcours li > p:last-child{color:var(--doux)}
/* Téléphone : tous les boutons d'un groupe et ceux des formulaires en pleine largeur (même règle que le socle des modèles) */
@media (max-width:599px){
  main .actions{display:grid;justify-items:stretch;width:100%}
  main .actions > .btn{width:100%}
  main .formulaire button[type=submit],main .appel .btn{width:100%}
}

/* ===== Formulaire de démo v3 (28/10/2026) : trois groupes, le choix du configurateur rappelé, ce qui suit à côté ===== */
.section-form{padding-top:clamp(32px,5vw,56px)}
.form-grille{display:grid;gap:40px;align-items:start}
@media (min-width:960px){.form-grille{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)}.apres-envoi{position:sticky;top:110px}}
.groupe{border:0;margin:0;padding:24px 0 0;border-top:1px solid var(--filet);display:grid;gap:22px;min-width:0}
.groupe legend{float:left;width:100%;padding:0;margin-bottom:6px;font:400 var(--t-bloc)/1.2 var(--titre)}
.groupe legend .aide{font-family:var(--texte)}
.groupe legend + *{clear:both}
.choix-fait{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:center;padding:14px;background:var(--blanc);border:1px solid var(--filet);border-radius:4px}
.choix-fait img{width:100%;height:auto;border-radius:3px}
.choix-fait p{margin:0}
.choix-fait[hidden]{display:none}
.apres-envoi{display:grid;gap:20px;padding:28px;background:var(--kraft-clair);border-radius:4px}
@media (max-width:599px){.apres-envoi{padding:24px}}
.parcours--vertical{grid-template-columns:1fr!important;gap:20px;margin-top:0}
.parcours--vertical li{padding-top:14px;border-top-width:1px}
.parcours--vertical h3{font-size:19px}
.valider-grille > *,.formulaire,.formulaire fieldset{min-width:0}
@media (max-width:399px){.recap-modele{grid-template-columns:96px minmax(0,1fr);gap:12px}}

/* À propos : parcours en six temps (3 colonnes sur ordinateur), ce que ça change en trois cartes sur le sombre */
@media (min-width:800px){.parcours--5{grid-template-columns:repeat(3,minmax(0,1fr))}}
.cartes-3{list-style:none;margin:32px 0 0;padding:0;display:grid;gap:20px}
@media (min-width:800px){.cartes-3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.cartes-3 li{display:grid;gap:10px;align-content:start;padding-top:18px;border-top:2px solid var(--kraft)}
.cartes-3 h3{color:var(--creme)}
.cartes-3 p{color:#E9DCCB}
input[type=file]{display:block;width:100%;font:400 15px/1.4 var(--texte);padding:8px 0}
input[type=file]::file-selector-button{min-height:44px;margin-right:12px;padding:8px 14px;border:1.5px solid var(--encre);border-radius:3px;background:var(--blanc);font:600 15px/1 var(--texte);color:var(--encre);cursor:pointer}
.r-metier{background:#E4E0F1;color:#3A2F6B}
.r-compare{background:#F6E3C7;color:#6B4210}


/* ==========================================================================
   Adaptation au balisage WordPress (blocs du cœur, Navigation, Requête)
   ========================================================================== */
.wp-site-blocks{padding:0}
/* WordPress met la classe « page » sur <body> des pages : elle ne doit pas recevoir le conteneur centré .page */
body.page{width:auto;margin-inline:0}
.wp-block-image{margin:0}
.groupe-champs{border:0;padding:0;margin:0;min-width:0}
input[type=file]{display:block;width:100%;min-height:48px;padding:10px 0;font:400 15px/1.4 var(--texte)}
.note-editeur{padding:12px 16px;background:var(--kraft-clair);border:1px dashed #B9A48B;border-radius:6px;font-size:14px;color:var(--doux)}

/* Boutons : le bloc Bouton reprend .btn (plein par défaut, style « Contour » = trait) */
.wp-block-buttons{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.wp-block-button__link{text-align:center;display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;border-radius:3px;font:600 16px/1.2 var(--texte);text-decoration:none;border:2px solid var(--rouge);background:var(--rouge);color:var(--creme);cursor:pointer;transition:background-color .15s,color .15s,border-color .15s}
.wp-block-button__link:hover{background:var(--encre);border-color:var(--encre);color:var(--creme)}
.is-style-trait .wp-block-button__link{background:transparent;color:var(--encre);border-color:var(--encre)}
.is-style-trait .wp-block-button__link:hover{background:var(--encre);color:var(--creme)}
.appel .wp-block-button:not(.is-style-trait) .wp-block-button__link{border-color:var(--creme);background:var(--creme);color:var(--encre)}
.appel .wp-block-button:not(.is-style-trait) .wp-block-button__link:hover{background:transparent;color:var(--creme)}
.fond-encre .is-style-trait .wp-block-button__link{color:var(--creme);border-color:var(--creme)}

/* En-tête : la partie de modèle est collante (son parent est la page entière) */
header.wp-block-template-part{position:sticky;top:var(--wp-admin--admin-bar--height,0px);z-index:20;border-bottom:1px solid rgba(43,26,22,.08)}
/* Le verre dépoli est sur un calque à part : posé sur l'en-tête lui-même, il enfermerait le menu plein écran (position fixe) dans l'en-tête */
header.wp-block-template-part::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(251,248,243,.78);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2)}
@media (max-width:600px){header.wp-block-template-part{top:0}}
.entete{position:static;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border:0}
.entete-ligne{display:flex;align-items:center;gap:16px;min-height:68px}
.entete-actions{margin-left:auto;gap:8px;flex-wrap:nowrap}
.entete-actions .wp-block-button__link{min-height:44px;padding:8px 16px;font-size:15px;white-space:nowrap}
.entete-actions .long{display:none}
/* Libellé long seulement quand logo + bouton + Menu tiennent (≈ 500 px) : à 430 px (grands téléphones) il débordait */
@media (min-width:520px){.entete-actions .long{display:block}.entete-actions .court{display:none}}
@media (max-width:459px){.entete-ligne{gap:8px}.entete-ligne .logo{font-size:17px;gap:8px}.entete-ligne .logo svg{width:28px;height:28px}.entete-actions .wp-block-button__link{padding:8px 11px}}
@media (max-width:359px){.entete-ligne .logo span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}}
/* Deux blocs Navigation sur le même menu : en ligne sur grand écran, en plein écran sur téléphone et tablette */
.nav-ordi{display:none!important;margin-left:auto}
@media (min-width:1024px){.nav-ordi{display:flex!important}.nav-mobile{display:none!important}.entete-actions{margin-left:8px}}
.nav-ordi .wp-block-navigation__container{gap:4px}
.nav-ordi .seulement-mobile{display:none}
.wp-block-navigation .wp-block-navigation-item__content{display:block;padding:10px 12px;color:var(--encre);text-decoration:none;font-weight:600;font-size:15px;border-radius:3px}
.wp-block-navigation .wp-block-navigation-item__content:hover,.wp-block-navigation .current-menu-item>.wp-block-navigation-item__content{color:var(--rouge)}
.wp-block-navigation .current-menu-item>.wp-block-navigation-item__content{text-decoration:underline;text-decoration-thickness:2px}
.wp-block-navigation.nav-mobile .wp-block-navigation__responsive-container-open{min-height:44px;padding:8px 14px;border:2px solid var(--encre);border-radius:3px;background:transparent;color:var(--encre);font:600 15px/1.2 var(--texte);cursor:pointer}
@media (max-width:459px){.nav-mobile .wp-block-navigation__responsive-container-open{padding:8px 11px}}
.wp-block-navigation.nav-mobile:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open{background:var(--fond);color:var(--encre);padding:16px}
.nav-mobile .wp-block-navigation__responsive-container-close{min-height:44px;padding:8px 14px;border:2px solid var(--encre);border-radius:3px;font:600 15px/1.2 var(--texte);color:var(--encre)}
.nav-mobile .is-menu-open .wp-block-navigation__responsive-container-content{padding-top:56px}
.nav-mobile .is-menu-open .wp-block-navigation__container{width:min(560px,100%);gap:0!important}
.nav-mobile .is-menu-open .wp-block-navigation-item{width:100%}
.nav-mobile .is-menu-open .wp-block-navigation-item__content{width:100%;padding:14px 0!important;font:400 var(--t-bloc)/1.2 var(--titre);border-bottom:1px solid var(--filet);border-radius:0}

/* Pied de page */
.pied .liens-pied{list-style:none;padding:0;display:grid;gap:6px}
.pied .mentions > * + *{margin-top:2px}
footer.pied{margin-top:var(--esp-section)}

/* Sections : espacements qui étaient écrits dans la page de la maquette */
.page > h2 + .chapo,.page > h2 + p{margin-top:16px}
.titre-suite{margin-top:32px}
.page > h2 + .formulaire{margin-top:32px}
.chapo + .formulaire{margin-top:40px}
.entete-page .chapo + .wp-block-buttons{margin-top:28px}
.texte-legal{max-width:760px}
.texte-legal > h2{margin-top:48px}
.appel-section{margin-top:clamp(32px,6vw,64px)}
.garanties.encart{display:block;margin-top:32px}
.garanties.encart .wp-block-buttons{margin-top:12px}
.prix-option{font:400 40px/1 var(--titre)}
.fiche-note{margin-top:12px}
.portrait-photo img{width:100%;max-width:400px;height:auto;aspect-ratio:1;object-fit:cover;border-radius:10px}
.bande-visuel .wp-block-image img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:10px}

/* Comment ça marche : chaque étape est un groupe (durée + texte), la cote est dessinée sous la durée */
.etapes{margin:48px 0 0;display:grid;gap:40px}
@media (min-width:800px){.etapes{grid-template-columns:repeat(3,1fr);gap:32px}}
.etape .duree::after{content:"";display:block;height:14px;margin:14px 0 16px;border-left:2px solid currentColor;border-right:2px solid currentColor;background:linear-gradient(currentColor,currentColor) center/100% 2px no-repeat}
.etape:last-child .duree{text-decoration:underline;text-decoration-color:var(--kraft);text-decoration-thickness:5px;text-underline-offset:8px}

/* Blog : filtres (lien « Tous » + liste des rubriques) */
.filtres .tous,.filtres .wp-block-categories{display:contents}
.filtres .wp-block-categories li{list-style:none}
.filtres a{display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;border:1.5px solid var(--encre);border-radius:999px;color:var(--encre);font:600 15px/1 var(--texte);text-decoration:none}
.filtres a:hover{background:var(--kraft-clair)}
.blog .filtres .tous a,.filtres .current-cat a{background:var(--encre);color:var(--creme)}
.wp-block-categories{margin:0;padding:0}

/* Blog : grille de cartes, la première de la page 1 en grand */
ul.articles{list-style:none;margin:0;padding:0;display:grid;gap:20px;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr))}
.section .page > h2 + .wp-block-query{margin-top:32px}
.articles > li{display:flex}
.articles .carte-article{position:relative;width:100%}
.carte-article .wp-block-post-title{font-size:var(--t-bloc)}
.carte-article .wp-block-post-title a{color:inherit;text-decoration:none}
.carte-article .wp-block-post-title a::after{content:"";position:absolute;inset:0;border-radius:10px}
.carte-article:hover .wp-block-post-title a{text-decoration:underline;text-underline-offset:4px}
.carte-article .wp-block-post-terms{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:6px;font-size:0}
.carte-article .wp-block-post-excerpt{margin:0}
.carte-article .wp-block-post-excerpt__excerpt{margin:0;color:var(--doux);font-size:16px}
.carte-article:focus-within{outline:3px solid var(--encre);outline-offset:3px}
.carte-article a:focus-visible{outline:0}
body:not(.paged) .liste-blog .articles > li:first-child{grid-column:1/-1}
body:not(.paged) .liste-blog .articles > li:first-child .carte-article{background:var(--encre);color:var(--creme);border-color:var(--encre);padding:clamp(24px,4vw,48px);gap:14px}
body:not(.paged) .liste-blog .articles > li:first-child .wp-block-post-title{font-size:var(--t-section);max-width:22ch}
body:not(.paged) .liste-blog .articles > li:first-child .wp-block-post-excerpt__excerpt{color:#E9DCCB;max-width:60ch;font-size:var(--t-texte)}
body:not(.paged) .liste-blog .articles > li:first-child .meta{color:#D8C8B6}
.meta{display:flex;flex-wrap:wrap;gap:0 6px}
.meta > * + *::before,.auteur > * + *::before{content:"·";margin-right:6px}
.rubrique{text-decoration:none;font-size:13px}
a.rubrique:hover{text-decoration:underline}
.rubrique-avoir-un-site{background:#F3DEDB;color:#6A1D1D}
.rubrique-etre-trouve{background:#DDE8E1;color:#1E4A35}
.rubrique-guides-pratiques{background:var(--kraft);color:var(--encre)}

/* Pagination du bloc Requête */
.wp-block-query-pagination{margin-top:40px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center}
.wp-block-query-pagination-numbers{display:flex;flex-wrap:wrap;gap:8px}
.wp-block-query-pagination a,.wp-block-query-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;min-height:44px;padding:0 12px;border-radius:999px;text-decoration:none;font-weight:600;color:var(--encre);margin:0}
.wp-block-query-pagination a{border:1.5px solid var(--filet);background:var(--blanc)}
.wp-block-query-pagination a:hover{border-color:var(--encre)}
.wp-block-query-pagination .page-numbers.current{background:var(--encre);color:var(--creme)}
.wp-block-query-pagination .page-numbers.dots{border:0;background:none;color:#A8988C}
@media (max-width:400px){.wp-block-query-pagination-numbers{display:none}}

/* Article */
.fil{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.fil .wp-block-post-terms{display:flex;gap:6px}
.entete-page .lecture > * + *{margin-top:18px}
.auteur{display:flex;flex-wrap:wrap;align-items:center;gap:6px 6px;font-size:15px;color:var(--doux)}
.auteur img{width:44px;height:44px;border-radius:50%;object-fit:cover;margin-right:6px}
.auteur > img + *::before{content:none}
.auteur p{margin:0}
.texte-article .wp-block-post-content > * + *{margin-top:20px}
.texte-article .wp-block-post-content > h2{margin-top:40px}
.texte-article .wp-block-quote{margin:32px 0;padding:8px 0 8px 24px;border-left:4px solid var(--kraft);font:400 var(--t-bloc)/1.35 var(--titre)}
.texte-article .wp-block-quote p{font:inherit}

/* ===== Pages v3 dans WordPress (28/10/2026) : correspondances entre les blocs du cœur et les classes de la maquette ===== */
.heros-v3 .heros-texte > .wp-block-buttons,.entete-v3 .pile > .wp-block-buttons{margin-top:24px}
.heros-v3 .heros-prix{margin-top:20px}
.tete-ligne > .wp-block-group{min-width:0}
.tete-ligne > p{margin:0}
.apropos-photo{margin:0}
.apropos-photo img{width:min(100%,340px);height:auto;aspect-ratio:1;object-fit:cover;border-radius:4px}
.carte-simple.encart{margin-top:28px}
.carte-simple .wp-block-buttons{margin-top:6px}
.section-form .formulaire{margin-top:0}
.devis-grille .formulaire{margin-top:0!important}
/* Téléphone : boutons des blocs en pleine largeur, comme le reste du site */
@media (max-width:599px){
  main .wp-block-buttons{display:grid;width:100%}
  main .wp-block-button,main .wp-block-button__link{width:100%}
}
/* Blog : filtres en liens soulignés (plus de pilules), deux rubriques de plus */
.filtres a{border:0;border-bottom:2px solid transparent;border-radius:0;padding:8px 2px;background:none;color:var(--doux)}
.filtres a:hover{background:none;color:var(--encre)}
.blog .filtres .tous a,.filtres .current-cat a{background:none;color:var(--encre);border-bottom-color:var(--rouge)}
.filtres{gap:4px 24px}
@media (max-width:599px){.filtres{gap:4px 16px}}
.rubrique-par-metier{background:#E4E0F1;color:#3A2F6B}
.rubrique-comparatifs{background:#F6E3C7;color:#6B4210}
/* Articles : photos et infographies, crédit en petit sous l'image (28/10/2026) */
.texte-article .wp-block-image,.texte-article .infographie{margin:32px 0}
.texte-article .wp-block-image img{border-radius:6px}
.texte-article figcaption,.texte-article .wp-element-caption{font-size:14px;line-height:1.4;color:var(--doux);margin-top:8px;text-align:left}
.texte-article .infographie svg{display:block;width:100%;height:auto}
/* Auteur d'un article : photo, puis le nom sur une ligne et dates et durée dessous ; pas de « · » qui finirait seul en début de ligne (28/10/2026) */
.auteur{flex-wrap:nowrap;gap:12px}
.auteur > * + *::before{content:none}
.auteur-texte{display:grid;gap:2px}
.auteur-meta{display:flex;flex-wrap:wrap;column-gap:14px;row-gap:2px}
.auteur-meta > *{white-space:nowrap}
/* Tableaux d'article : colonnes à la largeur du contenu, césure française plutôt que des mots coupés n'importe où ; défilement dans le tableau seulement s'il est vraiment trop large */
.texte-article .wp-block-table{overflow-x:auto}
.texte-article .wp-block-table td,.texte-article .wp-block-table th{overflow-wrap:normal;word-break:normal;hyphens:auto;-webkit-hyphens:auto;vertical-align:top}
@media (max-width:599px){
  .texte-article .wp-block-table{overflow:visible}
  .texte-article table.en-fiches,.texte-article table.en-fiches tbody,.texte-article table.en-fiches tr,.texte-article table.en-fiches td{display:block;width:auto}
  .texte-article table.en-fiches thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .texte-article table.en-fiches{border:0}
  .texte-article table.en-fiches tr{border:1px solid var(--filet);border-radius:6px;padding:12px 14px;margin-bottom:12px;background:var(--blanc)}
  .texte-article table.en-fiches td{border:0;padding:4px 0}
  .texte-article table.en-fiches td:first-child{font-weight:600;font-size:17px;padding-bottom:6px}
  .texte-article table.en-fiches td[data-label]:not(:first-child)::before{content:attr(data-label);display:block;font-size:14px;color:var(--doux)}
}

/* ===== Questionnaire Sur mesure (29/10/2026) : une étape à la fois, la vitrine se remplit à chaque réponse ===== */
.vitrine-q{width:100%;max-width:440px;height:auto;margin-top:28px;scroll-margin-top:84px}
@media (max-width:959px){.vitrine-q{max-height:200px;margin-inline:auto}}
.vitrine-q text{font-family:var(--titre)}
.q-nom{font-size:30px;fill:var(--creme)}
.vitrine-q:not([data-nom]) .q-nom{fill-opacity:.45}
.q-activite{font-size:17px;fill:var(--encre)}
.q-initiale{font-size:26px;fill:var(--creme)}
.q-petit{font:600 13px/1 var(--texte)!important;fill:var(--encre)}
/* Tout est posé, caché par défaut, et paraît selon les réponses */
.q-banne,.q-pastilles > g,.q-objets > g,.q-pages rect,.q-photos,.q-seance,.q-logo,.q-logo-vide,.q-delai,.q-lumiere{opacity:0;transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.q-banne{transform-box:fill-box;transform-origin:top;transform:scaleY(0)}
.vitrine-q[data-nom] .q-banne{opacity:1;transform:none}
.q-pastilles > g{transform-box:fill-box;transform-origin:center;transform:scale(.4)}
.q-pastilles > g.pose{opacity:1;transform:none}
.q-objets > g{transform:translateY(-12px)}
.vitrine-q[data-type=vitrine] [data-objet=vitrine],.vitrine-q[data-type=boutique] [data-objet=boutique],.vitrine-q[data-type=resa] [data-objet=resa],
.vitrine-q[data-type=refonte] [data-objet=refonte],.vitrine-q[data-type=autre] [data-objet=autre]{opacity:1;transform:none}
.vitrine-q[data-pages="2-5"] [data-p="1"],.vitrine-q[data-pages="?"] [data-p="1"],
.vitrine-q[data-pages="6-10"] :is([data-p="1"],[data-p="2"]),
.vitrine-q[data-pages="10+"] [data-p]{opacity:1}
.vitrine-q[data-pages="2-5"] [data-p="2"]{opacity:1}
.vitrine-q[data-pages="6-10"] [data-p="3"]{opacity:1}
.vitrine-q[data-photos=oui] .q-photos,.vitrine-q[data-photos=seance] .q-seance{opacity:1}
.vitrine-q:is([data-logo=charte],[data-logo=logo]) .q-logo,.vitrine-q[data-logo=non] .q-logo-vide{opacity:1}
.vitrine-q:not([data-delai=""]) .q-delai{opacity:1}
.vitrine-q[data-ouvert] .q-lumiere{opacity:.9}
.q-panneau{transform-box:fill-box;transform-origin:center}
.vitrine-q[data-ouvert] .q-panneau{animation:q-retourne .6s ease}
@keyframes q-retourne{50%{transform:scaleX(0)}}
@media (prefers-reduced-motion:reduce){.vitrine-q *{transition:none!important;animation:none!important}}

.q-form fieldset{border:0;margin:0;padding:0;min-width:0}
.etape{display:grid;gap:22px}
.etape:focus{outline:none}
.etape > legend{float:left;width:100%;margin-bottom:4px;font:400 var(--t-3)/1.15 var(--titre)}
.etape > legend + *{clear:both}
.en-etapes .etape > legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.q-progres{display:grid;gap:12px}
.q-etape-num{font:600 14px/1.2 var(--texte);letter-spacing:.06em;text-transform:uppercase;color:var(--rouge)}
.q-etape-titre{margin-top:4px;font:400 var(--t-3)/1.15 var(--titre)}
@media (max-width:959px){.q-sous-900{display:none}}
.q-carreaux{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.q-carreaux li{height:10px;border:1.5px solid var(--encre);border-radius:2px;background:var(--blanc);transition:background-color .3s}
.q-carreaux li.plein{background:var(--rouge);border-color:var(--rouge)}
.choix--court{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
.choix--large{grid-template-columns:1fr}
.choix--large .aide{display:block;font-weight:400}
.choix input[type=checkbox],.choix input[type=radio]{width:20px;height:20px;flex:none;accent-color:var(--rouge)}
.q-conseil{margin-top:6px;padding:14px 16px;background:var(--kraft-clair);border-left:3px solid var(--rouge);border-radius:3px;font-size:16px}
.q-conseil[hidden]{display:none}
.q-boutons{display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between}
.q-boutons [data-suivant],.q-boutons [data-envoyer]{margin-left:auto}
.q-boutons [hidden]{display:none}
@media (max-width:599px){.q-boutons{flex-direction:column-reverse}.q-boutons .btn{width:100%;margin-left:0}}
/* Sans JavaScript : les étapes l'une sous l'autre, séparées d'un filet */
.q-form:not(.en-etapes) .etape + .etape{padding-top:24px;border-top:1px solid var(--filet)}
.etape[hidden],.q-form[hidden]{display:none}
.q-form .choix{grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))}
.q-form .choix--court{grid-template-columns:repeat(auto-fit,minmax(min(100%,130px),1fr))}
.q-form .choix--large{grid-template-columns:1fr}
/* Confirmation mise au point après l'envoi : jamais sous l'en-tête fixe */
.confirmation{scroll-margin-top:96px}

/* Galerie des modèles : 9 modèles et la case du sur mesure (30/10/2026), soit 10 cases : 5 colonnes sur grand écran,
   2 sinon, jamais de trou en fin de grille (avec 4 colonnes, la dernière rangée en avait 2) */
/* 11 modèles + la case sur mesure : 4 × 3 sans trou (30/10/2026) */
@media (min-width:1100px){.galerie-themes,.accueil-modeles .galerie-themes{grid-template-columns:repeat(4,minmax(0,1fr));gap:36px 20px}.galerie-themes .vignette{padding:10px 10px 0}.galerie-themes .vignette-tel{display:none}}
@media (min-width:600px) and (max-width:1099px){.galerie-themes,.accueil-modeles .galerie-themes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.carte-sur-mesure .vignette{padding:16px;font-size:clamp(16px,.6rem + .6vw,20px)}}

/* Pied de page (06/11/2026, retour de l'utilisateur : « tous les liens, c'est pas très beau ») : trois colonnes titrées, liens sans soulignement permanent, mentions et liens légaux en bas, en petit. */
.pied ul{align-content:start}
.pied .accroche-pied{font-size:16px;color:var(--doux);max-width:min(30ch,100%)}
.pied .titre-pied{margin:0 0 14px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--doux)}
.pied .liens-pied{gap:2px}
.pied .liens-pied a,.pied .reseaux a,.pied .legal-pied a{display:inline-flex;align-items:center;gap:8px;padding-block:10px;text-decoration:none;text-underline-offset:4px}
.pied .liens-pied a,.pied .reseaux a{font-size:16px}
.pied .reseaux{display:flex;flex-wrap:wrap;gap:0 20px}
.pied .reseaux a{font-weight:600}
@media (hover:hover) and (pointer:fine){.pied .colonne-pied a:hover,.pied .reseaux a:hover,.pied .legal-pied a:hover{text-decoration:underline;color:var(--rouge)}}
.pied a:focus-visible{text-decoration:underline}
.pied .bas-pied{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 32px;margin-top:8px;padding-top:18px;border-top:1px solid var(--filet)}
.pied .legal-pied{display:flex;flex-wrap:wrap;gap:0 20px}
.pied .legal-pied a{font-size:14px;color:var(--doux);padding-block:12px}
@media (max-width:799px){.pied .page{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.pied .pile,.pied .bas-pied{grid-column:1/-1}}
@media (hover:hover) and (pointer:fine) and (min-width:800px){.pied .liens-pied a{padding-block:5px}}
/* En-tête sur téléphone (06/11/2026, retour de l'utilisateur) : icône à trois traits devant « Menu », textes des deux boutons centrés en hauteur. */
.wp-block-navigation.nav-mobile .wp-block-navigation__responsive-container-open,.entete-actions .wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;gap:8px;line-height:1}
.wp-block-navigation.nav-mobile .wp-block-navigation__responsive-container-open::before{content:"";flex:none;width:16px;height:12px;background:linear-gradient(currentColor 0 0) top/100% 2px no-repeat,linear-gradient(currentColor 0 0) center/100% 2px no-repeat,linear-gradient(currentColor 0 0) bottom/100% 2px no-repeat}
@media (max-width:359px){.wp-block-navigation.nav-mobile .wp-block-navigation__responsive-container-open{gap:6px}}
@media (max-width:419px){.wp-block-navigation.nav-mobile .wp-block-navigation__responsive-container-open{width:44px;padding:0;font-size:0;gap:0}.wp-block-navigation.nav-mobile .wp-block-navigation__responsive-container-open::before{width:18px;height:14px}}
.wp-block-navigation.nav-mobile .wp-block-navigation__responsive-container-close{display:inline-flex;align-items:center;justify-content:center;gap:8px;line-height:1;font-weight:600}
.wp-block-navigation.nav-mobile:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open{padding:12px max(20px,env(safe-area-inset-right)) 16px 20px}
.nav-mobile .wp-block-navigation__responsive-container-close::before{content:"";flex:none;width:14px;height:14px;background:linear-gradient(45deg,transparent calc(50% - 1px),currentColor calc(50% - 1px) calc(50% + 1px),transparent calc(50% + 1px)),linear-gradient(-45deg,transparent calc(50% - 1px),currentColor calc(50% - 1px) calc(50% + 1px),transparent calc(50% + 1px))}