/* =========================================================
   TOKENS
   ========================================================= */
:root {
  --noir:      #0e0c13;
  --noir2:     #13111a;
  --noir3:     #1c1924;
  --creme:     #ede8e0;
  --c60:       rgba(237,232,224,.62);
  --c35:       rgba(237,232,224,.35);
  --c15:       rgba(237,232,224,.12);
  --or:        #c9a070;
  --rose:      #c97890;
  --cramoisi:  #a01c1c;
  --page-accent: var(--or);
  --font-serif: 'Cormorant Garamond', Georgia, serif;
  --font-sans:  'DM Sans', -apple-system, sans-serif;
  --nav-h:  70px;
  --max-w:  1060px;
  --gutter: clamp(22px,5vw,56px);
  --ease:   cubic-bezier(.4,0,.2,1);
  --dur:    .3s;
  --s1:6px; --s2:14px; --s3:22px; --s4:32px;
  --s5:48px; --s6:72px; --s7:104px;
}
.accent-gfe    { --page-accent: var(--rose);     }
.accent-domina { --page-accent: var(--cramoisi); }

/* =========================================================
   RESET & BASE
   ========================================================= */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0 }
html { font-size:16px; scroll-behavior:smooth }
body {
  background: var(--noir);
  color: var(--creme);
  font-family: var(--font-sans);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
img  { display:block; max-width:100%; height:auto }
a    { color:inherit; text-decoration:none }
ul   { list-style:none }
button { cursor:pointer; border:none; background:none; font-family:inherit }

/* =========================================================
   NAVIGATION
   ========================================================= */
.site-nav {
  position:fixed;
  top:0; left:0; right:0; z-index:200;
  height:var(--nav-h);
  background: rgba(14,12,19,.97);
  display:flex; align-items:center; justify-content:flex-end;
  padding-inline: var(--gutter);
  transition: background var(--dur) var(--ease), border-color var(--dur);
  border-bottom: 1px solid var(--c15);
}
.nav-logo { display: none; }
.nav-list { display:flex; align-items:center; gap:28px }
.nav-list a {
  font-size:.63rem; font-weight:400;
  letter-spacing:.2em; text-transform:uppercase;
  color:var(--c60);
  cursor:pointer;
  transition:color var(--dur);
  padding-bottom:1px;
  border-bottom:1px solid transparent;
}
.nav-list a:hover { color:var(--creme) }
.nav-list .nav-cta a {
  color:var(--page-accent);
  letter-spacing:.16em;
}
.nav-list a[aria-current="page"] {
  color:var(--creme);
  border-bottom-color:var(--page-accent);
}
.nav-list .nav-cta a[aria-current="page"] {
  color:var(--page-accent);
  border-bottom-color:var(--page-accent);
}
.nav-toggle { display:none; flex-direction:column; gap:5px; width:26px; padding:4px 0 }
.nav-toggle span { display:block; height:1px; background:var(--creme); transition:transform var(--dur) var(--ease),opacity var(--dur) }
.nav-toggle.open span:nth-child(1){ transform:translateY(6px) rotate(45deg) }
.nav-toggle.open span:nth-child(2){ opacity:0 }
.nav-toggle.open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg) }
.nav-backdrop { display:none; position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:150 }
.nav-backdrop.visible { display:block }

.nav-dropdown { position:relative }
.nav-dropdown > a::after { content:' ›'; opacity:.55; font-size:.85em }
.nav-dropdown::before {
  content:'';
  position:absolute; left:0; right:0;
  top:100%; height:16px;
}
.nav-submenu {
  position:absolute; top:calc(100% + 14px); right:0;
  background:rgba(14,12,19,.97); backdrop-filter:blur(16px);
  border:1px solid var(--c15); border-radius:6px;
  min-width:150px; padding:6px 0;
  opacity:0; pointer-events:none;
  transform:translateY(-6px);
  transition:opacity .2s var(--ease), transform .2s var(--ease);
  z-index:210;
}
.nav-dropdown:hover .nav-submenu,
.nav-dropdown:focus-within .nav-submenu {
  opacity:1; pointer-events:auto; transform:translateY(0);
}
.nav-submenu li a {
  display:block; padding:10px 18px;
  white-space:nowrap; border-bottom:none !important;
}

@media(max-width:840px){
  .nav-toggle  { display:flex }
  .nav-links   {
    position:fixed; top:var(--nav-h); right:0; bottom:0;
    width:min(280px,90vw); background:var(--noir2);
    border-left:1px solid var(--c15);
    z-index:190; padding:var(--s5) var(--s4);
    transform:translateX(100%); transition:transform var(--dur) var(--ease);
  }
  .nav-links.open { transform:translateX(0) }
  .nav-list { flex-direction:column; align-items:flex-start; gap:0 }
  .nav-list a { display:block; padding:14px 0; font-size:.72rem; letter-spacing:.14em; border-bottom:1px solid var(--c15); color:var(--c60); width:100% }
  .nav-list a:hover { color:var(--creme) }
  .nav-list .nav-cta a { border-bottom:none; padding-top:20px; font-size:.72rem; color:var(--page-accent) }
}

/* =========================================================
   TYPOGRAPHIE
   ========================================================= */
h1 {
  font-family:var(--font-serif); font-style:italic; font-weight:300;
  font-size:clamp(3rem,8vw,7rem); line-height:1.04; letter-spacing:-.01em;
}
h2 {
  font-family:var(--font-serif); font-style:italic; font-weight:300;
  font-size:clamp(2rem,5vw,3.8rem); line-height:1.15;
}
h3 {
  font-family:var(--font-sans); font-weight:500; font-size:.78rem;
  letter-spacing:.18em; text-transform:uppercase; color:var(--page-accent);
}
p { font-size:.97rem; line-height:1.8; color:var(--c60) }
.lead { font-size:clamp(1rem,2vw,1.18rem); color:var(--c60); line-height:1.85 }
.caption {
  font-family:var(--font-sans); font-size:.65rem; font-weight:400;
  letter-spacing:.16em; text-transform:uppercase; color:var(--c35);
  display:block; margin-bottom:var(--s2);
}

/* =========================================================
   LAYOUT
   ========================================================= */
.container { width:100%; max-width:var(--max-w); margin-inline:auto; padding-inline:var(--gutter) }
.section { padding-block:var(--s7) }
.section-head { margin-bottom:var(--s6) }
.section-head h2 { margin-top:var(--s2) }

.divider {
  width:48px; height:1px; background:var(--page-accent);
  margin:var(--s4) 0;
}
.divider--center { margin-inline:auto }

/* =========================================================
   HÉROS
   ========================================================= */
.hero {
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  text-align:center; position:relative; overflow:hidden;
  padding:var(--s7) var(--gutter);
  background:
    radial-gradient(ellipse 80% 60% at 65% 45%, rgba(150,50,70,.18) 0%, transparent 65%),
    radial-gradient(ellipse 50% 70% at 20% 80%, rgba(100,60,10,.12) 0%, transparent 55%),
    var(--noir);
}
.hero--sm     { min-height:36vh }
.hero--inner  { min-height:36vh }
.hero--gfe {
  background:
    radial-gradient(ellipse 75% 65% at 55% 45%, rgba(180,80,120,.22) 0%, transparent 65%),
    radial-gradient(ellipse 40% 50% at 80% 80%, rgba(120,30,60,.12) 0%, transparent 50%),
    var(--noir);
}
.hero--domina {
  background:
    radial-gradient(ellipse 70% 60% at 60% 40%, rgba(140,20,20,.28) 0%, transparent 65%),
    radial-gradient(ellipse 40% 50% at 20% 70%, rgba(80,0,0,.15) 0%, transparent 50%),
    var(--noir);
}
.hero-content { position:relative; z-index:1; max-width:760px }
.hero-content h1 { margin-bottom:var(--s3) }
.hero-content .lead { margin-bottom:var(--s5) }
.hero-line {
  width:56px; height:1px; background:var(--page-accent);
  margin:var(--s3) auto var(--s4);
}
.hero-actions { display:flex; gap:var(--s3); justify-content:center; flex-wrap:wrap }

/* =========================================================
   BOUTONS
   ========================================================= */
.btn {
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-sans); font-size:.7rem; font-weight:400;
  letter-spacing:.18em; text-transform:uppercase;
  padding:14px 30px;
  transition:all var(--dur) var(--ease);
  cursor:pointer; white-space:nowrap;
  border:1px solid transparent;
}
.btn-gold {
  border-color:var(--or); color:var(--or);
}
.btn-gold:hover { background:rgba(201,160,112,.12) }
.btn-rose {
  border-color:var(--rose); color:var(--rose);
}
.btn-rose:hover { background:rgba(201,120,144,.1) }
.btn-red {
  border-color:var(--cramoisi); color:var(--cramoisi);
}
.btn-red:hover { background:rgba(160,28,28,.1) }
.btn-outline {
  border-color:var(--c35); color:var(--c60);
}
.btn-outline:hover { border-color:var(--creme); color:var(--creme) }

.btn-arrow {
  font-size:.7rem; font-weight:400; letter-spacing:.14em; text-transform:uppercase;
  color:var(--page-accent); padding:0; border:none; background:none;
  display:inline-flex; align-items:center; gap:8px;
  transition:gap var(--dur), color var(--dur);
  cursor:pointer;
}
.btn-arrow:hover { gap:14px }

/* =========================================================
   SECTION ABOUT (2 colonnes)
   ========================================================= */
.about-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(40px,6vw,88px); align-items:center;
}
.about-grid--home {
  grid-template-columns: 40% 60%;
  gap: clamp(var(--s4),4vw,var(--s6));
  align-items: center;
  max-width: 1280px;
  margin: 0 auto;
  padding: clamp(var(--s5),6vw,var(--s7)) clamp(var(--s4),5vw,var(--s6));
}
.about-grid--home-rev {
  grid-template-columns: 60% 40%;
  gap: clamp(var(--s4),4vw,var(--s6));
  align-items: center;
  max-width: 1280px;
  margin: 0 auto;
  padding: clamp(var(--s5),6vw,var(--s7)) clamp(var(--s4),5vw,var(--s6));
}
.about-grid--home .about-text,
.about-grid--home-rev .about-text {
  display:flex; flex-direction:column; justify-content:center;
}
.about-visual {
  aspect-ratio:3/4; border-radius:1px; overflow:hidden; position:relative;
  background:
    radial-gradient(ellipse at 50% 30%, rgba(180,100,80,.2) 0%, transparent 60%),
    var(--noir2);
}
.about-visual--home {
  aspect-ratio: 3/4;
  min-height: unset;
  border-radius: 12px;
  box-shadow:
    0 8px 24px rgba(0,0,0,.55),
    0 24px 60px rgba(0,0,0,.40),
    0 2px 6px rgba(0,0,0,.70);
}
@media (max-width:900px) {
  .about-grid--home,
  .about-grid--home-rev {
    grid-template-columns: 1fr;
    gap: var(--s4);
    padding: var(--s5) var(--s4);
  }
  .about-grid--home .about-visual--home {
    order: -1;
  }
}
@media (max-width:600px) {
  .about-grid--home,
  .about-grid--home-rev {
    padding: var(--s4) var(--s3);
  }
  .about-visual--home {
    aspect-ratio: 4/5;
  }
}
.about-visual::after {
  content:'';
  position:absolute; inset:0;
  background:linear-gradient(to bottom, transparent 55%, rgba(14,12,19,.6) 100%);
}
.about-text { display:flex; flex-direction:column; gap:var(--s3) }
.about-text h2 { margin-top:var(--s2) }
.about-text .divider { margin:var(--s2) 0 var(--s1) }

.photo-link { display:block; width:100%; height:100%; -webkit-tap-highlight-color:transparent; }
.photo-img {
  width:100%; height:100%; object-fit:cover; display:block;
  pointer-events:none;
  user-select:none;
  -webkit-user-drag:none;
  -webkit-touch-callout:none;
  draggable:false;
}

/* =========================================================
   SERVICES
   ========================================================= */
.services-list { display:flex; flex-direction:column; gap:0 }
.service-item {
  display:flex; align-items:flex-start; gap:var(--s5);
  padding:var(--s5) 0;
  border-bottom:1px solid var(--c15);
  transition:border-color var(--dur);
}
.service-item:first-child { border-top:1px solid var(--c15) }
.service-item:hover { border-color:var(--c35) }
.service-num {
  font-family:var(--font-serif); font-style:italic; font-weight:300;
  font-size:2.5rem; color:var(--c15); line-height:1; flex-shrink:0;
  width:60px;
}
.service-body { flex:1 }
.service-body h3 { font-size:.72rem; letter-spacing:.2em; margin-bottom:var(--s3) }
.service-body p { max-width:580px }
.service-arrow { flex-shrink:0; align-self:center }

/* =========================================================
   TARIFS
   ========================================================= */
.tarif-reveal {
  opacity:0;
  transform:translateY(22px);
  transition:opacity .55s var(--ease), transform .55s var(--ease);
}
.tarif-reveal.in {
  opacity:1;
  transform:translateY(0);
}

.tarif-section-head {
  padding:var(--s5) 0 var(--s3);
  border-top:1px solid var(--c15);
  display:flex; align-items:baseline; gap:var(--s3);
}
.tarif-section-head .cat-name {
  font-family:var(--font-serif); font-style:italic; font-weight:300;
  font-size:2rem; color:var(--creme);
}
.tarif-section-head .cat-dot {
  width:6px; height:6px; border-radius:50%; background:var(--page-accent);
  flex-shrink:0; align-self:center;
}

.tarif-row {
  display:flex; align-items:center;
  padding:16px 14px 16px 14px;
  border-bottom:1px solid var(--c15);
  border-radius:6px;
  gap:var(--s4);
  position:relative;
  transition:border-color var(--dur), background .3s, box-shadow .3s, transform .28s var(--ease);
}
.tarif-row::before {
  content:'';
  position:absolute; left:0; top:15%; bottom:15%;
  width:2px; border-radius:1px;
  background:var(--page-accent);
  transform:scaleY(0);
  transform-origin:center;
  transition:transform .28s var(--ease);
}
.tarif-row:hover {
  border-color:var(--c35);
  background:rgba(255,255,255,.03);
  box-shadow:0 6px 24px rgba(0,0,0,.4), 0 1px 4px rgba(0,0,0,.5);
  transform:translateY(-2px);
}
.tarif-row:hover::before { transform:scaleY(1) }
.tarif-row:hover .t-price {
  color:var(--creme);
  text-shadow:0 0 28px rgba(201,160,112,.45);
  transition:color .3s, text-shadow .3s;
}
.tarif-row:hover .t-name {
  color:var(--creme);
  transition:color .3s;
}

.t-duree {
  font-size:.68rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--c35); min-width:110px;
}
.t-name {
  flex:1; font-family:var(--font-serif); font-weight:300;
  font-size:1.2rem; color:var(--creme);
}
.t-price {
  font-family:var(--font-serif); font-style:italic; font-weight:300;
  font-size:1.7rem; color:var(--page-accent); min-width:90px; text-align:right;
}
.t-price .t-unit { font-size:1rem; font-style:normal; color:var(--c35) }

.tarif-domina-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:var(--s4); margin-top:var(--s3);
}
@media(max-width:600px){ .tarif-domina-grid { grid-template-columns:1fr } }

.tarif-domina-col {
  border:1px solid var(--c15); border-radius:10px;
  padding:var(--s4) var(--s3);
  box-shadow: 0 4px 16px rgba(0,0,0,.45), 0 1px 4px rgba(0,0,0,.6);
  transition:border-color var(--dur), transform .28s var(--ease), box-shadow .28s var(--ease);
}
.tarif-domina-col:hover {
  border-color:var(--cramoisi);
  transform:translateY(-4px);
  box-shadow: 0 10px 32px rgba(0,0,0,.55), 0 2px 8px rgba(160,28,28,.25);
}
.tarif-domina-col h4 {
  font-family:var(--font-serif); font-style:italic; font-weight:300;
  font-size:1.1rem; color:var(--creme); margin-bottom:var(--s2);
  letter-spacing:.02em;
}
.tarif-acts {
  display:flex; flex-wrap:wrap; gap:6px;
  padding:0; margin:0 0 var(--s3);
}
.tarif-act {
  font-size:.62rem; letter-spacing:.1em; text-transform:uppercase;
  color:var(--c35); padding:3px 9px;
  border:1px solid var(--c15); border-radius:100px;
}
.tarif-domina-prices { display:flex; flex-direction:column; gap:10px; padding-top:var(--s3) }
.tarif-domina-pick {
  display:flex; align-items:center; gap:var(--s3);
}
.tarif-domina-pick .t-duree { min-width:36px }
.tarif-domina-pick .t-price { font-size:1.35rem; flex:1 }

.tarif-contrat {
  border:1px solid var(--c15); border-radius:10px;
  padding:var(--s4) var(--s4);
  text-align:center;
  box-shadow: 0 4px 16px rgba(0,0,0,.45), 0 1px 4px rgba(0,0,0,.6);
  transition:border-color var(--dur), transform .28s var(--ease), box-shadow .28s var(--ease);
}
.tarif-contrat:hover {
  border-color:var(--or);
  transform:translateY(-4px);
  box-shadow: 0 10px 32px rgba(0,0,0,.55), 0 2px 8px rgba(201,160,112,.2);
}
.tarif-contrat-min {
  font-size:.65rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--c35); margin-bottom:var(--s3);
}
.tarif-contrat-desc {
  font-size:.9rem; color:var(--c60); line-height:1.7;
  max-width:520px; margin:0 auto var(--s3);
}
.tarif-contrat-cta-line {
  font-family:var(--font-serif); font-style:italic; font-weight:300;
  font-size:1.4rem; color:var(--cramoisi);
  margin-bottom:var(--s4);
}

/* =========================================================
   GALERIE
   ========================================================= */
.gallery-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(220px,1fr));
  gap:12px;
  grid-auto-rows:240px;
}
.gallery-item { position:relative; overflow:hidden; border-radius:2px }
.gallery-item.landscape { grid-column:span 2 }
.gallery-item.landscape .gallery-ph { aspect-ratio:16/10 }
.gallery-item.portrait .gallery-ph { aspect-ratio:3/4 }
.gallery-ph {
  display:flex; align-items:flex-end; padding:16px;
  transition:transform .5s var(--ease);
  background-size:cover; background-position:center;
  aspect-ratio:3/4;
}
.gallery-item:hover .gallery-ph { transform:scale(1.04) }
.gallery-ph figcaption {
  font-size:.65rem; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(237,232,224,.6);
  transform:translateY(8px); opacity:0;
  transition:all var(--dur);
}
.gallery-item:hover .gallery-ph figcaption { transform:translateY(0); opacity:1 }

/* =========================================================
   FORMULAIRE
   ========================================================= */
.form-wrap { max-width:620px; margin-inline:auto }

.selection-banner {
  display:none; padding:var(--s3) var(--s4);
  border-left:2px solid var(--page-accent);
  margin-bottom:var(--s4);
  background:rgba(237,232,224,.04);
  font-size:.88rem;
}
.selection-banner strong { color:var(--page-accent) }

.form-group { display:flex; flex-direction:column; gap:8px; margin-bottom:var(--s4) }
.form-group label {
  font-size:.62rem; font-weight:400; letter-spacing:.18em; text-transform:uppercase;
  color:var(--c35);
}
.form-group label .req { color:var(--cramoisi); margin-left:2px }
.form-control {
  width:100%; padding:14px 0;
  border:none; border-bottom:1px solid var(--c35);
  background:transparent;
  font-family:var(--font-sans); font-size:1rem; color:var(--creme);
  transition:border-color var(--dur); appearance:none;
  border-radius:0;
}
.form-control:focus { outline:none; border-bottom-color:var(--page-accent) }
.form-control::placeholder { color:var(--c35) }
textarea.form-control { resize:vertical; min-height:100px }

.radio-group { display:flex; flex-wrap:wrap; gap:8px; margin-top:4px }
.radio-pill input[type="radio"] { display:none }
.radio-pill label {
  display:inline-flex; align-items:center;
  padding:7px 18px;
  border:1px solid var(--c35); font-size:.68rem;
  letter-spacing:.12em; text-transform:uppercase; font-weight:400;
  cursor:pointer; color:var(--c60);
  transition:all var(--dur);
}
.radio-pill input:checked + label {
  border-color:var(--page-accent); color:var(--page-accent);
  background:rgba(201,160,112,.06);
}
.accent-gfe .radio-pill input:checked + label {
  border-color:var(--rose); color:var(--rose); background:rgba(201,120,144,.06);
}
.accent-domina .radio-pill input:checked + label {
  border-color:var(--cramoisi); color:var(--cramoisi); background:rgba(160,28,28,.06);
}
.form-rgpd { font-size:.75rem; color:var(--c35); margin-top:var(--s2) }
.form-rgpd a { color:var(--page-accent); text-decoration:underline; font-size:.75rem }

.form-success {
  display:none; text-align:center; padding:var(--s7) var(--s4);
}
.form-success .suc-icon { font-size:2rem; margin-bottom:var(--s3) }
.form-success h2 { font-size:2rem; margin-bottom:var(--s2) }
.form-success p { color:var(--c60) }
.form-error {
  display:none; margin-top:var(--s4); padding:var(--s3) var(--s4);
  border:1px solid var(--cramoisi); background:rgba(204,2,2,.07);
}
.form-error p { color:var(--c60); margin:0; font-size:.95rem }
.form-error p + p { margin-top:.6em }
.form-error strong { color:var(--creme); font-weight:500 }
.form-error a { color:var(--or); text-decoration:underline }

/* =========================================================
   FAQ
   ========================================================= */
.faq-list { max-width:720px; margin-inline:auto }
.faq-item { border-bottom:1px solid var(--c15); overflow:hidden }
.faq-item:first-child { border-top:1px solid var(--c15) }
.faq-question {
  width:100%; display:flex; align-items:center; justify-content:space-between;
  gap:var(--s4); padding:22px 0; text-align:left;
  font-family:var(--font-sans); font-size:.9rem; font-weight:300;
  color:var(--c60); cursor:pointer;
  transition:color var(--dur);
}
.faq-question:hover { color:var(--creme) }
.faq-icon {
  font-style:normal; flex-shrink:0; color:var(--c35);
  transition:transform var(--dur), color var(--dur);
  font-size:1.1rem; font-weight:300; font-family:var(--font-serif);
}
.faq-item.open .faq-question { color:var(--creme) }
.faq-item.open .faq-icon { transform:rotate(45deg); color:var(--page-accent) }
.faq-answer { max-height:0; overflow:hidden; transition:max-height .38s var(--ease) }
.faq-answer-inner {
  padding:0 0 var(--s4) 44px;
  font-size:.9rem; line-height:1.85; color:var(--c60);
}

/* =========================================================
   CTA BANNER
   ========================================================= */
.cta-banner {
  padding:var(--s7) var(--gutter); text-align:center;
  background:
    radial-gradient(ellipse 70% 60% at 50% 50%, rgba(100,50,20,.15) 0%, transparent 70%),
    var(--noir2);
  border-top:1px solid var(--c15);
  border-bottom:1px solid var(--c15);
}
.cta-banner h2 { margin-bottom:var(--s2) }
.cta-banner p { color:var(--c60); margin-bottom:var(--s5) }
.cta-banner .divider--center { margin-bottom:var(--s5) }

/* =========================================================
   PAGE TEXTE
   ========================================================= */
.page-text { max-width:680px; margin-inline:auto; padding:var(--s7) var(--gutter) }
.page-text h2 {
  font-family:var(--font-serif); font-style:italic; font-weight:300;
  font-size:1.6rem; margin:var(--s5) 0 var(--s2);
  color:var(--creme);
}
.page-text h2:first-of-type { margin-top:0 }
.page-text p, .page-text li { color:var(--c60); font-size:.93rem; margin-bottom:var(--s2) }
.page-text ul { list-style:none }
.page-text ul li::before {
  content:'—'; color:var(--page-accent); margin-right:10px;
}

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer {
  background:rgba(0,0,0,.6);
  border-top:1px solid var(--c15);
  padding:var(--s7) var(--gutter);
}
.footer-inner {
  max-width:var(--max-w); margin-inline:auto;
  display:flex; flex-direction:column; align-items:center; gap:var(--s4);
  text-align:center;
}
.footer-logo {
  font-family:var(--font-serif); font-style:italic; font-weight:300;
  font-size:2rem; color:var(--creme); letter-spacing:.02em;
}
.footer-tagline { font-size:.65rem; letter-spacing:.18em; text-transform:uppercase; color:var(--c35) }
.footer-nav { display:flex; flex-wrap:wrap; justify-content:center; gap:28px }
.footer-nav button {
  font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--c35);
  cursor:pointer; transition:color var(--dur);
}
.footer-nav button:hover { color:var(--creme) }
.footer-copy { font-size:.62rem; letter-spacing:.1em; color:var(--c35) }

/* =========================================================
   UTILITAIRES
   ========================================================= */
.text-center { text-align:center }
.mt-5 { margin-top:var(--s5) }

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media(max-width:768px){
  :root{ --s7:60px; --s6:44px }
  .about-grid { grid-template-columns:1fr }
  .about-visual { aspect-ratio:4/3; order:-1 }
  .hero { min-height:75vh }
  .hero--sm { min-height:48vh }
  .service-item { flex-direction:column; gap:var(--s2) }
  .service-num { font-size:1.6rem; width:auto }
  .tarif-row { flex-wrap:wrap; gap:var(--s2) }
  .t-price { min-width:auto; text-align:left }
}
@media(max-width:480px){
  .hero-actions { flex-direction:column; align-items:center }
  .btn { width:100%; justify-content:center; text-align:center }
}

/* =========================================================
   LIGHTBOX
   ========================================================= */
.lightbox {
  position:fixed; top:0; left:0; right:0; bottom:0; z-index:9999;
  display:flex; align-items:center; justify-content:center;
}
.lightbox-overlay {
  position:absolute; top:0; left:0; right:0; bottom:0;
  background:rgba(0,0,0,.95); cursor:pointer;
}
.lightbox-content {
  position:relative; z-index:10000; max-width:90vw; max-height:90vh;
  display:flex; align-items:center; justify-content:center;
}
#lightbox-img {
  max-width:100%; max-height:90vh; object-fit:contain;
  border-radius:2px; box-shadow:0 20px 60px rgba(0,0,0,.8);
}
.lightbox-close {
  position:absolute; top:20px; right:20px; z-index:10001;
  width:44px; height:44px; border:none; background:rgba(237,232,224,.1);
  color:var(--creme); font-size:32px; cursor:pointer;
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  transition:all .3s; padding:0;
}
.lightbox-close:hover { background:rgba(237,232,224,.2) }
.lightbox-nav {
  position:absolute; z-index:10001; top:50%; transform:translateY(-50%);
  width:50px; height:50px; border:none; background:rgba(237,232,224,.1);
  color:var(--creme); font-size:24px; cursor:pointer; border-radius:2px;
  transition:all .3s; padding:0;
}
.lightbox-prev { left:20px }
.lightbox-next { right:20px }
.lightbox-nav:hover { background:rgba(237,232,224,.2) }
@media(max-width:600px){
  .lightbox-nav { width:40px; height:40px; font-size:20px }
  .lightbox-close { width:36px; height:36px; font-size:28px; top:10px; right:10px }
}

/* =========================================================
   ÉCRAN D'ENTRÉE
   ========================================================= */
body.on-entry { overflow:hidden }
body.on-entry #site-nav { opacity:0; pointer-events:none }
body.on-entry .site-footer { visibility:hidden }

.entry-screen {
  position:fixed;
  top:0; left:0;
  width:100vw; height:100vh;
  z-index:200;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background: var(--noir);
  opacity:1;
  visibility:visible;
  transition:opacity .7s ease, visibility .7s ease;
}
@keyframes kb-entry {
  0%   { transform: scale(1.03) translate(0, 0); }
  100% { transform: scale(1.13) translate(-1.8%, 1.4%); }
}
.entry-screen::before {
  content:'';
  position:absolute; inset:-4%; z-index:0;
  background:
    linear-gradient(rgba(14,12,19,.38), rgba(14,12,19,.60)),
    url('https://vesper31.com/wp-content/uploads/2026/07/vesper-hero-HD.webp') center 22% / cover no-repeat;
  animation: kb-entry 9s ease-in-out infinite alternate;
}
/* Grain sur l'écran d'entrée — dithering qui masque le banding des ombres */
.entry-screen::after {
  content:'';
  position:absolute; inset:0; z-index:0; pointer-events:none;
  opacity:.06;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}
.entry-screen.is-leaving {
  opacity:0;
  visibility:hidden;
}
.entry-content {
  text-align:center; position:relative; z-index:1;
  display:flex; flex-direction:column; align-items:center;
}
.entry-city {
  font-size:.6rem; letter-spacing:.38em; text-transform:uppercase;
  color:var(--c35); margin-bottom:var(--s3);
}
.entry-name {
  font-family:var(--font-serif); font-style:italic; font-weight:300;
  font-size:clamp(5.5rem,16vw,12rem); line-height:1;
  letter-spacing:-.01em; color:var(--creme); margin:0;
}
.entry-line {
  width:52px; height:1px; background:var(--or);
  margin:var(--s4) auto var(--s3);
}
.entry-tagline {
  font-size:.65rem; letter-spacing:.28em; text-transform:uppercase;
  color:var(--c60); margin-bottom:var(--s6);
}
.btn-enter {
  display:inline-block;
  border:1px solid rgba(201,160,112,.45);
  color:var(--or); background:transparent;
  font-family:var(--font-sans); font-size:.63rem;
  letter-spacing:.38em; text-transform:uppercase;
  padding:14px 52px; cursor:pointer;
  text-decoration:none;
  transition:background var(--dur), border-color var(--dur), color var(--dur);
}
.btn-enter:hover {
  background:rgba(201,160,112,.10);
  border-color:var(--or); color:var(--creme);
}


/* Screen-reader only (H1 SEO accueil) */
.sr-only {
  position:absolute; width:1px; height:1px;
  padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;
}


/* CTA sticky mobile */
.sticky-cta { display:none }
@media (max-width:768px) {
  .sticky-cta {
    display:block;
    position:fixed;
    left:50%; transform:translateX(-50%);
    bottom:18px;
    z-index:150;
    background:var(--or);
    color:var(--noir);
    padding:13px 38px;
    font-size:.72rem;
    letter-spacing:.22em;
    text-transform:uppercase;
    text-decoration:none;
    border-radius:999px;
    box-shadow:0 6px 24px rgba(0,0,0,.45);
  }
  body.on-entry .sticky-cta { display:none }
}

/* =========================================================
   REFONTE DESIGN 2026-07-04 — Ken Burns + relief + grain
   (ajouts issus du prototype hors ligne — bloc réversible)
   ========================================================= */

/* Ken Burns permanent sur les grandes photos (boucle inverse via alternate) */
@keyframes kb-photo {
  0%   { transform: scale(1.02) translate(0, 0); }
  100% { transform: scale(1.11) translate(-1.5%, 1.2%); }
}
.photo-img {
  animation: kb-photo 22s ease-in-out infinite alternate;
}
/* Survol : rapprochement + ombre plus profonde du cadre entier */
.about-visual, .about-visual--home {
  transition: transform .6s var(--ease), box-shadow .6s var(--ease);
}
.about-visual--home:hover {
  transform: scale(1.025);
  box-shadow:
    0 12px 30px rgba(0,0,0,.6),
    0 34px 80px rgba(0,0,0,.5),
    0 3px 8px rgba(0,0,0,.75);
}

/* Ken Burns permanent sur la galerie (durées décalées, boucle inverse) */
@keyframes kb-tile {
  0%   { transform: scale(1.06) translate(0, 0); }
  100% { transform: scale(1.15) translate(-1.4%, 1.6%); }
}
.gallery-ph {
  animation: kb-tile 24s ease-in-out infinite alternate;
}
.gallery-item:nth-child(3n)   .gallery-ph { animation-duration: 30s; animation-delay: -8s; }
.gallery-item:nth-child(3n+1) .gallery-ph { animation-duration: 27s; animation-delay: -15s; }

/* Grain photographique subtil sur tout le site */
body::after {
  content: '';
  position: fixed; inset: 0; z-index: 149; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
}

/* Accessibilité : couper les animations si l'utilisateur le demande */
@media (prefers-reduced-motion: reduce) {
  .photo-img, .gallery-ph { animation: none; }
}

/* Bandeau 3 colonnes page GFE — douceur | photo | sans pudeur */
.gfe-trio {
  display:grid; grid-template-columns:1fr 1.05fr 1fr;
  gap:clamp(26px,3.5vw,60px); align-items:center;
  max-width:1180px; margin:0 auto;
  padding:var(--s6) var(--gutter);
}
.gfe-trio .btn-arrow { margin-top:var(--s2) }
@media (max-width:1020px) {
  .gfe-trio { grid-template-columns:1fr }
  .gfe-trio .about-visual--home { order:-1; max-width:420px; width:100%; margin:0 auto }
}
/* Note « sans pudeur » dans la bannière de réservation */
.selection-banner .sp-note {
  font-size:.72rem; color:var(--c35);
  margin-top:10px; letter-spacing:.06em; font-style:normal;
}


/* =======================================================
   AVION BANDEROLE — VACANCES (2026-07-09)
   ======================================================= */
.sky-plane{
  position:fixed; left:0; top:clamp(84px,13vh,150px); z-index:300;
  pointer-events:none; transform:translateX(-780px); will-change:transform;
}
body:not(.on-entry) .sky-plane{animation:sky-cross 55s linear 2.5s infinite}
.sky-plane svg{width:680px; height:auto; display:block; overflow:visible; filter:drop-shadow(0 3px 12px rgba(0,0,0,.65))}
@keyframes sky-cross{
  0%{transform:translateX(-780px)}
  40%{transform:translateX(calc(100vw + 40px))}
  100%{transform:translateX(calc(100vw + 40px))}
}
.plane-bob{animation:plane-bob 4.2s ease-in-out infinite alternate}
@keyframes plane-bob{from{transform:translateY(0)}to{transform:translateY(6px)}}
.ban-wave{animation:ban-wave 2.8s ease-in-out infinite alternate; transform-box:fill-box; transform-origin:100% 50%}
@keyframes ban-wave{from{transform:skewY(1.2deg)}to{transform:skewY(-1deg) translateY(1.5px)}}
.prop-blur{animation:prop-spin .14s linear infinite alternate; transform-box:fill-box; transform-origin:center}
@keyframes prop-spin{from{transform:scaleY(1)}to{transform:scaleY(.25)}}
@media(max-width:768px){.sky-plane{top:clamp(72px,11vh,120px)} .sky-plane svg{width:430px}}
@media(prefers-reduced-motion:reduce){.sky-plane{display:none}}

/* Bannières partenaires (LadyXena, liens réciproques Tescort, SexeModel) */
.footer-partners {
  display:flex; flex-direction:column; align-items:center;
  gap:var(--s2); margin-top:var(--s4);
}
.footer-partner {
  display:inline-block;
  opacity:.72; transition:opacity .3s var(--ease), transform .3s var(--ease);
}
.footer-partner:hover { opacity:1; transform:translateY(-2px) }
.footer-partner img { display:block; border-radius:3px; max-width:100%; height:auto }

.lx-banner {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2px; width:234px; height:60px; box-sizing:border-box;
  border:1px solid var(--c15); border-radius:3px;
  background:linear-gradient(160deg, rgba(160,28,28,.10), rgba(160,28,28,.02));
}
.footer-partner--lx:hover .lx-banner { border-color:var(--cramoisi) }
.lx-banner em {
  font-family:var(--font-serif); font-style:italic; font-weight:400;
  font-size:1.15rem; color:var(--creme); letter-spacing:.02em;
}
.lx-banner small {
  font-size:.55rem; letter-spacing:.14em; text-transform:uppercase; color:var(--c35);
}
/* --- FIX MOBILE 2026-07-19 --- */
@media(max-width:768px){
  .about-visual--home{ aspect-ratio:auto; }
  .about-visual--home .photo-link,
  .about-visual--home .photo-img{ height:auto; }
}
.sky-plane{ transform:none !important; will-change:auto !important; animation:none !important; }
.sky-plane svg{ transform:translateX(-780px); will-change:transform; }
body:not(.on-entry) .sky-plane svg{ animation:sky-cross 55s linear 2.5s infinite; }