/*
 * Fievrelama — feuille de style principale.
 * Reprise fidèle de la maquette de référence (palette, typographies, rythmes, animations).
 */

:root {
  --ink: #13120f;
  --ink-strong: #0d0c0a;
  --ink-soft: #1d1b17;
  --paper: #f4f0e8;
  --paper-bright: #faf8f3;
  --gold: #d6ad78;
  --gold-bright: #e9c99d;
  --gold-soft: rgba(214, 173, 120, .14);
  --line-light: rgba(255, 255, 255, .15);
  --line-dark: rgba(19, 18, 15, .14);
  --muted-light: rgba(250, 248, 243, .65);
  --muted-dark: rgba(19, 18, 15, .66);
  --display: "Cormorant Garamond", Georgia, serif;
  --body: "Manrope", Arial, sans-serif;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --page-pad: clamp(20px, 7vw, 112px);
  --section-pad: clamp(88px, 13vw, 180px);
  --header-height: 88px;
  --hero-slide-duration: 7.5s;
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 102px; }
body {
  margin: 0;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--body);
  font-size: 15px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

body.menu-open, body.lightbox-open, body.intro-open { overflow: hidden; }
@media (hover: hover) and (pointer: fine) {
  body.has-art-cursor, body.has-art-cursor a, body.has-art-cursor button, body.has-art-cursor [role="button"] { cursor: none !important; }
}
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
img { display: block; max-width: 100%; }
::selection { background: var(--gold); color: var(--ink); }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }

.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 999;
  padding: 12px 18px;
  background: var(--paper);
  color: var(--ink);
  transform: translateY(-160%);
}

.skip-link:focus { transform: none; }
.progress-bar {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 200;
  width: 100%;
  height: 2px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: left;
}

.intro-lens {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  background: #0b0a09;
  overflow: hidden;
  transition: opacity .46s ease, visibility .46s;
}
.intro-lens.is-skipped { display: none; }
.intro-lens.is-leaving { opacity: 0; visibility: hidden; }
.intro-curtain { position: absolute; right: 0; left: 0; height: 51%; background: #0b0a09; transition: transform .56s var(--ease); }
.intro-curtain--top { top: 0; transform-origin: top; }
.intro-curtain--bottom { bottom: 0; transform-origin: bottom; }
.intro-lens.is-leaving .intro-curtain--top { transform: translateY(-101%); }
.intro-lens.is-leaving .intro-curtain--bottom { transform: translateY(101%); }
/* Introduction : le portrait de Mickael, plein cadre, quatre secondes.
   La durée est pilotée par --intro-duration ; le script attend exactement la même. */
.intro-lens { --intro-duration: 4s; }
.intro-portrait { position: absolute; inset: 0; z-index: 1; overflow: hidden; transition: opacity .5s ease, transform .6s var(--ease); }
.intro-lens.is-leaving .intro-portrait { opacity: 0; transform: scale(1.06); }
.intro-portrait-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 28%;
  opacity: 0;
  transform: scale(1.14);
  filter: saturate(.88) contrast(1.04);
  animation: introPortrait var(--intro-duration) cubic-bezier(.18, .62, .2, 1) both;
}
@keyframes introPortrait {
  0% { opacity: 0; transform: scale(1.14); }
  24% { opacity: .82; }
  100% { opacity: .82; transform: scale(1); }
}

/* Le voile tient la lisibilité du nom quelle que soit la photographie choisie. */
.intro-veil {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    /* Bande centrale : le nom reste lisible même sur un portrait très clair. */
    radial-gradient(62% 30% at 50% 50%, rgba(11, 10, 9, .8) 0%, rgba(11, 10, 9, .58) 46%, rgba(11, 10, 9, .12) 82%, transparent 100%),
    radial-gradient(96% 72% at 50% 38%, rgba(11, 10, 9, .06) 0%, rgba(11, 10, 9, .34) 58%, rgba(11, 10, 9, .84) 100%),
    linear-gradient(0deg, rgba(11, 10, 9, .88) 0%, rgba(11, 10, 9, .46) 26%, rgba(11, 10, 9, .2) 58%, rgba(11, 10, 9, .56) 100%);
}

.intro-focus { position: relative; z-index: 2; display: grid; justify-items: center; gap: 13px; padding-inline: 24px; text-align: center; transition: opacity .32s ease, transform .55s var(--ease); }
.intro-lens.is-leaving .intro-focus { opacity: 0; transform: scale(1.04); }

.intro-rule { width: min(190px, 44vw); height: 1px; overflow: hidden; background: rgba(250, 248, 243, .16); }
.intro-rule span { display: block; height: 100%; background: linear-gradient(90deg, transparent, var(--gold-bright), transparent); transform: scaleX(0); animation: introRule 1.1s var(--ease) .35s both; }
@keyframes introRule { to { transform: scaleX(1); } }

.intro-brand {
  font-family: var(--display);
  font-size: clamp(46px, 8.4vw, 74px);
  line-height: 1;
  letter-spacing: -.02em;
  opacity: 0;
  transform: translateY(16px);
  animation: introRise 1.25s var(--ease) .62s both;
  text-shadow: 0 2px 26px rgba(8, 7, 6, .7);
}
.intro-brand em { color: var(--gold); font-style: normal; }

.intro-signature {
  max-width: 46ch;
  color: rgba(250, 248, 243, .94);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 2.4px;
  line-height: 1.8;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(10px);
  animation: introRise 1.15s var(--ease) 1.24s both;
  text-shadow: 0 1px 12px rgba(8, 7, 6, .8);
}
@keyframes introRise { to { opacity: 1; transform: none; } }

.intro-status { color: rgba(250, 248, 243, .72); text-shadow: 0 1px 10px rgba(8, 7, 6, .85); font-size: 8px; letter-spacing: 2.5px; text-transform: uppercase; opacity: 0; animation: introRise 1s var(--ease) 1.9s both; }
.intro-progress { width: min(230px, 58vw); height: 1px; margin-top: 3px; overflow: hidden; background: rgba(255, 255, 255, .14); }
.intro-progress span { display: block; width: 100%; height: 100%; background: linear-gradient(90deg, var(--gold), var(--gold-bright)); transform: scaleX(0); transform-origin: left; animation: introProgress var(--intro-duration) linear forwards; }
@keyframes introProgress { to { transform: scaleX(1); } }
.intro-skip {
  position: absolute;
  right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  z-index: 2;
  padding: 10px 13px;
  border: 1px solid rgba(250, 248, 243, .2);
  border-radius: 999px;
  color: rgba(250, 248, 243, .72);
  background: rgba(255, 255, 255, .04);
  font: 700 8px/1 var(--sans);
  letter-spacing: 1.8px;
  text-transform: uppercase;
  backdrop-filter: blur(10px);
  cursor: pointer;
  transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.intro-skip:hover, .intro-skip:focus-visible { color: var(--paper); border-color: rgba(214, 173, 120, .7); background: rgba(214, 173, 120, .12); }

.art-cursor {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 990;
  width: 0;
  height: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity .2s ease;
}
.art-cursor.is-visible { opacity: 1; }
.art-cursor-dot { position: absolute; width: 3px; height: 3px; border-radius: 50%; background: var(--gold-bright); transform: translate(-50%, -50%); }
.art-cursor-ring { position: absolute; display: grid; width: 30px; height: 30px; place-items: center; border: 1px solid rgba(233, 201, 157, .5); border-radius: 50%; transform: translate(-50%, -50%); transition: width .4s var(--ease), height .4s var(--ease), background .4s ease, border-color .4s ease; }
.art-cursor-label { opacity: 0; color: var(--paper); font-size: 7px; font-weight: 700; letter-spacing: 1.2px; transform: scale(.7); transition: opacity .22s ease, transform .3s var(--ease); }
.art-cursor.is-contextual .art-cursor-ring { width: 58px; height: 58px; border-color: rgba(233, 201, 157, .76); background: rgba(13, 12, 10, .34); backdrop-filter: blur(7px); }
.art-cursor.is-contextual .art-cursor-label { opacity: 1; transform: scale(1); }

.page-aura { display: none; }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  height: var(--header-height);
  padding-inline: var(--page-pad);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  transition: background .4s ease, height .4s ease, box-shadow .4s ease;
}

/* Avant défilement, l'en-tête est posé sur la photographie : un dégradé discret
   garantit la lisibilité du menu sur les quatre diapositives. */
.site-header::before {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  left: 0;
  height: 168px;
  content: "";
  pointer-events: none;
  background: linear-gradient(180deg, rgba(12, 11, 9, .8) 0%, rgba(12, 11, 9, .62) 45%, rgba(12, 11, 9, .28) 74%, transparent 100%);
  transition: opacity .4s ease;
}

.site-header.scrolled::before { opacity: 0; }

.site-header.scrolled {
  height: 76px;
  background: rgba(19, 18, 15, .88);
  backdrop-filter: blur(20px);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .08);
}

.brand {
  display: inline-flex;
  flex-direction: column;
  gap: 0;
  flex: 0 0 auto;
  line-height: 1;
}

.brand-word {
  font-family: var(--display);
  font-size: 31px;
  font-weight: 500;
  letter-spacing: -.8px;
}

.brand-word span { color: var(--gold); }
.brand-caption {
  margin-top: 5px;
  font-size: 8px;
  letter-spacing: 2.8px;
  text-transform: uppercase;
  color: var(--muted-light);
}

.desktop-nav { display: flex; align-items: center; gap: clamp(18px, 2.6vw, 38px); }
.nav-link {
  position: relative;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 1.2px;
  color: rgba(250, 248, 243, .92);
  transition: color .25s ease;
}

.nav-link::after {
  position: absolute;
  right: 0;
  bottom: -7px;
  left: 0;
  height: 1px;
  content: "";
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .32s var(--ease);
}

/* L'espace client n'est pas une rubrique du site : il se distingue discrètement. */
.nav-link--client { color: var(--gold-bright); }
.nav-link--client::before { margin-right: clamp(12px, 1.4vw, 22px); color: rgba(250, 248, 243, .24); content: "|"; }
.nav-link--client::after { background: var(--gold-bright); }

.mobile-menu-client { color: var(--gold-bright) !important; }

.nav-link:hover, .nav-link.active { color: var(--paper); }
.nav-link:hover::after, .nav-link.active::after { transform: scaleX(1); }

.header-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 11px 17px;
  border: 1px solid rgba(214, 173, 120, .6);
  color: var(--gold-bright);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  transition: color .25s ease, background .25s ease, border-color .25s ease;
}

.header-cta:hover { background: var(--gold); color: var(--ink); border-color: var(--gold); }
.availability-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #9fbd91;
  box-shadow: 0 0 0 4px rgba(159, 189, 145, .11);
}

.menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  padding: 10px;
  border: 0;
  background: transparent;
}

.menu-toggle span {
  display: block;
  width: 100%;
  height: 1px;
  background: var(--paper);
  transition: transform .28s ease, opacity .28s ease;
}

.menu-toggle span + span { margin-top: 7px; }
.menu-open .menu-toggle span:first-child { transform: translateY(4px) rotate(45deg); }
.menu-open .menu-toggle span:last-child { transform: translateY(-4px) rotate(-45deg); }

.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 110px 32px 50px;
  background: var(--ink-strong);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-12px);
  transition: opacity .3s ease, transform .3s ease, visibility .3s;
}

.menu-open .mobile-menu { opacity: 1; visibility: visible; transform: none; }
.mobile-menu a {
  display: block;
  padding: 13px 0;
  border-bottom: 1px solid var(--line-light);
  font-family: var(--display);
  font-size: clamp(35px, 9vw, 58px);
}

.mobile-menu .mobile-menu-contact {
  margin-top: 30px;
  padding: 0;
  border: 0;
  color: var(--gold);
  font-family: var(--body);
  font-size: 13px;
  letter-spacing: 1.2px;
}

.hero {
  position: relative;
  min-height: max(780px, 100svh);
  overflow: hidden;
  isolation: isolate;
}

.hero-slides, .hero-slide, .hero-scrim, .hero-exposure { position: absolute; inset: 0; }
.hero-slides {
  --hero-x: 0px;
  --hero-y: 0px;
  transform: translate3d(var(--hero-x), var(--hero-y), 0) scale(1.018);
  transform-origin: center;
  transition: transform .75s cubic-bezier(.2, .75, .2, 1);
  will-change: transform;
}
.hero-slide {
  /* Cadrage réglable : --hero-focus place le sujet, --hero-zoom resserre autour de lui.
     Deux jeux de valeurs, grand écran et mobile, réglés dans
     Fievrelama → Cadrage de l'accueil. */
  --hero-focus: var(--hero-focus-d, 50% 45%);
  --hero-zoom: var(--hero-zoom-d, 1);
  z-index: 0;
  opacity: 0;
  clip-path: inset(0 0 0 100%);
  transform: scale(1.035);
  transform-origin: center;
  transition: opacity .72s ease, clip-path 1.08s var(--ease), transform 4.8s cubic-bezier(.2, .6, .2, 1);
  will-change: clip-path, opacity, transform;
}

.hero-slide::before {
  position: absolute;
  inset: 0;
  content: "";
  background-image: var(--hero-img, none);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: var(--hero-focus);
  transform: scale(var(--hero-zoom));
  transform-origin: var(--hero-focus);
}
.hero-slide-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--hero-focus);
  transform: scale(var(--hero-zoom));
  transform-origin: var(--hero-focus);
}
.hero-slide.is-active { z-index: 1; opacity: 1; clip-path: inset(0); transform: scale(1); }
/* Le voile et le balayage se placent au-dessus de la photographie active :
   sans z-index explicite, la diapositive active (z-index 1) recouvrait le voile
   et le texte se retrouvait posé directement sur la photo. */

.hero-exposure {
  z-index: 4;
  overflow: hidden;
  pointer-events: none;
}

.hero-exposure::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  content: "";
  background: linear-gradient(180deg, transparent 8%, rgba(246, 224, 194, .72) 46%, transparent 92%);
  opacity: 0;
  transform: scaleY(.1);
}

.hero.is-exposing .hero-exposure::before { animation: exposureSweep .9s var(--ease) both; }
@keyframes exposureSweep { 0% { opacity: 0; transform: scaleY(.1); } 35% { opacity: .72; } 100% { left: 82%; opacity: 0; transform: scaleY(.92); } }

.hero-scrim {
  z-index: 3;
  background:
    /* colonne de texte, à gauche */
    linear-gradient(90deg, rgba(12, 11, 9, .93) 0%, rgba(12, 11, 9, .87) 28%, rgba(12, 11, 9, .66) 46%, rgba(12, 11, 9, .3) 60%, rgba(12, 11, 9, .1) 72%, transparent 84%),
    /* socle bas : cartouche de scène, index, invitation à défiler */
    linear-gradient(0deg, rgba(12, 11, 9, .88) 0%, rgba(12, 11, 9, .58) 17%, rgba(12, 11, 9, .2) 32%, transparent 46%),
    /* voile général, très léger : tient les photographies les plus lumineuses
       sans éteindre le ciel étoilé de la première diapositive */
    linear-gradient(0deg, rgba(12, 11, 9, .12), rgba(12, 11, 9, .12));
}

.hero-content {
  position: relative;
  z-index: 2;
  display: flex;
  width: min(49vw, 715px);
  min-height: max(780px, 100svh);
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 150px 0 145px var(--page-pad);
}

.hero-depth-canvas { display: none; }

.hero-aperture {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  opacity: 0;
  clip-path: inset(0 50%);
  background: rgba(10, 9, 8, .68);
}
.hero.is-aperture .hero-aperture { animation: apertureMoment .82s cubic-bezier(.65, 0, .35, 1) both; }
@keyframes apertureMoment { 0% { opacity: 0; clip-path: inset(0 50%); } 38% { opacity: .7; clip-path: inset(0); } 100% { opacity: 0; clip-path: inset(0); } }

.hero h1,
.hero-seo-line,
.hero-copy,
.hero-message > .eyebrow,
.hero-location,
.hero-scene-title,
.hero-scene-kicker,
.hero-scene-place,
.slide-index,
.scroll-cue {
  /* Halo très doux : garde le texte lisible même si une photographie
     remplacée par la médiathèque est plus claire que les quatre actuelles. */
  text-shadow: 0 1px 14px rgba(9, 8, 6, .55), 0 1px 3px rgba(9, 8, 6, .38);
}

.hero-message {
  --message-x: 0px;
  --message-y: 0px;
  opacity: 1;
  transform: translate3d(var(--message-x), var(--message-y), 0);
  transition: opacity .3s ease, transform .75s cubic-bezier(.2, .75, .2, 1);
  will-change: transform;
}

.hero-message.is-withdrawn { pointer-events: none; }
.hero-message > .eyebrow, .hero-message > .hero-copy { transition: opacity .72s ease, transform .85s var(--ease); }
.hero-message > .eyebrow { transition-delay: .08s; }
.hero-message > .hero-copy { transition-delay: .34s; }
.hero-message.is-withdrawn > .eyebrow, .hero-message.is-withdrawn > .hero-copy { opacity: 0; transform: translateY(9px); }

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--gold-bright);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 3.1px;
  text-transform: uppercase;
}

.eyebrow::before { width: 27px; height: 1px; content: ""; background: currentColor; }
.hero h1 {
  max-width: 610px;
  margin: 33px 0 22px;
  font-family: var(--display);
  font-size: clamp(63px, 7.2vw, 104px);
  font-weight: 400;
  letter-spacing: -4.7px;
  line-height: .91;
}

.hero h1 em { color: var(--gold-bright); font-weight: 400; }
.hero h1 em.is-neutral { color: inherit; }
.hero h1 .hero-line.is-accent { color: var(--gold-bright); }
.hero-seo-line {
  display: block;
  margin: 0 0 17px;
  color: rgba(250, 248, 243, .92);
  font-family: var(--body);
  font-size: clamp(10px, 1vw, 12px);
  font-weight: 500;
  letter-spacing: 2px;
  line-height: 1.65;
  text-transform: uppercase;
  transition: opacity .45s ease, transform .55s var(--ease);
}
.hero-message.is-withdrawn .hero-seo-line { opacity: 0; transform: translateY(5px); }
.hero-line { display: block; overflow: hidden; padding-bottom: .035em; }
.hero-line-inner {
  display: block;
  opacity: 1;
  transform: translateY(0);
  transition: transform 1.02s var(--ease), opacity .75s ease;
  transition-delay: var(--line-delay);
  will-change: transform, opacity;
}

.hero-message.is-withdrawn .hero-line-inner {
  opacity: 0;
  transform: translateY(108%);
  transition-delay: var(--line-exit);
}
.hero-copy {
  max-width: 550px;
  color: rgba(250, 248, 243, .92);
  font-size: clamp(14px, 1.55vw, 17px);
  line-height: 1.95;
}

.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 37px; transition: opacity .35s ease, transform .45s var(--ease); }
.hero.is-copy-changing .hero-actions { opacity: .66; transform: translateY(3px); }
.button {
  position: relative;
  display: inline-flex;
  min-height: 58px;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 0 24px;
  border: 1px solid transparent;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  transition: background .28s ease, color .28s ease, border-color .28s ease, transform .28s ease;
}

.button:hover { transform: translateY(-2px); }
.button.is-magnetic { transform: translate3d(var(--mag-x, 0px), var(--mag-y, 0px), 24px); transition: background .28s ease, color .28s ease, border-color .28s ease, transform .18s ease-out; }
.button-gold { background: var(--gold); color: var(--ink); }
.button-gold:hover { background: var(--gold-bright); }
.button-outline { border-color: rgba(255, 255, 255, .37); background: rgba(255, 255, 255, .025); }
.button-outline:hover { border-color: var(--gold); color: var(--gold); }
.button-dark { border-color: var(--ink); background: var(--ink); color: var(--paper); }
.button-dark:hover { background: #302b23; }
.button svg, .text-link svg { width: 15px; height: 15px; flex: 0 0 auto; }

.hero-location {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 30px;
  color: rgba(250, 248, 243, .7);
  font-size: 11px;
  letter-spacing: .4px;
}

.hero-location svg { width: 15px; height: 15px; color: var(--gold); }

.hero-bottom {
  position: absolute;
  z-index: 2;
  right: var(--page-pad);
  bottom: 42px;
  left: var(--page-pad);
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
}

.scroll-cue {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  color: rgba(250, 248, 243, .7);
  font-size: 9px;
  letter-spacing: 2.2px;
  text-transform: uppercase;
}

.scroll-cue span { position: relative; width: 48px; height: 1px; overflow: hidden; background: rgba(255, 255, 255, .3); }
.scroll-cue span::after {
  position: absolute;
  inset: 0 75% 0 0;
  content: "";
  background: var(--gold);
  animation: sweep 2s infinite ease-in-out;
}

@keyframes sweep { 0% { transform: translateX(-15px); } 100% { transform: translateX(65px); } }
.slide-index { color: rgba(250, 248, 243, .75); font-size: 10px; letter-spacing: 2px; }
.slide-index strong { color: var(--gold); font-weight: 500; }

.hero-scene {
  position: absolute;
  right: var(--page-pad);
  bottom: 128px;
  z-index: 3;
  width: min(330px, 29vw);
  padding: 17px 15px 15px 17px;
  border-left: 1px solid rgba(233, 201, 157, .68);
  color: var(--paper);
  /* Le cartouche tombe hors du dégradé de gauche : il porte son propre fond. */
  background: linear-gradient(90deg, rgba(12, 11, 9, .82), rgba(12, 11, 9, .6));
  backdrop-filter: blur(3px);
}

.hero-scene-kicker { display: flex; align-items: center; gap: 8px; color: var(--gold-bright); font-size: 8px; letter-spacing: 2px; text-transform: uppercase; }
.hero-scene-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--gold-bright); animation: scenePulse 1.8s infinite ease-in-out; }
@keyframes scenePulse { 0%, 100% { opacity: .44; transform: scale(.84); } 50% { opacity: 1; transform: scale(1.14); } }
.hero-scene-title { display: block; margin-top: 11px; font-family: var(--display); font-size: clamp(23px, 2.3vw, 32px); font-weight: 400; line-height: 1.06; }
.hero-scene-place { display: block; margin-top: 8px; color: rgba(250, 248, 243, .88); font-size: 9px; letter-spacing: .65px; }
.hero-scene-copy { transition: opacity .42s ease, transform .56s var(--ease); }
.hero-scene.is-changing .hero-scene-copy { opacity: 0; transform: translateY(7px); }
.hero-scene-progress { display: flex; gap: 7px; margin-top: 17px; }
.hero-scene-step { position: relative; height: 16px; flex: 1; padding: 7px 0; border: 0; background: transparent; cursor: pointer; }
.hero-scene-step::before, .hero-scene-step::after { position: absolute; top: 7px; right: 0; left: 0; height: 2px; content: ""; }
.hero-scene-step::before { background: rgba(250, 248, 243, .29); }
.hero-scene-step::after { background: var(--gold-bright); transform: scaleX(0); transform-origin: left; }
.hero-scene-step.is-current::after { animation: heroSceneProgress var(--hero-slide-duration, 7.5s) linear both; }
@keyframes heroSceneProgress { from { transform: scaleX(0); } to { transform: scaleX(1); } }

.trust-bar {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  padding: 34px var(--page-pad);
  border-bottom: 1px solid var(--line-light);
  background: var(--ink-strong);
}

.trust-item { display: flex; align-items: center; gap: 15px; }
.trust-item svg { width: 22px; height: 22px; color: var(--gold); }
.trust-item strong { display: block; font-size: 11px; font-weight: 600; letter-spacing: .65px; }
.trust-item span { display: block; color: var(--muted-light); font-size: 10px; }

.section { padding: var(--section-pad) var(--page-pad); }
.section-paper { background: var(--paper); color: var(--ink); color-scheme: light; }
.section-ink { background: var(--ink); }
.section-deep { background: var(--ink-strong); }

.section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: clamp(42px, 7vw, 86px);
}

.section-heading-copy { max-width: 730px; }
.section-heading h2, .about-copy h2, .quote-copy h2, .contact-copy h2 {
  margin: 18px 0 0;
  font-family: var(--display);
  font-size: clamp(49px, 6.2vw, 88px);
  font-weight: 400;
  letter-spacing: -2.1px;
  line-height: .98;
}

.section-heading h2 em, .about-copy h2 em, .quote-copy h2 em, .contact-copy h2 em { color: var(--gold); font-weight: 400; }
.section-paper .section-heading h2 em, .section-paper .about-copy h2 em { color: #977044; }
.section-note { max-width: 310px; color: var(--muted-light); font-size: 12px; line-height: 1.95; }
.section-paper .section-note { color: var(--muted-dark); }

.about-layout { display: grid; grid-template-columns: 1fr .9fr; align-items: center; gap: clamp(52px, 10vw, 145px); }
.about-image {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #28231e;
}

.about-image img { width: 100%; height: 100%; object-fit: cover; object-position: 57% center; transition: transform .8s var(--ease); }
.about-image:hover img { transform: scale(1.045); }
.image-label {
  position: absolute;
  right: 18px;
  bottom: 18px;
  left: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px;
  background: rgba(19, 18, 15, .77);
  backdrop-filter: blur(10px);
  color: var(--paper);
  font-size: 9px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.image-label span:last-child { color: var(--gold); }
.about-copy { max-width: 560px; }
.about-copy h2 { margin-bottom: 28px; }
.about-copy p { max-width: 530px; color: var(--muted-dark); font-size: 14px; line-height: 2; }
.about-copy p + p { margin-top: 17px; }
.about-signature { display: flex; align-items: center; gap: 17px; margin-top: 31px; }
.signature-mark { font-family: var(--display); font-size: 38px; font-style: italic; }
.signature-caption { padding-left: 17px; border-left: 1px solid var(--line-dark); font-size: 10px; line-height: 1.7; }
.signature-caption span { display: block; color: var(--muted-dark); }

.story-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.story-card {
  position: relative;
  display: flex;
  min-height: 560px;
  align-items: flex-end;
  overflow: hidden;
  background: #28231e;
  isolation: isolate;
}

.story-card:nth-child(2) { margin-top: 70px; }
.story-card:nth-child(3) { margin-top: 140px; }
.story-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease); }
.story-card:hover img { transform: scale(1.07); }
.story-card::after { position: absolute; inset: 0; z-index: 0; content: ""; background: linear-gradient(0deg, rgba(12, 11, 9, .9), transparent 63%); }
.story-content { position: relative; z-index: 1; width: 100%; padding: 28px; }
.story-number { color: var(--gold); font-size: 10px; letter-spacing: 2px; }
.story-content h3 { margin: 12px 0 7px; font-family: var(--display); font-size: 45px; font-weight: 400; line-height: 1; }
.story-content p { min-height: 44px; color: rgba(250, 248, 243, .75); font-size: 12px; }
.story-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 21px; padding-top: 18px; border-top: 1px solid var(--line-light); }
.story-footer span { color: var(--gold-bright); font-size: 10px; letter-spacing: .6px; }
.story-footer svg { width: 19px; height: 19px; }

.gallery-manifesto {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 28px;
  margin-bottom: 35px;
  padding: 26px 0 22px;
  border-top: 1px solid var(--line-dark);
  border-bottom: 1px solid var(--line-dark);
}

.gallery-manifesto-copy { display: flex; align-items: flex-end; gap: 19px; }
.gallery-edition { color: #93704c; font-size: 9px; letter-spacing: 1.9px; text-transform: uppercase; }
.gallery-manifesto-copy strong { font-family: var(--display); font-size: clamp(34px, 5vw, 61px); font-weight: 400; line-height: .88; }
.gallery-manifesto-copy strong em { color: #93704c; font-weight: 400; }
.gallery-manifesto-copy span:last-child { max-width: 148px; padding-bottom: 4px; color: var(--muted-dark); font-size: 9px; line-height: 1.7; }
.gallery-mode-list { display: flex; align-items: center; gap: 7px; padding-bottom: 3px; }
.gallery-mode {
  display: inline-flex;
  min-height: 37px;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--muted-dark);
  font-size: 9px;
  cursor: pointer;
}

.gallery-mode svg { width: 15px; height: 15px; }
.gallery-mode[aria-pressed="true"] { border-color: rgba(19, 18, 15, .22); color: var(--ink); }
.portfolio-tools { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 18px; margin-bottom: 25px; }
.filter-list { display: flex; flex-wrap: wrap; gap: 7px; }
.filter-button {
  display: inline-flex;
  min-height: 38px;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid transparent;
  background: transparent;
  color: rgba(19, 18, 15, .64);
  font-size: 10px;
  cursor: pointer;
}

.filter-button[aria-pressed="true"] { border-color: rgba(19, 18, 15, .24); color: var(--ink); }
.filter-count { color: #93704c; font-size: 8px; }
.photo-count { color: var(--muted-dark); font-size: 9px; letter-spacing: 1.1px; white-space: nowrap; }
.gallery-exhibit { position: relative; }
.gallery-exhibit::before, .gallery-exhibit::after {
  position: absolute;
  left: -14px;
  z-index: 1;
  width: 6px;
  height: 6px;
  border: 1px solid #93704c;
  content: "";
  transform: rotate(45deg);
}

.gallery-exhibit::before { top: 0; }
.gallery-exhibit::after { bottom: 0; }

.portfolio-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-flow: dense;
  grid-auto-rows: clamp(105px, 13vw, 172px);
  gap: 10px;
  transition: gap .35s var(--ease);
}

.portfolio-card {
  position: relative;
  grid-column: span 4;
  grid-row: span 2;
  margin: 0;
  overflow: hidden;
  background: #d8d1c5;
  cursor: zoom-in;
}

.portfolio-card.wide { grid-column: span 8; }
.portfolio-card.portrait { grid-column: span 4; grid-row: span 3; }
.portfolio-card.cinema { grid-column: span 12; grid-row: span 3; }
.portfolio-card.short { grid-row: span 1; }
.portfolio-card.hidden { display: none; }
.portfolio-card::before {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 1;
  color: rgba(255, 255, 255, .92);
  content: attr(data-frame);
  font-size: 8px;
  letter-spacing: 1.3px;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .65);
}

.portfolio-card::after {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 1;
  color: rgba(255, 255, 255, .88);
  content: attr(data-label);
  font-size: 7px;
  letter-spacing: 1.2px;
  text-shadow: 0 1px 8px rgba(0, 0, 0, .65);
  text-transform: uppercase;
}

.portfolio-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .85s var(--ease), filter .4s ease; }
.portfolio-card:hover img, .portfolio-card:focus-visible img { transform: scale(1.055); }
.portfolio-card figcaption {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  padding: 48px 17px 15px;
  background: linear-gradient(0deg, rgba(0, 0, 0, .72), transparent);
  color: white;
  font-family: var(--display);
  font-size: clamp(19px, 2.2vw, 27px);
  line-height: 1.12;
  opacity: 0;
  transform: translateY(5px);
  transition: opacity .35s ease, transform .35s var(--ease);
}

.portfolio-card:hover figcaption, .portfolio-card:focus-visible figcaption { opacity: 1; transform: none; }
.portfolio-grid.is-contact-sheet { grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-rows: clamp(105px, 11vw, 145px); gap: 5px; }
.portfolio-grid.is-contact-sheet .portfolio-card,
.portfolio-grid.is-contact-sheet .portfolio-card.wide,
.portfolio-grid.is-contact-sheet .portfolio-card.portrait,
.portfolio-grid.is-contact-sheet .portfolio-card.cinema { grid-column: span 1; grid-row: span 1; }
.portfolio-grid.is-contact-sheet .portfolio-card::before { top: 8px; left: 8px; font-size: 7px; }
.portfolio-grid.is-contact-sheet .portfolio-card::after { display: none; }
.portfolio-grid.is-contact-sheet .portfolio-card figcaption { padding: 22px 8px 8px; font-size: 14px; }
.gallery-signature { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 18px; color: var(--muted-dark); font-size: 8px; letter-spacing: 1.15px; text-transform: uppercase; }
.gallery-signature i { width: 34px; height: 1px; background: #93704c; }
.portfolio-footer { display: flex; justify-content: center; margin-top: 45px; }

.cinema-break {
  position: relative;
  min-height: 680px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  text-align: center;
  isolation: isolate;
}

.cinema-break img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.cinema-break::before { position: absolute; inset: 0; z-index: -1; content: ""; background: rgba(12, 11, 9, .55); }
.quote-copy { max-width: 900px; padding: 90px 25px; }
.quote-copy h2 { margin-top: 19px; font-size: clamp(60px, 8.6vw, 119px); }
.quote-copy p { margin-top: 28px; color: rgba(250, 248, 243, .81); font-size: 13px; }

.pricing-intro { max-width: 780px; margin: 17px auto 35px; color: var(--muted-light); text-align: center; }
.pricing-guide {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  max-width: 990px;
  margin: 0 auto 34px;
  border: 1px solid var(--line-light);
  background: var(--line-light);
}
.pricing-guide-item {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 12px;
  min-height: 68px;
  padding: 14px 18px;
  background: #11100e;
}
.pricing-guide-item strong { color: var(--gold-bright); font-family: var(--display); font-size: 25px; font-weight: 400; line-height: 1; }
.pricing-guide-item span { color: var(--muted-light); font-size: 9px; line-height: 1.55; letter-spacing: .5px; text-transform: uppercase; }
.pricing-guide-arrow { color: var(--gold); font-size: 17px; }
.pricing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.pricing-card {
  position: relative;
  display: flex;
  min-height: 690px;
  flex-direction: column;
  padding: 35px 30px 28px;
  border: 1px solid var(--line-light);
  background: rgba(255, 255, 255, .025);
  overflow: hidden;
}

.pricing-card.featured { border-color: rgba(214, 173, 120, .64); background: linear-gradient(150deg, rgba(214, 173, 120, .105), transparent 65%); }
.pricing-card.cinema { background: linear-gradient(150deg, rgba(214, 173, 120, .14), rgba(255, 255, 255, .015) 54%); }
.pricing-card::after { position: absolute; top: 0; right: 0; left: 0; height: 2px; content: ""; background: rgba(255, 255, 255, .12); }
.pricing-card.featured::after { background: linear-gradient(90deg, transparent, var(--gold), transparent); }
.pricing-card.cinema::after { height: 3px; background: var(--gold); }
.pricing-badge { position: absolute; top: 0; right: 21px; padding: 6px 10px; background: var(--gold); color: var(--ink); font-size: 8px; letter-spacing: .7px; text-transform: uppercase; }
.pricing-category { color: var(--gold); font-size: 9px; letter-spacing: 2px; text-transform: uppercase; }
.pricing-card h3 { margin: 16px 0 4px; font-family: var(--display); font-size: 42px; font-weight: 400; line-height: 1; }
.pricing-duration { min-height: 34px; color: var(--muted-light); font-size: 11px; }
.pricing-price { margin-top: 20px; font-family: var(--display); font-size: 69px; line-height: 1; }
.pricing-price span { font-size: 30px; }
.pricing-promise { min-height: 62px; margin: 18px 0 0; color: var(--paper); font-family: var(--display); font-size: 23px; line-height: 1.14; }
.coverage-label { display: flex; justify-content: space-between; gap: 10px; margin-top: 23px; color: rgba(250, 248, 243, .48); font-size: 8px; letter-spacing: 1px; text-transform: uppercase; }
.coverage-track { position: relative; height: 3px; margin: 9px 0 15px; background: rgba(255, 255, 255, .13); }
.coverage-track span { position: absolute; inset: 0 auto 0 0; width: var(--coverage); background: var(--gold); }
.coverage-track span::after { position: absolute; top: 50%; right: -4px; width: 8px; height: 8px; border-radius: 50%; background: var(--gold-bright); content: ""; transform: translateY(-50%); box-shadow: 0 0 0 4px rgba(214, 173, 120, .13); }
.pricing-moments { min-height: 43px; color: rgba(250, 248, 243, .72); font-size: 10px; line-height: 1.65; }
.pricing-added { min-height: 52px; margin-top: 16px; padding: 11px 12px; border-left: 2px solid var(--gold); background: rgba(214, 173, 120, .07); color: rgba(250, 248, 243, .84); font-size: 9px; line-height: 1.55; }
.pricing-added strong { display: block; margin-bottom: 2px; color: var(--gold-bright); font-size: 8px; letter-spacing: 1px; text-transform: uppercase; }
.pricing-list { display: grid; gap: 11px; margin: 20px 0 24px; padding: 0; list-style: none; }
.pricing-list li { display: flex; align-items: flex-start; gap: 10px; color: rgba(250, 248, 243, .8); font-size: 11px; }
.pricing-list li::before { margin-top: 1px; content: "✓"; color: var(--gold); }
.pricing-fit { margin: 0 0 22px; padding-top: 15px; border-top: 1px solid var(--line-light); color: var(--muted-light); font-size: 10px; line-height: 1.65; }
.pricing-fit strong { color: var(--paper); font-size: 9px; letter-spacing: 1px; text-transform: uppercase; }
.pricing-card .button { margin-top: auto; }
.pricing-card .button-outline { min-height: 51px; }

.capsule-callout {
  position: relative;
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  align-items: center;
  gap: clamp(32px, 7vw, 90px);
  margin-top: 26px;
  padding: clamp(31px, 5vw, 61px);
  border: 1px solid rgba(214, 173, 120, .48);
  background: linear-gradient(115deg, rgba(214, 173, 120, .13), rgba(255, 255, 255, .025));
  overflow: hidden;
}
.capsule-callout::after { position: absolute; top: -80px; right: -55px; width: 210px; height: 210px; border: 1px solid rgba(214, 173, 120, .18); border-radius: 50%; content: ""; }
.capsule-mark { color: var(--gold-bright); font-family: var(--display); font-size: clamp(57px, 8vw, 106px); line-height: .78; }
.capsule-mark span { display: block; margin-top: 18px; color: var(--muted-light); font-family: var(--body); font-size: 8px; letter-spacing: 2px; text-transform: uppercase; }
.footer-client { color: var(--gold-bright); }

.pricing-note {
  max-width: 760px;
  margin: clamp(26px, 4vw, 42px) auto 0;
  padding: 18px 22px;
  border: 1px solid rgba(214, 173, 120, .34);
  background: rgba(214, 173, 120, .07);
  color: rgba(250, 248, 243, .84);
  font-size: 14px;
  line-height: 1.75;
  text-align: center;
}

.pricing-note strong { color: var(--gold-bright); font-weight: 600; }

.capsule-copy { position: relative; z-index: 1; }
.capsule-copy .eyebrow { display: block; margin-bottom: 12px; }
.capsule-copy h3 { margin: 0; font-family: var(--display); font-size: clamp(34px, 4.2vw, 57px); font-weight: 400; line-height: .98; }
.capsule-copy p { max-width: 610px; margin: 17px 0 22px; color: rgba(250, 248, 243, .74); font-size: 11px; line-height: 1.85; }

.session-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 45px; }
.session-card { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 24px 19px; border: 1px solid var(--line-light); }
.session-card strong { display: block; font-family: var(--display); font-size: 26px; font-weight: 400; line-height: 1.08; }
.session-card small { display: block; margin-top: 9px; color: var(--muted-light); font-size: 10px; line-height: 1.75; }
.session-price { white-space: nowrap; color: var(--gold-bright); font-family: var(--display); font-size: 28px; }

.process-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(30px, 5vw, 80px); }
.process-card { position: relative; padding-top: 22px; border-top: 1px solid var(--line-dark); }
.process-number { color: #977044; font-size: 11px; letter-spacing: 1.7px; }
.process-card h3 { margin: 22px 0 11px; font-family: var(--display); font-size: 39px; font-weight: 400; line-height: 1; }
.process-card p { color: var(--muted-dark); font-size: 12px; line-height: 1.9; }

.faq-layout { display: grid; grid-template-columns: .85fr 1.15fr; align-items: start; gap: clamp(42px, 8vw, 125px); }
.faq-intro { position: sticky; top: 120px; }
.faq-intro p { max-width: 385px; margin-top: 24px; color: var(--muted-light); font-size: 12px; line-height: 1.95; }
.faq-list { border-top: 1px solid var(--line-light); }
.faq-item { border-bottom: 1px solid var(--line-light); }
.faq-item summary { position: relative; padding: 24px 32px 24px 0; cursor: pointer; list-style: none; font-size: 13px; font-weight: 500; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { position: absolute; top: 24px; right: 3px; content: "+"; color: var(--gold); font-size: 21px; line-height: 1; }
.faq-item[open] summary::after { content: "−"; }
.faq-item p { margin: 0 0 22px; padding-right: 28px; color: var(--muted-light); font-size: 12px; line-height: 1.95; }

.local-copy { max-width: 760px; margin: 0 auto; text-align: center; }
.local-copy h2 { margin: 16px 0 20px; font-family: var(--display); font-size: clamp(40px, 5.5vw, 69px); font-weight: 400; line-height: 1.04; }
.local-copy p { color: var(--muted-dark); font-size: 12px; line-height: 2; }
.city-list { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 31px; }
.city-list span { padding: 7px 12px; border: 1px solid var(--line-dark); font-size: 9px; letter-spacing: .4px; }

.contact-layout { display: grid; grid-template-columns: 1fr .84fr; align-items: start; gap: clamp(50px, 10vw, 150px); }
.contact-copy h2 { max-width: 610px; }
.contact-copy > p { max-width: 440px; margin: 25px 0 32px; color: var(--muted-light); font-size: 13px; line-height: 2; }
.contact-direct { display: grid; gap: 13px; }
.contact-direct a { display: inline-flex; align-items: center; gap: 11px; width: fit-content; font-size: 12px; }
.contact-direct svg { width: 17px; height: 17px; color: var(--gold); }
.contact-hours { margin-top: 26px; color: rgba(250, 248, 243, .62); font-size: 10px; }

.contact-form { display: grid; gap: 18px; padding-top: 6px; }
.form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.field { display: grid; gap: 7px; }
.field label { color: rgba(250, 248, 243, .74); font-size: 10px; letter-spacing: .25px; }
.field input, .field select, .field textarea {
  width: 100%;
  padding: 12px 13px;
  border: 1px solid rgba(255, 255, 255, .19);
  border-radius: 0;
  background: rgba(255, 255, 255, .032);
  color: var(--paper);
  font-size: 12px;
  transition: border-color .25s ease, background .25s ease;
}

.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--gold); background: rgba(255, 255, 255, .055); outline: 0; }
.field select option { background: var(--ink); }
.field textarea { min-height: 105px; resize: vertical; }
.form-note { color: rgba(250, 248, 243, .61); font-size: 9px; line-height: 1.8; }
.form-feedback { min-height: 20px; color: var(--gold-bright); font-size: 11px; }

.footer { display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 32px var(--page-pad); border-top: 1px solid var(--line-light); background: var(--ink-strong); }
.footer-copy { color: rgba(250, 248, 243, .66); font-size: 10px; }
.footer-links { display: flex; align-items: center; gap: 19px; }
.footer-links a { color: var(--muted-light); font-size: 10px; transition: color .2s ease; }
.footer-links a:hover { color: var(--gold); }

.floating-cta {
  position: fixed;
  right: 23px;
  bottom: 20px;
  z-index: 80;
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding: 12px 16px;
  border: 1px solid rgba(214, 173, 120, .42);
  background: rgba(19, 18, 15, .92);
  backdrop-filter: blur(12px);
  color: var(--gold-bright);
  font-size: 10px;
  box-shadow: 0 12px 35px rgba(0, 0, 0, .26);
}

.floating-cta svg { width: 16px; height: 16px; }
.floating-cta { transition: opacity .3s ease, transform .35s var(--ease), visibility .3s; }
.floating-cta.is-parked { opacity: 0; visibility: hidden; transform: translateY(120%); }
.mobile-booking { display: none; }

.lightbox {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: grid;
  place-items: center;
  padding: 55px 25px;
  background: rgba(9, 8, 7, .94);
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s ease, visibility .25s;
}

.lightbox.is-open { opacity: 1; visibility: visible; }
.lightbox img { max-width: min(1100px, 83vw); max-height: 79vh; object-fit: contain; opacity: 0; transform: perspective(1300px) translateZ(-150px) rotateX(7deg) scale(.78); filter: blur(7px); transition: opacity .52s ease, transform .75s var(--ease), filter .55s ease; }
.lightbox.is-open img { opacity: 1; transform: perspective(1300px) translateZ(0) rotateX(0) scale(1); filter: blur(0); }
.lightbox-close { position: absolute; top: 19px; right: 21px; width: 43px; height: 43px; border: 1px solid var(--line-light); background: transparent; font-size: 23px; cursor: pointer; }
.lightbox-counter { position: absolute; top: 31px; left: 25px; color: var(--gold-bright); font-size: 9px; letter-spacing: 1.7px; }
.lightbox-nav { position: absolute; top: 50%; width: 48px; height: 48px; border: 1px solid var(--line-light); background: rgba(15, 14, 12, .52); cursor: pointer; transform: translateY(-50%); }
.lightbox-nav:hover { border-color: rgba(214, 173, 120, .72); color: var(--gold-bright); }
.lightbox-nav svg { width: 20px; height: 20px; }
.lightbox-prev { left: 24px; }
.lightbox-next { right: 24px; }
.lightbox-caption { position: absolute; right: 20px; bottom: 20px; left: 20px; color: rgba(250, 248, 243, .84); text-align: center; font-family: var(--display); font-size: 22px; line-height: 1.2; }

.film-section {
  position: relative;
  padding-block: clamp(96px, 13vw, 165px);
  overflow: hidden;
  background: #0b0a09;
}

.depth-orbit {
  position: absolute;
  top: 3%;
  right: -15vw;
  z-index: 0;
  width: min(74vw, 980px);
  aspect-ratio: 1;
  perspective: 1100px;
  pointer-events: none;
  opacity: .48;
}
.depth-orbit { display: none; }
.depth-orbit span { position: absolute; inset: 9%; border: 1px solid rgba(214, 173, 120, .2); border-radius: 50%; transform-style: preserve-3d; animation: orbit3d 19s linear infinite; }
.depth-orbit span:nth-child(1) { transform: rotateX(67deg) rotateZ(0deg); }
.depth-orbit span:nth-child(2) { inset: 23%; border-color: rgba(250, 248, 243, .13); animation-duration: 13s; animation-direction: reverse; transform: rotateY(65deg) rotateZ(32deg); }
.depth-orbit span:nth-child(3) { inset: 36%; border-color: rgba(214, 173, 120, .32); animation-duration: 9s; transform: rotateX(57deg) rotateY(28deg); }
@keyframes orbit3d { to { transform: rotateX(67deg) rotateY(360deg) rotateZ(360deg); } }
.film-heading, .invisible-manifesto, .film-track, .film-controls, .invisible-close { position: relative; z-index: 1; }

.film-heading { padding-inline: var(--page-pad); }
.film-heading .section-heading { margin-bottom: 52px; }
.invisible-manifesto {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr);
  align-items: end;
  gap: clamp(30px, 7vw, 100px);
  margin: 0 var(--page-pad) 58px;
  padding: clamp(28px, 5vw, 58px) 0;
  border-top: 1px solid var(--line-light);
  border-bottom: 1px solid var(--line-light);
}
.invisible-manifesto blockquote { margin: 0; font-family: var(--display); font-size: clamp(39px, 6vw, 82px); font-weight: 400; line-height: .96; }
.invisible-manifesto blockquote em { color: var(--gold-bright); font-weight: 400; }
.invisible-manifesto-copy { max-width: 430px; color: rgba(250, 248, 243, .7); font-size: 11px; line-height: 1.95; }
.invisible-manifesto-copy strong { display: block; margin-bottom: 12px; color: var(--paper); font-family: var(--display); font-size: 25px; font-weight: 400; line-height: 1.2; }
.film-track {
  display: flex;
  gap: 18px;
  overflow-x: auto;
  padding: 0 var(--page-pad) 17px;
  scroll-snap-type: x mandatory;
  scrollbar-color: var(--gold) rgba(255, 255, 255, .12);
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.film-track::-webkit-scrollbar { height: 2px; }
.film-track::-webkit-scrollbar-thumb { background: var(--gold); }
.film-frame {
  position: relative;
  flex: 0 0 min(73vw, 770px);
  min-height: clamp(365px, 54vw, 565px);
  scroll-snap-align: start;
  overflow: hidden;
  background: #27231e;
  isolation: isolate;
  transform-style: preserve-3d;
  will-change: transform, opacity;
  transition: transform .24s ease-out, opacity .24s ease;
}

.film-frame img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease); }
.film-frame:hover img { transform: scale(1.045); }
.film-frame::after { position: absolute; inset: 0; z-index: -1; content: ""; background: linear-gradient(0deg, rgba(7, 6, 5, .84), transparent 62%); }
.film-perspective { position: absolute; top: 18px; right: 18px; left: 18px; display: flex; justify-content: space-between; gap: 12px; color: rgba(250, 248, 243, .74); font-size: 8px; letter-spacing: 1.4px; text-transform: uppercase; }
.film-perspective span:last-child { color: var(--gold-bright); text-align: right; }
.film-frame-copy { position: absolute; right: 26px; bottom: 25px; left: 26px; }
.film-frame-copy span { color: var(--gold-bright); font-size: 9px; letter-spacing: 2.2px; text-transform: uppercase; }
.film-frame-copy h3 { margin: 8px 0 5px; font-family: var(--display); font-size: clamp(32px, 5vw, 55px); font-weight: 400; line-height: 1; }
.film-frame-copy p { max-width: 480px; margin: 0; color: rgba(250, 248, 243, .78); font-size: 11px; }
.film-controls { display: flex; justify-content: flex-end; gap: 10px; margin: 20px var(--page-pad) 0; }
.film-control { display: grid; width: 43px; height: 43px; place-items: center; border: 1px solid var(--line-light); background: transparent; cursor: pointer; }
.film-control:hover { border-color: var(--gold); color: var(--gold); }
.invisible-close { display: grid; justify-items: center; gap: 21px; max-width: 780px; margin: clamp(58px, 8vw, 96px) auto 0; padding-inline: var(--page-pad); text-align: center; }
.invisible-close p { margin: 0; font-family: var(--display); font-size: clamp(35px, 5vw, 61px); line-height: 1; }
.invisible-close p em { color: var(--gold-bright); font-weight: 400; }
.chapter-method { position: relative; z-index: 1; max-width: 1160px; margin: clamp(58px, 8vw, 98px) auto 0; padding-inline: var(--page-pad); }
.chapter-method-head { display: grid; grid-template-columns: 1.05fr .95fr; align-items: end; gap: clamp(28px, 6vw, 78px); margin-bottom: 31px; }
.chapter-method-head h3 { max-width: 720px; margin: 10px 0 0; font-family: var(--display); font-size: clamp(42px, 6vw, 76px); font-weight: 400; line-height: .94; }
.chapter-method-head h3 em { color: var(--gold-bright); font-weight: 400; }
.chapter-method-head p { max-width: 450px; margin: 0; color: rgba(250, 248, 243, .72); font-size: 11px; line-height: 1.9; }
.chapter-method-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--line-light); }
.chapter-method-step { position: relative; min-height: 230px; padding: 28px; overflow: hidden; }
.chapter-method-step + .chapter-method-step { border-left: 1px solid var(--line-light); }
.chapter-method-step::after { position: absolute; right: -20px; bottom: -45px; color: rgba(214, 173, 120, .07); content: attr(data-step); font-family: var(--display); font-size: 150px; line-height: 1; }
.chapter-method-step span { color: var(--gold-bright); font-size: 8px; letter-spacing: 2px; text-transform: uppercase; }
.chapter-method-step strong { position: relative; z-index: 1; display: block; margin: 31px 0 10px; font-family: var(--display); font-size: 33px; font-weight: 400; line-height: 1; }
.chapter-method-step p { position: relative; z-index: 1; max-width: 270px; margin: 0; color: rgba(250, 248, 243, .68); font-size: 10px; line-height: 1.8; }
.chapter-method-action { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 19px; color: rgba(250, 248, 243, .6); font-size: 9px; }

.is-tilting {
  transform: perspective(1500px) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg)) translate3d(0, -2px, 8px) !important;
  transform-style: preserve-3d;
  transition: transform .2s ease-out !important;
  will-change: transform;
}
.tilt-3d-shine { position: absolute; inset: -1px; z-index: 8; pointer-events: none; opacity: 0; background: linear-gradient(112deg, transparent 35%, rgba(255, 244, 221, .09) 49%, transparent 63%); transform: translateX(calc((var(--shine-x, 50%) - 50%) * .12)); transition: opacity .4s ease; }
.is-tilting .tilt-3d-shine { opacity: .72; }
.story-card.is-tilting .story-content, .pricing-card.is-tilting > :not(.tilt-3d-shine), .capsule-callout.is-tilting > :not(.tilt-3d-shine), .estimate-panel.is-tilting > :not(.tilt-3d-shine), .chapter-method-step.is-tilting > :not(.tilt-3d-shine) { transform: translateZ(12px); }
.pricing-card > :not(.tilt-3d-shine), .capsule-callout > :not(.tilt-3d-shine), .estimate-panel > :not(.tilt-3d-shine), .story-content, .moment-result-copy, .image-label, .portfolio-card figcaption { transition: transform .28s ease; }

.experience-section { position: relative; overflow: hidden; }
.experience-layout { display: grid; grid-template-columns: .86fr 1.14fr; align-items: center; gap: clamp(44px, 8vw, 118px); }
.experience-copy .section-heading { margin-bottom: 22px; }
.experience-copy > p { max-width: 455px; color: var(--muted-dark); font-size: 12px; line-height: 1.95; }
.moment-list { display: grid; gap: 9px; margin-top: 29px; }
.moment-choice {
  display: flex;
  min-height: 63px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 15px;
  border: 1px solid rgba(19, 18, 15, .17);
  background: transparent;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
  transition: border-color .23s ease, background .23s ease;
}

.moment-choice:hover, .moment-choice[aria-pressed="true"] { border-color: rgba(151, 112, 68, .76); background: rgba(151, 112, 68, .07); }
.moment-choice strong { display: block; font-size: 11px; font-weight: 600; }
.moment-choice small { display: block; color: var(--muted-dark); font-size: 9px; }
.moment-choice span:last-child { color: #977044; font-size: 14px; }
.moment-result { position: relative; min-height: 610px; overflow: hidden; background: #28231e; isolation: isolate; }
.moment-result img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: opacity .26s ease, transform .6s var(--ease); }
.moment-result.is-changing img { opacity: .33; transform: scale(1.03); }
.moment-result::after { position: absolute; inset: 0; z-index: -1; content: ""; background: linear-gradient(0deg, rgba(9, 8, 7, .9), transparent 63%); }
.moment-result-copy { position: absolute; right: 28px; bottom: 30px; left: 28px; color: var(--paper); }
.moment-result-copy > span { color: var(--gold-bright); font-size: 9px; letter-spacing: 1.7px; text-transform: uppercase; }
.moment-result-copy h3 { margin: 12px 0 8px; font-family: var(--display); font-size: clamp(40px, 5.5vw, 68px); font-weight: 400; line-height: .98; }
.moment-result-copy p { max-width: 490px; color: rgba(250, 248, 243, .8); font-size: 11px; line-height: 1.8; }
.moment-result-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 20px; }
.moment-result-price { color: var(--gold-bright); font-family: var(--display); font-size: 28px; white-space: nowrap; }

.honest-proof { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 26px; margin-top: 73px; padding-top: 35px; border-top: 1px solid var(--line-dark); }
.honest-proof-item strong { display: block; font-family: var(--display); font-size: 29px; font-weight: 400; line-height: 1; }
.honest-proof-item span { display: block; margin-top: 7px; color: var(--muted-dark); font-size: 10px; }

.estimate-section { position: relative; overflow: hidden; }
.estimate-layout { display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; gap: clamp(48px, 9vw, 128px); }
.estimate-copy .section-heading { margin-bottom: 19px; }
.estimate-copy > p { max-width: 455px; color: var(--muted-dark); font-size: 12px; line-height: 1.95; }
.estimate-promise { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 26px; }
.estimate-promise span { padding: 7px 10px; border: 1px solid var(--line-dark); color: var(--muted-dark); font-size: 9px; }
.estimate-panel { position: relative; padding: clamp(23px, 4vw, 40px); background: var(--ink-strong); color: var(--paper); overflow: hidden; }
.estimate-panel-kicker { display: block; color: var(--gold-bright); font-size: 9px; letter-spacing: 1.8px; text-transform: uppercase; }
.estimate-label { display: block; margin: 25px 0 10px; color: rgba(250, 248, 243, .77); font-size: 10px; }
.estimate-services { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.estimate-choice { min-height: 70px; padding: 12px; border: 1px solid var(--line-light); background: transparent; text-align: left; cursor: pointer; transition: border-color .22s ease, background .22s ease; }
.estimate-choice[aria-pressed="true"] { border-color: var(--gold); background: var(--gold-soft); }
.estimate-choice strong { display: block; font-size: 10px; font-weight: 500; }
.estimate-choice span { display: block; margin-top: 4px; color: var(--muted-light); font-size: 9px; }
.estimate-variants { display: flex; flex-wrap: wrap; gap: 8px; }
.estimate-variants[data-service="mariage"] { display: grid; grid-template-columns: 1fr; }
.estimate-variant { min-height: 37px; padding: 8px 11px; border: 1px solid var(--line-light); background: transparent; color: var(--paper); font-size: 9px; cursor: pointer; }
.estimate-variants[data-service="mariage"] .estimate-variant { display: flex; min-height: 58px; align-items: center; justify-content: space-between; gap: 16px; padding: 11px 13px; text-align: left; }
.estimate-variant strong { font-size: 10px; font-weight: 500; }
.estimate-variant span { color: var(--muted-light); font-size: 8px; letter-spacing: 1px; text-align: right; text-transform: uppercase; }
.estimate-variant[aria-pressed="true"] { border-color: var(--gold); background: var(--gold-soft); color: var(--gold-bright); }
.estimate-result { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin-top: 26px; padding-top: 21px; border-top: 1px solid var(--line-light); }
.estimate-result-label { display: block; color: var(--muted-light); font-size: 9px; }
.estimate-formula { display: block; margin-top: 5px; color: var(--paper); font-size: 10px; letter-spacing: 1.3px; text-transform: uppercase; }
.estimate-amount { display: block; margin-top: 6px; color: var(--gold-bright); font-family: var(--display); font-size: 54px; font-weight: 400; line-height: .95; }
.estimate-detail { max-width: 175px; margin: 0; color: var(--muted-light); text-align: right; font-size: 9px; line-height: 1.75; }
.estimate-panel > .button { width: 100%; margin-top: 22px; }
.estimate-footnote { margin: 13px 0 0; color: rgba(250, 248, 243, .56); font-size: 9px; line-height: 1.75; }

.film-frame { cursor: pointer; }
.film-frame:focus-visible { outline: 2px solid var(--gold); outline-offset: -5px; }
.film-controls { align-items: center; justify-content: space-between; }
.film-immersive-hint { color: rgba(250, 248, 243, .68); font-size: 9px; letter-spacing: .4px; }
.film-arrows { display: flex; gap: 10px; }
body.story-open { overflow: hidden; }
.immersive-story { position: fixed; inset: 0; z-index: 320; display: grid; place-items: center; padding: 18px; background: rgba(9, 8, 7, .95); opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s; }
.immersive-story.is-open { opacity: 1; visibility: visible; }
.immersive-screen { position: relative; width: min(100%, 475px); height: min(850px, calc(100svh - 36px)); overflow: hidden; background: #24211e; }
.immersive-screen > img { width: 100%; height: 100%; object-fit: cover; }
.immersive-screen::after { position: absolute; inset: 0; content: ""; background: linear-gradient(0deg, rgba(8, 7, 6, .89), transparent 58%, rgba(8, 7, 6, .54)); pointer-events: none; }
.immersive-progress { position: absolute; top: 12px; right: 13px; left: 13px; z-index: 2; display: flex; gap: 5px; }
.immersive-progress span { height: 2px; flex: 1; background: rgba(255, 255, 255, .36); }
.immersive-progress span.active { background: var(--gold-bright); }
.immersive-top { position: absolute; top: 24px; right: 13px; left: 15px; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--paper); font-size: 9px; letter-spacing: 1.1px; }
.immersive-close { display: grid; width: 39px; height: 39px; place-items: center; border: 1px solid rgba(255, 255, 255, .36); background: rgba(8, 7, 6, .3); color: var(--paper); font-size: 21px; cursor: pointer; }
.immersive-zone { position: absolute; top: 75px; bottom: 150px; z-index: 1; width: 38%; border: 0; background: transparent; cursor: pointer; }
.immersive-prev { left: 0; }
.immersive-next { right: 0; }
.immersive-copy { position: absolute; right: 22px; bottom: 23px; left: 22px; z-index: 2; color: var(--paper); }
.immersive-copy > span { color: var(--gold-bright); font-size: 9px; letter-spacing: 1.5px; text-transform: uppercase; }
.immersive-copy h3, .immersive-copy .immersive-story-title { margin: 11px 0 8px; color: var(--paper); font-family: var(--display); font-size: clamp(41px, 8vw, 58px); font-weight: 400; line-height: .98; }
.immersive-copy p:not(.immersive-story-title) { margin: 0 0 15px; color: rgba(250, 248, 243, .76); font-size: 10px; line-height: 1.8; }
.immersive-actions { display: flex; align-items: center; gap: 9px; }
.immersive-actions .button { min-height: 46px; flex: 1; padding-inline: 13px; }
.immersive-share { display: grid; width: 46px; height: 46px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(255, 255, 255, .37); background: rgba(8, 7, 6, .3); color: var(--paper); cursor: pointer; }
.immersive-share svg { width: 18px; height: 18px; }
.immersive-status { min-height: 14px; margin-top: 8px; color: rgba(250, 248, 243, .75); font-size: 9px; }
.mobile-booking-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.booking-backdrop { position: fixed; inset: 0; z-index: 250; background: rgba(8, 7, 6, .67); opacity: 0; visibility: hidden; transition: opacity .28s ease, visibility .28s; }
.booking-panel {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 260;
  width: min(100%, 475px);
  overflow-y: auto;
  padding: 31px 29px max(29px, env(safe-area-inset-bottom));
  border-left: 1px solid var(--line-light);
  background: var(--ink-strong);
  transform: translateX(102%);
  transition: transform .38s var(--ease);
}

body.booking-open { overflow: hidden; }
.booking-open .booking-backdrop { opacity: 1; visibility: visible; }
.booking-open .booking-panel { transform: none; }
.booking-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }
.booking-close { display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; border: 1px solid var(--line-light); background: transparent; font-size: 23px; cursor: pointer; }
.booking-panel h2 { margin: 31px 0 10px; font-family: var(--display); font-size: 59px; font-weight: 400; letter-spacing: -1.3px; line-height: .96; }
.booking-panel h2 em { color: var(--gold); font-weight: 400; }
.booking-panel > p { color: var(--muted-light); font-size: 11px; line-height: 1.85; }
.booking-label { display: block; margin: 24px 0 9px; color: rgba(250, 248, 243, .76); font-size: 10px; letter-spacing: .5px; }
.booking-services { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.booking-service { min-height: 64px; padding: 10px; border: 1px solid var(--line-light); background: transparent; text-align: left; cursor: pointer; }
.booking-service[aria-pressed="true"] { border-color: var(--gold); background: var(--gold-soft); }
.booking-service strong { display: block; font-size: 10px; }
.booking-service span { display: block; color: var(--muted-light); font-size: 9px; }
.booking-date { width: 100%; min-height: 49px; padding: 10px 12px; border: 1px solid var(--line-light); background: rgba(255, 255, 255, .035); color: var(--paper); }
.booking-actions { display: grid; gap: 9px; margin-top: 24px; }
.booking-actions .button { min-height: 52px; }
.booking-actions .button[hidden] { display: none; }
.booking-or { position: relative; margin: 22px 0; color: var(--muted-light); text-align: center; font-size: 9px; }
.booking-or::before, .booking-or::after { position: absolute; top: 50%; width: 42%; height: 1px; content: ""; background: var(--line-light); }
.booking-or::before { left: 0; }
.booking-or::after { right: 0; }
.booking-small { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px; border: 1px solid var(--line-light); color: var(--paper); font-size: 10px; }
.booking-footnote { margin-top: 18px; color: rgba(250, 248, 243, .61); font-size: 9px; line-height: 1.8; }
.booking-date-note { display: block; min-height: 36px; margin-top: 9px; color: var(--muted-light); font-size: 9px; line-height: 1.7; }
.booking-date-note.is-selected { color: var(--gold-bright); }
.booking-secondary-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 9px; }
.booking-secondary-actions .booking-small { min-height: 44px; text-align: center; }
.booking-secondary-actions button { background: transparent; cursor: pointer; }

.proof-section { position: relative; overflow: hidden; }
.proof-layout { display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; gap: clamp(48px, 9vw, 125px); }
.proof-copy > p { max-width: 480px; margin: 23px 0 29px; color: var(--muted-dark); font-size: 12px; line-height: 1.95; }
.proof-links { display: flex; flex-wrap: wrap; gap: 10px; }
.proof-evidence { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.proof-evidence-item { min-height: 152px; padding: 22px; border: 1px solid var(--line-dark); }
.proof-evidence-item strong { display: block; color: #8a643d; font-family: var(--display); font-size: 42px; font-weight: 400; line-height: 1; }
.proof-evidence-item span { display: block; margin-top: 11px; color: var(--muted-dark); font-size: 10px; line-height: 1.75; }

.service-directory { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; max-width: 860px; margin: 38px auto 0; text-align: left; }
.service-directory a { display: flex; min-height: 69px; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 17px; border: 1px solid var(--line-dark); font-size: 10px; transition: background .2s ease, border-color .2s ease; }
.service-directory a:hover { border-color: #977044; background: rgba(151, 112, 68, .06); }
.service-directory a span:last-child { color: #8a643d; font-family: var(--display); font-size: 22px; }
.privacy-line { display: flex; gap: 10px; align-items: flex-start; color: rgba(250, 248, 243, .75); font-size: 10px; line-height: 1.8; }
.privacy-line input { width: 15px; height: 15px; flex: 0 0 auto; margin-top: 2px; accent-color: var(--gold); }
.bot-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

.contact-mode { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.contact-mode-option { position: relative; }
.contact-mode-option input { position: absolute; opacity: 0; }
.contact-mode-option span { display: flex; min-height: 42px; align-items: center; justify-content: center; gap: 7px; border: 1px solid var(--line-light); color: var(--paper); font-size: 10px; cursor: pointer; }
.contact-mode-option input:checked + span { border-color: var(--gold); background: var(--gold-soft); color: var(--gold-bright); }
.contact-mode-option input:focus-visible + span { outline: 2px solid var(--gold); outline-offset: 3px; }

html.motion-ready .reveal { opacity: 0; transform: translate3d(0, 34px, 0); transform-origin: center top; transition: opacity .86s ease, transform 1.08s var(--ease); }
html.motion-ready .reveal.visible { opacity: 1; transform: translate3d(0, 0, 0); }
.reveal-delay-1 { transition-delay: .13s; }
.reveal-delay-2 { transition-delay: .25s; }

html.motion-ready .motion-item {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
  transform-origin: center top;
  transition: opacity .72s ease var(--motion-delay, 0ms), transform .96s var(--ease) var(--motion-delay, 0ms);
}
html.motion-ready .motion-item.is-in-view { opacity: 1; transform: translate3d(0, 0, 0); }
.motion-section { position: relative; }
.section-scan { position: absolute; top: clamp(30px, 5vw, 70px); left: var(--page-pad); z-index: 15; width: clamp(46px, 7vw, 92px); height: 1px; pointer-events: none; opacity: .68; background: linear-gradient(90deg, var(--gold-bright), transparent); transform: scaleX(0); transform-origin: left; }
.motion-section.is-in-view > .section-scan { animation: sectionScan 1.15s var(--ease) .16s both; }
@keyframes sectionScan { to { transform: scaleX(1); } }
.site-parallax { scale: 1.012; will-change: translate; transition: translate .18s linear; }
h2.site-parallax { scale: 1; }

/* Révélation couture : la photographie apparaît comme un tirage que l’on découvre. */
.couture-media { position: relative; overflow: hidden; isolation: isolate; }
.couture-veil {
  position: absolute;
  inset: -1px;
  z-index: 12;
  pointer-events: none;
  background: linear-gradient(90deg, #15120f 0%, #201a15 76%, #b48958 99.5%, #ead4b8 100%);
  transform: scaleX(1);
  transform-origin: right;
  transition: transform 1.18s var(--ease) var(--develop-delay, 0ms);
}
.couture-media.is-developed .couture-veil { transform: scaleX(0); }
.couture-media > img { transition: transform 1.7s var(--ease), filter 1.35s ease; }
.couture-media:not(.is-developed) > img { transform: scale(1.035); filter: saturate(.72) contrast(1.04); }
.couture-media.is-developed > img { transform: scale(1); filter: none; }
html.motion-ready .couture-title {
  clip-path: inset(0 0 104% 0);
  transform: translateY(20px);
  transition: clip-path 1.08s var(--ease), transform 1.08s var(--ease);
}
html.motion-ready .couture-title.is-typeset { clip-path: inset(-8% 0 -8% 0); transform: translateY(0); }

/* Les longues sections restent légères tant qu’elles sont hors écran. */
/* Filet de sécurité : si le script ne répond pas, le contenu redevient visible. */
html.motion-ready.motion-timeout .reveal,
html.motion-ready.motion-timeout .motion-item { opacity: 1 !important; transform: none !important; }
html.motion-ready.motion-timeout .couture-title { clip-path: none !important; transform: none !important; }

/* content-visibility retiré : il empêchait les titres atteints par une ancre de se révéler. */
html.low-power .page-aura, html.low-power .depth-orbit { display: none; }
html.low-power .motion-item { filter: none; }
html.low-power .site-parallax { will-change: auto; }

/* Mouvement éditorial Fievrelama — discret, tactile et photographique. */
html.luxury-motion .art-cursor,
html.luxury-motion .page-aura,
html.luxury-motion .depth-orbit,
html.luxury-motion .tilt-3d-shine { display: none !important; }
html.luxury-motion .is-tilting,
html.luxury-motion .button.is-magnetic { transform: none !important; }
html.luxury-motion main > section:not(.hero) {
  --section-wash: rgba(180, 137, 89, .62);
  overflow: clip;
}
html.luxury-motion main > section:not(.hero)::after {
  position: absolute;
  right: var(--page-pad);
  bottom: 0;
  left: var(--page-pad);
  z-index: 2;
  height: 1px;
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, transparent, var(--section-wash), transparent);
  opacity: 0;
  transform: scaleX(.08);
  transition: opacity 1.1s ease .25s, transform 1.8s var(--ease) .25s;
}
html.luxury-motion main > section.is-in-view:not(.hero)::after { opacity: .42; transform: scaleX(1); }
html.luxury-motion .section-scan {
  top: clamp(28px, 4vw, 58px);
  width: clamp(34px, 4vw, 62px);
  opacity: .46;
  background: linear-gradient(90deg, transparent, var(--gold-bright), transparent);
  transform: translateX(-18px) scaleX(0);
}
html.luxury-motion .motion-section.is-in-view > .section-scan { animation: luxuryRule 1.65s var(--ease) .12s both; }
@keyframes luxuryRule { 55% { transform: translateX(0) scaleX(1); } 100% { transform: translateX(18px) scaleX(.55); opacity: .22; } }

html.luxury-motion .motion-item {
  filter: blur(7px);
  transform: translate3d(0, 30px, 0);
  transition: opacity 1s ease var(--motion-delay, 0ms), filter 1.25s ease var(--motion-delay, 0ms), transform 1.35s var(--ease) var(--motion-delay, 0ms);
}
html.luxury-motion .motion-item.is-in-view { filter: blur(0); transform: translate3d(0, 0, 0); }
html.luxury-motion .couture-veil {
  background: linear-gradient(96deg, #11100e 0%, #17130f 72%, #9c744c 99.3%, #f0dfc8 100%);
  transition-duration: 1.55s;
}
html.luxury-motion .couture-media > img { transition-duration: 2.15s, 1.8s; }
html.luxury-motion .couture-title { transition-duration: 1.35s; }
html.luxury-motion .hero-slide.is-active .hero-slide-image,
html.luxury-motion .hero-slide.is-active::before { animation: luxuryBreath 9s cubic-bezier(.2,.7,.2,1) both; }
@keyframes luxuryBreath {
  from { transform: scale(calc(var(--hero-zoom, 1) * 1.045)); filter: saturate(.9); }
  to { transform: scale(var(--hero-zoom, 1)); filter: saturate(1); }
}
html.luxury-motion .hero-line-inner { transition-duration: 1.12s; }
html.luxury-motion .hero h1 { text-wrap: balance; }
html.luxury-motion .portfolio-card img,
html.luxury-motion .story-card img,
html.luxury-motion .film-frame img { transition: transform 1.45s var(--ease), filter 1.1s ease; }
@media (hover: hover) and (pointer: fine) {
  html.luxury-motion .portfolio-card:hover img,
  html.luxury-motion .story-card:hover img,
  html.luxury-motion .film-frame:hover img { transform: scale(1.025); filter: saturate(.92) contrast(1.02); }
}
html.luxury-motion .button { overflow: hidden; isolation: isolate; }
html.luxury-motion .button::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  content: "";
  background: linear-gradient(105deg, transparent 26%, rgba(255,255,255,.18) 48%, transparent 70%);
  transform: translateX(-130%);
  transition: transform .95s var(--ease);
}
html.luxury-motion .button:hover::after { transform: translateX(130%); }

@media (max-width: 820px) {
  html.luxury-motion .motion-item { filter: blur(3px); transform: translate3d(0, 18px, 0); }
  html.luxury-motion .hero-slide.is-active .hero-slide-image { animation-duration: 7s; }
  html.luxury-motion main > section:not(.hero)::after { right: 21px; left: 21px; }
}

@media (max-width: 1120px) {
  :root { --page-pad: clamp(22px, 5vw, 68px); }
  .desktop-nav { gap: 17px; }
  .nav-link { font-size: 10px; }
  .header-cta { padding-inline: 12px; }
  .story-card { min-height: 495px; }
  .story-content { padding: 20px; }
  .pricing-card { padding-inline: 20px; }
}

@media (max-width: 820px) {
  :root { --header-height: 76px; --section-pad: clamp(78px, 13vw, 118px); }
  .desktop-nav, .header-cta { display: none; }
  .menu-toggle { display: block; }
  .hero, .hero-content { min-height: 100svh; }
  .hero-slide {
    --hero-focus: var(--hero-focus-m, var(--hero-focus-d, 50% 40%));
    --hero-zoom: var(--hero-zoom-m, var(--hero-zoom-d, 1));
  }
  .hero-slides { transform: scale(1.025); }
  .hero-message { transform: none; }
  .hero-depth-canvas { opacity: .46; }
  /* Les repères sont exprimés en pixels depuis le bas : la hauteur du hero
     dépasse celle de l'écran, des pourcentages ne tomberaient pas au bon endroit. */
  .hero-scrim {
    background:
      linear-gradient(0deg,
        rgba(12, 11, 9, .88) 0,
        rgba(12, 11, 9, .84) 140px,
        rgba(12, 11, 9, .8) 420px,
        rgba(12, 11, 9, .74) 700px,
        rgba(12, 11, 9, .5) 810px,
        rgba(12, 11, 9, .22) 910px,
        rgba(12, 11, 9, .1) 100%),
      linear-gradient(180deg, rgba(12, 11, 9, .4) 0, rgba(12, 11, 9, .2) 120px, transparent 250px),
      linear-gradient(0deg, rgba(12, 11, 9, .06), rgba(12, 11, 9, .06));
  }
  .hero-content {
    width: 100%;
    justify-content: flex-start;
    padding: max(49svh, 370px) var(--page-pad) 145px;
  }
  .hero h1 { max-width: 620px; font-size: clamp(62px, 9vw, 84px); }
  .hero-scene { top: 116px; right: var(--page-pad); bottom: auto; width: min(250px, 58vw); padding: 11px 11px 11px 12px; }
  .hero-scene-title { font-size: clamp(21px, 4.6vw, 30px); }
  .hero-scene-place { font-size: 8px; }
  .hero-scene-progress { margin-top: 11px; }
  .trust-bar { grid-template-columns: 1fr; gap: 20px; padding-block: 25px; }
  .about-layout, .faq-layout, .contact-layout { grid-template-columns: 1fr; }
  .about-layout { gap: 42px; }
  .about-image { max-width: 590px; aspect-ratio: 5 / 5; }
  .about-copy { max-width: none; }
  .section-heading { align-items: flex-start; flex-direction: column; margin-bottom: 44px; }
  .story-grid { grid-template-columns: 1fr; gap: 14px; }
  .story-card, .story-card:nth-child(2), .story-card:nth-child(3) { min-height: 540px; margin-top: 0; }
  .story-content { padding: 27px; }
  .gallery-manifesto { grid-template-columns: 1fr; gap: 20px; }
  .gallery-mode-list { justify-content: flex-start; }
  .portfolio-grid.is-contact-sheet { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .pricing-guide { grid-template-columns: 1fr; gap: 0; border-inline: 0; }
  .pricing-guide-item { border-bottom: 1px solid var(--line-light); }
  .pricing-guide-item:last-child { border-bottom: 0; }
  .pricing-grid, .session-grid { grid-template-columns: 1fr; }
  .pricing-card { min-height: auto; padding: 31px 25px; }
  .pricing-promise, .pricing-moments, .pricing-added { min-height: 0; }
  .pricing-list { margin-bottom: 25px; }
  .capsule-callout { grid-template-columns: 1fr; }
  .experience-layout { grid-template-columns: 1fr; gap: 40px; }
  .estimate-layout { grid-template-columns: 1fr; gap: 38px; }
  .proof-layout { grid-template-columns: 1fr; gap: 37px; }
  .moment-result { min-height: 535px; }
  .honest-proof { grid-template-columns: 1fr; gap: 23px; }
  .process-grid { grid-template-columns: 1fr; gap: 36px; }
  .faq-intro { position: static; }
  .contact-layout { gap: 44px; }
  .floating-cta { display: none; }
  .mobile-booking {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 80;
    display: grid;
    grid-template-columns: 1fr 1.36fr;
    gap: 9px;
    padding: 9px 11px calc(9px + env(safe-area-inset-bottom));
    background: rgba(19, 18, 15, .94);
    backdrop-filter: blur(15px);
    border-top: 1px solid var(--line-light);
  }

  .mobile-booking a { display: flex; min-height: 45px; align-items: center; justify-content: center; gap: 8px; font-size: 10px; }
  .mobile-booking a:first-child { border: 1px solid var(--line-light); }
  .mobile-booking a:last-child { background: var(--gold); color: var(--ink); }
  .mobile-booking svg { width: 15px; height: 15px; }
  .footer { padding-bottom: 106px; }
}

@media (max-width: 560px) {
  :root { --page-pad: 21px; }
  .brand-word { font-size: 28px; }
  .hero-content { padding-top: max(47svh, 355px); padding-bottom: 147px; }
  .hero h1 { max-width: 365px; margin: 17px 0 13px; font-size: clamp(54px, 13.3vw, 71px); letter-spacing: -2.7px; }
  .hero h1.is-compact { max-width: 100%; font-size: clamp(47px, 11.6vw, 62px); letter-spacing: -2px; }
  .hero-seo-line { max-width: 100%; margin-bottom: 12px; font-size: clamp(7px, 2.2vw, 9px); letter-spacing: 1.1px; overflow-wrap: anywhere; }
  .hero-message > .eyebrow { max-width: 100%; gap: 8px; font-size: 7px; letter-spacing: 1.35px; line-height: 1.55; }
  .hero-message > .eyebrow::before { width: 18px; flex: 0 0 18px; }
  .hero-copy { max-width: 345px; font-size: 13px; line-height: 1.72; }
  .hero-scene { top: 103px; width: min(218px, 60vw); }
  .hero-scene-kicker { font-size: 7px; letter-spacing: 1.6px; }
  .hero-scene-title { margin-top: 8px; font-size: 24px; }
  .hero-scene-step { height: 27px; padding: 12px 0; }
  .hero-scene-step::before, .hero-scene-step::after { top: 12px; }
  .hero-scrim {
    background:
      linear-gradient(0deg,
        rgba(12, 11, 9, .9) 0,
        rgba(12, 11, 9, .84) 150px,
        rgba(12, 11, 9, .78) 450px,
        rgba(12, 11, 9, .72) 660px,
        rgba(12, 11, 9, .46) 790px,
        rgba(12, 11, 9, .2) 900px,
        rgba(12, 11, 9, .1) 100%),
      linear-gradient(180deg, rgba(12, 11, 9, .4) 0, rgba(12, 11, 9, .2) 110px, transparent 240px),
      linear-gradient(0deg, rgba(12, 11, 9, .06), rgba(12, 11, 9, .06));
  }
  .eyebrow { font-size: 8px; letter-spacing: 2.2px; }
  .hero-actions { width: 100%; gap: 11px; margin-top: 22px; }
  .hero-actions .button { min-width: 0; max-width: 100%; padding-inline: 12px; }
  #hero-primary-label { line-height: 1.4; white-space: normal; }
  .button { min-height: 53px; padding-inline: 16px; font-size: 9px; }
  .hero-location { margin-top: 20px; font-size: 9px; }
  .hero-bottom { bottom: 100px; }
  .scroll-cue { font-size: 8px; }
  .slide-index { max-width: 56%; font-size: 9px; letter-spacing: 1px; text-align: right; }
  .section-heading h2, .about-copy h2, .contact-copy h2 { font-size: 57px; }
  .story-card { min-height: 460px; }
  .gallery-manifesto { gap: 17px; margin-bottom: 23px; padding: 19px 0 17px; }
  .gallery-manifesto-copy { gap: 12px; }
  .gallery-manifesto-copy strong { font-size: 46px; }
  .gallery-manifesto-copy span:last-child { max-width: 120px; font-size: 8px; }
  .gallery-mode { min-height: 37px; gap: 6px; padding-inline: 8px; font-size: 8px; }
  .portfolio-tools { align-items: flex-start; gap: 12px; margin-bottom: 17px; }
  .filter-list { width: calc(100vw - 42px); flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
  .filter-list::-webkit-scrollbar { display: none; }
  .filter-button { flex: 0 0 auto; padding-inline: 9px; font-size: 9px; }
  .photo-count { padding-left: 2px; font-size: 8px; }
  .gallery-exhibit::before, .gallery-exhibit::after { left: -11px; }
  .portfolio-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 134px; gap: 7px; }
  .portfolio-card, .portfolio-card.wide, .portfolio-card.portrait, .portfolio-card.cinema { grid-column: span 1; grid-row: span 2; }
  .portfolio-card.mobile-wide { grid-column: span 2; }
  .portfolio-card.short { grid-row: span 1; }
  .portfolio-card::before { top: 10px; left: 10px; font-size: 7px; }
  .portfolio-card::after { top: 10px; right: 10px; font-size: 6px; }
  .portfolio-card figcaption { padding: 34px 11px 10px; font-size: 19px; opacity: 1; transform: none; }
  .portfolio-grid.is-contact-sheet { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 118px; gap: 4px; }
  .portfolio-grid.is-contact-sheet .portfolio-card figcaption { font-size: 12px; }
  .gallery-signature { gap: 8px; font-size: 7px; letter-spacing: .7px; }
  .gallery-signature i { width: 17px; }
  .lightbox { padding: 78px 12px; }
  .lightbox img { max-width: 95vw; max-height: 72vh; }
  .lightbox-nav { top: auto; bottom: 31px; width: 40px; height: 40px; transform: none; }
  .lightbox-prev { left: 15px; }
  .lightbox-next { right: 15px; }
  .lightbox-caption { right: 65px; bottom: 39px; left: 65px; font-size: 17px; }
  .cinema-break { min-height: 570px; }
  .quote-copy h2 { font-size: 73px; }
  .film-frame { flex-basis: 83vw; min-height: 440px; }
  .film-frame-copy { right: 17px; bottom: 17px; left: 17px; }
  .invisible-manifesto { grid-template-columns: 1fr; align-items: start; }
  .chapter-method-head, .chapter-method-grid { grid-template-columns: 1fr; }
  .chapter-method-step + .chapter-method-step { border-top: 1px solid var(--line-light); border-left: 0; }
  .chapter-method-action { align-items: flex-start; flex-direction: column; }
  .film-perspective { top: 13px; right: 13px; left: 13px; }
  .moment-result { min-height: 460px; }
  .moment-result-copy { right: 18px; bottom: 21px; left: 18px; }
  .moment-result-footer { align-items: flex-start; flex-direction: column; }
  .booking-panel { padding-inline: 21px; }
  .form-row { grid-template-columns: 1fr; }
  .footer { align-items: flex-start; flex-direction: column; }
  .session-card { gap: 8px; }
  .proof-evidence { grid-template-columns: 1fr 1fr; gap: 8px; }
  .proof-evidence-item { min-height: 130px; padding: 17px; }
  .proof-evidence-item strong { font-size: 36px; }
  .service-directory { grid-template-columns: 1fr; }
  .booking-secondary-actions { grid-template-columns: 1fr; }
  .estimate-panel { padding: 21px 17px; }
  .estimate-choice { min-height: 64px; padding: 10px; }
  .estimate-result { align-items: flex-start; flex-direction: column; }
  .estimate-detail { max-width: none; text-align: left; }
  .estimate-amount { font-size: 48px; }
  .film-immersive-hint { max-width: 180px; }
  .immersive-story { padding: 0; }
  .immersive-screen { width: 100%; height: 100svh; }
  .immersive-copy { bottom: max(20px, env(safe-area-inset-bottom)); }
  .story-open .mobile-booking, .booking-open .mobile-booking { visibility: hidden; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; filter: none; transform: none; }
  .hero-slides, .hero-message, .film-frame, .is-tilting, .button.is-magnetic { transform: none !important; }
  .hero-depth-canvas, .depth-orbit, .hero-aperture, .intro-lens, .art-cursor, .page-aura, .section-scan { display: none; }
  .motion-item, .motion-item.is-in-view { opacity: 1; filter: none; transform: none; }
  .couture-title { clip-path: none; transform: none; }
  .couture-veil { display: none; }
  .site-parallax { translate: none !important; scale: 1 !important; }
}

/* ==========================================================================
   Pages spécialisées (référencement local) — même vocabulaire visuel
   ========================================================================== */

.page-hero {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: min(78vh, 720px);
  padding: calc(var(--header-height) + 90px) var(--page-pad) clamp(56px, 9vw, 110px);
  background: var(--ink-strong);
  overflow: hidden;
}

.page-hero-media { position: absolute; inset: 0; }
.page-hero-media img { width: 100%; height: 100%; object-fit: cover; opacity: .5; }
.page-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(13, 12, 10, .45) 0%, rgba(13, 12, 10, .78) 62%, var(--ink-strong) 100%);
}
.page-hero--plain { min-height: 44vh; }
.page-hero--plain::after { background: none; }

.page-hero-inner { position: relative; z-index: 2; max-width: 860px; }
.page-hero-inner h1 {
  margin: 14px 0 0;
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(38px, 6.4vw, 78px);
  line-height: 1.02;
  letter-spacing: -.015em;
  color: var(--paper-bright);
}
.page-hero-copy {
  max-width: 62ch;
  margin: 22px 0 0;
  font-size: clamp(15px, 1.6vw, 18px);
  line-height: 1.66;
  color: var(--muted-light);
}
.page-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

.page-block { max-width: 74ch; margin: 0 auto; }
.page-block h2 {
  margin: 0 0 20px;
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(28px, 4vw, 46px);
  line-height: 1.1;
}
.page-block p { margin: 0 0 18px; font-size: clamp(15px, 1.5vw, 17px); line-height: 1.75; }
.page-block .city-list { margin-top: 22px; }
.page-content h3 { font-family: var(--display); font-size: clamp(22px, 3vw, 32px); font-weight: 400; }

.page-gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin: 38px auto 0;
  max-width: 1180px;
}
.page-gallery-item { margin: 0; overflow: hidden; cursor: zoom-in; background: rgba(19, 18, 15, .1); }
.page-gallery-item img {
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 1.1s var(--ease), filter .6s ease;
}
.page-gallery-item:hover img,
.page-gallery-item:focus-visible img { transform: scale(1.045); }
.page-gallery-link { margin: 30px 0 0; text-align: center; }

.page-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 18px;
  max-width: 1180px;
  margin: 38px auto 0;
}
.page-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 28px 26px 30px;
  border: 1px solid var(--line-light);
  background: rgba(244, 240, 232, .03);
}
.section-paper .page-card { border-color: var(--line-dark); background: rgba(19, 18, 15, .025); }
.page-card h3 { margin: 0; font-family: var(--display); font-weight: 400; font-size: clamp(24px, 3vw, 32px); }
.page-card-price { font-family: var(--display); font-size: clamp(28px, 3.4vw, 38px); color: var(--gold); }
.page-card-meta { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; opacity: .7; }
.page-card p { margin: 4px 0 auto; font-size: 15px; line-height: 1.65; }
.page-card .button { margin-top: 18px; align-self: flex-start; }

.page-steps { max-width: 74ch; margin: 34px auto 0; padding: 0; list-style: none; counter-reset: fl-step; }
.page-steps li {
  position: relative;
  padding: 0 0 30px 34px;
  border-left: 1px solid var(--line-dark);
}
.section-deep .page-steps li,
.section-ink .page-steps li { border-left-color: var(--line-light); }
.page-steps li::before {
  content: "";
  position: absolute;
  left: -4px;
  top: 9px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--gold);
}
.page-steps h3 { margin: 0 0 8px; font-family: var(--display); font-weight: 400; font-size: clamp(21px, 2.6vw, 27px); }
.page-steps p { margin: 0; font-size: 15px; line-height: 1.7; opacity: .82; }

.page-cta { text-align: center; }
.page-cta .page-hero-actions { justify-content: center; }

@media (max-width: 820px) {
  .page-gallery { grid-template-columns: repeat(2, 1fr); }
  .page-hero { min-height: 68vh; padding-top: calc(var(--header-height) + 60px); }
}

@media (max-width: 520px) {
  .page-gallery { grid-template-columns: 1fr 1fr; gap: 8px; }
  .page-hero-actions .button { width: 100%; justify-content: center; }
}

/* ==========================================================================
   Corrections v1.1
   ========================================================================== */

/* Arrivée sur une ancre : l'en-tête fixe ne recouvre plus le titre. */
main section[id],
main div[id],
.hero { scroll-margin-top: calc(var(--header-height) + 18px); }
body.admin-bar main section[id] { scroll-margin-top: calc(var(--header-height) + 50px); }

.pricing-simulator-link { margin: 18px 0 0; }

/* Portfolio : sélection courte puis galerie complète. */
.portfolio-card.is-beyond-preview { display: none; }
.gallery-expand { display: flex; justify-content: center; margin: 34px 0 0; }
.gallery-expand button {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding: 15px 26px;
  border: 1px solid var(--line-dark);
  background: transparent;
  color: inherit;
  font-family: var(--body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  cursor: pointer;
  transition: border-color .35s ease, background .35s ease, color .35s ease;
}
.section-deep .gallery-expand button,
.section-ink .gallery-expand button { border-color: var(--line-light); }
.gallery-expand button:hover { border-color: var(--gold); background: var(--gold-soft); color: var(--gold); }
.gallery-expand button:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.gallery-expand button::after {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform .35s var(--ease);
}
.gallery-expand button[aria-expanded="true"]::after { transform: rotate(-135deg) translate(-2px, -2px); }

/* Avis vérifiés — n'apparaît que si un avis réel a été saisi. */
.testimonials-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
  max-width: 1180px;
  margin: 36px auto 0;
}
.testimonial {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 28px 26px;
  border: 1px solid var(--line-dark);
  background: rgba(19, 18, 15, .025);
}
.section-deep .testimonial, .section-ink .testimonial { border-color: var(--line-light); background: rgba(244, 240, 232, .03); }
.testimonial blockquote { margin: 0; font-family: var(--display); font-size: clamp(19px, 2.2vw, 24px); line-height: 1.4; }
.testimonial figcaption { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; opacity: .7; }
.testimonial .testimonial-source { font-size: 11px; letter-spacing: .06em; }
.testimonial .testimonial-source a { text-decoration: underline; text-underline-offset: 3px; }

/* Bannière de consentement CookieAdmin — habillée aux couleurs du site.
   Aucun masquage, aucun bouton dissimulé : seuls les styles changent. */
.cookieadmin_law_container {
  max-width: min(430px, calc(100vw - 32px)) !important;
  padding: 22px 24px 20px !important;
  border: 1px solid rgba(214, 173, 120, .34) !important;
  border-radius: 0 !important;
  background: #0d0c0a !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .45) !important;
  color: #f4f0e8 !important;
  font-family: "Manrope", Arial, sans-serif !important;
}
.cookieadmin_law_container * { font-family: inherit !important; color: inherit !important; }
#cookieadmin_notice_title {
  margin: 0 0 10px !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: 25px !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  color: #faf8f3 !important;
}
#cookieadmin_notice, .cookieadmin_notice_con {
  font-size: 12.5px !important;
  line-height: 1.6 !important;
  color: rgba(250, 248, 243, .72) !important;
}
#cookieadmin_notice a { color: #d6ad78 !important; text-decoration: underline !important; text-underline-offset: 3px; }
.cookieadmin_consent_btns { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; margin-top: 16px !important; }
.cookieadmin_law_container .cookieadmin_btn {
  flex: 1 1 auto;
  min-height: 44px;
  padding: 11px 16px !important;
  border-radius: 0 !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  cursor: pointer;
  transition: background .3s ease, border-color .3s ease, color .3s ease;
}
.cookieadmin_law_container .cookieadmin_accept_btn {
  border: 1px solid #d6ad78 !important;
  background: #d6ad78 !important;
  color: #13120f !important;
}
.cookieadmin_law_container .cookieadmin_accept_btn:hover { background: #e9c99d !important; border-color: #e9c99d !important; }
.cookieadmin_law_container .cookieadmin_reject_btn,
.cookieadmin_law_container .cookieadmin_customize_btn {
  border: 1px solid rgba(244, 240, 232, .32) !important;
  background: transparent !important;
  color: #f4f0e8 !important;
}
.cookieadmin_law_container .cookieadmin_reject_btn:hover,
.cookieadmin_law_container .cookieadmin_customize_btn:hover { border-color: #d6ad78 !important; color: #e9c99d !important; }
.cookieadmin_law_container .cookieadmin_btn:focus-visible { outline: 2px solid #e9c99d !important; outline-offset: 3px !important; }
.cookieadmin-poweredby { margin-top: 12px !important; opacity: .38 !important; font-size: 10px !important; }

/* Fenêtre « Personnaliser » */
.cookieadmin_cookie_modal {
  border: 1px solid rgba(214, 173, 120, .3) !important;
  border-radius: 0 !important;
  background: #13120f !important;
  color: #f4f0e8 !important;
  font-family: "Manrope", Arial, sans-serif !important;
}
.cookieadmin_cookie_modal * { color: inherit !important; font-family: inherit !important; }
.cookieadmin_mod_head { border-bottom: 1px solid rgba(244, 240, 232, .12) !important; }
.cookieadmin_preference_title {
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: 24px !important;
  font-weight: 400 !important;
}
.cookieadmin_cookie_modal .cookieadmin_btn { border-radius: 0 !important; letter-spacing: .1em !important; text-transform: uppercase !important; font-size: 10.5px !important; }
.cookieadmin_close_pref { color: #f4f0e8 !important; opacity: .8; }
.cookieadmin_close_pref:focus-visible { outline: 2px solid #e9c99d !important; outline-offset: 2px !important; }

@media (max-width: 640px) {
  .cookieadmin_law_container {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    max-width: 100% !important;
    border-width: 1px 0 0 0 !important;
    padding: 18px 18px calc(18px + env(safe-area-inset-bottom)) !important;
  }
  .cookieadmin_law_container .cookieadmin_btn { flex: 1 1 100%; }
  body.cookieadmin-open .mobile-booking { transform: translateY(120%); }
}

/* Réponse directe en haut des pages spécialisées — lisible d'un coup d'œil,
   et facilement reprise par les moteurs de réponse. */
.page-answer-section { padding-top: clamp(44px, 6vw, 72px); padding-bottom: clamp(44px, 6vw, 72px); }
.page-answer {
  position: relative;
  max-width: 74ch;
  margin: 0 auto;
  padding: 30px 32px 26px;
  border: 1px solid var(--line-dark);
  border-left: 2px solid var(--gold);
  background: rgba(19, 18, 15, .025);
}
.page-answer p {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(19px, 2.2vw, 25px);
  line-height: 1.5;
}
.page-answer-facts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--line-dark);
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  opacity: .75;
}
.page-answer-facts a { color: var(--gold); text-decoration: none; }
.page-answer-facts a:hover { text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 560px) {
  .page-answer { padding: 24px 22px 20px; }
}