/* Christine Rabemananjara — page démo. Référence : maquette 941 px = 1440 px (1 rem ≈ 16 px à 1440). */
@font-face { font-family: 'Newsreader'; src: url('../fonts/newsreader-latin.woff2') format('woff2'); font-weight: 200 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'Montserrat'; src: url('../fonts/montserrat-latin.woff2') format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: 'Signature'; src: url('../fonts/signature.woff2?v=2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: 'Newsreader repli'; src: local('Georgia'); size-adjust: 96%; ascent-override: 92%; descent-override: 26%; }

:root {
  --bronze: #a6845f;
  --bronze-fonce: #8f6f4d;
  --bronze-texte: #9a7a58;
  --bronze-clair: #c9a57d;
  --nuit: #0a212c;
  --nuit-2: #071820;
  --encre: #0d1b2a;
  --texte: #1f2b3a;
  --gris: #535b66;
  --creme: #f8f7f5;
  --blanc-casse: #fcfcfb;
  --filet: #e4ded8;
  --serif: 'Newsreader', 'Newsreader repli', Georgia, 'Times New Roman', serif;
  --sans: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --ease-io: cubic-bezier(.76, 0, .24, 1);
  --h-entete: 4.75rem;
}

html { font-size: 16px; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (min-width: 1100px) { html { font-size: clamp(12px, 1.09vw, 18px); } }
@media (min-width: 1100px) and (max-width: 1350px) { .entete { padding: 0 2rem 0 3.6rem; } .hero__contenu, .defiler { left: 3.6rem; } }
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--creme); color: var(--texte); font-family: var(--serif); font-size: 1rem; line-height: 1.5; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: hidden; }
body.verrou { overflow: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
figure { margin: 0; }
::selection { background: var(--bronze); color: #fff; }
:focus-visible { outline: 2px solid var(--bronze); outline-offset: 3px; }
.evitement { position: absolute; left: -9999px; top: 0; background: var(--nuit); color: #fff; padding: .6rem 1rem; z-index: 100; }
.evitement:focus { left: 1rem; top: 1rem; }
.bronze { color: var(--bronze-texte); }
.bronze-clair { color: var(--bronze-clair); }

/* ---------- textes communs ---------- */
.surtitre { font-family: var(--sans); font-weight: 500; font-size: .72rem; letter-spacing: .28em; text-transform: uppercase; color: var(--gris); }
.surtitre i { font-style: normal; padding: 0 .35em; color: var(--bronze); }
.surtitre--clair { color: rgba(255, 255, 255, .86); }
.titre-section { font-weight: 400; font-size: 3.36rem; line-height: 1.08; letter-spacing: -.015em; color: var(--encre); }
.titre-section--moyen { font-size: 2.6rem; line-height: 1.15; }

/* ---------- boutons ---------- */
.btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: .85rem; font-family: var(--serif); font-size: 1.1rem; line-height: 1; white-space: nowrap; border-radius: 1px; overflow: hidden; isolation: isolate; transition: background-color .45s var(--ease), color .45s var(--ease), border-color .45s var(--ease), box-shadow .45s var(--ease), translate .6s var(--ease); }
.btn--plein { background: var(--bronze); color: #fff; padding: 0 1.55rem; height: 2.95rem; box-shadow: 0 .5rem 1.2rem -.7rem rgba(90, 64, 36, .6); }
.btn--plein::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--encre); transform: scaleY(0); transform-origin: bottom; transition: transform .6s var(--ease-io); }
.btn--plein::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .35) 50%, transparent 70%); transform: translateX(-130%); animation: reflet 5.5s var(--ease) 2s infinite; }
.btn--plein:hover::before { transform: scaleY(1); }
.btn--plein:hover { box-shadow: 0 1.1rem 2rem -1rem rgba(13, 27, 42, .55); }
.btn--contour { color: var(--bronze-texte); border: 1px solid rgba(166, 132, 95, .75); background: rgba(255, 255, 255, .4); padding: 0 1.7rem; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.btn--contour::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--bronze); transform: scaleX(0); transform-origin: right; transition: transform .6s var(--ease-io); }
.btn--contour:hover { color: #fff; border-color: var(--bronze); }
.btn--contour:hover::before { transform: scaleX(1); transform-origin: left; }
.btn--grand { height: 3.62rem; font-size: 1.14rem; padding: 0 1.75rem; }
.btn--plein.btn--grand { padding: 0 2rem 0 1.6rem; }
.btn--xl { height: 4rem; font-size: 1.27rem; padding: 0 2.1rem 0 1.65rem; }
.fleche { display: inline-block; font-family: var(--sans); font-weight: 400; transition: transform .5s var(--ease); }
.btn:hover .fleche, a:hover > .fleche, .cas__item:hover .cas__legende .fleche { transform: translateX(.35rem); }
@keyframes reflet { 0% { transform: translateX(-130%); } 22%, 100% { transform: translateX(130%); } }

/* ---------- barre de progression + curseur ---------- */
.progression { position: fixed; inset: 0 0 auto 0; height: 2px; z-index: 70; pointer-events: none; }
.progression span { display: block; height: 100%; background: linear-gradient(90deg, var(--bronze-clair), var(--bronze)); transform: scaleX(0); transform-origin: left; }
.curseur { display: none; }
@media (hover: hover) and (pointer: fine) {
  .curseur { display: block; position: fixed; inset: 0; z-index: 80; pointer-events: none; }
  .curseur__point, .curseur__anneau { position: absolute; left: 0; top: 0; border-radius: 50%; opacity: 0; transition: opacity .3s; will-change: transform; }
  .curseur.is-actif .curseur__point, .curseur.is-actif .curseur__anneau { opacity: 1; }
  .curseur__point { width: 6px; height: 6px; margin: -3px 0 0 -3px; background: var(--bronze); }
  .curseur__anneau { width: 2.4rem; height: 2.4rem; margin: -1.2rem 0 0 -1.2rem; border: 1px solid rgba(166, 132, 95, .7); display: grid; place-items: center; transition: opacity .3s, width .45s var(--ease), height .45s var(--ease), margin .45s var(--ease), background-color .45s, border-color .45s; }
  .curseur__anneau em { font-style: normal; font-family: var(--sans); font-size: .7rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: #fff; opacity: 0; transform: scale(.6); transition: opacity .3s, transform .45s var(--ease); }
  .curseur.sur-lien .curseur__anneau { width: 3.6rem; height: 3.6rem; margin: -1.8rem 0 0 -1.8rem; background: rgba(166, 132, 95, .1); }
  .curseur.sur-carte .curseur__anneau { width: 5.6rem; height: 5.6rem; margin: -2.8rem 0 0 -2.8rem; background: rgba(166, 132, 95, .92); border-color: transparent; }
  .curseur.sur-carte .curseur__anneau em { opacity: 1; transform: none; }
  .curseur.sur-carte .curseur__point { opacity: 0; }
}

/* ---------- en-tête ---------- */
.entete { position: fixed; inset: 0 0 auto 0; z-index: 60; display: grid; grid-template-columns: auto 1fr auto; column-gap: 1.6rem; align-items: center; height: var(--h-entete); padding: 0 3.15rem 0 6.45rem; transition: transform .6s var(--ease), height .5s var(--ease), box-shadow .5s; }
.entete::before { content: ''; position: absolute; inset: 0; z-index: -1; background: rgba(252, 252, 251, .84); -webkit-backdrop-filter: saturate(1.5) blur(14px); backdrop-filter: saturate(1.5) blur(14px); opacity: 0; transition: opacity .5s; }
.entete.is-defile { height: 4.1rem; box-shadow: 0 .8rem 2rem -1.6rem rgba(13, 27, 42, .45); }
.entete.is-defile::before { opacity: 1; }
.entete.is-cache { transform: translateY(-105%); }
.logo { white-space: nowrap; display: inline-flex; flex-direction: column; align-items: flex-start; line-height: 1; }
.logo__nom { font-size: 1.42rem; font-weight: 400; letter-spacing: .06em; text-transform: uppercase; color: var(--encre); transition: letter-spacing .6s var(--ease), color .4s; }
.logo:hover .logo__nom { letter-spacing: .08em; }
.logo__sous { margin-top: .45rem; font-family: var(--sans); font-weight: 500; font-size: .56rem; letter-spacing: .34em; text-transform: uppercase; color: var(--gris); padding-left: .06rem; transition: color .4s; }
.nav { display: flex; align-items: center; gap: 1.08rem; margin-left: 2.1rem; height: 100%; }
.nav__lien { position: relative; display: flex; align-items: center; height: 100%; font-size: .98rem; color: #47525e; white-space: nowrap; transition: color .4s; }
.nav__lien::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--bronze); transform: scaleX(0); transform-origin: right; transition: transform .55s var(--ease); }
.nav__lien:hover::after, .nav__lien.is-actif::after { transform: scaleX(1); transform-origin: left; }
.nav__lien.is-actif { color: var(--bronze-texte); }
.roule { display: block; overflow: hidden; height: 1.35em; line-height: 1.35em; }
.roule > span { display: block; transition: transform .55s var(--ease); }
.roule > span + span { color: var(--bronze-texte); }
.nav__lien:hover .roule > span { transform: translateY(-100%); }
.entete__btn { min-width: max-content; height: 2.95rem; padding: 0 1.45rem 0 1.5rem; font-size: 1.11rem; }
.menu-btn { display: none; }

/* ---------- menu plein écran (sous 1100 px) ---------- */
.volet { position: fixed; inset: 0; z-index: 55; display: flex; flex-direction: column; justify-content: space-between; padding: calc(var(--h-entete) + 2.5rem) 2rem 2.5rem; background: var(--nuit); color: #fff; clip-path: circle(0% at calc(100% - 3rem) 2.4rem); visibility: hidden; transition: clip-path .9s var(--ease-io), visibility 0s .9s; }
.volet.is-ouvert { clip-path: circle(150% at calc(100% - 3rem) 2.4rem); visibility: visible; transition: clip-path .9s var(--ease-io), visibility 0s; }
.volet__nav { display: flex; flex-direction: column; }
.volet__nav a { display: flex; align-items: baseline; gap: 1.1rem; padding: .7rem 0; border-bottom: 1px solid rgba(255, 255, 255, .1); overflow: hidden; }
.volet__nav a em { font-style: normal; font-family: var(--sans); font-size: .72rem; letter-spacing: .2em; color: var(--bronze-clair); }
.volet__nav a span { display: inline-block; font-size: clamp(1.9rem, 6.5vw, 3rem); line-height: 1.15; transform: translateY(110%); transition: transform .8s var(--ease), color .3s; }
.volet.is-ouvert .volet__nav a span { transform: none; }
.volet.is-ouvert .volet__nav a:nth-child(1) span { transition-delay: .25s; } .volet.is-ouvert .volet__nav a:nth-child(2) span { transition-delay: .31s; }
.volet.is-ouvert .volet__nav a:nth-child(3) span { transition-delay: .37s; } .volet.is-ouvert .volet__nav a:nth-child(4) span { transition-delay: .43s; }
.volet.is-ouvert .volet__nav a:nth-child(5) span { transition-delay: .49s; } .volet.is-ouvert .volet__nav a:nth-child(6) span { transition-delay: .55s; }
.volet__nav a:hover span { color: var(--bronze-clair); }
.volet__pied { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.2rem; opacity: 0; transform: translateY(1rem); transition: opacity .6s .5s, transform .8s var(--ease) .5s; }
.volet.is-ouvert .volet__pied { opacity: 1; transform: none; }
.volet__pied p { font-family: var(--sans); font-size: .7rem; letter-spacing: .24em; text-transform: uppercase; color: rgba(255, 255, 255, .6); }

/* ---------- héros ---------- */
.hero { position: relative; height: calc(var(--h-entete) + 43rem); overflow: hidden; background: linear-gradient(180deg, #f6f1eb 0%, #faf8f5 55%, #f7f3ee 100%); }
.hero__aurore { position: absolute; inset: 0; pointer-events: none; }
.hero__aurore i { position: absolute; border-radius: 50%; filter: blur(60px); opacity: .8; will-change: transform; }
.hero__aurore i:nth-child(1) { width: 38rem; height: 38rem; right: 6%; top: -8rem; background: radial-gradient(circle, rgba(201, 165, 125, .5), rgba(201, 165, 125, 0) 70%); animation: derive-a 18s ease-in-out infinite alternate; }
.hero__aurore i:nth-child(2) { width: 30rem; height: 30rem; left: -8rem; bottom: -10rem; background: radial-gradient(circle, rgba(150, 175, 186, .38), rgba(150, 175, 186, 0) 70%); animation: derive-b 22s ease-in-out infinite alternate; }
.hero__aurore i:nth-child(3) { width: 22rem; height: 22rem; left: 42%; top: 40%; background: radial-gradient(circle, rgba(255, 255, 255, .9), rgba(255, 255, 255, 0) 70%); animation: derive-a 16s ease-in-out infinite alternate-reverse; }
@keyframes derive-a { to { transform: translate3d(-4rem, 3rem, 0) scale(1.15); } }
@keyframes derive-b { to { transform: translate3d(5rem, -3rem, 0) scale(1.2); } }
.hero__contenu { position: absolute; z-index: 2; left: 6.8rem; top: calc(var(--h-entete) + 3.75rem); width: 44rem; }
.hero__surtitre { color: #3f4954; }
.hero__titre { margin-top: 1.45rem; font-weight: 400; font-size: 4.87rem; line-height: .985; letter-spacing: -.018em; color: var(--encre); }
.hero__titre .ligne { display: block; overflow: hidden; padding-bottom: .1em; margin-bottom: -.1em; }
.hero__titre .ligne > span { position: relative; display: inline-block; animation: monte 1.2s var(--ease) both; }
.hero__titre .ligne:nth-child(2) > span { animation-delay: .1s; }
.hero__titre .ligne:nth-child(3) > span { animation-delay: .2s; }
.hero__titre .ligne:nth-child(4) > span { animation-delay: .3s; }
.hero__titre .bronze { color: var(--bronze-texte); }
.trace { position: absolute; left: 0; bottom: -.04em; width: 100%; height: .2em; overflow: visible; fill: none; stroke: var(--bronze); stroke-width: 2.4; stroke-linecap: round; stroke-dasharray: 320; stroke-dashoffset: 320; animation: trace 1.4s var(--ease) 1.1s forwards; }
@keyframes trace { to { stroke-dashoffset: 0; } }
.hero__texte { margin-top: 1.05rem; max-width: 34rem; font-size: 1.5rem; line-height: 1.4; color: var(--texte); }
.hero__actions { display: flex; gap: .95rem; margin-top: 1.55rem; }
.hero__actions .btn--plein { width: 17.25rem; }
.hero__actions .btn--contour { width: 15.9rem; }
.anim { animation: apparait 1.1s var(--ease) both; }
.hero__surtitre.anim { animation-delay: .05s; }
.hero__texte.anim { animation-delay: .5s; }
.hero__actions.anim { animation-delay: .65s; }

.portrait { position: absolute; z-index: 1; left: 54.5%; top: calc(var(--h-entete) + 3.4rem); width: 26.5rem; }
.portrait::before { content: ''; position: absolute; inset: 1.5rem -1.5rem -1.5rem 1.5rem; border: 1px solid rgba(166, 132, 95, .55); animation: apparait 1.2s var(--ease) 1s both; }
.portrait__cadre { position: relative; aspect-ratio: 602 / 790; overflow: hidden; background: #d9cfc4; box-shadow: 0 2.5rem 4rem -2.5rem rgba(13, 27, 42, .45); animation: devoile 1.5s var(--ease-io) .15s both; }
.portrait__cadre::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 33, 44, 0) 60%, rgba(10, 33, 44, .28) 100%); pointer-events: none; }
.portrait__img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; scale: 1.14; animation: dezoom 2.2s var(--ease) .15s both; }
@keyframes devoile { from { clip-path: inset(100% 0 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes dezoom { from { scale: 1.34; } to { scale: 1.14; } }
.badge-rond { position: absolute; left: -3.7rem; top: 2.2rem; width: 7.4rem; height: 7.4rem; animation: apparait 1s var(--ease) 1.2s both; }
.badge-rond__fond { fill: rgba(252, 252, 251, .92); stroke: rgba(166, 132, 95, .5); stroke-width: 1; }
.badge-rond__texte { transform-origin: 60px 60px; animation: tourne 22s linear infinite; }
.badge-rond text { font-family: var(--sans); font-size: 7.6px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; fill: var(--encre); }
.badge-rond .badge-rond__cs { font-family: var(--serif); font-size: 24px; font-weight: 400; letter-spacing: 1px; fill: var(--bronze); text-transform: none; }
@keyframes tourne { to { transform: rotate(360deg); } }
.carte-flottante { position: absolute; left: -6.2rem; bottom: 3.6rem; display: flex; align-items: center; gap: .95rem; padding: 1rem 1.4rem 1rem 1.2rem; background: rgba(255, 255, 255, .8); border: 1px solid rgba(255, 255, 255, .9); box-shadow: 0 1.6rem 3rem -1.6rem rgba(13, 27, 42, .45); -webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4); animation: apparait 1s var(--ease) 1.35s both, flotte 6s ease-in-out 2.4s infinite; }
.carte-flottante strong { font-weight: 400; font-size: 2.5rem; line-height: 1; color: var(--bronze-texte); font-variant-numeric: tabular-nums; }
.carte-flottante > span { font-size: .95rem; line-height: 1.35; color: var(--texte); }
@keyframes flotte { 50% { translate: 0 -.6rem; } }

.hero__mots { position: absolute; z-index: 2; left: 86%; top: calc(var(--h-entete) + 8rem); display: grid; gap: 1.02rem; }
.hero__mots li { position: relative; display: flex; align-items: center; font-family: var(--sans); font-weight: 600; font-size: .7rem; letter-spacing: .3em; text-transform: uppercase; color: #1f2d38; transition: color .5s, letter-spacing .6s var(--ease); animation: glisse .9s var(--ease) both; }
.hero__mots li::before { content: ''; width: 0; height: 1px; margin-right: 0; background: var(--bronze); transition: width .6s var(--ease), margin .6s var(--ease); }
.hero__mots li.is-on { color: var(--bronze-texte); letter-spacing: .34em; }
.hero__mots li.is-on::before { width: 1.4rem; margin-right: .6rem; }
.hero__mots li:nth-child(1) { animation-delay: .7s; } .hero__mots li:nth-child(2) { animation-delay: .78s; } .hero__mots li:nth-child(3) { animation-delay: .86s; }
.hero__mots li:nth-child(4) { animation-delay: .94s; } .hero__mots li:nth-child(5) { animation-delay: 1.02s; } .hero__mots li:nth-child(6) { animation-delay: 1.1s; }
.defiler { position: absolute; z-index: 2; left: 6.8rem; bottom: 1.6rem; display: flex; align-items: center; gap: .9rem; font-family: var(--sans); font-size: .62rem; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--gris); animation: apparait 1s var(--ease) 1.4s both; }
.defiler i { position: relative; width: 4.5rem; height: 1px; overflow: hidden; background: rgba(13, 27, 42, .15); }
.defiler i::after { content: ''; position: absolute; inset: 0; background: var(--bronze); animation: file 2.2s var(--ease-io) infinite; }
@keyframes file { from { transform: translateX(-100%); } to { transform: translateX(100%); } }

@keyframes monte { from { transform: translateY(110%); } to { transform: translateY(0); } }
@keyframes apparait { from { opacity: 0; transform: translateY(1.2rem); } to { opacity: 1; transform: none; } }
@keyframes glisse { from { opacity: 0; transform: translateX(1rem); } to { opacity: 1; transform: none; } }

/* ---------- piliers ---------- */
.piliers { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); align-items: stretch; height: 12.5rem; padding: 1.4rem 3.45rem; background: #f9f8f6; }
.pilier { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: .1rem .8rem .3rem; transition: background-color .5s, transform .6s var(--ease), box-shadow .6s var(--ease); }
.pilier::before { content: ''; position: absolute; left: 0; top: 12%; bottom: 12%; width: 1px; background: var(--filet); transform: scaleY(0); transition: transform 1.2s var(--ease) calc(var(--d, 0) * .12s); }
.pilier.is-visible::before { transform: scaleY(1); }
.pilier::after { content: ''; position: absolute; left: 18%; right: 18%; top: 0; height: 2px; background: var(--bronze); transform: scaleX(0); transition: transform .6s var(--ease); }
.pilier:hover { background: #fff; box-shadow: 0 1.6rem 2.6rem -1.8rem rgba(13, 27, 42, .3); }
.js .pilier.is-visible:hover { transform: translateY(-.35rem); transition-delay: 0s; }
.pilier:hover::after { transform: scaleX(1); }
.icone { width: 3rem; height: 3rem; fill: none; stroke: var(--bronze); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.icone--plein rect { fill: var(--bronze); stroke: none; }
.icone--plein .trait { fill: none; }
.pilier .icone { width: 4.6rem; height: 4.6rem; margin-top: -.75rem; stroke-width: 1.55; }
.pilier__titre { margin-top: .55rem; font-family: var(--sans); font-weight: 600; font-size: .92rem; letter-spacing: .2em; text-transform: uppercase; color: #22313d; }
.pilier p { margin-top: .35rem; font-size: .97rem; line-height: 1.55; color: #4a5361; }

/* ---------- approche ---------- */
.approche { display: grid; grid-template-columns: 31.25% 1fr 28.2%; height: 37.4rem; background: var(--blanc-casse); }
.approche__photo { position: relative; overflow: hidden; background: #cbbfb2; }
.approche__photo img { width: 100%; height: 112%; margin-top: -6%; object-fit: cover; object-position: 50% 15%; }
.etiquette { position: absolute; left: 1.4rem; bottom: 1.4rem; padding: .7rem 1rem; font-family: var(--sans); font-size: .66rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: #fff; background: rgba(10, 33, 44, .45); border: 1px solid rgba(255, 255, 255, .25); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.approche__texte { padding: 3.25rem .6rem 0 2.95rem; }
.approche__texte .titre-section { margin-top: 1.2rem; white-space: nowrap; }
.approche__para { margin-top: 1.45rem; max-width: 31rem; font-size: 1.16rem; line-height: 1.7; color: #4f5866; }
.approche__para strong { font-weight: 500; color: var(--encre); background: linear-gradient(transparent 62%, rgba(201, 165, 125, .28) 62%); }
.parcours { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.3rem; max-width: 33rem; margin-top: 1.6rem; }
.parcours li { position: relative; padding-top: .85rem; }
.parcours li::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--bronze); transform: scaleX(0); transform-origin: left; transition: transform 1.2s var(--ease) calc(var(--d, 0) * .12s + .2s); }
.parcours li.is-visible::before { transform: scaleX(1); }
.parcours span { display: block; font-family: var(--sans); font-size: .62rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--bronze-texte); }
.parcours strong { display: block; margin-top: .4rem; font-weight: 400; font-size: 1.12rem; line-height: 1.25; color: var(--encre); }
.approche__texte .btn { margin-top: 2rem; width: 18.2rem; }
.univers { display: grid; grid-template-rows: 116fr 117fr 122fr; gap: .56rem; padding-bottom: .5rem; background: #fff; }
.carte { position: relative; display: block; overflow: hidden; background: #2b3138; }
.carte img { width: 100%; height: 100%; object-fit: cover; transition: scale 1.4s var(--ease); }
.carte::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10, 18, 24, .58) 0%, rgba(10, 18, 24, .05) 70%); transition: background-color .6s; pointer-events: none; }
.carte:hover::after { background-color: rgba(10, 33, 44, .25); }
.carte__nom { position: absolute; left: 2.1rem; bottom: 1.45rem; z-index: 1; font-family: var(--sans); font-weight: 500; font-size: 1.06rem; line-height: 1.5; letter-spacing: .2em; text-transform: uppercase; color: #fff; transition: letter-spacing .7s var(--ease), translate .7s var(--ease); }
.rond { position: absolute; right: 1.85rem; bottom: 1.6rem; z-index: 1; display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: rgba(166, 132, 95, .92); color: #fff; font-family: var(--sans); font-size: 1.2rem; transition: transform .7s var(--ease), background-color .4s, box-shadow .6s; }
.carte:hover .carte__nom { letter-spacing: .26em; translate: .3rem 0; }
.carte:hover .rond { transform: rotate(-45deg) scale(1.08); background: var(--bronze); box-shadow: 0 0 0 .5rem rgba(166, 132, 95, .25); }

/* ---------- chiffres ---------- */
.chiffres { position: relative; display: grid; grid-template-columns: 1fr 1.07fr 1.22fr 1.15fr; height: 12.5rem; padding: 1.55rem 1rem 1.6rem 5.4rem; overflow: hidden; background: var(--nuit); color: #fff; }
.chiffres::before { content: ''; position: absolute; top: -50%; bottom: -50%; width: 30rem; left: -30rem; background: radial-gradient(closest-side, rgba(201, 165, 125, .16), rgba(201, 165, 125, 0)); animation: balaye 11s ease-in-out infinite; pointer-events: none; }
@keyframes balaye { to { transform: translateX(calc(100vw + 30rem)); } }
.chiffre { position: relative; display: flex; align-items: flex-start; gap: 1.45rem; padding: .3rem 1rem 0 1.8rem; }
.chiffre::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: rgba(255, 255, 255, .14); transform: scaleY(0); transform-origin: top; transition: transform 1.2s var(--ease) calc(var(--d, 0) * .12s + .2s); }
.chiffre.is-visible::before { transform: scaleY(1); }
.chiffre:first-child::before { display: none; }
.chiffre:first-child { padding-left: 0; }
.icone--clair { flex: none; width: 3.9rem; height: 3.9rem; margin-top: -.25rem; stroke: var(--bronze-clair); stroke-width: 1.45; }
.chiffre__val { font-size: 2.25rem; line-height: 1; letter-spacing: -.01em; padding-top: .2rem; font-variant-numeric: tabular-nums; }
.chiffre__titre { font-size: 1.52rem; line-height: 1.22; padding-top: .1rem; }
.chiffre__txt { margin-top: .55rem; font-size: 1rem; line-height: 1.5; color: #b9c0c2; }
.chiffre__val + .chiffre__txt { margin-top: .5rem; }
.chiffre__titre + .chiffre__txt { margin-top: .75rem; }

/* ---------- bande défilante ---------- */
.bande { overflow: hidden; padding: 2.1rem 0; background: var(--creme); border-bottom: 1px solid var(--filet); }
.bande__piste { display: flex; align-items: center; width: max-content; will-change: transform; }
.bande__piste span { font-size: 4.4rem; line-height: 1.05; letter-spacing: -.01em; white-space: nowrap; color: transparent; -webkit-text-stroke: 1px var(--bronze); transition: color .5s; }
.bande__piste span.plein { color: var(--encre); -webkit-text-stroke: 0; }
.bande__piste span:hover { color: var(--bronze); }
.bande__piste b { margin: 0 2.2rem; font-size: 1.5rem; font-weight: 400; color: var(--bronze); }

/* ---------- résultats ---------- */
.resultats { background: var(--creme); }
.resultats__tete { display: grid; grid-template-columns: 1.04fr 1fr; align-items: start; padding: 2.4rem 2.4rem 1.6rem 3.8rem; }
.resultats__titre { position: relative; padding: .2rem 0 .1rem 1.55rem; }
.resultats__titre::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: var(--bronze); }
.resultats__titre .titre-section { margin-top: .75rem; }
.resultats__intro { margin-top: .2rem; padding: .35rem 0 .35rem 2.35rem; border-left: 1px solid var(--filet); font-size: 1.09rem; line-height: 1.68; color: #3b4552; }
.cas { display: grid; grid-template-columns: 316fr 297fr 314fr; gap: .7rem; }
.cas__item { display: block; background: var(--blanc-casse); transition: box-shadow .6s var(--ease); }
.cas__item:hover { box-shadow: 0 2rem 3rem -2.2rem rgba(13, 27, 42, .4); }
.cas__img { position: relative; display: block; height: 11.1rem; overflow: hidden; }
.cas__img img { width: 100%; height: 100%; object-fit: cover; transition: scale 1.4s var(--ease); }
.cas__legende { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .95rem .95rem 1.45rem 1.5rem; }
.cas__legende::after { content: ''; position: absolute; left: 1.5rem; right: .95rem; bottom: .9rem; height: 1px; background: var(--bronze); transform: scaleX(0); transform-origin: left; transition: transform .7s var(--ease); }
.cas__item:hover .cas__legende::after { transform: scaleX(1); }
.cas__item:first-child .cas__legende { padding-left: 2.85rem; }
.cas__item:first-child .cas__legende::after { left: 2.85rem; }
.cas__legende strong { display: block; font-weight: 400; font-size: 1.4rem; line-height: 1.25; color: var(--encre); transition: color .4s; }
.cas__item:hover strong { color: var(--bronze-texte); }
.cas__legende small { display: block; margin-top: .3rem; font-size: .97rem; line-height: 1.4; color: #4a5361; }
.cas__legende .fleche { color: var(--bronze); font-size: 1.25rem; }

/* ---------- contact ---------- */
.contact { position: relative; height: 22.5rem; margin-top: .75rem; overflow: hidden; background: radial-gradient(120% 140% at 15% 50%, #12313f 0%, var(--nuit) 55%, var(--nuit-2) 100%); color: #fff; }
.cretes { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; fill: none; stroke: rgba(201, 165, 125, .3); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.cretes path { stroke-dasharray: 2200; stroke-dashoffset: 2200; transition: stroke-dashoffset 3s var(--ease); }
.cretes path:nth-child(2) { stroke: rgba(201, 165, 125, .2); transition-delay: .25s; }
.cretes path:nth-child(3) { stroke: rgba(201, 165, 125, .12); transition-delay: .5s; }
.contact.is-visible .cretes path { stroke-dashoffset: 0; }
.contact__lueur { position: absolute; width: 34rem; height: 34rem; right: 8%; top: -14rem; border-radius: 50%; background: radial-gradient(closest-side, rgba(201, 165, 125, .22), rgba(201, 165, 125, 0)); animation: derive-a 14s ease-in-out infinite alternate; pointer-events: none; }
.contact__portrait { position: absolute; z-index: 2; left: 8.6rem; top: 50%; width: 14.5rem; height: 14.5rem; margin-top: -7.25rem; border-radius: 50%; box-shadow: 0 0 0 .55rem rgba(201, 165, 125, .18), 0 2rem 3rem -1.5rem rgba(0, 0, 0, .6); }
.contact__portrait img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; object-position: 50% 12%; }
.contact__portrait::after { content: ''; position: absolute; inset: -1.3rem; border-radius: 50%; border: 1px dashed rgba(201, 165, 125, .55); animation: tourne 30s linear infinite; }
.js .contact__portrait[data-devoile] img { clip-path: circle(0% at 50% 50%); }
.js .contact__portrait[data-devoile].is-visible img { clip-path: circle(75% at 50% 50%); }
.contact__contenu { position: absolute; z-index: 2; left: 30.4rem; top: 3.9rem; }
.contact__titre { margin-top: 1.1rem; font-weight: 400; font-size: 2.24rem; line-height: 1.24; letter-spacing: -.005em; }
.contact__actions { display: flex; align-items: center; gap: 2.4rem; margin-top: 1.6rem; }
.contact__actions .btn { width: 17.6rem; }
.lien-souligne { position: relative; font-size: 1.06rem; color: #fff; padding-bottom: .15rem; }
.lien-souligne::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform-origin: right; transition: transform .6s var(--ease); }
.lien-souligne:hover::after { transform: scaleX(0); }
.lien-souligne--bronze { color: var(--bronze-clair); }
.signature { position: absolute; z-index: 2; right: 1.9rem; top: 11.6rem; width: 15.6rem; }
.signature__nom { font-family: 'Signature', 'Snell Roundhand', cursive; font-size: 2.3rem; line-height: 1; color: #fff; white-space: nowrap; padding-left: .2rem; }
.js .signature__nom { clip-path: inset(0 100% 0 0); }
.js .signature.is-visible .signature__nom { animation: ecrit 2.4s var(--ease-io) .5s forwards; }
.signature__trait { display: block; width: 1px; height: 2.6rem; margin: -.3rem 0 0 7.2rem; background: linear-gradient(rgba(255, 255, 255, .85), rgba(255, 255, 255, .15)); }
.signature__sous { margin-top: -.6rem; font-family: var(--sans); font-weight: 500; font-size: .65rem; line-height: 2; letter-spacing: .3em; text-transform: uppercase; color: rgba(255, 255, 255, .92); }
@keyframes ecrit { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }

/* ---------- pied de page ---------- */
.pied { position: relative; overflow: hidden; padding: 6rem 6.8rem 2rem; background: var(--nuit-2); color: rgba(255, 255, 255, .78); }
.pied__haut { display: flex; align-items: flex-end; justify-content: space-between; gap: 3rem; padding-bottom: 3.5rem; border-bottom: 1px solid rgba(255, 255, 255, .1); }
.pied__titre { font-weight: 400; font-size: 4rem; line-height: 1.05; letter-spacing: -.015em; color: #fff; max-width: 40rem; }
.pied__colonnes { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.1fr; gap: 3rem; padding: 3.5rem 0 1rem; }
.pied__bloc { display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; }
.logo--clair .logo__nom { color: #fff; font-size: 1.3rem; }
.logo--clair .logo__sous { color: rgba(255, 255, 255, .55); }
.pied__bio { margin-top: 1.1rem; max-width: 24rem; font-size: 1.02rem; line-height: 1.6; color: rgba(255, 255, 255, .62); }
.pied__entete { margin-bottom: .6rem; font-family: var(--sans); font-size: .68rem; font-weight: 600; letter-spacing: .28em; text-transform: uppercase; color: var(--bronze-clair); }
.pied__bloc > a:not(.lien-souligne) { position: relative; font-size: 1.05rem; color: rgba(255, 255, 255, .78); transition: color .3s, translate .5s var(--ease); }
.pied__bloc > a:not(.lien-souligne):hover { color: #fff; translate: .35rem 0; }
.pied__lieux { font-size: 1.05rem; line-height: 1.6; color: rgba(255, 255, 255, .78); margin-bottom: .6rem; }
.pied__marque { margin: 2.5rem -6.8rem 0; overflow: hidden; text-align: center; line-height: .82; }
.pied__marque span { display: inline-block; font-size: 8.5vw; letter-spacing: -.03em; white-space: nowrap; color: transparent; -webkit-text-stroke: 1px rgba(201, 165, 125, .28); background: linear-gradient(90deg, rgba(201, 165, 125, 0) 0%, rgba(201, 165, 125, .2) 50%, rgba(201, 165, 125, 0) 100%) no-repeat; background-size: 40% 100%; -webkit-background-clip: text; background-clip: text; animation: lumiere 7s ease-in-out infinite; }
@keyframes lumiere { from { background-position: -60% 0; } to { background-position: 160% 0; } }
.pied__bas { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; margin-top: 2rem; padding-top: 1.6rem; border-top: 1px solid rgba(255, 255, 255, .1); font-family: var(--sans); font-size: .72rem; letter-spacing: .06em; color: rgba(255, 255, 255, .5); }
.pied__liens { display: flex; gap: 1.6rem; }
.pied__liens a:hover { color: #fff; }
.haut { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; border: 1px solid rgba(201, 165, 125, .55); color: var(--bronze-clair); font-family: var(--sans); font-size: 1.05rem; transition: background-color .4s, color .4s, translate .6s var(--ease); }
.haut:hover { background: var(--bronze); color: #fff; }

/* ---------- fenêtre d'avertissement (droit d'auteur) ---------- */
.gate { position: fixed; inset: 0; z-index: 90; display: none; align-items: center; justify-content: center; padding: 1.5rem; background: radial-gradient(120% 90% at 50% 40%, rgba(10, 33, 44, .55), rgba(5, 16, 22, .85)); -webkit-backdrop-filter: blur(18px) saturate(1.1); backdrop-filter: blur(18px) saturate(1.1); transition: opacity .7s var(--ease); }
.js:not(.gate-ok) .gate { display: flex; }
.js:not(.gate-ok) body { overflow: hidden; }
.js:not(.gate-ok) .hero, .js:not(.gate-ok) .hero *, .js:not(.gate-ok) .hero *::before, .js:not(.gate-ok) .hero *::after { animation-play-state: paused !important; }
.gate.is-sortie { opacity: 0; }
.gate.is-sortie .gate__carte { transform: translateY(-1.5rem) scale(.97); opacity: 0; }
.gate__carte { position: relative; display: grid; grid-template-columns: 22rem 1fr; width: min(60rem, 100%); max-height: calc(100vh - 3rem); overflow: auto; background: var(--blanc-casse); box-shadow: 0 3rem 7rem -2rem rgba(0, 0, 0, .7), 0 0 0 1px rgba(201, 165, 125, .25); animation: gate-entre 1.1s var(--ease-io) .1s both; transition: transform .7s var(--ease), opacity .6s; }
@keyframes gate-entre { from { opacity: 0; clip-path: inset(8% 8% 8% 8%); transform: translateY(1.5rem) scale(.97); } to { opacity: 1; clip-path: inset(0 0 0 0); transform: none; } }

.gate__visuel { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: flex-end; padding: 2.2rem; background: radial-gradient(130% 90% at 20% 15%, #17394a 0%, var(--nuit) 50%, var(--nuit-2) 100%); color: #fff; }
.gate__visuel::after { content: ''; position: absolute; width: 24rem; height: 24rem; right: -9rem; top: -9rem; border-radius: 50%; background: radial-gradient(closest-side, rgba(201, 165, 125, .28), rgba(201, 165, 125, 0)); animation: derive-a 12s ease-in-out infinite alternate; }
.gate__cretes { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: rgba(201, 165, 125, .35); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.gate__cretes path { stroke-dasharray: 900; stroke-dashoffset: 900; animation: trace 2.6s var(--ease) .7s forwards; }
.gate__cretes path:nth-child(2) { stroke: rgba(201, 165, 125, .22); animation-delay: .9s; }
.gate__cretes path:nth-child(3) { stroke: rgba(201, 165, 125, .12); animation-delay: 1.1s; }
.gate__copyright { position: absolute; left: 1.6rem; top: .2rem; font-size: 13rem; line-height: 1; color: transparent; -webkit-text-stroke: 1px rgba(201, 165, 125, .7); background: linear-gradient(110deg, rgba(201, 165, 125, 0) 30%, rgba(201, 165, 125, .55) 50%, rgba(201, 165, 125, 0) 70%) no-repeat; background-size: 250% 100%; -webkit-background-clip: text; background-clip: text; animation: apparait 1.2s var(--ease) .5s both, lumiere-c 4.5s ease-in-out 1.6s infinite; }
@keyframes lumiere-c { from { background-position: 120% 0; } to { background-position: -120% 0; } }
.gate__rond { position: absolute; right: 1.6rem; top: 1.8rem; width: 6.6rem; height: 6.6rem; animation: apparait 1s var(--ease) .9s both; }
.gate__rond-texte { transform-origin: 60px 60px; animation: tourne 20s linear infinite; }
.gate__rond text { font-family: var(--sans); font-size: 7.3px; font-weight: 600; letter-spacing: 1.4px; text-transform: uppercase; fill: rgba(255, 255, 255, .75); }
.gate__marque { position: relative; z-index: 1; font-family: var(--sans); font-size: .7rem; font-weight: 600; line-height: 1.8; letter-spacing: .3em; text-transform: uppercase; color: var(--bronze-clair); animation: apparait 1s var(--ease) 1s both; }
.gate__marque::before { content: ''; display: block; width: 2.4rem; height: 1px; margin-bottom: 1rem; background: var(--bronze-clair); }

.gate__contenu { padding: 2.8rem 2.8rem 2rem; }
.gate__contenu > * { animation: apparait 1s var(--ease) both; }
.gate__surtitre { color: var(--bronze-texte); animation-delay: .55s !important; }
.gate__titre { margin-top: .7rem; font-weight: 400; font-size: 2.55rem; line-height: 1.08; letter-spacing: -.015em; color: var(--encre); animation-delay: .65s !important; }
.gate__texte { margin-top: 1.1rem; display: grid; gap: .65rem; font-size: 1rem; line-height: 1.62; color: #4f5866; animation-delay: .75s !important; }
.gate__texte strong { font-weight: 600; color: var(--encre); }
.gate__texte em { font-style: normal; color: var(--encre); background: linear-gradient(transparent 62%, rgba(201, 165, 125, .3) 62%); }
.gate__form { margin-top: 1.5rem; padding-top: 1.35rem; border-top: 1px solid var(--filet); animation-delay: .85s !important; }
.gate__etape { display: flex; align-items: center; gap: .7rem; font-family: var(--sans); font-size: .66rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--gris); }
.gate__etape span { display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; border: 1px solid rgba(166, 132, 95, .6); font-size: .66rem; letter-spacing: 0; color: var(--bronze-texte); }
.gate__etape + .gate__phrase { margin: .7rem 0 1.15rem; }
.gate__phrase { position: relative; display: inline-flex; align-items: center; gap: .9rem; height: 3rem; padding: 0 .55rem 0 1.25rem; font-family: var(--serif); font-size: 1.3rem; color: var(--encre); background: linear-gradient(135deg, #fbf6ef, #f2e8db); border: 1px solid rgba(166, 132, 95, .45); cursor: copy; overflow: hidden; transition: border-color .4s, box-shadow .5s var(--ease), transform .5s var(--ease); }
.gate__phrase::after { content: ''; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .7) 50%, transparent 70%); transform: translateX(-130%); animation: reflet 4s var(--ease) 2.2s infinite; pointer-events: none; }
.gate__phrase:hover { border-color: var(--bronze); box-shadow: 0 1rem 2rem -1.3rem rgba(90, 64, 36, .55); transform: translateY(-1px); }
.gate__phrase-icone { display: grid; place-items: center; width: 2.1rem; height: 2.1rem; background: var(--bronze); color: #fff; transition: background-color .3s; }
.gate__phrase-icone svg { width: 1.05rem; height: 1.05rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.gate__phrase-ok { position: absolute; right: .55rem; top: 50%; translate: 0 -50%; width: 2.1rem; padding: 0 !important; font-size: 0 !important; display: grid; place-items: center; height: 2.1rem; padding: 0 .7rem; font-family: var(--sans); font-size: .62rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: #fff; background: #5f8a5b; opacity: 0; transform: scale(.8); transition: opacity .3s, transform .4s var(--ease); }
.gate__phrase.is-copie .gate__phrase-ok { opacity: 1; transform: none; }
.gate__phrase-ok::before { content: '✓'; font-size: 1.05rem; letter-spacing: 0; }
.gate__phrase.is-copie .gate__phrase-txt { color: #5f8a5b; transition: color .3s; }
.gate__ligne { display: flex; align-items: flex-end; gap: .8rem; margin-top: .5rem; }
.gate__champ { position: relative; flex: 1; min-width: 0; padding-top: 1.1rem; }
.gate__champ input { width: 100%; height: 2.9rem; padding: 0 .1rem; font-family: var(--serif); font-size: 1.2rem; color: var(--encre); background: transparent; border: 0; border-bottom: 1px solid var(--filet); border-radius: 0; outline: none; }
.gate__champ label { position: absolute; left: .1rem; top: 1.95rem; font-size: 1.02rem; color: #8a929c; pointer-events: none; transform-origin: left; transition: transform .45s var(--ease), color .3s, top .45s var(--ease); }
.gate__champ input:focus + label, .gate__champ input:not(:placeholder-shown) + label { top: .3rem; transform: scale(.78); color: var(--bronze-texte); }
.gate__champ i { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--bronze); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--ease), background-color .3s; }
.gate__champ input:focus ~ i { transform: scaleX(1); }
.gate__champ input.is-valide ~ i { transform: scaleX(1); background: #5f8a5b; }
.gate__ok { height: 3.1rem; padding: 0 1.5rem; }
.gate__ok:disabled { opacity: .4; cursor: not-allowed; box-shadow: none; }
.gate__ok:disabled::after { animation: none; }
.gate__ok:not(:disabled) { animation: pulse 2s var(--ease) infinite; }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(166, 132, 95, .5); } 70% { box-shadow: 0 0 0 .9rem rgba(166, 132, 95, 0); } 100% { box-shadow: 0 0 0 0 rgba(166, 132, 95, 0); } }
.gate__mention { margin-top: 1.5rem; font-family: var(--sans); font-size: .6rem; letter-spacing: .18em; text-transform: uppercase; color: #8a929c; animation-delay: .95s !important; }
@media (max-width: 860px) {
  .gate { padding: 1rem; align-items: flex-start; overflow: auto; }
  .gate__carte { grid-template-columns: 1fr; max-height: none; overflow: visible; }
  .gate__visuel { height: 9.5rem; padding: 1.4rem 1.5rem; }
  .gate__copyright { font-size: 8rem; left: auto; right: 1.2rem; top: .1rem; }
  .gate__rond { display: none; }
  .gate__contenu { padding: 1.9rem 1.4rem 1.5rem; }
  .gate__titre { font-size: 1.9rem; }
  .gate__ligne { flex-direction: column; align-items: stretch; }
  .gate__ok { width: 100%; }
}

/* ---------- apparitions au défilement ---------- */
.js [data-reveal] { opacity: 0; transform: translateY(1.8rem); transition: opacity 1.1s var(--ease), transform 1.1s var(--ease); transition-delay: calc(var(--d, 0) * .12s); }
.js [data-reveal].is-visible { opacity: 1; transform: none; }
.js .pilier[data-reveal] { transition: opacity 1.1s var(--ease) calc(var(--d, 0) * .12s), transform 1.1s var(--ease) calc(var(--d, 0) * .12s), background-color .5s, box-shadow .6s var(--ease); }
.js .pilier[data-reveal] .icone { stroke-dasharray: 160; stroke-dashoffset: 160; transition: stroke-dashoffset 2s var(--ease) calc(var(--d, 0) * .12s + .25s), transform .7s var(--ease); }
.js .pilier.is-visible .icone { stroke-dashoffset: 0; }
.pilier:hover .icone { transform: translateY(-.3rem) scale(1.06); }
.js .chiffre[data-reveal] .icone { stroke-dasharray: 200; stroke-dashoffset: 200; transition: stroke-dashoffset 2.2s var(--ease) calc(var(--d, 0) * .12s + .3s); }
.js .chiffre.is-visible .icone { stroke-dashoffset: 0; }
.js .chiffre.is-visible .icone--tourne { animation: tourne 40s linear 2.5s infinite; }
.js [data-devoile] img { clip-path: inset(100% 0 0 0); scale: 1.25; transition: clip-path 1.4s var(--ease-io) calc(var(--d, 0) * .14s), scale 2s var(--ease) calc(var(--d, 0) * .14s); }
.js [data-devoile].is-visible img { clip-path: inset(0 0 0 0); scale: 1; }
.js .carte[data-devoile].is-visible:hover img, .js .cas__item:hover .cas__img.is-visible img { scale: 1.08; transition-delay: 0s; transition-duration: 1.4s; }
.mot { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .12em; margin-bottom: -.12em; }
.mot > span { display: inline-block; transform: translateY(110%); transition: transform 1.1s var(--ease) calc(var(--i, 0) * .045s + .05s); }
.is-visible .mot > span { transform: none; }

/* ---------- tablette ---------- */
@media (max-width: 1099px) {
  :root { --h-entete: 4.25rem; }
  .entete { grid-template-columns: 1fr auto; padding: 0 1.5rem; }
  .entete.menu-ouvert::before { opacity: 0; }
  .entete.menu-ouvert { box-shadow: none; }
  .entete.menu-ouvert .logo__nom { color: #fff; }
  .entete.menu-ouvert .logo__sous { color: rgba(255, 255, 255, .6); }
  .logo__nom { font-size: 1.12rem; }
  .logo__sous { font-size: .5rem; }
  .nav, .entete__btn { display: none; }
  .menu-btn { display: inline-flex; align-items: center; gap: .8rem; justify-self: end; height: 2.75rem; padding: 0 .2rem 0 .9rem; border: 0; background: transparent; cursor: pointer; font-family: var(--sans); font-size: .7rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--encre); transition: color .4s; }
  .menu-btn__traits { position: relative; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 50%; border: 1px solid rgba(166, 132, 95, .6); transition: border-color .4s, background-color .4s; }
  .menu-btn__traits i { position: absolute; width: 1.05rem; height: 1.5px; background: currentColor; transition: transform .6s var(--ease); }
  .menu-btn__traits i:first-child { transform: translateY(-3px); }
  .menu-btn__traits i:last-child { transform: translateY(3px); }
  .menu-btn[aria-expanded="true"] { color: #fff; }
  .menu-btn[aria-expanded="true"] .menu-btn__traits { border-color: var(--bronze-clair); background: rgba(255, 255, 255, .06); }
  .menu-btn[aria-expanded="true"] .menu-btn__traits i:first-child { transform: rotate(45deg); }
  .menu-btn[aria-expanded="true"] .menu-btn__traits i:last-child { transform: rotate(-45deg); }

  .hero { height: auto; display: grid; grid-template-columns: 1.25fr 1fr; align-items: center; gap: 2rem; padding: calc(var(--h-entete) + 3rem) 2.5rem 4.5rem 2.5rem; }
  .hero__contenu, .portrait { position: relative; left: auto; top: auto; width: auto; }
  .hero__titre { font-size: 3.9rem; }
  .hero__texte { font-size: 1.15rem; }
  .hero__texte br, .approche__para br, .resultats__intro br { display: none; }
  .hero__actions { flex-wrap: wrap; }
  .hero__actions .btn--plein, .hero__actions .btn--contour { width: auto; }
  .hero__mots { display: none; }
  .defiler { left: 2.5rem; bottom: 1.4rem; }
  .badge-rond { left: -2.6rem; top: 1.4rem; width: 6rem; height: 6rem; }
  .carte-flottante { left: -2.5rem; bottom: 2rem; }

  .piliers { grid-template-columns: repeat(2, 1fr); align-items: start; row-gap: 1.5rem; height: auto; padding: 2.5rem 1.5rem; }
  .pilier { padding: 1.4rem .8rem; }
  .pilier:nth-child(odd)::before { display: none; }

  .approche { grid-template-columns: 42% 1fr; grid-template-rows: auto auto; height: auto; }
  .approche__photo { min-height: 32rem; }
  .approche__texte { padding: 3rem 1.5rem 3rem 2.5rem; }
  .titre-section, .approche__texte .titre-section { font-size: 2.75rem; white-space: normal; }
  .univers { grid-column: 1 / -1; grid-template-rows: none; grid-template-columns: repeat(3, 1fr); height: 13rem; padding: 0; }

  .chiffres { grid-template-columns: repeat(2, 1fr); height: auto; row-gap: 2.2rem; padding: 2.5rem 1.5rem; }
  .chiffre:nth-child(3)::before { display: none; }
  .chiffre:nth-child(3) { padding-left: 0; }
  .bande__piste span { font-size: 3.2rem; }

  .resultats__tete { grid-template-columns: 1fr; gap: 1.6rem; padding: 3rem 1.5rem 2rem; }
  .resultats__intro { max-width: 40rem; padding-left: 1.55rem; }
  .cas__legende, .cas__item:first-child .cas__legende { padding: 1rem 1.1rem 1.5rem 1.3rem; }
  .cas__legende::after, .cas__item:first-child .cas__legende::after { left: 1.3rem; }
  .cas__legende strong { font-size: 1.12rem; }

  .contact { height: auto; display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 3rem; row-gap: 1.5rem; padding: 4rem 2.5rem; }
  .contact__portrait { position: relative; left: auto; top: auto; grid-row: span 2; margin: 0 0 0 1.4rem; width: 11rem; height: 11rem; }
  .contact__contenu { position: relative; left: auto; top: auto; }
  .contact__titre { font-size: 1.85rem; }
  .contact__titre br { display: none; }
  .contact__actions { flex-wrap: wrap; gap: 1.2rem 2rem; }
  .signature { position: relative; right: auto; top: auto; }

  .pied { padding: 4.5rem 2.5rem 2rem; }
  .pied__haut { flex-direction: column; align-items: flex-start; gap: 2rem; }
  .pied__titre { font-size: 3rem; }
  .pied__colonnes { grid-template-columns: 1fr 1fr; gap: 2.5rem 2rem; }
  .pied__marque { margin: 2rem -2.5rem 0; }
}

/* ---------- téléphone ---------- */
@media (max-width: 760px) {
  .entete { padding: 0 1rem; }
  .logo__nom { font-size: .92rem; letter-spacing: .05em; }
  .logo__sous { font-size: .44rem; letter-spacing: .26em; }
  .menu-btn__txt { display: none; }
  .volet { padding: calc(var(--h-entete) + 1.5rem) 1.25rem 2rem; }

  .hero { display: flex; flex-direction: column; align-items: stretch; gap: 3rem; padding: calc(var(--h-entete) + 2rem) 1rem 4.5rem; }
  .hero__surtitre { font-size: .6rem; letter-spacing: .2em; }
  .hero__titre { margin-top: 1rem; font-size: 2.55rem; line-height: 1.04; }
  .hero__texte { font-size: 1.08rem; max-width: none; }
  .hero__actions { flex-direction: column; align-items: stretch; }
  .hero__actions .btn { width: 100%; }
  .portrait { margin: 0 1.5rem 0 .25rem; }
  .badge-rond { left: auto; right: -1.2rem; top: -2rem; width: 5.6rem; height: 5.6rem; }
  .carte-flottante { left: -.25rem; bottom: 1.2rem; padding: .8rem 1rem; }
  .carte-flottante strong { font-size: 2rem; }
  .carte-flottante > span { font-size: .85rem; }
  .defiler { display: none; }

  .piliers { grid-template-columns: 1fr 1fr; padding: 1.75rem .5rem; row-gap: .5rem; }
  .pilier { padding: 1.2rem .4rem; }
  .pilier__titre { font-size: .68rem; letter-spacing: .14em; }
  .pilier p { font-size: .93rem; }
  .pilier p br { display: none; }

  .approche { grid-template-columns: 1fr; }
  .approche__photo { min-height: 0; height: 26rem; }
  .approche__texte { padding: 2.5rem 1rem 2.75rem; }
  .titre-section, .approche__texte .titre-section { font-size: 2.25rem; }
  .titre-section--moyen { font-size: 2rem; }
  .approche__para { font-size: 1.08rem; }
  .parcours { grid-template-columns: 1fr; gap: .9rem; }
  .parcours li { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding-top: .7rem; }
  .parcours strong { margin-top: 0; font-size: 1.05rem; text-align: right; }
  .approche__texte .btn { width: 100%; }
  .univers { grid-template-columns: 1fr; height: auto; gap: .5rem; }
  .carte { height: 10.5rem; }

  .chiffres { grid-template-columns: 1fr; padding: 2.25rem 1rem; row-gap: 1.6rem; }
  .chiffre { padding: 0 0 1.6rem; border-bottom: 1px solid rgba(255, 255, 255, .12); }
  .chiffre::before { display: none; }
  .chiffre:last-child { border-bottom: 0; padding-bottom: 0; }
  .chiffre__txt br { display: none; }
  .bande { padding: 1.4rem 0; }
  .bande__piste span { font-size: 2.3rem; }
  .bande__piste b { margin: 0 1.2rem; font-size: 1rem; }

  .resultats__tete { padding: 2.5rem 1rem 1.75rem; }
  .resultats__titre .titre-section br { display: none; }
  .resultats__intro { font-size: 1.02rem; }
  .cas { grid-template-columns: 1fr; gap: .6rem; }
  .cas__img { height: 12.5rem; }

  .contact { grid-template-columns: 1fr; justify-items: start; gap: 2rem; padding: 3.5rem 1rem 3rem; margin-top: .6rem; }
  .contact__portrait { grid-row: auto; margin: 1rem 0 0 1.4rem; width: 9rem; height: 9rem; }
  .contact__titre { font-size: 1.6rem; }
  .cretes { top: auto; height: 16rem; }
  .contact__actions { flex-direction: column; align-items: stretch; width: 100%; }
  .contact__actions .btn { width: 100%; }
  .lien-souligne { align-self: flex-start; }

  .pied { padding: 3.5rem 1rem 1.5rem; }
  .pied__titre { font-size: 2.3rem; }
  .pied__haut .btn { width: 100%; }
  .pied__colonnes { grid-template-columns: 1fr; gap: 2.2rem; }
  .pied__marque { margin: 1.5rem -1rem 0; }
  .pied__bas { flex-direction: column; align-items: flex-start; gap: 1rem; }
  .haut { position: absolute; right: 1rem; bottom: 1.5rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .js [data-reveal] { opacity: 1; transform: none; }
  .js [data-devoile] img, .js .contact__portrait[data-devoile] img { clip-path: none; scale: 1; }
  .mot > span { transform: none; }
  .js .pilier[data-reveal] .icone, .js .chiffre[data-reveal] .icone { stroke-dashoffset: 0; }
  .js .signature__nom { clip-path: none; }
  .cretes path, .gate__cretes path { stroke-dashoffset: 0; }
}