@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400;1,600&family=Jost:wght@300;400;500&display=swap');

/* View Transitions — cross-document (placed after @import: an @import
   must precede all other rules or it is dropped and fonts break) */
@view-transition {
  navigation: auto;
}

/* Default transition: fade */
::view-transition-old(root) {
  animation: 0.4s ease-out both fade-and-scale-out;
}
::view-transition-new(root) {
  animation: 0.5s ease-out both fade-and-scale-in;
}

@keyframes fade-and-scale-out {
  from { opacity: 1; transform: scale(1); }
  to   { opacity: 0; transform: scale(0.97); }
}

@keyframes fade-and-scale-in {
  from { opacity: 0; transform: scale(1.03); }
  to   { opacity: 1; transform: scale(1); }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root),
  ::view-transition-new(root) {
    animation: none;
  }
}

/* Custom cursor — hide native on desktop */
body { cursor: none; }
@media (hover: none) {
  body { cursor: auto; }
  #mv-cursor { display: none; }
}

:root {
  /* UN seul fond — la profondeur vient des images et radial-gradients */
  --bg:    #0D0818;
  --night: #0D0818;
  --deep:  #0D0818;
  --mid:   #0D0818;
  --lift:  #0D0818;

  /* Accents lumineux sur certaines sections (radial-gradient, pas background-color) */
  --glow-purple: rgba(60,20,110,.55);
  --glow-rose:   rgba(120,50,100,.25);

  --rose:    #C4A0B8;
  --rose2:   rgba(196,160,184,.3);
  --cream:   #EDE5D4;
  --cream65: rgba(237,229,212,.65);
  --cream35: rgba(237,229,212,.35);
  --b10:     rgba(237,229,212,.10);
  --b25:     rgba(237,229,212,.25);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:auto; font-size:16px; }
body {
  font-family:'Jost',sans-serif;
  font-weight:400;
  background:#0D0818;
  color:var(--cream);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img { display:block; max-width:100%; }
a { text-decoration:none; color:inherit; }

/* ─── TYPOGRAPHIE ─────────────────────────────────────────────── */
h1 {
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:clamp(52px,7vw,96px);
  line-height:.95;
  color:var(--cream);
  letter-spacing:-.01em;
}
h1 em { font-style:italic; color:rgba(237,229,212,.6); }
h2 {
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:clamp(36px,4.5vw,60px);
  line-height:1.05;
  color:var(--cream);
}
h2 em { font-style:italic; }
h3 {
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:clamp(24px,2.5vw,34px);
  color:var(--cream);
  line-height:1.15;
}
p {
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:15px;
  line-height:1.85;
  color:var(--cream65);
}
.kicker {
  font-family:'Jost',sans-serif;
  font-weight:500;
  font-size:11px;
  letter-spacing:.35em;
  text-transform:uppercase;
  color:var(--rose);
  display:block;
  margin-bottom:16px;
}

/* ─── HEADER ──────────────────────────────────────────────────── */
header {
  position:fixed;
  inset:0 0 auto;
  z-index:200;
  height:64px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 48px;
  transition:background .4s, border-color .4s, height .3s;
  border-bottom:1px solid transparent;
}
header.scrolled {
  background:rgba(8,4,26,.93);
  border-color:var(--b10);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  height:56px;
}
.logo {
  display: flex;
  align-items: center;
}

.logo img {
  height: 36px;
  width: auto;
  display: block;
  opacity: 0.88;
  transition: opacity 0.2s ease;
}

.logo img:hover {
  opacity: 1;
}

.logo-text {
  display: none;
}

@media (max-width: 768px) {
  .logo img {
    height: 28px;
  }
}
.nav {
  display:flex;
  align-items:center;
  gap:30px;
}
.nav a {
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(237,229,212,.8);
  transition:color .2s;
}
.nav a:hover, .nav a.active { color:var(--cream); }
.btn-cta {
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:11px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--cream);
  border:1px solid var(--b25);
  padding:9px 22px;
  background:rgba(237,229,212,.05);
  cursor:pointer;
  transition:background .25s, border-color .25s;
  white-space:nowrap;
}
.btn-cta:hover {
  background:rgba(237,229,212,.12);
  border-color:var(--b25);
}
.burger {
  display:none;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
  padding:4px;
}
.burger span {
  width:22px;
  height:1px;
  background:var(--cream);
  transition:all .3s;
  display:block;
}
.burger.open span:nth-child(1) { transform:translateY(6px) rotate(45deg); }
.burger.open span:nth-child(2) { opacity:0; }
.burger.open span:nth-child(3) { transform:translateY(-6px) rotate(-45deg); }
.mobile-nav {
  position:fixed;
  inset:0;
  background:rgba(8,4,26,.97);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:28px;
  z-index:199;
  opacity:0;
  visibility:hidden;
  transition:opacity .35s, visibility .35s;
}
.mobile-nav.open { opacity:1; visibility:visible; }
.mobile-nav a {
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:28px;
  color:var(--cream);
  letter-spacing:.05em;
}

/* ─── HERO 3D — sticky scroll 120vh (inspiré TRON DAO) ─────── */
/* Le "track" : donne 20vh de scroll-room au-delà du 100vh visible */
.hero-track {
  position: relative;
  height: 100vh;
  min-height: 600px;
  background: #070310;
  overflow: hidden;
}
.hero-sticky {
  position: relative;
  height: 100%;
  width: 100%;
  overflow: hidden;
}
/* Canvas : fixed, plein écran, derrière tout */
#hero-canvas-3d {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1;
}
/* Fallback gradient visible DERRIÈRE le canvas */
.hero-fallback {
  position: absolute;
  inset: 0;
  background: #070310;
  z-index: 0;
}
/* Gradient de fond derrière le canvas */
.hero-track::before {
  content: '';
  position: absolute;
  inset: 0;
  background: #070310;
  z-index: 0;
}
/* Mask gradient en bas pour fondre vers bandeau */
.hero-mask-bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 25%;
  background: linear-gradient(to bottom, transparent 0%, var(--night) 100%);
  pointer-events: none;
  z-index: 3;
}
/* Contenu texte */
.hero-content-3d {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 48px 32px 48px;
  pointer-events: none;
}
.hero-content-3d a,
.hero-content-3d .btn-primary,
.hero-content-3d .btn-outline {
  pointer-events: auto;
}

/* Hero kicker, rule, sub, btns : identiques à avant */
.hero-kicker {
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:10px;
  letter-spacing:.48em;
  text-transform:uppercase;
  color:rgba(196,160,184,.75);
  margin-bottom:4px;
}
.hero-rule { display:none; }
.hero-sub {
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-weight:300;
  font-size:clamp(17px,2vw,22px);
  color:rgba(237,229,212,.72);
  line-height:1.55;
  margin-bottom:40px;
  max-width:560px;
}
.hero-btns {
  display:flex;
  gap:14px;
  justify-content:center;
  flex-wrap:wrap;
  margin-top:160px;
}

/* Scroll cue dans le sticky */
.hero-track .scroll-cue {
  position:absolute;
  bottom:40px;
  left:50%;
  transform:translateX(-50%);
  z-index:4;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  animation:cue-pulse 2.5s ease-in-out infinite;
}
.hero-track .scroll-cue span {
  width:1px;
  height:38px;
  background:linear-gradient(to bottom, rgba(237,229,212,.5), transparent);
}

/* Ancien hero : conservé pour les autres pages via .hero classique */
.hero {
  position:relative;
  height:100vh;
  min-height:600px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
  background:var(--night);
}
.hero-bg {
  position:absolute;
  inset:0;
  background-image:url('../assets/images/ciel_etoile.jpg');
  background-size:cover;
  background-position:center;
  filter:brightness(.28) saturate(.6);
  transform:scale(1.12);
  will-change:transform;
}
.hero-nebula {
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse 70% 60% at 12% 65%, rgba(35,15,72,.65) 0%, transparent 60%),
    radial-gradient(ellipse 55% 70% at 88% 20%, rgba(28,12,60,.5) 0%, transparent 55%),
    linear-gradient(to bottom, rgba(8,4,26,.1) 0%, rgba(8,4,26,.5) 70%, rgba(8,4,26,1) 100%);
}
.hero-stars {
  position:absolute;
  inset:0;
  background-image:
    radial-gradient(1px 1px at 8% 12%, rgba(237,229,212,.95) 0%, transparent 100%),
    radial-gradient(1px 1px at 22% 35%, rgba(237,229,212,.65) 0%, transparent 100%),
    radial-gradient(1.5px 1.5px at 65% 7%, rgba(196,160,184,.85) 0%, transparent 100%),
    radial-gradient(1px 1px at 80% 28%, rgba(237,229,212,.55) 0%, transparent 100%),
    radial-gradient(1px 1px at 44% 53%, rgba(237,229,212,.45) 0%, transparent 100%),
    radial-gradient(1px 1px at 93% 17%, rgba(237,229,212,.75) 0%, transparent 100%),
    radial-gradient(1.5px 1.5px at 33% 78%, rgba(196,160,184,.7) 0%, transparent 100%),
    radial-gradient(1px 1px at 57% 91%, rgba(237,229,212,.5) 0%, transparent 100%),
    radial-gradient(1px 1px at 16% 63%, rgba(237,229,212,.4) 0%, transparent 100%),
    radial-gradient(1px 1px at 88% 46%, rgba(237,229,212,.4) 0%, transparent 100%),
    radial-gradient(1px 1px at 50% 21%, rgba(237,229,212,.8) 0%, transparent 100%),
    radial-gradient(1.5px 1.5px at 72% 68%, rgba(196,160,184,.6) 0%, transparent 100%),
    radial-gradient(1px 1px at 5% 82%, rgba(237,229,212,.55) 0%, transparent 100%),
    radial-gradient(1px 1px at 40% 44%, rgba(237,229,212,.35) 0%, transparent 100%),
    radial-gradient(1px 1px at 96% 56%, rgba(196,160,184,.45) 0%, transparent 100%);
}
.hero-content {
  position:relative;
  z-index:2;
  max-width:820px;
  padding:0 32px;
}
.hero-kicker {
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:10px;
  letter-spacing:.48em;
  text-transform:uppercase;
  color:rgba(196,160,184,.75);
  margin-bottom:4px;
}
.hero-rule { display:none; }
.hero-sub {
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-weight:300;
  font-size:clamp(17px,2vw,22px);
  color:rgba(237,229,212,.72);
  line-height:1.55;
  margin-bottom:40px;
}
.hero-btns {
  display:flex;
  gap:14px;
  justify-content:center;
  flex-wrap:wrap;
  margin-top:160px;
}
.btn-primary {
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--cream);
  background:rgba(237,229,212,.1);
  border:1px solid var(--b25);
  padding:13px 32px;
  cursor:pointer;
  transition:background .3s, border-color .3s;
  display:inline-block;
}
.btn-primary:hover {
  background:rgba(237,229,212,.18);
  border-color:rgba(237,229,212,.5);
}
.btn-outline {
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:11px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:rgba(237,229,212,.65);
  background:transparent;
  border:1px solid var(--b10);
  padding:13px 32px;
  cursor:pointer;
  transition:all .3s;
  display:inline-block;
}
.btn-outline:hover {
  border-color:var(--b25);
  color:var(--cream);
}
.scroll-cue {
  position:absolute;
  bottom:32px;
  left:50%;
  transform:translateX(-50%);
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  animation:cue-pulse 2.5s ease-in-out infinite;
}
.scroll-cue span {
  width:1px;
  height:38px;
  background:linear-gradient(to bottom, rgba(237,229,212,.5), transparent);
}
@keyframes cue-pulse {
  0%,100% { opacity:.4; transform:translateX(-50%) translateY(0); }
  50% { opacity:.9; transform:translateX(-50%) translateY(8px); }
}

/* ─── BANDEAU ──────────────────────────────────────────────────── */
.bandeau {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  background:#0D0818;
  border-top:1px solid rgba(237,229,212,.08);
  border-bottom:1px solid rgba(237,229,212,.08);
}
.bnd {
  padding:34px 20px;
  text-align:center;
  border-right:1px solid var(--b10);
}
.bnd:last-child { border-right:none; }
.bnd-val {
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:42px;
  line-height:1;
  color:var(--cream);
  margin-bottom:8px;
}
.bnd-lbl {
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(237,229,212,.55);
}

/* ─── APPROCHE ─────────────────────────────────────────────────── */
.approche {
  display:grid;
  grid-template-columns:1fr 1.55fr;
  min-height:540px;
  background: radial-gradient(ellipse 80% 60% at 60% 50%, rgba(40,15,80,.4) 0%, transparent 70%), #0D0818;
}
.approche-img {
  position:relative;
  overflow:hidden;
  background:var(--night);
  min-height:400px;
}
.approche-img .bg-photo {
  position:absolute;
  inset:0;
  width:100%;
  height:110%;
  top:-5%;
  object-fit:cover;
  object-position:center top;
  filter:brightness(.55) saturate(.6);
  will-change:transform;
}
.approche-img::after {
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(to right, transparent 55%, var(--deep) 100%),
    linear-gradient(to top, var(--night) 0%, transparent 20%);
  transition: opacity 0.8s ease;
}
.approche-img .bg-photo {
  transition: transform 1.4s ease-out, filter 0.8s ease;
}
.approche-img:hover .bg-photo {
  transform: scale(1.04);
  filter: brightness(.85) saturate(.9);
  transition: transform 1.4s ease-out, filter 0.8s ease;
}
.approche-img:hover::after {
  opacity: 0.7;
}

/* a-propos bare portrait <img> — CSS-only hook (no HTML change) */
img[src*="portrait"] {
  transition: transform 1.4s ease-out, filter 0.8s ease;
}
img[src*="portrait"]:hover {
  transform: scale(1.03);
  filter: brightness(.85) saturate(.9) !important;
}
.approche-txt {
  background:var(--deep);
  padding:72px 56px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.approche-txt h2 { margin-bottom:24px; }
.approche-txt p { margin-bottom:14px; max-width:500px; }
.quote-left {
  margin-top:28px;
  padding-left:20px;
  border-left:1px solid var(--rose2);
}
.quote-left p {
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-weight:300;
  font-size:19px;
  line-height:1.6;
  color:rgba(237,229,212,.72);
}

/* ─── PRATIQUES ───────────────────────────────────────────────── */
.pratiques {
  background: radial-gradient(ellipse 60% 70% at 30% 30%, rgba(50,18,90,.35) 0%, transparent 65%), #0D0818;
  padding:96px 0;
}
.sec-head {
  text-align:center;
  padding:0 40px;
  margin-bottom:56px;
}
.sec-head p { max-width:480px; margin:12px auto 0; font-size:14px; }
.cards-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:2px;
  background:rgba(237,229,212,.06);
  margin:0 40px;
}
.pcard {
  position:relative;
  overflow:hidden;
  min-height:380px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  cursor:pointer;
  background:var(--deep);
  transition:transform .5s cubic-bezier(.25,.46,.45,.94);
}
.pcard:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 48px rgba(130,80,185,.25);
}
/* Image en background-image, pas en <img> */
.pcard-bg {
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  filter:brightness(.28) saturate(.5);
  transform:scale(1.1);
  transition:filter .7s ease, transform .7s ease;
  will-change:transform,filter;
}
.pcard:hover .pcard-bg {
  filter:brightness(.68) saturate(.9);
  transform:scale(1.0);
}
/* Dégradé bas vers haut */
.pcard::after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(
    to top,
    rgba(8,4,26,1)   0%,
    rgba(8,4,26,.9)  25%,
    rgba(8,4,26,.45) 50%,
    rgba(8,4,26,0)   70%
  );
  z-index:1;
  transition:background .7s ease;
}
.pcard:hover::after {
  background:linear-gradient(
    to top,
    rgba(8,4,26,.98) 0%,
    rgba(8,4,26,.72) 30%,
    rgba(8,4,26,.12) 58%,
    rgba(8,4,26,0)   75%
  );
}
.pcard-body {
  position:relative;
  z-index:2;
  padding:30px 26px 28px;
}
.pcard-num {
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:10px;
  letter-spacing:.38em;
  color:rgba(196,160,184,.45);
  margin-bottom:12px;
}
.pcard-body h3 {
  font-size:clamp(20px,2vw,26px);
  margin-bottom:4px;
}
.pcard-body p { font-size:13px; line-height:1.65; }
.pcard-link {
  display:inline-block;
  margin-top:16px;
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(196,160,184,.65);
  transition:color .3s;
}
.pcard:hover .pcard-link { color:var(--rose); }

/* ─── SECTION CINÉMATIQUE ─────────────────────────────────────── */
.cine {
  position:relative;
  min-height:400px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.cine-bg {
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center 30%;
  filter:brightness(.25) saturate(.5);
  transform:scale(1.1);
  will-change:transform;
}
.cine-overlay {
  position:absolute;
  inset:0;
  background:
    linear-gradient(to bottom, rgba(8,4,26,.55) 0%, rgba(8,4,26,.45) 50%, rgba(8,4,26,.75) 100%);
}
.cine-content {
  position:relative;
  z-index:2;
  text-align:center;
  padding:60px 48px;
  max-width:800px;
}
.cine-content blockquote {
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-weight:300;
  font-size:clamp(20px,2.8vw,34px);
  line-height:1.4;
  color:rgba(237,229,212,.88);
}
.cine-rule {
  width:40px;
  height:1px;
  background:var(--rose2);
  margin:22px auto;
}

/* ─── DOMAINES ─────────────────────────────────────────────────── */
.domaines {
  background: radial-gradient(ellipse 70% 60% at 70% 40%, rgba(35,12,65,.4) 0%, transparent 70%), #0D0818;
  padding:96px 0;
}
.domaines-inner {
  max-width:1200px;
  margin:0 auto;
  padding:0 48px;
  display:grid;
  grid-template-columns:1fr 1.7fr;
  gap:72px;
  align-items:center;
}
.dom-editorial h2 { margin-bottom:20px; }
.dom-editorial p { max-width:340px; }
.dom-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2px;
  background:rgba(237,229,212,.07);
}
.dom-cell {
  background:#0D0818;
  padding:28px 20px;
  cursor:pointer;
  transition:background .3s;
  display:block;
  text-decoration:none;
  color:inherit;
}
.dom-cell:hover { background:rgba(196,160,184,.08); }
.dom-icon {
  width:22px;
  height:22px;
  stroke:rgba(196,160,184,.75);
  fill:none;
  stroke-width:1.4;
  stroke-linecap:round;
  stroke-linejoin:round;
  margin-bottom:12px;
  display:block;
}
.dom-cell h4 {
  font-family:'Jost',sans-serif;
  font-weight:500;
  font-size:12px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--cream);
  margin-bottom:6px;
}
.dom-cell p {
  font-size:12px;
  line-height:1.6;
  color:rgba(237,229,212,.52);
  margin:0;
}

/* ─── TÉMOIGNAGES ──────────────────────────────────────────────── */
.temos {
  position:relative;
  background: radial-gradient(ellipse 60% 80% at 20% 60%, rgba(30,10,60,.5) 0%, transparent 65%), #0D0818;
  overflow:hidden;
  padding:96px 0;
}
.temos-bg {
  position:absolute;
  inset:0;
  background-image:url('../assets/images/bougie_livre.jpg');
  background-size:cover;
  background-position:center;
  filter:brightness(.12) saturate(.4);
  opacity:.7;
}
.temos-overlay {
  position:absolute;
  inset:0;
  background:
    linear-gradient(to right, rgba(8,4,26,.97) 52%, rgba(8,4,26,.72) 100%);
}
.temos-inner {
  position:relative;
  z-index:2;
  max-width:1200px;
  margin:0 auto;
  padding:0 56px;
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:80px;
  align-items:start;
}
.temos-quote-wrap { padding-top:8px; }
.guillemet {
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:100px;
  line-height:1;
  color:rgba(196,160,184,.12);
  margin-bottom:-18px;
  display:block;
}
.temo-quote {
  font-family:'Cormorant Garamond',serif;
  font-style:italic;
  font-weight:300;
  font-size:clamp(18px,2.1vw,23px);
  line-height:1.65;
  color:rgba(237,229,212,.85);
  transition:opacity .3s;
}
.temo-source {
  margin-top:22px;
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:11px;
  letter-spacing:.28em;
  text-transform:uppercase;
  color:rgba(196,160,184,.75);
  transition:opacity .3s;
}
.temo-list { display:flex; flex-direction:column; }
.temo-item {
  padding:14px 0;
  border-bottom:1px solid var(--b10);
  cursor:pointer;
  transition:all .25s;
}
.temo-item p {
  font-size:13px;
  line-height:1.55;
  color:rgba(237,229,212,.3);
  margin:0;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.temo-item.active p,
.temo-item:hover p { color:rgba(237,229,212,.8); }
.temo-dots {
  display:flex;
  gap:9px;
  margin-top:28px;
}
.tdot {
  width:6px;
  height:6px;
  border-radius:50%;
  background:rgba(237,229,212,.2);
  border:none;
  cursor:pointer;
  padding:0;
  transition:background .25s;
}
.tdot.active { background:rgba(196,160,184,.8); }

/* ─── CTA FINAL ────────────────────────────────────────────────── */
.cta-sec {
  background: radial-gradient(ellipse 80% 60% at 50% 50%, rgba(55,20,95,.4) 0%, transparent 70%), #0D0818;
  padding:112px 40px;
  text-align:center;
}
.cta-sec h2 { margin-bottom:14px; }
.cta-sec .sub { margin-bottom:44px; }
.cta-tel {
  display:block;
  margin-top:28px;
  font-family:'Cormorant Garamond',serif;
  font-weight:300;
  font-size:30px;
  color:rgba(196,160,184,.65);
  transition:color .3s;
}
.cta-tel:hover { color:rgba(196,160,184,.9); }

/* ─── LOCALISATION ─────────────────────────────────────────────── */
.loca {
  display:grid;
  grid-template-columns:1fr 1fr;
  background:#0D0818;
  min-height:440px;
}
.loca-map {
  overflow:hidden;
  min-height:440px;
}
.loca-map iframe {
  width:100%;
  height:100%;
  min-height:440px;
  border:0;
  filter:grayscale(1) invert(1) hue-rotate(220deg) brightness(.42) saturate(.8);
  display:block;
}
/* Map hover — illumination on mouse over (same as consultations) */
.loca-map:hover iframe {
  filter: grayscale(0) invert(0) hue-rotate(0deg) brightness(1) saturate(1);
  transition: filter 0.6s ease;
}
.loca-map iframe {
  transition: filter 0.6s ease;
}
.loca-info {
  padding:64px 52px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border-left:1px solid var(--b10);
}
.loca-info h2 { margin-bottom:28px; }
.loca-row {
  display:flex;
  gap:14px;
  margin-bottom:18px;
  align-items:flex-start;
}
.loca-row svg {
  flex-shrink:0;
  width:18px;
  height:18px;
  margin-top:3px;
  stroke:rgba(196,160,184,.55);
  fill:none;
  stroke-width:1.4;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.loca-row p { margin:0; font-size:14px; line-height:1.75; }
.loca-row a { color:var(--cream65); transition:color .2s; }
.loca-row a:hover { color:var(--cream); }
.btn-itin {
  display:inline-block;
  align-self:flex-start;
  width:auto;
  margin-top:24px;
  padding:10px 24px;
  border:1px solid var(--b10);
  font-family:'Jost',sans-serif;
  font-weight:400;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--cream65);
  transition:all .3s;
}
.btn-itin:hover { border-color:var(--b25); color:var(--cream); }

/* ─── FOOTER ───────────────────────────────────────────────────── */
footer {
  background:#050210;
  padding:60px 48px 28px;
  border-top:1px solid rgba(196,160,184,.15);
}
.footer-grid {
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr;
  gap:40px;
  margin-bottom:40px;
}
.f-brand { font-family:'Jost',sans-serif; font-weight:400; font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:rgba(237,229,212,.65); margin-bottom:12px; display:block; }
.f-desc { font-size:13px; line-height:1.8; color:rgba(237,229,212,.38); max-width:240px; }
.f-col h5 { font-family:'Jost',sans-serif; font-weight:500; font-size:10px; letter-spacing:.28em; text-transform:uppercase; color:rgba(196,160,184,.6); margin-bottom:16px; }
.f-col a, .f-col p { font-size:13px; line-height:2; color:rgba(237,229,212,.38); display:block; transition:color .2s; }
.f-col a:hover { color:rgba(237,229,212,.72); }
.footer-bottom { border-top:1px solid rgba(237,229,212,.06); padding-top:20px; display:flex; justify-content:space-between; align-items:center; }
.footer-bottom p, .footer-bottom a { font-size:11px; font-weight:400; color:rgba(237,229,212,.22); }

/* ─── ITALIC — interdit sur petits textes ─────────────────────── */
p em, .kicker em, .bnd-lbl em, .dom-cell p em,
.f-col p em, .f-col a em {
  font-style: normal;
}
p {
  font-style: normal !important;
  font-weight: 400;
}
/* Italic AUTORISÉ uniquement sur : */
h1 em { font-style: italic; }
h2 em { font-style: italic; }
h3 em { font-style: italic; }
blockquote { font-style: italic; }
.hero-sub { font-style: italic; }
.quote-left p { font-style: italic !important; }
.temo-quote { font-style: italic; }
.cine-content blockquote { font-style: italic; }

/* ─── TEMO-CARD (page témoignages) ────────────────────────────── */
.temo-card {
  /* Glassmorphism : fond légèrement translucide avec blur */
  background: rgba(196,160,184,.07);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(196,160,184,.18);
  border-top: 1px solid rgba(196,160,184,.28); /* reflet du dessus */
  padding: 36px 32px 32px;
  position: relative;
  transition: border-color .3s, background .3s;
}
.temo-card:hover {
  background: rgba(196,160,184,.11);
  border-color: rgba(196,160,184,.28);
}
/* Grand guillemet décoratif rose bien visible */
.temo-card::before {
  content: '\201C';
  position: absolute;
  top: 10px;
  left: 20px;
  font-family: 'Cormorant Garamond', serif;
  font-size: 64px;
  line-height: 1;
  color: rgba(196,160,184,.25);
  pointer-events: none;
}
/* Texte de la citation : Jost regular (pas italic) pour lisibilité maximale */
.temo-card blockquote {
  font-family: 'Jost', sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.85;
  color: rgba(237,229,212,.92); /* très lisible */
  padding-top: 8px;
}
/* Source : rose discret mais lisible */
.temo-card .source {
  margin-top: 18px;
  font-family: 'Jost', sans-serif;
  font-weight: 500;
  font-size: 10px;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(196,160,184,.8);
  padding-top: 14px;
  border-top: 1px solid rgba(196,160,184,.12);
}

/* ─── CTA BOUTON VISIBLE ───────────────────────────────────────── */
.cta-sec .btn-primary {
  background: rgba(196,160,184,.2);
  border: 1px solid rgba(196,160,184,.6);
  color: var(--cream);
  font-size: 12px;
  padding: 15px 40px;
  letter-spacing: .22em;
  transition: background .3s, border-color .3s, transform .2s;
}
.cta-sec .btn-primary:hover {
  background: rgba(196,160,184,.32);
  border-color: rgba(196,160,184,.85);
  transform: translateY(-2px);
}

/* ─── REVEAL ANIMATIONS (état initial) ────────────────────────── */
.rev { opacity:0; transform:translateY(44px); }
.rev-left { opacity:0; transform:translateX(-36px); }
.rev-scale { opacity:0; transform:scale(.96); }

/* ─── RESPONSIVE ───────────────────────────────────────────────── */
@media (max-width:1024px) {
  .cards-grid { grid-template-columns:repeat(2,1fr); }
  .domaines-inner { grid-template-columns:1fr; gap:40px; padding:0 32px; }
  .temos-inner { grid-template-columns:1fr; gap:40px; }
  .temo-list { display:none; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
  .loca { grid-template-columns:1fr; }
}
@media (max-width:768px) {
  header { padding:0 20px; }
  .nav, .btn-cta { display:none; }
  .burger { display:flex; }
  .approche { grid-template-columns:1fr; }
  .approche-img { min-height:280px; }
  .cards-grid { grid-template-columns:1fr; margin:0 20px; }
  .domaines-inner { padding:0 20px; }
  .dom-grid { grid-template-columns:repeat(2,1fr); }
  .temos-inner { padding:0 24px; }
  .bandeau { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:1fr; }
  footer { padding:48px 24px 24px; }
  .loca-info { padding:40px 24px; }
}

/* ─── PAGE HERO (pages internes) ──────────────────────────────── */
.page-hero {
  position:relative;
  height:62vh;
  min-height:420px;
  max-height:580px;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  background:#0D0818;
  padding-bottom:52px;
}
.page-hero-bg {
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center 25%;
  filter:brightness(.52) saturate(.7);
  transform:scale(1.12);
  will-change:transform;
  animation:kenburns 22s ease-out forwards;
}
.page-hero:hover .page-hero-bg {
  transform: scale(1.16);
  filter: brightness(.62) saturate(.85);
  transition: transform 8s ease-out, filter 1.2s ease;
}
.page-hero-bg {
  transition: transform 8s ease-out, filter 1.2s ease;
}
@keyframes kenburns {
  0%   { transform:scale(1.12) translate(0px, 0px); }
  100% { transform:scale(1.0)  translate(-18px, -10px); }
}
@keyframes kenburns-strong {
  0%   { transform: scale(1.5) translate(25px, 20px); }
  50%  { transform: scale(1.28) translate(-12px, -8px); }
  100% { transform: scale(1.0)  translate(-40px, -25px); }
}
@media (prefers-reduced-motion: reduce) {
  .page-hero-bg { animation:none; transform:scale(1.0); }
}
/* Dégradé UNIQUEMENT depuis le bas — laisse l'image visible en haut */
.page-hero-overlay {
  position:absolute;
  inset:0;
  background:linear-gradient(
    to bottom,
    rgba(13,8,24,0)    0%,
    rgba(13,8,24,0)    50%,
    rgba(13,8,24,.65)  72%,
    rgba(13,8,24,.95)  88%,
    rgba(13,8,24,1)    100%
  );
}
.page-hero-content {
  position:relative;
  z-index:2;
  max-width:1200px;
  margin:0 auto;
  padding:0 48px;
  width:100%;
}
.page-hero-content .kicker { margin-bottom:12px; }
.page-hero-content h1 { font-size:clamp(42px,6vw,80px); }

/* ─── FORMULAIRE ───────────────────────────────────────────────── */
.form-prog { height:1px; background:rgba(237,229,212,.12); margin-bottom:36px; }
.form-prog-fill { height:100%; background:rgba(196,160,184,.6); transition:width .5s ease; width:50%; }
.form-step { display:none; }
.form-step.active { display:block; }
.form-group { margin-bottom:20px; }
.form-group label { display:block; font-family:'Jost',sans-serif; font-weight:500; font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:rgba(196,160,184,.8); margin-bottom:9px; }
.form-group input, .form-group textarea, .form-group select {
  width:100%;
  padding:12px 15px;
  background:rgba(237,229,212,.05);
  border:1px solid var(--b10);
  border-radius:0;
  color:var(--cream);
  font-family:'Jost',sans-serif;
  font-size:14px;
  font-weight:400;
  outline:none;
  transition:border-color .3s, background .3s;
}
.form-group input:focus, .form-group textarea:focus {
  border-color:rgba(196,160,184,.4);
  background:rgba(237,229,212,.08);
}
.form-group input::placeholder, .form-group textarea::placeholder { color:rgba(237,229,212,.28); }
.form-honeypot { position:absolute; left:-9999px; opacity:0; }

/* ─── FAQ ──────────────────────────────────────────────────────── */
.faq-item { border-bottom:1px solid var(--b10); background:transparent; }
.faq-btn { width:100%; padding:18px 0; background:transparent; border:none; color:var(--cream); font-family:'Jost',sans-serif; font-weight:400; font-size:15px; text-align:left; cursor:pointer; display:flex; justify-content:space-between; align-items:center; }
.faq-btn::after { content:'+'; font-family:'Cormorant Garamond',serif; font-size:22px; color:rgba(196,160,184,.65); transition:transform .3s; flex-shrink:0; }
.faq-item.open .faq-btn::after { transform:rotate(45deg); }
.faq-body { max-height:0; overflow:hidden; transition:max-height .4s ease; background:transparent; }
.faq-body p { padding-bottom:18px; color:rgba(237,229,212,.6); font-size:14px; line-height:1.78; margin:0; background:transparent; }

/* ─── NUMEROLOGIE WIDGET ────────────────────────────────────────── */
.num-box { background:rgba(24,15,56,.6); border:1px solid var(--b10); padding:36px; max-width:460px; margin:36px auto 0; }
.num-inputs { display:grid; grid-template-columns:1fr 1fr 2fr; gap:10px; margin-bottom:18px; }
.num-result { text-align:center; margin-top:22px; }
.num-result .nb { font-family:'Cormorant Garamond',serif; font-weight:300; font-size:68px; line-height:1; color:var(--cream); display:block; }
.num-result .nm { font-family:'Cormorant Garamond',serif; font-style:italic; font-weight:300; font-size:18px; color:rgba(196,160,184,.72); margin-top:10px; display:block; line-height:1.5; }

/* Scroll reveal — prevent flash of hidden content */
@media (prefers-reduced-motion: reduce) {
  * {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* ════════════ PREMIUM MICRO-INTERACTIONS ════════════ */

/* Premium button micro-interactions */
.btn-primary, .btn-outline, .lg-btn-primary,
button[type="submit"], .pcard-link {
  transition: transform 0.18s ease-out,
              box-shadow 0.18s ease-out,
              background 0.25s ease,
              color 0.25s ease;
  will-change: transform;
}

.btn-primary:hover, .lg-btn-primary:hover {
  transform: scale(1.03) translateY(-2px);
  box-shadow: 0 8px 32px rgba(130,80,185,.35);
}

.btn-primary:active, .lg-btn-primary:active {
  transform: scale(0.97) translateY(0px);
  transition-duration: 0.08s;
}

.btn-outline:hover {
  transform: scale(1.02) translateY(-1px);
  box-shadow: 0 6px 24px rgba(196,160,184,.2);
}

.btn-outline:active {
  transform: scale(0.98);
  transition-duration: 0.08s;
}

/* Form field focus micro-interactions */
input, textarea, select {
  transition: border-color 0.2s ease,
              box-shadow 0.2s ease,
              background 0.2s ease;
  outline: none;
}

input:focus, textarea:focus, select:focus {
  border-color: rgba(196,160,184,.8);
  box-shadow: 0 0 0 3px rgba(196,160,184,.12),
              0 1px 8px rgba(130,80,185,.15);
  background: rgba(255,255,255,.04);
}

input:valid:not(:placeholder-shown),
textarea:valid:not(:placeholder-shown) {
  border-color: rgba(160,196,184,.6);
  box-shadow: 0 0 0 2px rgba(160,196,184,.1);
}

input:invalid:not(:placeholder-shown):not(:focus),
textarea:invalid:not(:placeholder-shown):not(:focus) {
  border-color: rgba(196,130,130,.5);
  animation: field-shake 0.3s ease;
}

@keyframes field-shake {
  0%, 100% { transform: translateX(0); }
  25%       { transform: translateX(-4px); }
  75%       { transform: translateX(4px); }
}

/* Nav link underline animation */
nav a, .nav-link, header a:not(.btn-primary):not(.lg-btn-primary) {
  position: relative;
  transition: color 0.2s ease;
}

nav a::after, .nav-link::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 1px;
  background: rgba(196,160,184,.7);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.25s ease;
}

nav a:hover::after, .nav-link:hover::after {
  transform: scaleX(1);
  transform-origin: left;
}

/* .pcard-link arrow animation */
.pcard-link {
  transition: color 0.2s ease, letter-spacing 0.2s ease;
}

.pcard:hover .pcard-link {
  letter-spacing: 0.04em;
}

/* ── SEO — screen-reader only text ── */
.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;
}
