

@font-face { font-family: 'MD Nichrome FR'; font-weight: 900; font-style: normal; font-display: swap;
  src: url("../fonts/two26-demo/MDNichromeTestFR-Dark.woff2") format("woff2"), url("../fonts/two26-demo/MDNichromeTestFR-Dark.woff") format("woff"); }
@font-face { font-family: 'MD Nichrome FR'; font-weight: 700; font-style: normal; font-display: swap;
  src: url("../fonts/two26-demo/MDNichromeTestFR-Bold.woff2") format("woff2"), url("../fonts/two26-demo/MDNichromeTestFR-Bold.woff") format("woff"); }

@font-face { font-family: 'MD Nichrome Ruban'; font-weight: 400; font-style: normal; font-display: swap;
  src: url("../fonts/two26-demo/MDNichromeTestFR-Dark.woff2") format("woff2"), url("../fonts/two26-demo/MDNichromeTestFR-Dark.woff") format("woff"); }

@font-face { font-family: 'Neue Montreal'; font-weight: 400; font-style: normal; font-display: swap;
  src: url("../fonts/two26-demo/NeueMontreal-Regular.woff2") format("woff2"), url("../fonts/two26-demo/NeueMontreal-Regular.otf") format("opentype"); }
@font-face { font-family: 'Neue Montreal'; font-weight: 500; font-style: normal; font-display: swap;
  src: url("../fonts/two26-demo/NeueMontreal-Medium.woff2") format("woff2"), url("../fonts/two26-demo/NeueMontreal-Medium.otf") format("opentype"); }

:root {
  --fond: #F9F7F2; --blanc: #FFFFFF; --encre: #141312; --nuit: #141312; --orange: #FF4107; --gris: #8A857C;
  --ease: cubic-bezier(.22,1,.36,1);
  --fleche-blanche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23FFFFFF' d='M6 6v2h8.59L5 17.59L6.41 19L16 9.41V18h2V6z'/%3E%3C/svg%3E");
  --chevron-blanc: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.1 18.4'%3E%3Cpath fill='%23FFFFFF' d='M0 0L6.89 9.755L.78 18.4H6.99L13.1 9.755L6.2 0Z'/%3E%3C/svg%3E");
  --display: 'MD Nichrome FR', 'Neue Montreal', 'Inter', sans-serif;
  --texte: 'Neue Montreal', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --gout: 28px; --barre: 72px;
}
@media (max-width: 767px) { :root { --gout: 20px; } }

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { background: var(--fond); overflow-x: clip; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html.lenis, html.lenis body { height: auto; }
body { background: var(--fond); color: var(--encre); font-family: var(--texte); font-size: 16px; line-height: 1.5; overflow-x: clip;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; }
ul { list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
:focus-visible { outline: 2px solid var(--orange); outline-offset: 3px; }
.v2-evitement { position: fixed; left: 12px; top: 12px; z-index: 100; padding: 10px 14px; border-radius: 999px; background: var(--encre); color: #fff;
  font-size: 13px; font-weight: 500; transform: translateY(-160%); transition: transform .3s var(--ease); }
.v2-evitement:focus-visible { transform: none; }

.btn { position: relative; display: inline-flex; align-items: center; height: 48px; padding: 0 18px 0 56px; border-radius: 10px;
  background: var(--encre); color: var(--fond); font-size: 15px; font-weight: 500; line-height: 1; letter-spacing: -.005em; white-space: nowrap;
  transition: background-color .8s var(--ease), color .8s var(--ease), padding .9s var(--ease), box-shadow .8s var(--ease), translate .45s var(--ease); -webkit-tap-highlight-color: transparent; }
.btn::before { content: ""; position: absolute; left: 6px; top: 6px; width: 36px; height: 36px; border-radius: 6px;
  background: var(--orange) var(--chevron-blanc) center / 8px 11px no-repeat; transition: left .9s var(--ease), background-color .8s var(--ease), transform .3s var(--ease); }
.btn:hover, .btn:focus-visible { background-color: var(--orange); color: #fff; padding: 0 56px 0 18px; }
.btn:hover::before, .btn:focus-visible::before { left: calc(100% - 42px); background-color: var(--encre); }
.btn:active::before { transform: scale(.92); }
@media (prefers-reduced-motion: reduce) { .btn, .btn::before { transition: none; } }

.v2-pastille { position: relative; display: inline-flex; align-items: center; height: 36px; padding: 0 18px 0 20px; border-radius: 999px; background: var(--blanc); color: var(--encre);
  border: 0; overflow: hidden; isolation: isolate; font-family: var(--texte); font-size: 14px; font-weight: 500; line-height: 1;
  white-space: nowrap; cursor: pointer; transition: transform .45s cubic-bezier(.34,1.56,.64,1); }
.v2-pastilles { gap: 8px; }
.v2-pastille:hover, .v2-pastille:focus-visible { transform: rotate(var(--v2-tilt, -3deg)) scale(1.05); }
.v2-pastille:hover .v2-pastille-txt, .v2-pastille:focus-visible .v2-pastille-txt { color: var(--blanc); transition-delay: .12s; }
.v2-grib.v2-flip svg { transform: scaleX(-1); }
.v2-pastille-txt { position: relative; z-index: 1; transition: color .25s var(--ease); }

.v2-grib { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.v2-grib svg { display: block; width: 100%; height: 100%; overflow: visible; }
.v2-grib path { fill: none; stroke: var(--orange); stroke-width: 0; stroke-linecap: round; stroke-linejoin: round; }
@media (prefers-reduced-motion: reduce) { .v2-pastille:hover { background: var(--orange); } .v2-pastille:hover .v2-pastille-txt { color: var(--blanc); } }
.v2-pastille-encre, .v2-pastille-blanche { display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 999px;
  font-family: var(--texte); font-size: 13px; font-weight: 500; line-height: 1.1; white-space: nowrap; }
.v2-pastille-encre { background: var(--encre); color: var(--blanc); }
.v2-pastille-blanche { background: var(--blanc); color: var(--encre); }

.v2-nav { position: fixed; inset: 0 0 auto 0; z-index: 50; height: var(--barre); display: grid; grid-template-columns: 1fr auto 1fr;
  align-items: center; gap: 16px; padding: 0 var(--gout); border-bottom: 1px solid transparent;
  transition: background-color .3s var(--ease), border-color .3s var(--ease); }

.v2-nav-g { justify-self: start; display: flex; align-items: center; }
.v2-pastilles { display: flex; align-items: center; gap: 6px; }
.v2-menu { display: none; }
.nav-logo { justify-self: center; display: inline-flex; align-items: center; gap: 11.5px; height: 44px; color: var(--encre);
  transition: transform .25s var(--ease); }
.nav-logo .marque { width: auto; height: 30px; }
.nav-logo .mot { width: auto; height: 14.4px; color: currentColor; transition: color .25s var(--ease); }
.nav-logo:hover, .nav-logo:focus-visible { transform: scale(1.04); }
.nav-logo:hover .mot, .nav-logo:focus-visible .mot { color: var(--orange); }
.v2-nav-d { justify-self: end; display: flex; align-items: center; gap: 22px; }
.nav-tel { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; font-size: 14px; font-weight: 500; color: var(--encre);
  font-variant-numeric: tabular-nums; white-space: nowrap; }
.nav-tel svg { width: 15px; height: 15px; color: var(--orange); flex: none; }
@media (max-width: 1180px) { .nav-tel span { display: none; } .v2-nav-d { gap: 12px; } }
@media (max-width: 991px) {
  .v2-pastilles, .nav-tel { display: none; }
  .v2-menu { display: inline-flex; }
}
@media (max-width: 520px) { .nav-logo .mot { display: none; } .v2-nav { gap: 8px; } }

@media (max-width: 991px) { .v2-nav .v2-menu { height: 44px; padding: 0 18px; } }
@media (max-width: 520px) { .nav-logo { padding: 0 14px; margin: 0 -14px; } }

.v2-heros { position: sticky; top: 0; z-index: 0; height: 100vh; min-height: 640px; overflow: clip; display: flex; flex-direction: column; align-items: center;
  padding: max(calc(var(--barre) + 36px), calc(24vh - 16px)) var(--gout) 0; text-align: center; background: var(--nuit); color: var(--fond); }

.v2-heros-in { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; width: 100%; will-change: transform, opacity; }

.v2-heros.v2-couvert { opacity: 0; }
.v2-heros.v2-couvert :is(a, button, input, select, textarea, iframe, [tabindex]) { visibility: hidden; }

.v2-loin { opacity: 0; }

.v2-arc { position: absolute; z-index: 0; top: 13vh; height: 78vh; width: 52vh; overflow: visible; pointer-events: none; }
.v2-arc--g { left: -24vh; top: 5vh; height: 66vh; width: 44vh; }
.v2-arc--d { right: -27vh; top: 16vh; height: 76vh; width: 50.7vh; }
.v2-arc path { fill: none; stroke: var(--arc, #1F1D1B); stroke-width: 26; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1 1; stroke-dashoffset: 0; }
.js:not(.v2-final) .v2-arc path { stroke-dashoffset: 1; }

.v2-surtitre { display: flex; justify-content: center; align-items: center; gap: 13px; margin-bottom: 22px; }

.v2-surtitre-fl { flex: none; width: 11px; height: 15.5px; fill: var(--orange); }

.v2-surtitre-txt { display: inline-block; font-family: var(--texte); font-size: 15px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase;
  line-height: 1; color: var(--orange); }

.v2-h1 { margin-top: 18px; font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: clamp(96px, 13.4vw, 196px);
  line-height: .9; letter-spacing: -.01em; font-synthesis: none; color: var(--fond); }
.v2-h1 .l { display: block; overflow: hidden; padding: .1em .08em .02em; margin: -.1em -.08em -.02em; }
.v2-h1 .l > span { display: inline-block; }
.v2-pt { color: var(--orange); }
.v2-badges { display: flex; flex-wrap: wrap; justify-content: center; gap: 18px 30px; margin-top: 44px; }
.v2-b, .v2-flotte { display: block; }
.v2-badge { display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px 10px 12px; border-radius: 999px;
  background: var(--blanc); color: var(--encre); border: 2px solid var(--encre); box-shadow: 3px 3px 0 var(--encre);
  font-family: var(--texte); font-size: 15px; font-weight: 500; line-height: 1; white-space: nowrap; rotate: var(--r, 0deg);
  transition: translate .25s var(--ease), rotate .25s var(--ease), box-shadow .25s var(--ease); }
.v2-badge:hover, .v2-badge:focus-visible { translate: -2px -2px; rotate: 0deg; box-shadow: 5px 5px 0 var(--encre); }
.v2-badge--orange { background: var(--orange); color: var(--blanc); }
.v2-ico { width: 28px; height: 28px; flex: none; overflow: visible; }

.v2-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px 30px; margin-top: 40px; }
.v2-lien { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-family: var(--texte); font-size: 15px; font-weight: 500; line-height: 1;
  color: var(--encre); text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 1.5px; text-underline-offset: 6px; }
.v2-lien svg { width: 11px; height: 13px; flex: none; transition: transform .3s var(--ease); }
.v2-lien:hover svg, .v2-lien:focus-visible svg { transform: translateY(3px); }

.js:not(.v2-final) .v2-surtitre-txt,
.js:not(.v2-final) .v2-surtitre-fl,
.js:not(.v2-final) .v2-b,
.js:not(.v2-final) .v2-actions { opacity: 0; }
.js:not(.v2-final) .v2-h1 .l > span { transform: translateY(110%); }

.v2-clair { position: relative; z-index: 2; overflow-x: clip; }

.v2-ruban { position: relative; z-index: 2; display: block; width: 100%; height: max(380px, 26.39vw); margin: calc(-1 * max(104px, 7.2vw)) 0 -1px; overflow: hidden; pointer-events: none; }
.v2-decoupe { fill: var(--fond); }
.v2-bande { fill: none; stroke: var(--orange); stroke-width: 122; stroke-linecap: butt; stroke-dasharray: 1 1; stroke-dashoffset: 0; }
.v2-masque-trait { fill: none; stroke: #FFFFFF; stroke-width: 156; stroke-linecap: butt; stroke-dasharray: 1 1; stroke-dashoffset: 0; }
.js:not(.v2-final) .v2-bande, .js:not(.v2-final) .v2-masque-trait { stroke-dashoffset: -1; }
.v2-ruban-txt { font-family: 'MD Nichrome Ruban', var(--display); font-weight: 800; font-size: 64px; letter-spacing: .04em; fill: #FFFFFF; white-space: pre; font-synthesis: weight; }

.v2-ruban-txt .ast { font-family: 'Neue Montreal', var(--texte); font-weight: 500; font-synthesis: none; font-size: 92px; letter-spacing: 0; baseline-shift: -.2em; fill: #FFFFFF; }
.v2-mesure { visibility: hidden; }

.v2-promesse { position: relative; z-index: 1; background: var(--fond); color: var(--encre); display: flex; flex-direction: column;
  align-items: center; padding: 0 var(--gout) clamp(72px, 6.2vw, 112px); text-align: center; margin-top: -2.5vw; }

.v2-promesse-bloc { display: flex; flex-direction: column; align-items: center; gap: 34px; width: 100%; }

.v2-sur { font-family: var(--texte); font-size: 18px; font-weight: 500; line-height: 1; text-transform: uppercase; color: var(--encre); }
.v2-texte { max-width: 1320px; font-family: var(--display); font-weight: 900; font-size: clamp(44px, 5.4vw, 82px); line-height: 1.05; letter-spacing: -.0125em;
  font-synthesis: none; color: var(--encre); }
.js:not(.v2-final) .v2-texte { color: rgba(255,65,7,.45); }
.v2-w { display: inline-block; white-space: nowrap; }
.v2-c { display: inline-block; will-change: transform; backface-visibility: hidden; }
.v2-final .v2-w.o { color: var(--orange); }

.v2-real { position: relative; z-index: 1; background: var(--fond); padding: 56px 0 260px; overflow-x: clip; }

.v2-real-env { position: relative; }

.js:not(.v2-final) .v2-real-env::after { content: ""; display: block; height: 100vh; }
.js:not(.v2-final) .v2-real-env > .v2-real { position: sticky; top: var(--v2-real-top, 0px); }
.v2-real.v2-couvert { opacity: 0; }
.v2-real.v2-couvert :is(a, button, input, select, textarea, iframe, [tabindex]) { visibility: hidden; }
.v2-real-tete { display: grid; grid-template-columns: 1fr auto 1fr; align-items: start; gap: 24px; padding: 0 var(--gout); margin-bottom: clamp(48px, 4.6vw, 84px); }
.v2-real-sur, .v2-real-lien { font-family: var(--texte); font-size: 18px; font-weight: 500; line-height: 1; text-transform: uppercase; color: var(--encre); padding-top: .5em; }
.v2-real-sur { justify-self: start; }
.v2-real-lien { justify-self: end; white-space: nowrap; text-decoration: underline; text-decoration-color: var(--orange); text-decoration-thickness: 2px; text-underline-offset: 7px;
  transition: color .25s var(--ease); }
.v2-real-lien:hover, .v2-real-lien:focus-visible { color: var(--orange); }
.v2-real-titre { font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: clamp(68px, 6.95vw, 132px); line-height: .85; letter-spacing: 0;
  font-synthesis: none; text-align: left; color: var(--encre); }
.v2-real-titre .l { display: block; overflow: hidden; padding: .16em .06em .03em; margin: -.16em -.06em -.03em; }
.v2-real-titre .l > span { display: inline-block; }
.v2-mur { --tw: 405; display: flex; flex-direction: column; gap: 20px; overflow: hidden; }
.v2-rang { display: flex; gap: 20px; width: max-content; will-change: transform; }
.v2-tuile { position: relative; flex: none; width: calc(var(--tw) * 1px); aspect-ratio: 4 / 5; margin: 0; border-radius: 26px; overflow: hidden; background: #EFEBE3; }
.v2-tuile-in { position: absolute; inset: 0; will-change: transform; }
.v2-tuile img { display: block; width: 100%; height: 100%; object-fit: cover; -webkit-user-drag: none; pointer-events: none; }

.v2-tuile iframe { position: absolute; left: 0; top: 0; width: 1080px; height: 1350px; border: 0; transform-origin: 0 0; transform: scale(calc(var(--tw) / 1080)); pointer-events: none; }

.js:not(.v2-final) .v2-tuile:not(.v2-vue) { clip-path: inset(42.5% 42.5% 42.5% 42.5% round 36px); }

.js:not(.v2-final) .v2-real-titre .l > span { transform: translateY(110%); }

.v2-suite { position: relative; z-index: 1; height: 40vh; display: flex; align-items: center; justify-content: center; background: var(--fond); }
.v2-suite p { font-size: 12px; color: var(--gris); }

@media (max-width: 767px) {
  .v2-heros { height: auto; min-height: 100svh; padding-top: calc(var(--barre) + 40px); padding-bottom: 150px; }
  .v2-h1 { font-size: 72px; }
  .v2-badges { flex-direction: column; align-items: center; gap: 16px; margin-top: 36px; }
  .v2-arc { top: auto; bottom: 120px; height: 44vh; width: 29.3vh; }
  .v2-arc--g { left: -24vh; }
  .v2-arc--d { right: -24vh; }
  .v2-promesse { padding-bottom: 120px; margin-top: 0; padding-top: 24px; }
  .v2-promesse-bloc { gap: 32px; }
  .v2-real { padding: 72px 0; }

  .v2-real-tete { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .v2-real-sur { grid-row: 1; }
  .v2-real-titre { grid-row: 2; font-size: clamp(52px, 15vw, 68px); }
  .v2-real-lien { grid-row: 3; justify-self: start; font-size: 16px; padding: 15px 0; margin: -7px 0 -15px; }
}
@media (max-width: 400px) { .v2-h1 { font-size: 64px; } }

@media (min-width: 768px) and (max-height: 820px) {
  .v2-h1 { margin-top: 12px; }
  .v2-badges { margin-top: 30px; }
  .v2-actions { margin-top: 26px; }
  .v2-heros { padding-top: max(calc(var(--barre) + 28px), calc(22vh - 16px)); }
}

.v2-cta { position: relative; display: inline-flex; align-items: center; gap: 12px; height: 52px; padding: 0 24px 0 7px; border-radius: 999px;
  background: var(--encre); color: var(--blanc); overflow: hidden; isolation: isolate; font-family: var(--texte); font-size: 15px; font-weight: 500;
  line-height: 1; white-space: nowrap; text-decoration: none; transition: transform .45s cubic-bezier(.34,1.56,.64,1); -webkit-tap-highlight-color: transparent; }
.v2-nav .v2-cta { height: 46px; font-size: 14px; padding-right: 20px; }
.v2-cta-ico { position: relative; z-index: 1; flex: none; width: 38px; height: 38px; border-radius: 50%; background: var(--orange) var(--fleche-blanche) 50% 50% / 18px 18px no-repeat;
  transition: background-color .3s var(--ease) .1s, transform .45s cubic-bezier(.34,1.56,.64,1); }
.v2-nav .v2-cta-ico { width: 34px; height: 34px; }
.v2-cta-txt { position: relative; z-index: 1; }
.v2-cta .v2-grib path { stroke-width: 0; }
.v2-cta:hover, .v2-cta:focus-visible { transform: rotate(var(--v2-tilt, -3deg)) scale(1.04); }
.v2-cta:hover .v2-cta-ico, .v2-cta:focus-visible .v2-cta-ico { background-color: var(--encre); transform: rotate(45deg); }
.v2-cta:active .v2-cta-ico { transform: scale(.9); }

.nav-logo, .nav-tel, .nav-tel svg, .nav-logo .marque path { transition: color .25s var(--ease), fill .25s var(--ease); }
.v2-nav .v2-cta { transition: background-color .25s var(--ease), color .25s var(--ease), transform .45s cubic-bezier(.34,1.56,.64,1); }
.v2-nav .v2-cta .v2-cta-ico { transition: background-color .25s var(--ease), transform .45s cubic-bezier(.34,1.56,.64,1); }
.nav-logo.v2-sur-accent, .nav-tel.v2-sur-accent, .nav-tel.v2-sur-accent svg { color: #FFFFFF; }
.nav-logo.v2-sur-accent .marque path { fill: #FFFFFF; }
.nav-logo.v2-sur-sombre, .nav-tel.v2-sur-sombre { color: var(--fond); }

.v2-nav .v2-pastille { transition: transform .45s cubic-bezier(.34,1.56,.64,1), background-color .25s var(--ease), color .25s var(--ease); }
.v2-nav .v2-pastille.v2-sur-sombre { background: #1F1D1B; color: var(--fond); }

.v2-nav .v2-cta { --cta-fond: var(--orange); --cta-txt: #FFFFFF; --cta-ico: var(--encre); --cta-h-fond: #141312; --cta-h-txt: #F9F7F2; --cta-h-ico: var(--orange);
  background-color: var(--cta-fond); color: var(--cta-txt); }
.v2-nav .v2-cta .v2-cta-ico { background-color: var(--cta-ico); }
.v2-nav .v2-cta .v2-grib path { stroke: var(--cta-h-fond); }
.v2-nav .v2-cta:hover, .v2-nav .v2-cta:focus-visible { background-color: var(--cta-h-fond); color: var(--cta-h-txt); }
.v2-nav .v2-cta:hover .v2-cta-ico, .v2-nav .v2-cta:focus-visible .v2-cta-ico { background-color: var(--cta-h-ico); }
.v2-nav .v2-cta.v2-sur-sombre { --cta-h-fond: #F9F7F2; --cta-h-txt: #141312; }
.v2-nav .v2-cta.v2-sur-accent { --cta-fond: #F9F7F2; --cta-txt: #141312; --cta-ico: var(--orange); --cta-h-fond: #141312; --cta-h-txt: #F9F7F2; }
.v2-nav .v2-cta .v2-cta-txt { color: var(--cta-txt); transition: color .12s var(--ease) 0s; }
.v2-nav .v2-cta:hover .v2-cta-txt, .v2-nav .v2-cta:focus-visible .v2-cta-txt { color: var(--cta-h-txt); }

.v2-cta--accent { --cta-h-fond: #141312; --cta-h-txt: #F9F7F2; --cta-h-ico: var(--orange); background-color: var(--orange); color: #FFFFFF;
  transition: background-color .2s var(--ease), color .2s var(--ease), transform .45s cubic-bezier(.34,1.56,.64,1); }
.v2-cta--accent .v2-cta-ico { background-color: var(--encre); transition: background-color .25s var(--ease), transform .45s cubic-bezier(.34,1.56,.64,1); }
.v2-cta--accent .v2-grib path { stroke: var(--cta-h-fond); }

.v2-cta--accent:hover, .v2-cta--accent:focus-visible { background-color: var(--cta-h-fond); color: var(--cta-h-txt);
  transition: background-color .2s var(--ease) .7s, color .25s var(--ease) .35s, transform .45s cubic-bezier(.34,1.56,.64,1); }
.v2-cta--accent:hover .v2-cta-ico, .v2-cta--accent:focus-visible .v2-cta-ico { background-color: var(--cta-h-ico); }

.v2-cta--accent .v2-cta-txt { color: #FFFFFF; transition: color .12s var(--ease) 0s; }
.v2-cta--accent:hover .v2-cta-txt, .v2-cta--accent:focus-visible .v2-cta-txt { color: var(--cta-h-txt); }
.v2-cta--accent.v2-cta--nuit { --cta-h-fond: #F9F7F2; --cta-h-txt: #141312; }

.v2-cta--accent.v2-cta--nuit:not(:hover):not(:focus-visible) .v2-cta-txt,
.v2-nav .v2-cta.v2-sur-sombre:not(:hover):not(:focus-visible) .v2-cta-txt { transition: color .12s var(--ease) .38s; }

.v2-nav .v2-cta.v2-sur-accent:not(:hover):not(:focus-visible) .v2-cta-txt { transition: color .5s linear(0, .5 8%, .5 76%, 1) 0s; }

.v2-cta--clair { background: var(--fond); color: var(--encre); transition: color .25s var(--ease) .08s, transform .45s cubic-bezier(.34,1.56,.64,1); }
.v2-cta--clair:hover, .v2-cta--clair:focus-visible { color: var(--blanc); }
.v2-cta--contour { background: transparent; color: var(--fond); box-shadow: inset 0 0 0 1.5px rgba(249,247,242,.6); cursor: pointer; }
.v2-cta--contour .v2-cta-ico { display: grid; place-items: center; background: transparent; box-shadow: inset 0 0 0 1.5px rgba(249,247,242,.6); }
.v2-cta--contour .v2-cta-ico svg { width: 11px; height: 12px; margin-left: 2px; fill: var(--fond); transition: fill .25s var(--ease) .08s; }
.v2-cta--contour:hover .v2-cta-ico, .v2-cta--contour:focus-visible .v2-cta-ico { background-color: var(--blanc); box-shadow: none; transform: scale(1.08); }
.v2-cta--contour:hover .v2-cta-ico svg, .v2-cta--contour:focus-visible .v2-cta-ico svg { fill: var(--orange); }

.v2-video { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 84px 5vw 44px; background: var(--nuit);
  clip-path: circle(0px at var(--vx, 50%) var(--vy, 50%)); visibility: hidden; pointer-events: none;
  transition: clip-path .6s var(--ease), visibility 0s linear .6s; }
.v2-video.ouvert { clip-path: circle(150vmax at var(--vx, 50%) var(--vy, 50%)); visibility: visible; pointer-events: auto; transition: clip-path .9s var(--ease), visibility 0s; }
.v2-video-film { display: block; width: min(100%, calc((100vh - 150px) * 16 / 9)); aspect-ratio: 16 / 9; border-radius: 22px; background: #000; }
.v2-video-fermer { position: absolute; top: 18px; right: var(--gout); }
.v2-video:focus { outline: none; }
html.v2-video-ouverte, html.v2-video-ouverte body { overflow: hidden; }

.v2-sec { position: relative; z-index: 1; }
.v2-sec--nuit { background: var(--nuit); color: var(--fond); }
.v2-sec--clair { background: var(--fond); color: var(--encre); }
.v2-sec--accent { background: var(--orange); color: var(--blanc); }
.v2-sec--nuit .v2-sur, .v2-sec--accent .v2-sur { color: inherit; }

.v2-h2 { font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: clamp(64px, 6.95vw, 132px); line-height: .88; letter-spacing: 0; font-synthesis: none; }
.v2-h2 .l { display: block; overflow: hidden; padding: .16em .06em .03em; margin: -.16em -.06em -.03em; }
.v2-h2 .l > span { display: inline-block; }
.v2-corps { font-family: var(--texte); font-size: 20px; font-weight: 400; line-height: 1.5; text-wrap: pretty; }

.v2-coupe { position: absolute; left: 0; bottom: calc(100% - 1px); width: 100%; height: clamp(90px, 9.7vw, 190px); display: block; pointer-events: none; }

.v2-coupe path { pointer-events: fill; }

.v2-coupe.v2-coupe-vive { transform: none !important; overflow: visible; }

.v2-ch { position: relative; z-index: 1; background: var(--nuit); color: var(--fond); min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center; padding: 0 var(--gout); overflow: clip; }
.v2-ch-txt { position: relative; z-index: 2; padding-left: clamp(12px, 4.2vw, 72px); }
.v2-ch-num { font-family: var(--texte); font-size: 18px; font-weight: 500; line-height: 1; letter-spacing: .12em; color: var(--orange); }
.v2-ch-titre { margin-top: 22px; font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: clamp(54px, 5.3vw, 100px); line-height: .9; font-synthesis: none; }
.v2-ch-titre .l { display: block; overflow: hidden; padding: .16em .06em .03em; margin: -.16em -.06em -.03em; }
.v2-ch-titre .l > span { display: inline-block; }
.v2-ch-para { margin-top: 28px; max-width: 480px; font-family: var(--texte); font-size: 20px; line-height: 1.5; color: rgba(249,247,242,.8); text-wrap: balance; }

@media (min-width: 768px) {
  .v2-ch-titre { font-size: clamp(48px, 6.4vw, 124px); line-height: .9; }
  .v2-ch-para { max-width: min(100%, 42.3vw); font-size: clamp(19px, 1.4vw, 27px); }
}
.v2-ch-scene { position: relative; align-self: stretch; min-height: 100vh; }
.v2-fil { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }

.v2-fil-trait { fill: none; stroke: var(--orange); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

@media (max-width: 767px), (max-width: 1023px) and (orientation: portrait) {
  .v2-ch { grid-template-columns: minmax(0, 1fr); align-items: start; min-height: 0; padding-top: 96px; padding-bottom: 12px; }
  .v2-ch-txt { padding-left: 0; }
  .v2-ch-titre { margin-top: 16px; font-size: calc((100vw - 2 * var(--gout)) / 6.9); }
  .v2-ch-para { margin-top: 20px; max-width: none; font-size: 17px; text-wrap: pretty; }
  .v2-ch-scene { min-height: 0; margin: 4px calc(-1 * var(--gout)) 0; aspect-ratio: 720 / 900; overflow: clip; }

  .v2-ch-scene .v2-fil { -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 14%, #000 86%, transparent 100%);
    mask-image: linear-gradient(to bottom, transparent 0, #000 14%, #000 86%, transparent 100%); }
}
@media (min-width: 768px) and (max-width: 1023px) and (orientation: portrait) {
  .v2-ch-titre { font-size: min(76px, calc((100vw - 2 * var(--gout)) / 6.9)); }
  .v2-ch-para { max-width: 34em; font-size: 19px; }
  .v2-ch-scene { width: min(100%, 640px); margin: 12px auto 0; }
}

@media (pointer: coarse) and (min-width: 992px) {
  .v2-nav .v2-pastille { height: 44px; border: 4px solid transparent; background-clip: padding-box; }
  .nav-tel { padding: 0 14px; margin: 0 -14px; }
}
@media (pointer: coarse) and (min-width: 768px) { .v2-real-lien { padding-block: 13px; margin-block: -13px; } }
