@import url('https://fonts.googleapis.com/css2?family=Besley:opsz,wght@9..144,400;9..144,600;9..144,800&family=Reddit+Mono:wght@400;500;600&family=Wix+Madefor+Text:wght@400;500;600;700&display=swap');

:root {
  --encre: #18181A;
  --encre-rvb: 24 24 26;
  --papier: #F2F0EA;
  --papier-rvb: 242 240 234;
  --violet: #5038E6;
  --violet-rvb: 80 56 230;
  --lavande: #D9D2FF;
  --lavande-rvb: 217 210 255;
  --blanc: #FFFEFA;
  --bois: #B7946C;
  --trait: rgb(var(--encre-rvb) / .22);
  --trait-clair: rgb(var(--papier-rvb) / .28);
  --voile: rgb(var(--encre-rvb) / .62);
  --voile-fort: rgb(var(--encre-rvb) / .86);
  --ombre-violette: rgb(var(--violet-rvb) / .24);
  --transparent: rgb(var(--papier-rvb) / 0);
  --titre: 'Besley', serif;
  --texte: 'Wix Madefor Text', sans-serif;
  --donnees: 'Reddit Mono', monospace;
  --gouttiere: clamp(1.2rem, 3vw, 3rem);
  --largeur: 1440px;
  --entete: 84px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--encre); background: var(--papier); font-family: var(--texte); font-size: 1rem; line-height: 1.65; text-rendering: optimizeLegibility; }
body.verrouille { overflow: hidden; }
img { display: block; width: 100%; height: auto; }
a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .22em; }
button, input, select, textarea { color: inherit; font: inherit; }
button, a { -webkit-tap-highlight-color: var(--transparent); }
button { cursor: pointer; }
h1, h2, h3, p, figure, blockquote, dl, dd { margin-top: 0; }
h1, h2, h3 { font-family: var(--titre); line-height: .98; letter-spacing: -.045em; }
h1 { font-size: clamp(3.6rem, 9vw, 9.5rem); font-weight: 600; }
h2 { font-size: clamp(2.35rem, 5vw, 5.75rem); font-weight: 600; }
h3 { font-size: clamp(1.45rem, 2vw, 2rem); font-weight: 600; }
p { max-width: 72ch; }
::selection { color: var(--papier); background: var(--violet); }
.acces-contenu { position: fixed; z-index: 200; top: .5rem; left: .5rem; padding: .8rem 1rem; color: var(--papier); background: var(--violet); transform: translateY(-150%); transition: transform .2s ease; }
.acces-contenu:focus { transform: translateY(0); }
.entete-site { position: relative; z-index: 80; min-height: var(--entete); display: grid; grid-template-columns: minmax(180px, 1fr) auto auto; align-items: center; gap: 2rem; padding: 0 var(--gouttiere); border-bottom: 1px solid var(--trait); background: var(--papier); }
.logo { display: inline-flex; width: max-content; flex-direction: column; font-family: var(--donnees); font-size: 1.08rem; font-weight: 600; letter-spacing: .14em; line-height: 1.1; text-decoration: none; transition: color .25s ease; }
.logo small { margin-top: .38rem; font-family: var(--texte); font-size: .68rem; font-weight: 500; letter-spacing: .04em; }
.logo:hover { color: var(--violet); }
.nav-principale { display: flex; align-items: center; gap: clamp(.8rem, 1.6vw, 1.8rem); }
.nav-principale a { position: relative; padding: 1.8rem 0; font-size: .9rem; font-weight: 600; text-decoration: none; transition: color .25s ease; }
.nav-principale a::after { content: ''; position: absolute; right: 0; bottom: 1.35rem; left: 0; height: 2px; background: var(--violet); transform: scaleX(0); transform-origin: right; transition: transform .3s ease; }
.nav-principale a:hover, .nav-principale a[aria-current='page'] { color: var(--violet); }
.nav-principale a:hover::after, .nav-principale a[aria-current='page']::after { transform: scaleX(1); transform-origin: left; }
.telephone-entete { padding: .7rem .9rem; border: 1px solid var(--encre); font-family: var(--donnees); font-size: .8rem; text-decoration: none; transition: color .25s ease, background .25s ease, border-color .25s ease; }
.telephone-entete:hover { color: var(--papier); border-color: var(--violet); background: var(--violet); }
.bouton-menu { display: none; min-height: 44px; border: 0; background: var(--transparent); }
.bouton-menu b, .bouton-menu b::before { display: block; width: 22px; height: 1px; background: var(--encre); transition: transform .25s ease; }
.bouton-menu b::before { content: ''; transform: translateY(6px); }
.actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.bouton { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: .8rem 1.15rem; border: 1px solid var(--encre); font-family: var(--donnees); font-size: .76rem; font-weight: 600; letter-spacing: .02em; text-decoration: none; transition: transform .25s ease, color .25s ease, background .25s ease, border-color .25s ease; }
.bouton:hover { transform: translateY(-3px); }
.bouton.accent { color: var(--blanc); border-color: var(--violet); background: var(--violet); }
.bouton.accent:hover { color: var(--violet); background: var(--blanc); }
.bouton.fantome { color: var(--papier); border-color: var(--papier); background: var(--transparent); }
.bouton.fantome:hover { color: var(--encre); background: var(--papier); }
.bouton.ligne { background: var(--transparent); }
.bouton.ligne:hover { color: var(--papier); background: var(--encre); }
.lien-fleche { display: inline-block; margin-top: 1rem; font-family: var(--donnees); font-size: .82rem; font-weight: 600; text-decoration: none; transition: color .25s ease, transform .25s ease; }
.lien-fleche:hover { color: var(--violet); transform: translateX(5px); }
.surtitre, .index-section, .micro { font-family: var(--donnees); font-size: .72rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.index-section { margin-bottom: 1.5rem; color: var(--violet); }
.negatif { color: var(--papier); background: var(--encre); }
.rv { opacity: 0; transform: translateY(32px); transition: opacity .75s ease, transform .75s ease; }
.rv.visible { opacity: 1; transform: translateY(0); }
.titre-ligne { display: grid; grid-template-columns: 1fr 2.2fr; gap: var(--gouttiere); align-items: start; }
.section-grille { display: grid; grid-template-columns: minmax(220px, .9fr) minmax(320px, 1.4fr); gap: clamp(2rem, 6vw, 7rem); padding: clamp(5rem, 10vw, 10rem) var(--gouttiere); }
.pied-site { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: clamp(2rem, 5vw, 6rem); padding: 4rem var(--gouttiere); color: var(--papier); border-top: 1px solid var(--trait-clair); background: var(--encre); }
.pied-marque p { margin-top: 2rem; color: rgb(var(--papier-rvb) / .68); }
.plan-navigation { display: grid; grid-template-columns: repeat(2, 1fr); align-content: start; gap: .45rem 1rem; }
.plan-navigation a { font-size: .84rem; text-decoration: none; transition: color .2s ease; }
.plan-navigation a:hover { color: var(--lavande); }
.pied-coordonnees p { margin-bottom: .6rem; }
.pied-coordonnees a { font-family: var(--donnees); }
.pied-coordonnees .micro { margin-top: 2rem; color: rgb(var(--papier-rvb) / .5); }
form { display: grid; gap: 1rem; }
label { display: grid; gap: .4rem; font-size: .85rem; font-weight: 600; }
input, select, textarea { width: 100%; min-height: 48px; padding: .75rem; border: 1px solid var(--trait); border-radius: 0; outline: none; background: var(--blanc); transition: border-color .2s ease, box-shadow .2s ease; }
textarea { resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--violet); box-shadow: 0 0 0 3px var(--ombre-violette); }
form .bouton { justify-self: start; }

@keyframes glissement-haut { from { transform: translateY(22px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
@keyframes ligne-vivante { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes reflet { 0%, 100% { transform: translateX(-140%) skewX(-15deg); } 48%, 62% { transform: translateX(240%) skewX(-15deg); } }
@keyframes respiration { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
@keyframes entree-menu { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 1050px) {
  .entete-site { grid-template-columns: 1fr auto auto; gap: 1rem; }
  .bouton-menu { display: flex; align-items: center; gap: .7rem; }
  .nav-principale { position: absolute; top: 100%; right: 0; left: 0; display: none; padding: 1rem var(--gouttiere) 2rem; border-bottom: 1px solid var(--trait); background: var(--papier); }
  .nav-principale.ouverte { display: grid; animation: entree-menu .25s ease both; }
  .nav-principale a { padding: .65rem 0; font-size: 1rem; }
  .nav-principale a::after { bottom: .4rem; }
  .titre-ligne, .section-grille { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  :root { --entete: 68px; }
  .entete-site { grid-template-columns: 1fr auto; }
  .logo small { display: none; }
  .telephone-entete { grid-column: 1 / -1; margin: 0 calc(var(--gouttiere) * -1); padding: .55rem var(--gouttiere); color: var(--papier); border: 0; background: var(--encre); }
  .pied-site { grid-template-columns: 1fr; }
  .plan-navigation { grid-template-columns: 1fr; }
  .actions { flex-direction: column; align-items: stretch; }
  .bouton { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .rv { opacity: 1; transform: none; }
}

/* VERSION SIGNATURE — catalogue nocturne, pleine image et outil de composition */
.signature .entete-site { position: absolute; top: 0; right: 0; left: 0; color: var(--papier); border-color: var(--trait-clair); background: var(--transparent); }
.signature .entete-site .logo:hover, .signature .nav-principale a:hover, .signature .nav-principale a[aria-current='page'] { color: var(--lavande); }
.signature .nav-principale a::after { background: var(--lavande); }
.signature .telephone-entete { border-color: var(--papier); }
.signature .bouton-menu b, .signature .bouton-menu b::before { background: var(--papier); }
.s-hero { position: relative; min-height: 100svh; overflow: hidden; display: grid; align-items: end; padding: calc(var(--entete) + 7rem) var(--gouttiere) 4rem; }
.s-hero .hero-photo, .s-hero .hero-voile { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.s-hero .hero-photo { filter: saturate(.75) contrast(1.08); transform: scale(1.02); }
.s-hero .hero-voile { background: linear-gradient(180deg, var(--transparent), var(--voile-fort)); }
.hero-contenu { position: relative; z-index: 2; max-width: 1080px; }
.hero-contenu h1 { max-width: 9ch; margin-bottom: 2rem; }
.hero-contenu .surtitre { color: var(--lavande); }
.hero-texte { max-width: 60ch; font-size: clamp(1.05rem, 1.8vw, 1.35rem); }
.fiche-hero { position: absolute; z-index: 3; right: var(--gouttiere); bottom: 4rem; width: min(310px, 26vw); padding: 1.2rem; border: 1px solid var(--trait-clair); background: rgb(var(--encre-rvb) / .7); backdrop-filter: blur(12px); }
.fiche-hero p { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .55rem; padding-bottom: .55rem; border-bottom: 1px solid var(--trait-clair); font-family: var(--donnees); font-size: .68rem; }
.fiche-hero strong { text-align: right; }
.fiche-hero a { display: block; margin-top: 1rem; color: var(--lavande); font-family: var(--donnees); font-weight: 600; }
.s-reperes { grid-template-columns: 1fr 1.2fr; }
.s-reperes h2 { max-width: 10ch; }
.texte-colonnes { columns: 2; column-gap: 2rem; }
.texte-colonnes p { break-inside: avoid; }
.donnees-atelier { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 3rem; border-top: 1px solid var(--trait); border-left: 1px solid var(--trait); }
.donnees-atelier div { padding: 1.2rem; border-right: 1px solid var(--trait); border-bottom: 1px solid var(--trait); }
.donnees-atelier dt { color: var(--violet); font-family: var(--donnees); font-size: .68rem; text-transform: uppercase; }
.donnees-atelier dd { margin-top: .6rem; font-weight: 600; }
.s-composer { padding: clamp(5rem, 10vw, 10rem) var(--gouttiere); }
.intro-outil { display: grid; grid-template-columns: .6fr 1fr 1fr; gap: var(--gouttiere); align-items: start; }
.intro-outil h2 { max-width: 10ch; }
.composeur { display: grid; grid-template-columns: minmax(340px, 1.35fr) minmax(320px, .8fr); gap: clamp(2rem, 6vw, 7rem); align-items: center; max-width: var(--largeur); margin: 5rem auto 0; }
.apercu-cadre { position: relative; width: min(70vw, 650px); aspect-ratio: 1 / .88; display: grid; place-items: center; margin-inline: auto; border-style: solid; transition: border-width .45s ease, border-color .45s ease, box-shadow .45s ease, background .45s ease; }
.apercu-cadre.cadre-chene { border-width: 34px; border-color: var(--bois); box-shadow: inset 0 0 0 4px var(--encre); }
.apercu-cadre.cadre-noir { border-width: 24px; border-color: var(--encre); box-shadow: inset 0 0 0 2px var(--lavande); }
.apercu-cadre.cadre-noyer { border-width: 42px; border-color: var(--voile); box-shadow: inset 0 0 0 3px var(--bois); }
.passe-partout { width: 100%; height: 100%; display: grid; place-items: center; padding: 13%; background: var(--blanc); transition: padding .45s ease, background .45s ease; }
.passe-partout img { width: 72%; height: 82%; object-fit: cover; box-shadow: 0 0 0 1px var(--trait); }
.passe-ardoise .passe-partout { background: var(--encre); }
.passe-lavande .passe-partout { background: var(--lavande); }
.reflet-verre { pointer-events: none; position: absolute; inset: 0; overflow: hidden; }
.reflet-verre::before { content: ''; position: absolute; inset: -20%; width: 18%; background: linear-gradient(90deg, var(--transparent), var(--ombre-violette), var(--transparent)); opacity: 0; transform: translateX(-140%) skewX(-15deg); }
.verre-musee .reflet-verre::before { opacity: 1; animation: reflet 4.5s ease-in-out infinite; }
.commandes-composeur { display: grid; gap: 1.5rem; }
.commandes-composeur fieldset { display: grid; grid-template-columns: repeat(3, 1fr); gap: .45rem; margin: 0; padding: 1rem 0 0; border: 0; border-top: 1px solid var(--trait-clair); }
.commandes-composeur legend { padding-right: 1rem; color: var(--lavande); font-family: var(--donnees); font-size: .72rem; }
.choix { min-height: 44px; padding: .55rem; color: var(--papier); border: 1px solid var(--trait-clair); background: var(--transparent); font-size: .78rem; transition: color .2s ease, border-color .2s ease, background .2s ease; }
.choix:hover, .choix.actif { color: var(--encre); border-color: var(--lavande); background: var(--lavande); }
.resultat-composeur { display: grid; padding: 1.2rem; color: var(--encre); background: var(--papier); }
.resultat-composeur span, .resultat-composeur small { font-family: var(--donnees); font-size: .68rem; }
.resultat-composeur strong { margin: .4rem 0; color: var(--violet); font-family: var(--titre); font-size: 2rem; }
.s-matieres { padding: clamp(5rem, 10vw, 10rem) var(--gouttiere); overflow: hidden; }
.s-matieres .titre-ligne { margin-bottom: 4rem; }
.s-matieres h2 { max-width: 10ch; }
.materiaux-defilement { display: grid; grid-template-columns: repeat(4, minmax(260px, 1fr)); gap: 1px; background: var(--trait); }
.materiaux-defilement article { padding: 1rem; background: var(--papier); }
.materiaux-defilement img { height: 280px; object-fit: cover; filter: saturate(.8); transition: filter .35s ease, transform .35s ease; }
.materiaux-defilement article:hover img { filter: saturate(1.05); transform: scale(.98); }
.materiaux-defilement span { display: block; margin: 1rem 0; color: var(--violet); font-family: var(--donnees); font-size: .7rem; }
.materiaux-defilement h3 { margin-bottom: .7rem; }
.materiaux-defilement a { font-size: .82rem; }
.s-galerie { padding: clamp(5rem, 9vw, 9rem) var(--gouttiere); }
.galerie-entete { display: grid; grid-template-columns: .7fr 1.3fr .8fr; gap: var(--gouttiere); margin-bottom: 4rem; }
.galerie-entete h2 { max-width: 9ch; }
.mur-images { display: grid; grid-template-columns: 1.5fr 1fr 1fr; grid-template-rows: repeat(2, 300px); gap: .65rem; }
.mur-images figure { position: relative; margin: 0; overflow: hidden; }
.mur-images .grande { grid-row: 1 / 3; }
.mur-images img { height: 100%; object-fit: cover; transition: transform .6s ease, filter .4s ease; }
.mur-images figure:hover img { transform: scale(1.025); filter: brightness(.72); }
.mur-images figcaption { position: absolute; right: 0; bottom: 0; left: 0; padding: 1rem; background: linear-gradient(180deg, var(--transparent), var(--voile-fort)); font-family: var(--donnees); font-size: .68rem; transform: translateY(100%); transition: transform .3s ease; }
.mur-images figure:hover figcaption { transform: translateY(0); }
.s-galerie > .bouton { margin-top: 2rem; }
.s-conservation { grid-template-columns: .75fr 1fr .75fr; }
.s-conservation h2 { max-width: 10ch; }
.manifeste { font-size: 1.08rem; }
.image-verticale { margin: 0; }
.image-verticale img { min-height: 520px; object-fit: cover; }
.image-verticale figcaption { margin-top: .6rem; font-family: var(--donnees); font-size: .68rem; }
.s-processus { padding: clamp(5rem, 10vw, 10rem) var(--gouttiere); border-top: 1px solid var(--trait); }
.s-processus h2 { max-width: 10ch; }
.etapes { display: grid; grid-template-columns: repeat(4, 1fr); margin: 4rem 0 0; padding: 0; border-top: 1px solid var(--trait); border-left: 1px solid var(--trait); list-style: none; }
.etapes li { min-height: 320px; padding: 1.3rem; border-right: 1px solid var(--trait); border-bottom: 1px solid var(--trait); transition: color .3s ease, background .3s ease, transform .3s ease; }
.etapes li:hover { color: var(--papier); background: var(--violet); transform: translateY(-8px); }
.etapes span { font-family: var(--donnees); font-size: .7rem; }
.etapes h3 { margin-top: 7rem; }
.s-journal { display: grid; grid-template-columns: 1fr 1fr; min-height: 740px; background: var(--lavande); }
.journal-image img { height: 100%; object-fit: cover; }
.s-journal > div:last-child { align-self: center; padding: clamp(3rem, 8vw, 8rem); }
.s-temoignages { padding: clamp(5rem, 9vw, 9rem) var(--gouttiere); text-align: center; }
.s-temoignages blockquote { max-width: 1100px; margin: 3rem auto; font-family: var(--titre); font-size: clamp(2rem, 4.5vw, 5rem); line-height: 1.08; }
.s-temoignages cite { display: block; margin-top: 1.5rem; color: var(--lavande); font-family: var(--donnees); font-size: .74rem; font-style: normal; }
.preuves { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 1000px; margin: 5rem auto 0; border-top: 1px solid var(--trait-clair); border-left: 1px solid var(--trait-clair); }
.preuves p { display: grid; margin: 0; padding: 1rem; border-right: 1px solid var(--trait-clair); border-bottom: 1px solid var(--trait-clair); }
.preuves strong { font-family: var(--titre); font-size: 1.6rem; }
.preuves span { font-family: var(--donnees); font-size: .68rem; }
.s-visite { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: clamp(2rem, 8vw, 9rem); padding: clamp(5rem, 10vw, 10rem) var(--gouttiere); }
.s-visite h2 { max-width: 11ch; }
.s-visite figure { margin: 0; }
.s-visite figure img { min-height: 600px; object-fit: cover; }
.s-visite figcaption { padding-top: .7rem; font-family: var(--donnees); font-size: .68rem; }
.s-contact { padding: clamp(5rem, 10vw, 10rem) var(--gouttiere); text-align: center; }
.s-contact h2 { max-width: 15ch; margin-inline: auto; }
.s-contact p { margin-inline: auto; }
.s-contact .actions { justify-content: center; }

/* Pages intérieures Signature */
.inter-hero { position: relative; min-height: 78svh; display: grid; align-items: end; padding: calc(var(--entete) + 7rem) var(--gouttiere) 5rem; overflow: hidden; }
.inter-hero > img, .inter-hero .hero-voile { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.inter-hero .hero-voile { background: linear-gradient(180deg, var(--transparent), var(--voile-fort)); }
.inter-hero > div:last-child { position: relative; z-index: 2; max-width: 920px; }
.inter-hero h1 { max-width: 10ch; }
.inter-hero p:last-child { max-width: 58ch; font-size: 1.15rem; }
.inter-sommaire { display: grid; grid-template-columns: .8fr repeat(4, 1fr); padding: 2rem var(--gouttiere); border-bottom: 1px solid var(--trait); }
.inter-sommaire p { margin: 0; }
.inter-sommaire a { display: grid; padding: .8rem; border-left: 1px solid var(--trait); font-weight: 600; text-decoration: none; transition: color .25s ease, background .25s ease; }
.inter-sommaire a:hover { color: var(--papier); background: var(--violet); }
.inter-sommaire span { color: var(--violet); font-family: var(--donnees); font-size: .68rem; }
.inter-chapitre { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2rem, 8vw, 9rem); padding: clamp(5rem, 9vw, 9rem) var(--gouttiere); border-bottom: 1px solid var(--trait); }
.inter-chapitre:nth-of-type(2n) { background: var(--blanc); }
.inter-chapitre h2 { max-width: 10ch; }
.inter-chapitre > div:last-child { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; }
.inter-preuves { display: grid; grid-template-columns: 1fr 1fr; min-height: 650px; }
.inter-preuves figure { margin: 0; }
.inter-preuves img { height: 100%; object-fit: cover; }
.inter-preuves > div { align-self: center; padding: clamp(3rem, 8vw, 8rem); }
.inter-formulaire { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2rem, 8vw, 9rem); padding: clamp(5rem, 9vw, 9rem) var(--gouttiere); background: var(--lavande); }
.inter-formulaire form { grid-template-columns: 1fr 1fr; }
.inter-formulaire label:last-of-type { grid-column: 1 / -1; }
.inter-contact { padding: 5rem var(--gouttiere); text-align: center; }
.inter-contact h2 { max-width: 14ch; margin-inline: auto; }
.inter-contact p { margin-inline: auto; }

@media (max-width: 1050px) {
  .signature .nav-principale { color: var(--encre); background: var(--papier); }
  .fiche-hero { position: relative; right: auto; bottom: auto; z-index: 3; width: 100%; margin-top: 2rem; }
  .s-hero { align-content: end; }
  .s-reperes, .intro-outil, .galerie-entete, .s-conservation { grid-template-columns: 1fr; }
  .composeur { grid-template-columns: 1fr; }
  .materiaux-defilement { overflow-x: auto; grid-template-columns: repeat(4, 300px); padding-bottom: .7rem; }
  .etapes { grid-template-columns: repeat(2, 1fr); }
  .inter-sommaire { grid-template-columns: repeat(2, 1fr); }
  .inter-sommaire p { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
  .s-hero { min-height: 850px; padding-top: calc(var(--entete) + 6rem); }
  .s-hero h1 { font-size: clamp(3.5rem, 18vw, 6rem); }
  .texte-colonnes { columns: 1; }
  .donnees-atelier { grid-template-columns: 1fr; }
  .apercu-cadre { width: 86vw; }
  .commandes-composeur fieldset { grid-template-columns: 1fr; }
  .mur-images { grid-template-columns: 1fr 1fr; grid-template-rows: 360px 220px 220px; }
  .mur-images .grande { grid-column: 1 / -1; grid-row: auto; }
  .image-verticale img { min-height: 380px; }
  .etapes { grid-template-columns: 1fr; }
  .etapes li { min-height: 240px; }
  .etapes h3 { margin-top: 3rem; }
  .s-journal, .s-visite, .inter-preuves, .inter-formulaire { grid-template-columns: 1fr; }
  .journal-image img { height: 430px; }
  .preuves { grid-template-columns: 1fr; }
  .s-visite figure img { min-height: 400px; }
  .inter-hero { min-height: 720px; }
  .inter-sommaire { grid-template-columns: 1fr; }
  .inter-chapitre { grid-template-columns: 1fr; }
  .inter-chapitre > div:last-child { grid-template-columns: 1fr; }
  .inter-formulaire form { grid-template-columns: 1fr; }
  .inter-formulaire label:last-of-type { grid-column: auto; }
}

/* Finitions éditoriales : repères de catalogue, états clavier et grands écrans */
:focus-visible { outline: 3px solid var(--lavande); outline-offset: 4px; }
.signature main { overflow: hidden; }
.signature section { position: relative; }
.signature section::selection { color: var(--encre); background: var(--lavande); }
.signature .surtitre { display: inline-flex; align-items: center; gap: .65rem; }
.signature .surtitre::before { content: ''; width: 32px; height: 1px; background: currentColor; transform-origin: left; animation: ligne-vivante .7s ease both; }
.signature .index-section { display: flex; align-items: center; gap: .8rem; }
.signature .index-section::after { content: ''; width: clamp(32px, 5vw, 80px); height: 1px; background: currentColor; opacity: .5; }
.signature .hero-contenu > * { animation: glissement-haut .8s ease both; }
.signature .hero-contenu > :nth-child(2) { animation-delay: .08s; }
.signature .hero-contenu > :nth-child(3) { animation-delay: .16s; }
.signature .hero-contenu > :nth-child(4) { animation-delay: .24s; }
.signature .hero-photo { transition: filter .8s ease, transform 1.2s ease; }
.signature .s-hero:hover .hero-photo { filter: saturate(.9) contrast(1.05); transform: scale(1); }
.signature .fiche-hero strong { font-variant-numeric: tabular-nums; }
.signature .donnees-atelier div { transition: color .25s ease, background .25s ease; }
.signature .donnees-atelier div:hover { color: var(--papier); background: var(--violet); }
.signature .donnees-atelier div:hover dt { color: var(--papier); }
.signature .commandes-composeur button:focus-visible { outline-color: var(--lavande); }
.signature .materiaux-defilement article { transition: color .3s ease, background .3s ease; }
.signature .materiaux-defilement article:hover { color: var(--papier); background: var(--encre); }
.signature .materiaux-defilement article:hover span { color: var(--lavande); }
.signature .materiaux-defilement article:hover a { color: var(--lavande); }
.signature .s-conservation::before { content: '05'; position: absolute; top: 2rem; right: var(--gouttiere); color: var(--lavande); font-family: var(--donnees); font-size: clamp(4rem, 9vw, 9rem); font-weight: 600; line-height: 1; opacity: .45; }
.signature .s-processus::after { content: ''; position: absolute; right: var(--gouttiere); bottom: 0; left: var(--gouttiere); height: 5px; background: var(--violet); transform-origin: left; }
.signature .s-journal .journal-image { overflow: hidden; }
.signature .s-journal .journal-image img { transition: transform 1s ease, filter .6s ease; }
.signature .s-journal:hover .journal-image img { transform: scale(1.025); filter: contrast(1.06); }
.signature .s-visite figure { position: relative; }
.signature .s-visite figure::before { content: 'TOURS / 47.3941° N'; position: absolute; z-index: 2; top: 1rem; left: 1rem; padding: .45rem .6rem; color: var(--papier); background: var(--voile-fort); font-family: var(--donnees); font-size: .65rem; }
.signature .s-contact::before, .signature .s-contact::after { content: ''; position: absolute; top: 50%; width: 16vw; height: 1px; background: var(--trait-clair); }
.signature .s-contact::before { left: 0; }
.signature .s-contact::after { right: 0; }
.signature .inter-hero > img { filter: saturate(.72) contrast(1.08); transition: filter .8s ease, transform 1.2s ease; }
.signature .inter-hero:hover > img { filter: saturate(.88) contrast(1.04); transform: scale(1.018); }
.signature .inter-chapitre { isolation: isolate; }
.signature .inter-chapitre::after { content: ''; position: absolute; z-index: -1; top: 0; bottom: 0; left: 0; width: 0; background: var(--lavande); transition: width .55s ease; }
.signature .inter-chapitre:hover::after { width: 6px; }
.signature .inter-chapitre p { text-wrap: pretty; }
.signature .inter-chapitre h2 { text-wrap: balance; }
.signature .inter-preuves { border-top: 1px solid var(--trait-clair); border-bottom: 1px solid var(--trait-clair); }
.signature .inter-preuves figure { overflow: hidden; }
.signature .inter-preuves figure img { transition: transform .9s ease; }
.signature .inter-preuves:hover figure img { transform: scale(1.025); }
.signature .inter-contact { border-top: 1px solid var(--trait); }
.signature .inter-contact .lien-fleche { color: var(--violet); }
.signature .pied-site { position: relative; }
.signature .pied-site::before { content: 'HC'; position: absolute; right: var(--gouttiere); bottom: 0; color: var(--trait-clair); font-family: var(--titre); font-size: clamp(5rem, 12vw, 12rem); font-weight: 800; line-height: .7; pointer-events: none; }

@media (min-width: 1500px) {
  .signature .s-hero, .signature .s-reperes, .signature .s-composer, .signature .s-matieres, .signature .s-galerie, .signature .s-conservation, .signature .s-processus, .signature .s-visite { padding-right: max(var(--gouttiere), calc((100vw - var(--largeur)) / 2)); padding-left: max(var(--gouttiere), calc((100vw - var(--largeur)) / 2)); }
  .signature .inter-chapitre, .signature .inter-sommaire, .signature .inter-formulaire, .signature .inter-contact { padding-right: max(var(--gouttiere), calc((100vw - var(--largeur)) / 2)); padding-left: max(var(--gouttiere), calc((100vw - var(--largeur)) / 2)); }
}

@media (hover: none) {
  .signature .mur-images figcaption { transform: translateY(0); }
  .signature .materiaux-defilement article:hover img { transform: none; }
  .signature .etapes li:hover { transform: none; }
}

@media print {
  .signature .entete-site, .signature .pied-site, .signature .actions, .signature .bouton-menu { display: none; }
  .signature .rv { opacity: 1; transform: none; }
  .signature .inter-hero { min-height: 45rem; }
  .signature .inter-chapitre { break-inside: avoid; }
}