/* =========================================================================
   ABEL MONTCLAIR — Direction « Os & Sang-de-bœuf » (Bone & Oxblood)
   Le manuscrit du guérisseur : papier os, encre sang-de-bœuf, filets laiton.
   Les blocs sont SERTIS (cartouches à double filet), jamais empilés en cartes.
   Les animations (braises, bougies, encens) vivent sur des PLANCHES d'encre
   incrustées dans le papier, comme des gravures collées dans un vieux livre.
   ========================================================================= */

/* ---------- Tokens ---------- */
:root{
  /* Papier */
  --paper:    #f2ede2;   /* fond principal, os chaud            */
  --paper-2:  #ebe4d6;   /* bande alternée                      */
  --panel:    #e7e0d1;   /* panneau serti                       */

  /* Encre */
  --ink:      #211d19;   /* texte principal                     */
  --ink-soft: #3a342d;   /* texte courant                       */
  --slate:    #6d665c;   /* texte secondaire                    */
  --slate-2:  #8b8377;   /* légendes                            */

  /* Sang-de-bœuf & laiton */
  --ox:       #6b1f24;   /* accent primaire                     */
  --ox-lit:   #8d3138;
  --brass:    #9c7b3a;
  --brass-lit:#c0a05c;

  /* Filets */
  --rule:      rgba(33,29,25,.20);
  --rule-soft: rgba(33,29,25,.11);
  --brass-in:  rgba(156,123,58,.38);

  /* Planche d'encre (fond des canvas) */
  --plate:    #16130f;
  --plate-2:  #1f1a14;

  /* WhatsApp — assombri pour tenir sur fond clair */
  --wa:      #1f7a45;
  --wa-lit:  #269353;

  /* Typographie */
  --f-display:"Bodoni Moda", Didot, "Times New Roman", Georgia, serif;
  --f-body:   "Spectral", Georgia, "Times New Roman", serif;
  --f-ui:     "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Rythme */
  --wrap: 1140px;
  --wrap-narrow: 780px;
  --gutter: clamp(20px, 5vw, 56px);
  --sect-y: clamp(64px, 10vw, 128px);
  --radius: 0px;          /* le manuscrit n'a pas d'angles arrondis */
  --radius-lg: 0px;

  --ease: cubic-bezier(.22,.61,.36,1);
  --hair: var(--rule);
  --hair-soft: var(--rule-soft);
}

/* ---------- Reset / base ---------- */
*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink-soft);
  font-family:var(--f-body);
  font-weight:400;
  font-size:clamp(16px, 1.05vw + 12px, 18px);
  line-height:1.78;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
/* grain de papier */
body::after{
  content:""; position:fixed; inset:0; z-index:2000; pointer-events:none;
  opacity:.20; mix-blend-mode:multiply;
  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='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; cursor:pointer; }
:focus-visible{ outline:2px solid var(--ox); outline-offset:3px; }

/* ---------- Layout ---------- */
.container{ width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gutter); }
.narrow{ max-width:var(--wrap-narrow); }
.section{ padding-block:var(--sect-y); position:relative; }
.section--tight{ padding-block:clamp(48px,7.5vw,92px); }
/* alternance de teinte pour rythmer la lecture */
.section.services + .section.services{ background:var(--paper-2); }

/* ---------- Typographie ---------- */
h1,h2,h3,h4{
  font-family:var(--f-display); font-weight:400; color:var(--ink);
  line-height:1.08; margin:0; letter-spacing:-.005em; text-wrap:balance;
}
.display{ font-size:clamp(2.5rem, 7vw, 5rem); line-height:1.02; }
h2.h-sect{ font-size:clamp(1.9rem, 4.2vw, 3.1rem); }
h3{ font-size:clamp(1.35rem, 2.3vw, 1.8rem); }
p{ margin:0 0 1.05em; }
p:last-child{ margin-bottom:0; }
em, .italic{ font-style:italic; }
strong{ font-weight:600; color:var(--ox); }

/* étiquette gravée */
.eyebrow{
  font-family:var(--f-ui); font-weight:600;
  font-size:.66rem; letter-spacing:.3em; text-transform:uppercase;
  color:var(--ox); display:inline-flex; align-items:center; gap:.9em;
  margin:0 0 1.3rem;
}
.eyebrow::before{ content:""; width:30px; height:1px; background:var(--brass); }
.eyebrow--center{ justify-content:center; }
.eyebrow--center::after{ content:""; width:30px; height:1px; background:var(--brass); }

.lede{ font-size:clamp(1.06rem,1.55vw,1.24rem); color:var(--ink-soft); line-height:1.7; }
.muted{ color:var(--slate); }
.center{ text-align:center; }

.sect-head{ max-width:720px; }
.sect-head.center{ margin-inline:auto; }
.sect-head h2{ margin-bottom:.45em; }

/* ornement de séparation */
.sect-head.center::after{
  content:"✦"; display:block; margin:1.4rem auto 0; color:var(--brass);
  font-size:.8rem; line-height:1;
}

/* ---------- Boutons ---------- */
.btn{
  --bg: transparent; --fg: var(--ink); --bd: var(--rule);
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  padding:1em 1.75em; min-height:52px;
  font-family:var(--f-ui); font-weight:600; font-size:.78rem;
  letter-spacing:.17em; text-transform:uppercase;
  color:var(--fg); background:var(--bg);
  border:1px solid var(--bd); border-radius:var(--radius);
  transition:background .28s var(--ease), color .28s var(--ease), border-color .28s var(--ease);
}
.btn svg{ width:1.05em; height:1.05em; flex:none; }

/* primaire = sang-de-bœuf */
.btn--gold{ --bg:var(--ox); --fg:var(--paper); --bd:var(--ox); }
.btn--gold:hover{ --bg:var(--ox-lit); --bd:var(--ox-lit); }

.btn--wa{ --bg:var(--wa); --fg:var(--paper); --bd:var(--wa); }
.btn--wa:hover{ --bg:var(--wa-lit); --bd:var(--wa-lit); }

.btn--ghost{ --bd:var(--rule); --fg:var(--ink); background:transparent; }
.btn--ghost:hover{ --bd:var(--brass); color:var(--ox); }

.btn--block{ width:100%; }
.btn--sm{ padding:.7em 1.15em; min-height:44px; font-size:.7rem; }

/* ---------- En-tête ---------- */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between; gap:2rem;
  padding:clamp(13px,2vw,19px) var(--gutter);
  background:transparent; border-bottom:1px solid transparent;
  transition:background .35s var(--ease), border-color .35s var(--ease), padding .35s var(--ease);
}
.site-header.is-stuck{
  background:rgba(242,237,226,.93); backdrop-filter:blur(10px);
  border-bottom-color:var(--rule); padding-block:11px;
}
.brand{ display:inline-flex; flex-direction:column; line-height:1; gap:.3em; }
.brand__name{
  font-family:var(--f-display); font-weight:600; font-size:1.12rem;
  letter-spacing:.13em; color:var(--ink); text-transform:uppercase;
}
.brand__role{
  font-family:var(--f-ui); font-size:.54rem; letter-spacing:.28em;
  text-transform:uppercase; color:var(--ox); font-weight:600;
}

.nav{ display:flex; align-items:center; gap:clamp(1rem,2.1vw,2rem); }
.nav a{
  font-family:var(--f-ui); font-size:.73rem; letter-spacing:.15em;
  color:var(--ink); text-transform:uppercase; font-weight:600;
  position:relative; padding:.3em 0; transition:color .25s var(--ease);
}
.nav a::after{
  content:""; position:absolute; left:0; bottom:-3px; width:0; height:1px;
  background:var(--ox); transition:width .3s var(--ease);
}
.nav a:hover{ color:var(--ox); } .nav a:hover::after{ width:100%; }

.header-tools{ display:flex; align-items:center; gap:.9rem; }
.lang-toggle{ display:inline-flex; border:1px solid var(--rule); overflow:hidden; }
.lang-toggle button{
  font-family:var(--f-ui); padding:.42em .78em; font-size:.66rem; font-weight:700;
  letter-spacing:.1em; color:var(--slate); background:transparent; text-transform:uppercase;
  transition:color .22s, background .22s;
}
.lang-toggle button[aria-pressed="true"]{ color:var(--paper); background:var(--ox); }

.hamburger{
  display:none; width:42px; height:42px; border:1px solid var(--rule);
  background:transparent; align-items:center; justify-content:center;
}
.hamburger span, .hamburger span::before, .hamburger span::after{
  content:""; display:block; width:18px; height:1.5px; background:var(--ink);
  transition:transform .3s var(--ease);
}
.hamburger span::before{ transform:translateY(-6px); }
.hamburger span::after{ transform:translateY(4.5px); }
body.nav-open .hamburger span{ background:transparent; }
body.nav-open .hamburger span::before{ transform:rotate(45deg); }
body.nav-open .hamburger span::after{ transform:rotate(-45deg) translateY(-1px); }

/* ---------- Hero — grand cartouche ---------- */
.hero{
  position:relative; display:flex; align-items:center; overflow:hidden;
  padding-block:clamp(118px,15vh,168px) clamp(56px,8vw,96px);
  background:var(--paper);
}
/* halo remplacé par un lavis chaud très discret */
.hero__glow{
  position:absolute; z-index:0; left:50%; top:42%; width:min(880px,116vw); aspect-ratio:1;
  translate:-50% -50%;
  background:radial-gradient(circle, rgba(156,123,58,.13), rgba(107,31,36,.05) 42%, transparent 68%);
}
/* double filet laiton = le cadre du cartouche */
.hero__frame{ position:absolute; inset:clamp(14px,2.6vw,34px); border:1px solid var(--brass); pointer-events:none; }
.hero__frame::before{ content:""; position:absolute; inset:5px; border:1px solid var(--brass-in); }
.hero__frame::after{ display:none; }

.hero__inner{ max-width:860px; margin-inline:auto; text-align:center; position:relative; z-index:1; }
.hero__eyebrow{ margin-bottom:1.7rem; }
.hero__title{
  font-size:clamp(2.8rem,8.5vw,6rem); line-height:1; letter-spacing:-.02em; color:var(--ink);
}
.hero__title .amp{ font-style:italic; color:var(--ox); }
.hero__tag{
  font-family:var(--f-ui); font-weight:600; font-size:clamp(.66rem,1.4vw,.8rem);
  letter-spacing:.3em; text-transform:uppercase; color:var(--brass); margin:1.5rem 0 0;
}
.hero__place{ font-style:italic; font-family:var(--f-display); color:var(--slate); font-size:1.05rem; margin-top:.55rem; }
.hero__lede{ margin:1.7rem auto 0; max-width:60ch; color:var(--ink-soft); }
.hero__actions{ display:flex; flex-wrap:wrap; gap:.85rem; justify-content:center; margin-top:2.2rem; }
.hero__confidential{
  display:inline-flex; align-items:center; gap:.6em; margin-top:1.7rem;
  font-family:var(--f-ui); font-size:.68rem; letter-spacing:.18em;
  text-transform:uppercase; color:var(--slate);
}
.hero__confidential svg{ width:1em; height:1em; color:var(--brass); }
.hero__scroll{
  position:absolute; left:50%; bottom:clamp(16px,3.5vh,34px); translate:-50% 0;
  display:flex; flex-direction:column; align-items:center; gap:.6em; z-index:1;
  font-family:var(--f-ui); font-size:.56rem; letter-spacing:.3em; text-transform:uppercase; color:var(--slate-2);
}
.hero__scroll i{ width:1px; height:38px; background:linear-gradient(var(--brass),transparent); }

/* ---------- Bandeau de confiance — registre réglé ---------- */
.trust{ border-block:1px solid var(--rule); background:var(--paper-2); }
.trust__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(148px,1fr)); gap:1px; background:var(--rule); }
.trust__item{ padding:clamp(24px,3.6vw,40px) clamp(12px,2vw,24px); text-align:center; position:relative; background:var(--paper-2); }
.trust__k{ font-family:var(--f-display); font-size:clamp(1.7rem,3vw,2.5rem); color:var(--ox); line-height:1;
  font-variant-numeric:tabular-nums; display:block; }
.trust__k--sm{ font-size:clamp(1.15rem,2vw,1.55rem); letter-spacing:.02em; }
.trust__ico{ display:block; width:25px; height:25px; margin:0 auto; color:var(--brass); }
.trust__l{
  display:block; margin-top:.7em; font-family:var(--f-ui); font-size:.63rem;
  letter-spacing:.19em; text-transform:uppercase; color:var(--slate);
}

/* ---------- Sélecteur de situation ---------- */
.selector{ background:var(--paper); }
.selector__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(215px,1fr)); gap:12px; margin-top:clamp(28px,4.5vw,46px); }
.selector__card{
  position:relative; text-align:left; padding:1.4rem 1.3rem 1.25rem; min-height:146px;
  display:flex; flex-direction:column; justify-content:space-between; gap:.9rem;
  background:var(--panel); border:1px solid var(--rule); color:var(--ink);
  transition:border-color .3s var(--ease), background .3s var(--ease);
}
.selector__card::before{ content:""; position:absolute; inset:4px; border:1px solid transparent; transition:border-color .3s var(--ease); }
.selector__card:hover, .selector__card:focus-visible{ border-color:var(--brass); background:var(--paper); }
.selector__card:hover::before{ border-color:var(--brass-in); }
.selector__icon{ width:28px; height:28px; color:var(--ox); }
.selector__label{ font-family:var(--f-display); font-size:1.14rem; line-height:1.2; color:var(--ink); }
.selector__go{
  display:inline-flex; align-items:center; gap:.4em; font-family:var(--f-ui);
  font-size:.62rem; letter-spacing:.17em; text-transform:uppercase; color:var(--ox); font-weight:700;
}
.selector__go svg{ width:1em; transition:transform .3s var(--ease); }
.selector__card:hover .selector__go svg{ transform:translateX(4px); }

.selector__result{
  margin-top:18px; border:1px solid var(--brass); background:var(--panel);
  padding:clamp(20px,3vw,32px); display:none; align-items:center; gap:1.5rem;
  flex-wrap:wrap; justify-content:space-between; position:relative;
}
.selector__result::before{ content:""; position:absolute; inset:5px; border:1px solid var(--brass-in); pointer-events:none; }
.selector__result.is-open{ display:flex; }
.selector__result h3{ margin-bottom:.28em; }
.selector__result p{ color:var(--ink-soft); max-width:52ch; }
.selector__result-actions{ display:flex; gap:.6rem; flex-wrap:wrap; }

/* ---------- Services : le cartouche ---------- */
.services{ background:var(--paper); }

.svc-feature{
  position:relative; display:grid; grid-template-columns:1.1fr .9fr;
  gap:clamp(24px,4vw,56px); align-items:center;
  padding:clamp(26px,3.6vw,50px);
  background:var(--panel); border:1px solid var(--brass);
}
.svc-feature::before{ content:""; position:absolute; inset:6px; border:1px solid var(--brass-in); pointer-events:none; }
.svc-feature__glow{ display:none; }
.svc-feature__body{ position:relative; z-index:1; }
.svc-feature h3{ font-size:clamp(1.8rem,3.4vw,2.7rem); margin-bottom:.35em; }
.svc-feature__list{ list-style:none; margin:1.5rem 0 0; padding:0; display:grid; gap:0; border-top:1px solid var(--rule); }
.svc-feature__list li{
  display:flex; gap:.7em; align-items:flex-start; color:var(--ink-soft);
  padding:.7rem 0; border-bottom:1px solid var(--rule); font-size:.96rem;
}
.svc-feature__list svg{ width:1em; height:1em; color:var(--brass); flex:none; margin-top:.42em; }
.svc-feature__actions{ display:flex; gap:.7rem; flex-wrap:wrap; margin-top:1.8rem; }
.svc-badge{
  display:inline-flex; align-items:center; gap:.5em; font-family:var(--f-ui);
  font-size:.6rem; letter-spacing:.22em; text-transform:uppercase; color:var(--ox);
  border:1px solid var(--brass-in); padding:.42em 1em; margin-bottom:1.1rem;
}

/* planche d'encre pour le cœur de braises */
.svc-feature__visual{ position:relative; z-index:1; display:flex; align-items:center; justify-content:center; min-height:270px; }
.heart3d{
  position:relative; width:100%; max-width:430px; aspect-ratio:1/1; margin-inline:auto;
  background:radial-gradient(circle at 50% 45%, var(--plate-2), var(--plate) 70%);
  border:1px solid var(--brass);
}
.heart3d::before{ content:""; position:absolute; inset:5px; border:1px solid rgba(192,160,92,.28); pointer-events:none; z-index:2; }
.heart3d canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.heart3d__caption{
  position:absolute; left:0; right:0; bottom:5%; text-align:center; pointer-events:none; z-index:2;
  font-family:var(--f-ui); font-weight:600; font-size:.58rem;
  letter-spacing:.24em; text-transform:uppercase; color:var(--brass-lit);
}

/* grille de services — plaques serties */
.svc-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(272px,1fr)); gap:14px; margin-top:20px; }
.svc-card{
  position:relative; padding:clamp(22px,2.8vw,32px);
  background:var(--panel); border:1px solid var(--rule);
  transition:border-color .35s var(--ease), background .35s var(--ease);
}
.svc-card::after{
  content:""; position:absolute; inset:5px; border:1px solid transparent;
  transition:border-color .35s var(--ease); pointer-events:none;
}
.svc-card:hover{ border-color:var(--brass); background:var(--paper); }
.svc-card:hover::after{ border-color:var(--brass-in); }
.svc-card__icon{ width:34px; height:34px; color:var(--ox); margin-bottom:1rem; }
.svc-card h3{ font-size:1.3rem; margin-bottom:.42em; }
.svc-card p{ color:var(--ink-soft); font-size:.94rem; margin-bottom:1rem; }
.svc-card__tags{ display:flex; flex-wrap:wrap; gap:.35em; }
.svc-card__tags span{
  font-family:var(--f-ui); font-size:.58rem; letter-spacing:.13em; text-transform:uppercase;
  color:var(--brass); border:1px solid var(--brass-in); padding:.34em .8em;
}
.svc-card__link{
  display:inline-flex; align-items:center; gap:.4em; margin-top:1.1rem;
  font-family:var(--f-ui); font-size:.64rem; letter-spacing:.16em;
  text-transform:uppercase; font-weight:700; color:var(--ox);
}
.svc-card__link svg{ width:1em; transition:transform .3s var(--ease); }
.svc-card__link:hover svg{ transform:translateX(4px); }

.svc-card--delicate{ background:transparent; border-style:dashed; border-color:var(--brass-in); }
.svc-note{ font-size:.8rem; color:var(--slate); font-style:italic; margin-top:.9rem; line-height:1.6; }

/* ---------- Planches d'encre : bougies & encens ---------- */
.altar-band{ position:relative; background:var(--paper); padding:clamp(30px,5vw,60px) var(--gutter) clamp(18px,3vw,30px); }
.altar{
  position:relative; width:100%; max-width:var(--wrap); margin-inline:auto;
  height:clamp(215px,27vw,310px);
  background:radial-gradient(ellipse at 50% 95%, var(--plate-2), var(--plate) 72%);
  border:1px solid var(--brass);
}
.altar::after{ content:""; position:absolute; inset:5px; border:1px solid rgba(192,160,92,.26); pointer-events:none; }
.altar canvas{ position:absolute; inset:0; width:100%; height:100%; display:block; }
.altar--incense{ height:clamp(190px,23vw,262px); }
.altar__line{
  position:relative; text-align:center; margin:1rem 0 0; font-family:var(--f-ui); font-weight:600;
  font-size:.6rem; letter-spacing:.28em; text-transform:uppercase; color:var(--brass);
}

/* ---------- À propos ---------- */
.about{ background:var(--paper-2); }
.about__grid{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(28px,4.5vw,66px); align-items:center; }
.about__caption{
  position:absolute; left:12px; right:12px; bottom:14px; font-family:var(--f-ui);
  letter-spacing:.2em; font-size:.56rem; text-transform:uppercase; color:var(--brass); text-align:center;
}

/* ---------- New York ---------- */
.nyc{ position:relative; overflow:hidden; background:var(--paper); }
.nyc__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(26px,4vw,56px); align-items:center; }
.nyc__card{
  position:relative; border:1px solid var(--brass); padding:clamp(22px,3vw,36px); background:var(--panel);
}
.nyc__card::before{ content:""; position:absolute; inset:5px; border:1px solid var(--brass-in); pointer-events:none; }
.nyc__list{ list-style:none; margin:1.3rem 0 0; padding:0; display:grid; gap:0; border-top:1px solid var(--rule); position:relative; z-index:1; }
.nyc__list li{ display:flex; gap:.75em; align-items:flex-start; color:var(--ink-soft); padding:.8rem 0; border-bottom:1px solid var(--rule); }
.nyc__list svg{ width:1.15em; height:1.15em; color:var(--brass); flex:none; margin-top:.35em; }

/* ---------- Discrétion (icône SVG) — utilisé dans thank-you.html ---------- */
.discretion__mark{ width:46px; height:46px; color:var(--brass); margin:0 auto 1.5rem; }

/* ---------- FAQ — registre réglé ---------- */
.faq__list{ margin-top:clamp(26px,4vw,44px); border-top:1px solid var(--rule); }
.faq__item{ border-bottom:1px solid var(--rule); }
.faq__q{
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:1.4rem;
  text-align:left; padding:1.4rem 0; background:transparent; border:0; color:var(--ink);
  font-family:var(--f-display); font-size:clamp(1.08rem,1.9vw,1.32rem); line-height:1.34;
  transition:color .25s var(--ease);
}
.faq__q:hover{ color:var(--ox); }
.faq__icon{ flex:none; width:24px; height:24px; position:relative; }
.faq__icon::before,.faq__icon::after{
  content:""; position:absolute; left:50%; top:50%; width:13px; height:1.5px;
  background:var(--brass); translate:-50% -50%; transition:transform .3s var(--ease);
}
.faq__icon::after{ transform:rotate(90deg); }
.faq__item[open] .faq__icon::after{ transform:rotate(0); }
.faq__a{ overflow:hidden; max-height:0; transition:max-height .4s var(--ease); }
.faq__a-inner{ padding:0 0 1.5rem; color:var(--ink-soft); max-width:70ch; }
.faq__item[open] .faq__a{ max-height:460px; }

/* ---------- Contact ---------- */
.contact{ background:var(--paper); }
.contact__grid{ display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(28px,4.5vw,58px); align-items:start; }
.contact__actions{ display:grid; gap:.8rem; margin-top:1.9rem; }
.contact__line{ display:flex; gap:1em; align-items:center; padding:1rem 0; border-bottom:1px solid var(--rule); }
.contact__line svg{ width:1.2em; height:1.2em; color:var(--brass); flex:none; }
.contact__line span{ font-family:var(--f-ui); font-size:.62rem; letter-spacing:.17em; text-transform:uppercase; color:var(--slate); display:block; }
.contact__line a,.contact__line b{ font-family:var(--f-display); font-size:1.14rem; color:var(--ink); font-weight:500; }
.contact__line a:hover{ color:var(--ox); }

.contact-form{
  position:relative; border:1px solid var(--brass); padding:clamp(22px,3.2vw,38px); background:var(--panel);
}
.contact-form::before{ content:""; position:absolute; inset:6px; border:1px solid var(--brass-in); pointer-events:none; }
.contact-form > *{ position:relative; z-index:1; }
.field{ margin-bottom:1.1rem; }
.field label{
  display:block; font-family:var(--f-ui); font-size:.64rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--slate); margin-bottom:.5rem; font-weight:600;
}
.field label .req{ color:var(--ox); }
.field input,.field select,.field textarea{
  width:100%; padding:.85rem .95rem; background:var(--paper); color:var(--ink);
  border:1px solid var(--rule); border-radius:var(--radius);
  font-family:var(--f-body); font-size:.97rem;
  transition:border-color .28s var(--ease), box-shadow .28s var(--ease);
}
.field textarea{ min-height:126px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--brass); box-shadow:0 0 0 3px rgba(156,123,58,.16);
}
.field select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%236b1f24' stroke-width='1.5'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1rem center; padding-right:2.5rem;
}
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:.9rem; }
.form-consent{ display:flex; gap:.65em; align-items:flex-start; font-size:.82rem; color:var(--slate); line-height:1.55; margin-bottom:1.2rem; }
.form-consent input{ margin-top:.3em; width:auto; accent-color:var(--ox); }
.form-note{ font-family:var(--f-ui); font-size:.72rem; color:var(--slate-2); margin-top:.9rem; text-align:center; }

/* ---------- Pied de page — colophon d'encre ---------- */
.footer{
  background:var(--plate); color:#cfc6b6; padding-block:clamp(46px,7vw,78px) 0;
  border-top:1px solid var(--brass);
}
.footer .brand__name{ color:#f2ede2; }
.footer .brand__role{ color:var(--brass-lit); }
.footer__bottom{
  display:flex; flex-wrap:wrap; gap:1rem; justify-content:space-between; align-items:center;
  margin-top:clamp(26px,3.6vw,42px); padding:1.8rem 0; border-top:1px solid rgba(207,198,182,.14);
  color:#8b8377; font-family:var(--f-ui); font-size:.74rem;
}
.footer__bottom a{ color:#9d9486; } .footer__bottom a:hover{ color:var(--brass-lit); }

/* ---------- Barre mobile ---------- */
.mobilebar{
  position:fixed; left:0; right:0; bottom:0; z-index:900; display:none;
  grid-template-columns:1fr 1fr 1.3fr; gap:1px; background:rgba(192,160,92,.3);
  border-top:1px solid var(--brass); padding-bottom:env(safe-area-inset-bottom);
}
.mobilebar a{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.24em;
  padding:.68rem .4rem; background:var(--plate); font-family:var(--f-ui);
  font-size:.58rem; letter-spacing:.1em; text-transform:uppercase; color:#cfc6b6; font-weight:700;
}
.mobilebar a svg{ width:19px; height:19px; }
.mobilebar a.is-wa{ color:#5fd08a; }
.mobilebar a.is-call{ color:var(--brass-lit); }
.mobilebar a.is-talk{ background:var(--ox); color:#f2ede2; }

/* ---------- Révélation au défilement ---------- */
.reveal{ opacity:0; transform:translateY(20px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }
.reveal[data-delay="1"]{ transition-delay:.07s; }
.reveal[data-delay="2"]{ transition-delay:.14s; }
.reveal[data-delay="3"]{ transition-delay:.21s; }
.reveal[data-delay="4"]{ transition-delay:.28s; }

/* ---------- Sous-pages ---------- */
.subpage-hero{
  padding-block:clamp(128px,17vh,182px) clamp(42px,7vw,80px);
  text-align:center; position:relative; overflow:hidden; background:var(--paper);
}
.subpage-hero .hero__glow{ top:34%; }
.breadcrumb{
  font-family:var(--f-ui); font-size:.66rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--slate); margin-bottom:1.3rem;
}
.breadcrumb a:hover{ color:var(--ox); }
.prose{ max-width:740px; margin-inline:auto; }
.prose h2{ font-size:clamp(1.45rem,2.9vw,2rem); margin:2.3rem 0 .7rem; }
.prose h3{ margin:1.7rem 0 .55rem; }
.prose p,.prose li{ color:var(--ink-soft); }
.prose ul,.prose ol{ padding-left:1.25rem; display:grid; gap:.45rem; margin:1rem 0; }
.prose a{ color:var(--ox); text-decoration:underline; text-underline-offset:3px; }
.cta-band{
  position:relative; text-align:center; border:1px solid var(--brass);
  padding:clamp(28px,4.5vw,52px); background:var(--panel);
}
.cta-band::before{ content:""; position:absolute; inset:6px; border:1px solid var(--brass-in); pointer-events:none; }
.cta-band > *{ position:relative; z-index:1; }
.cta-band h2{ margin-bottom:.5em; }
.cta-band__actions{ display:flex; flex-wrap:wrap; gap:.85rem; justify-content:center; margin-top:1.7rem; }

/* ---------- Responsive ---------- */
@media (max-width:1000px){
  .trust__grid{ grid-template-columns:repeat(2,1fr); }
  .trust__item:nth-child(5){ grid-column:1/-1; }
  .about__grid,.nyc__grid,.contact__grid,.svc-feature{ grid-template-columns:1fr; }
  .svc-feature__visual{ min-height:300px; }
  .heart3d{ max-width:350px; }
}
@media (max-width:760px){
  /* la marque tient sur une ligne et le cadre du hero passe sous l'en-tête */
  .brand__name{ font-size:.98rem; letter-spacing:.08em; }
  .brand__role{ font-size:.47rem; letter-spacing:.14em; }
  .hero__frame{ top:92px; }
  .nav{
    position:fixed; inset:0 0 0 auto; width:min(84vw,330px); flex-direction:column;
    align-items:flex-start; justify-content:center; gap:1.5rem;
    padding:2rem var(--gutter); background:var(--paper);
    border-left:1px solid var(--rule); transform:translateX(100%);
    transition:transform .38s var(--ease); z-index:1001;
  }
  body.nav-open .nav{ transform:none; }
  .nav a{ font-size:1rem; }
  .hamburger{ display:inline-flex; }
  .field-row{ grid-template-columns:1fr; }
  .mobilebar{ display:grid; }
  .selector__result{ flex-direction:column; align-items:flex-start; }
  .heart3d{ max-width:300px; }
}
@media (max-width:420px){ .hero__actions .btn{ width:100%; } }

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .reveal{ opacity:1; transform:none; }
}

/* ---------- Les trois voies (catégories traditionnelles) ---------- */
.magic{ margin-top:clamp(26px,4vw,44px); padding-top:clamp(24px,3.5vw,36px); border-top:1px solid var(--rule); }
.magic__head{ max-width:660px; }
.magic__head h3{ font-size:clamp(1.4rem,2.6vw,1.95rem); margin-bottom:.45em; }
.magic__head p{ color:var(--ink-soft); }
.magic__grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(238px,1fr)); gap:14px; margin-top:1.6rem; }
.magic-card{ position:relative; border:1px solid var(--rule); background:var(--panel); padding:clamp(20px,2.6vw,28px); transition:border-color .35s var(--ease); }
.magic-card::after{ content:""; position:absolute; inset:5px; border:1px solid transparent; transition:border-color .35s var(--ease); pointer-events:none; }
.magic-card:hover{ border-color:var(--brass); }
.magic-card:hover::after{ border-color:var(--brass-in); }
/* sceaux de cire */
.seal{ display:block; width:26px; height:26px; border-radius:50%; margin-bottom:.95rem;
  box-shadow:0 0 0 1px var(--brass-in), inset 0 -3px 5px rgba(0,0,0,.28), inset 0 2px 3px rgba(255,255,255,.18); }
.seal--white{ background:#efe9dc; }
.seal--red{ background:var(--ox); }
.seal--black{ background:var(--plate); }
.magic-card h4{ font-family:var(--f-display); font-size:1.2rem; margin-bottom:.4em; }
.magic-card p{ color:var(--ink-soft); font-size:.92rem; margin:0; }
.magic__note{ margin-top:1.2rem; font-size:.8rem; color:var(--slate); font-style:italic; }

/* ---------- Bilingue (piloté par <html lang>) ---------- */
html[lang="en"] [data-lang="fr"]{ display:none !important; }
html[lang="fr"] [data-lang="en"]{ display:none !important; }
[hidden]{ display:none !important; }

/* ============================================================
   COMPACT FOOTER
   ============================================================ */
.footer--slim{ padding-block: clamp(24px,3.5vw,38px) 0; }
.footer__legal{
  color:#9d9486; font-family:var(--f-ui); font-size:.74rem;
  line-height:1.6; text-align:center; margin:0 0 clamp(16px,2vw,22px);
}
.footer__links a{ color:#9d9486; font-size:.74rem; }
.footer__links a:hover{ color:var(--brass-lit); }

/* ============================================================
   FLOATING WHATSAPP BUTTON (desktop only)
   ============================================================ */
.wa-float{
  position:fixed; right:24px; bottom:30px; z-index:300;
  display:flex; align-items:center; gap:.55rem;
  padding:.7rem 1.15rem .7rem .9rem;
  background:#25d366; color:#fff !important;
  font-family:var(--f-ui); font-size:.82rem; font-weight:700;
  text-decoration:none; letter-spacing:.01em;
  box-shadow:0 4px 18px rgba(0,0,0,.22);
  transition:transform .18s ease, box-shadow .18s ease;
}
.wa-float svg{ width:22px; height:22px; flex-shrink:0; }
.wa-float:hover{ transform:translateY(-3px); box-shadow:0 8px 28px rgba(0,0,0,.28); }
@media(max-width:760px){ .wa-float{ display:none; } }

/* ============================================================
   CONVERSION — contact section enhancements
   ============================================================ */
.wa-primary-cta{ display:grid; gap:.55rem; }
.wa-response-badge{
  margin:0; text-align:center;
  color:var(--ink-soft); font-family:var(--f-ui); font-size:.74rem;
}
.btn--lg{ padding:1rem 1.8rem; font-size:1rem; }

/* form section label */
.form-label-top{
  font-family:var(--f-ui); font-size:.7rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--slate); margin:0 0 1.1rem;
}

/* ============================================================
   TESTIMONIALS — Before / After cards
   ============================================================ */
.testimonials-section{ background:var(--panel); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); }

.t-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:16px;
  margin-top:clamp(28px,4vw,48px);
}

.t-card{
  position:relative;
  display:flex; flex-direction:column;
  border:1px solid var(--rule);
  background:var(--paper);
  padding:0;
  overflow:hidden;
}
.t-card::before{
  content:""; position:absolute; inset:5px;
  border:1px solid var(--brass-in); pointer-events:none; z-index:0;
}
.t-card > *{ position:relative; z-index:1; }

.t-card__tag{
  font-family:var(--f-ui); font-size:.6rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--brass); padding:.7rem 1.2rem .5rem; border-bottom:1px solid var(--rule);
}

.t-card__before{
  padding:1.1rem 1.2rem .9rem;
  background:var(--paper);
  border-bottom:1px solid var(--rule);
  flex:1;
}
.t-card__after{
  padding:1.1rem 1.2rem .9rem;
  background:linear-gradient(160deg,rgba(107,31,36,.05) 0%,transparent 70%);
  flex:1;
}

.t-card__label{
  display:block;
  font-family:var(--f-ui); font-size:.58rem; letter-spacing:.18em; text-transform:uppercase;
  margin-bottom:.55rem;
}
.t-card__before .t-card__label{ color:var(--slate); }
.t-card__after .t-card__label{ color:var(--ox); font-weight:600; }

.t-card__before p,
.t-card__after p{
  margin:0; font-style:italic; font-size:.9rem; line-height:1.65; color:var(--ink);
}
.t-card__after p{ color:var(--ink); }

.t-card__arrow{
  display:flex; align-items:center; justify-content:center;
  height:28px; font-size:1rem; color:var(--brass);
  background:var(--panel); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
  letter-spacing:0;
}

.t-card figcaption{
  padding:.7rem 1.2rem .85rem;
  border-top:1px solid var(--rule);
  background:var(--paper);
}
.t-card__cite{
  font-style:normal; font-family:var(--f-ui); font-size:.65rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ox);
}

/* privacy note below grid */
.t-note{
  margin-top:clamp(22px,3vw,32px);
  text-align:center; font-size:.8rem; font-style:italic;
  color:var(--slate); max-width:52ch; margin-inline:auto;
}

/* mobile — single column */
@media(max-width:600px){
  .t-grid{ grid-template-columns:1fr; }
}

/* ============================================================
   FAQ — version compacte (moins de hauteur)
   ============================================================ */
.faq{ padding-block:clamp(36px,5vw,64px); }
.faq .faq__list{ margin-top:clamp(16px,2.5vw,28px); }

/* Question : padding + fonte réduits */
.faq .faq__q{
  padding:1rem 0;
  font-size:clamp(.9rem,1.5vw,1.08rem);
}

/* Desktop : 2 colonnes */
@media(min-width:820px){
  .faq .faq__list{
    display:grid;
    grid-template-columns:1fr 1fr;
    column-gap:0;
    border-top:0;
    margin-top:clamp(14px,2vw,24px);
  }
  .faq .faq__item{ border-top:1px solid var(--rule); }
  /* séparateur vertical entre les deux colonnes */
  .faq .faq__item:nth-child(odd){
    border-right:1px solid var(--rule);
    padding-right:clamp(1.1rem,2.2vw,1.8rem);
  }
  .faq .faq__item:nth-child(even){
    padding-left:clamp(1.1rem,2.2vw,1.8rem);
  }
  /* dernier item impair (si nombre impair) : étend sur les 2 cols */
  .faq .faq__item:last-child:nth-child(odd){
    grid-column:1/-1;
    border-right:0;
    padding-right:0;
  }
}

/* ============================================================
   Testimonial stars
   ============================================================ */
.t-card__stars{
  display:flex; gap:2px; margin-bottom:.42rem;
}
.t-card__stars span{
  color:#c8983a; font-size:1.05rem; line-height:1;
}
/* empty star (☆) slightly lighter */
.t-card__stars span:last-child:not(:first-child){ opacity:.45; }

/* ============================================================
   PALETTE COMPLÉMENTAIRE — couleurs sur les conteneurs
   Ajoute de la chaleur et une lecture visuelle par catégorie,
   sans dénaturer l'esthétique manuscrit.
   ============================================================ */
:root{
  /* rose/amour */
  --love-tint:   #f2ddd4;
  --love-tint-2: #ecccc0;
  --love-mark:   #a94a41;
  /* sauge/purification */
  --purif-tint:  #dfe8dc;
  --purif-tint-2:#cddccb;
  --purif-mark:  #4a725a;
  /* indigo/mystique — traditions & clairvoyance */
  --mystic-tint: #dcdee9;
  --mystic-tint-2:#c9ccdc;
  --mystic-mark: #454670;
  /* miel/chance */
  --luck-tint:   #f0e2c1;
  --luck-tint-2: #e8d5a4;
  --luck-mark:   #a6772a;
}

/* ----------------------------------------------------------
   1) Situation Selector — cartes colorisées par catégorie
   ---------------------------------------------------------- */
.selector__card{
  border-top-width:3px !important;
  transition:border-color .3s var(--ease), background .3s var(--ease), transform .25s var(--ease) !important;
}
.selector__card:hover{ transform:translateY(-2px); }

/* AMOUR — rose */
.selector__card[data-situation="reconnect"],
.selector__card[data-situation="love"],
.selector__card[data-situation="breakup"]{
  background:linear-gradient(180deg,var(--love-tint) 0%,var(--panel) 55%);
  border-top-color:var(--love-mark);
}
.selector__card[data-situation="reconnect"] .selector__icon,
.selector__card[data-situation="love"] .selector__icon,
.selector__card[data-situation="breakup"] .selector__icon{ color:var(--love-mark); }
.selector__card[data-situation="reconnect"] .selector__go,
.selector__card[data-situation="love"] .selector__go,
.selector__card[data-situation="breakup"] .selector__go{ color:var(--love-mark); }

/* CLARITÉ / SPIRITUEL — indigo */
.selector__card[data-situation="clarity"],
.selector__card[data-situation="spiritual"]{
  background:linear-gradient(180deg,var(--mystic-tint) 0%,var(--panel) 55%);
  border-top-color:var(--mystic-mark);
}
.selector__card[data-situation="clarity"] .selector__icon,
.selector__card[data-situation="spiritual"] .selector__icon{ color:var(--mystic-mark); }
.selector__card[data-situation="clarity"] .selector__go,
.selector__card[data-situation="spiritual"] .selector__go{ color:var(--mystic-mark); }

/* PURIFICATION / PROTECTION — sauge */
.selector__card[data-situation="evileye"],
.selector__card[data-situation="protect"],
.selector__card[data-situation="blocked"]{
  background:linear-gradient(180deg,var(--purif-tint) 0%,var(--panel) 55%);
  border-top-color:var(--purif-mark);
}
.selector__card[data-situation="evileye"] .selector__icon,
.selector__card[data-situation="protect"] .selector__icon,
.selector__card[data-situation="blocked"] .selector__icon{ color:var(--purif-mark); }
.selector__card[data-situation="evileye"] .selector__go,
.selector__card[data-situation="protect"] .selector__go,
.selector__card[data-situation="blocked"] .selector__go{ color:var(--purif-mark); }

/* CHANCE — miel */
.selector__card[data-situation="luck"]{
  background:linear-gradient(180deg,var(--luck-tint) 0%,var(--panel) 55%);
  border-top-color:var(--luck-mark);
}
.selector__card[data-situation="luck"] .selector__icon,
.selector__card[data-situation="luck"] .selector__go{ color:var(--luck-mark); }

/* ----------------------------------------------------------
   2) Cartes de service PURIFICATION — teinte sauge
   ---------------------------------------------------------- */
#purification .svc-card{
  background:linear-gradient(180deg,var(--purif-tint) 0%,var(--paper) 45%);
  border-top:3px solid var(--purif-mark);
}
#purification .svc-card__icon{ color:var(--purif-mark); }

/* ----------------------------------------------------------
   3) Cartes MAGIE (blanche/rouge/noire) — teintes de fond
   ---------------------------------------------------------- */
.magic-card{ transition:border-color .35s var(--ease), transform .25s var(--ease); }
.magic-card:hover{ transform:translateY(-2px); }
/* magie blanche — parchemin doré */
.magic-card:has(.seal--white){
  background:linear-gradient(180deg,#f5efe0 0%,var(--panel) 65%);
  border-top:3px solid #c9b48a;
}
/* magie rouge — sang-de-bœuf profond */
.magic-card:has(.seal--red){
  background:linear-gradient(180deg,#f0d5d3 0%,var(--panel) 60%);
  border-top:3px solid var(--ox);
}
.magic-card:has(.seal--red) h4{ color:var(--ox); }
/* magie noire — anthracite mystique */
.magic-card:has(.seal--black){
  background:linear-gradient(180deg,#d8d5cf 0%,var(--panel) 60%);
  border-top:3px solid var(--plate);
}

/* ----------------------------------------------------------
   4) Cartes témoignages — teinte par catégorie (via nth-child)
   Card 1 (Love EN) — rose
   Card 2 (Purif FR) — sauge
   Card 3 (Love FR) — rose
   Card 4 (Luck EN) — miel
   ---------------------------------------------------------- */
.t-card{ transition:border-color .3s var(--ease), transform .25s var(--ease); }
.t-card:hover{ transform:translateY(-3px); border-color:var(--brass); }

.t-card:nth-child(1),
.t-card:nth-child(3){
  border-top:3px solid var(--love-mark);
}
.t-card:nth-child(1) .t-card__tag,
.t-card:nth-child(3) .t-card__tag{ color:var(--love-mark); background:linear-gradient(180deg,var(--love-tint) 0%,transparent 100%); }
.t-card:nth-child(1) .t-card__after,
.t-card:nth-child(3) .t-card__after{ background:linear-gradient(160deg,rgba(169,74,65,.09) 0%,transparent 70%); }

.t-card:nth-child(2){
  border-top:3px solid var(--purif-mark);
}
.t-card:nth-child(2) .t-card__tag{ color:var(--purif-mark); background:linear-gradient(180deg,var(--purif-tint) 0%,transparent 100%); }
.t-card:nth-child(2) .t-card__after{ background:linear-gradient(160deg,rgba(74,114,90,.10) 0%,transparent 70%); }

.t-card:nth-child(4){
  border-top:3px solid var(--luck-mark);
}
.t-card:nth-child(4) .t-card__tag{ color:var(--luck-mark); background:linear-gradient(180deg,var(--luck-tint) 0%,transparent 100%); }
.t-card:nth-child(4) .t-card__after{ background:linear-gradient(160deg,rgba(166,119,42,.10) 0%,transparent 70%); }

/* étoiles or plus vif */
.t-card__stars span{ color:var(--luck-mark); }

/* ----------------------------------------------------------
   5) Trust counter — filets colorés
   ---------------------------------------------------------- */
.trust__item:nth-child(1){ border-top:3px solid var(--love-mark); }
.trust__item:nth-child(2){ border-top:3px solid var(--brass); }
.trust__item:nth-child(3){ border-top:3px solid var(--mystic-mark); }
.trust__item:nth-child(4){ border-top:3px solid var(--purif-mark); }
.trust__item:nth-child(5){ border-top:3px solid var(--luck-mark); }

/* ----------------------------------------------------------
   6) Contact form — panneau avec liseré or
   ---------------------------------------------------------- */
.contact-form{
  background:linear-gradient(180deg,#f5efe1 0%,var(--paper) 100%);
  border-top:3px solid var(--brass);
}


/* ============================================================
   Réseaux sociaux — Facebook & Instagram
   ============================================================ */

/* Bloc « Suivre Abel » — section contact */
.social-block{
  margin-top:1.8rem;
  padding-top:1.4rem;
  border-top:1px solid var(--rule);
}
.social-block__label{
  font-family:var(--f-ui);
  font-size:.68rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--brass); margin:0 0 .85rem;
}
.social-links{
  display:flex; gap:.7rem; flex-wrap:wrap;
}
.social-link{
  display:inline-flex; align-items:center; gap:.55em;
  padding:.7rem 1.1rem;
  font-family:var(--f-ui); font-size:.78rem; font-weight:600;
  text-decoration:none; letter-spacing:.02em;
  background:var(--paper); color:var(--ink);
  border:1px solid var(--rule);
  position:relative;
  transition:transform .22s var(--ease), border-color .22s var(--ease), background .22s var(--ease), color .22s var(--ease);
}
.social-link::before{
  content:""; position:absolute; inset:4px;
  border:1px solid transparent; pointer-events:none;
  transition:border-color .22s var(--ease);
}
.social-link svg{ width:18px; height:18px; flex-shrink:0; }
.social-link:hover{ transform:translateY(-2px); }
.social-link:hover::before{ border-color:var(--brass-in); }

/* Facebook — bleu profond au hover */
.social-link--fb:hover{
  background:#1877f2; color:#fff; border-color:#1877f2;
}
/* Instagram — dégradé au hover */
.social-link--ig:hover{
  background:linear-gradient(135deg,#f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
  color:#fff; border-color:#dc2743;
}

/* Version compacte — footer */
.footer__social{
  display:flex; justify-content:center; gap:.6rem;
  margin-bottom:clamp(14px,2vw,20px);
}
.social-link--sm{
  padding:.55rem;
  background:transparent;
  border-color:rgba(207,198,182,.28);
  color:#cfc6b6;
}
.social-link--sm span{ display:none; }
.social-link--sm svg{ width:16px; height:16px; }
.social-link--sm:hover{ color:#f2ede2; border-color:var(--brass-lit); }
.social-link--sm.social-link--fb:hover{ background:transparent; color:#4d95ff; border-color:#4d95ff; }
.social-link--sm.social-link--ig:hover{ background:transparent; color:#e6683c; border-color:#e6683c; }

/* ============================================================
   Consent banner (RGPD)
   ============================================================ */
.consent-banner{
  position:fixed; left:16px; right:16px; bottom:16px; z-index:9999;
  max-width:640px; margin-inline:auto;
  background:var(--paper); color:var(--ink);
  border:1px solid var(--brass); box-shadow:0 8px 32px rgba(0,0,0,.28);
  padding:1rem 1.15rem 1.05rem;
  display:flex; flex-direction:column; gap:.85rem;
  font-family:var(--f-ui);
  opacity:0; transform:translateY(20px);
  transition:opacity .35s var(--ease), transform .35s var(--ease);
}
.consent-banner::before{ content:""; position:absolute; inset:5px; border:1px solid var(--brass-in); pointer-events:none; }
.consent-banner.is-in{ opacity:1; transform:translateY(0); }
.consent-banner.is-out{ opacity:0; transform:translateY(20px); }
.consent-banner__msg{
  margin:0; font-size:.82rem; line-height:1.55; color:var(--ink-soft);
  position:relative; z-index:1;
}
.consent-banner__msg a{ color:var(--ox); text-decoration:underline; text-underline-offset:2px; }
.consent-banner__actions{ display:flex; gap:.6rem; justify-content:flex-end; position:relative; z-index:1; }
.consent-banner__btn{
  padding:.55rem 1rem;
  font-family:var(--f-ui); font-size:.75rem; font-weight:600;
  letter-spacing:.03em; cursor:pointer;
  border:1px solid var(--rule); background:transparent; color:var(--ink);
  transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.consent-banner__btn:hover{ border-color:var(--brass); }
.consent-banner__btn--accept{ background:var(--ox); color:#fff; border-color:var(--ox); }
.consent-banner__btn--accept:hover{ background:var(--ox-lit); border-color:var(--ox-lit); color:#fff; }
@media(max-width:520px){
  .consent-banner{ padding:.9rem; }
  .consent-banner__msg{ font-size:.78rem; }
  .consent-banner__btn{ flex:1; }
}

/* ============================================================
   PHOTOS RITUELLES — bandeaux pleine largeur & illustrations
   Cadres laiton assortis, ratio figé (anti-CLS), légendes gravées.
   ============================================================ */

/* ---------- Bandeau photo pleine largeur (remplace les canvas) ---------- */
.altar-band--photo img{
  display:block;
  width:100%; max-width:var(--wrap); margin-inline:auto;
  aspect-ratio:1584/672; height:auto; object-fit:cover;
  background:var(--plate);
  /* cadre laiton + double filet intérieur (outline négatif = fiable sur <img>) */
  border:1px solid var(--brass);
  outline:1px solid rgba(192,160,92,.30);
  outline-offset:-6px;
}
.altar-band--tall img{ aspect-ratio:1584/560; }

/* ---------- Illustration encadrée dans une section ---------- */
.ritual-photo{
  position:relative; margin:clamp(22px,3.4vw,38px) 0 0;
  border:1px solid var(--brass);
  background:var(--plate);
  overflow:hidden;
}
.ritual-photo::before{
  content:""; position:absolute; inset:5px; z-index:2;
  border:1px solid rgba(192,160,92,.30); pointer-events:none;
}
.ritual-photo img{
  display:block; width:100%; height:auto;
  aspect-ratio:1584/672; object-fit:cover;
}
/* dégradé bas pour lisibilité de la légende */
.ritual-photo figcaption{
  position:absolute; left:0; right:0; bottom:0; z-index:3;
  padding:2.6rem 1.2rem .9rem;
  background:linear-gradient(180deg, transparent 0%, rgba(11,8,5,.82) 100%);
  font-family:var(--f-ui); font-size:.62rem; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--brass-lit); text-align:center;
  text-shadow:0 1px 6px rgba(0,0,0,.7);
}

/* variante étroite (témoignages) — pas de légende, plus courte */
.ritual-photo--narrow{
  max-width:760px; margin-inline:auto;
}
.ritual-photo--narrow img{ aspect-ratio:1400/560; }

/* variante amour — colonne visuelle du svc-feature.
   Ratio 4/3 : assez de présence face à la colonne texte, sans rogner
   le bol ni la clé (le sujet — les mains — est légèrement à droite). */
.ritual-photo--love{ margin:0; }
.ritual-photo--love img{
  aspect-ratio:4/3;
  object-position:54% center;
}

/* ---------- Mobile ---------- */
@media(max-width:760px){
  .ritual-photo figcaption{ font-size:.56rem; letter-spacing:.16em; padding:2rem .8rem .75rem; }
  .ritual-photo--love img{ aspect-ratio:3/2; }
  .altar-band--photo img{ outline-offset:-4px; }
}

/* ============================================================
   MÉTHODE DE TRAVAIL
   ============================================================ */
.method{ background:var(--paper-2); border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); }

/* ---------- Les trois étapes ---------- */
.method__steps{
  list-style:none; margin:clamp(28px,4vw,48px) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(268px,1fr)); gap:16px;
  counter-reset:step;
}
.method-step{
  position:relative;
  background:var(--paper);
  border:1px solid var(--rule);
  border-top:3px solid var(--brass);
  padding:clamp(22px,2.8vw,30px);
  transition:border-color .3s var(--ease), transform .25s var(--ease);
}
.method-step::before{
  content:""; position:absolute; inset:5px;
  border:1px solid transparent; pointer-events:none;
  transition:border-color .3s var(--ease);
}
.method-step:hover{ transform:translateY(-2px); border-color:var(--brass); }
.method-step:hover::before{ border-color:var(--brass-in); }

/* chiffre romain gravé */
.method-step__num{
  display:block;
  font-family:var(--f-display); font-size:2.1rem; line-height:1;
  color:var(--brass); letter-spacing:.06em;
  margin-bottom:.85rem;
}
.method-step h3{
  font-family:var(--f-display); font-size:1.24rem; line-height:1.25;
  margin:0 0 .6em; color:var(--ink);
}
.method-step p{ margin:0; color:var(--ink-soft); font-size:.93rem; line-height:1.68; }

/* ---------- Plaque de durée (5 — 31 jours) ---------- */
.method__duration{
  margin-top:clamp(24px,3.4vw,38px);
  display:flex; align-items:center; gap:clamp(18px,3vw,32px);
  flex-wrap:wrap;
  background:var(--paper); border:1px solid var(--rule);
  padding:clamp(18px,2.4vw,26px);
}
.method__duration-plate{
  flex:none;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:1rem 1.6rem;
  background:radial-gradient(ellipse at 50% 120%, var(--plate-2), var(--plate) 75%);
  border:1px solid var(--brass);
  position:relative;
}
.method__duration-plate::before{
  content:""; position:absolute; inset:4px;
  border:1px solid var(--brass-in); pointer-events:none;
}
.method__duration-range{
  font-family:var(--f-display); font-size:clamp(1.9rem,4vw,2.6rem); line-height:1;
  color:var(--brass-lit); letter-spacing:.02em;
}
.method__duration-range i{
  font-style:normal; color:var(--brass); opacity:.7;
  margin-inline:.12em; font-size:.72em; vertical-align:.12em;
}
.method__duration-unit{
  font-family:var(--f-ui); font-size:.58rem; font-weight:600;
  letter-spacing:.28em; text-transform:uppercase;
  color:var(--brass); margin-top:.5rem;
}
.method__duration-note{
  margin:0; flex:1 1 260px;
  font-family:var(--f-body); font-style:italic;
  font-size:.95rem; line-height:1.65; color:var(--ink-soft);
}

/* ---------- Condition : sincérité ---------- */
.method__condition{
  margin-top:clamp(24px,3.4vw,38px);
  text-align:center;
  max-width:62ch; margin-inline:auto;
  background:var(--panel);
  border:1px solid var(--brass);
  padding:clamp(26px,3.6vw,40px) clamp(20px,3vw,36px);
  position:relative;
}
.method__condition::before{
  content:""; position:absolute; inset:5px;
  border:1px solid var(--brass-in); pointer-events:none;
}
.method__condition-mark{
  width:40px; height:40px; color:var(--ox); margin-bottom:1rem;
}
.method__condition h3{
  font-family:var(--f-display); font-size:clamp(1.34rem,2.4vw,1.66rem);
  margin:0 0 .6em; color:var(--ink);
}
.method__condition p{
  margin:0; color:var(--ink-soft); font-size:.97rem; line-height:1.7;
}

@media(max-width:600px){
  .method__duration{ flex-direction:column; align-items:stretch; text-align:center; }
  .method__duration-plate{ align-self:center; }
  .method__duration-note{ flex:none; }
}

/* ============================================================
   Nav à 7 items — évite la casse entre 1000 et 1180px
   ============================================================ */
/* un libellé de menu ne doit jamais se couper en deux lignes */
.nav a{ white-space:nowrap; }

/* zone serrée : on resserre gap et fonte plutôt que de casser la ligne */
@media (min-width:1001px) and (max-width:1180px){
  .nav{ gap:.85rem; }
  .nav a{ font-size:.66rem; letter-spacing:.1em; }
}


/* ============================================================
   WIDGET NEW YORK LIVE — heure réelle + disponibilité
   Planche d'encre sertie de laiton, comme les bandeaux d'autel.
   ============================================================ */
.nyc-live{
  position:relative;
  margin:0 0 1.5rem;
  padding:clamp(16px,2.2vw,22px) clamp(18px,2.4vw,24px);
  background:radial-gradient(ellipse at 50% 120%, var(--plate-2), var(--plate) 78%);
  border:1px solid var(--brass);
}
.nyc-live::before{
  content:""; position:absolute; inset:5px;
  border:1px solid var(--brass-in); pointer-events:none;
}
.nyc-live > *{ position:relative; z-index:1; }

.nyc-live__top{
  display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap; margin-bottom:.7rem;
}
.nyc-live__city{
  font-family:var(--f-ui); font-size:.6rem; font-weight:700;
  letter-spacing:.28em; text-transform:uppercase; color:var(--brass);
}

/* pastille de statut */
.nyc-live__status{
  display:inline-flex; align-items:center; gap:.45em;
  font-family:var(--f-ui); font-size:.6rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:#7fd39b;
}
.nyc-live__dot{
  width:7px; height:7px; border-radius:50%;
  background:#4ade80; box-shadow:0 0 0 3px rgba(74,222,128,.16);
  animation:nycPulse 2.4s ease-in-out infinite;
}
@keyframes nycPulse{
  0%,100%{ box-shadow:0 0 0 3px rgba(74,222,128,.16); }
  50%    { box-shadow:0 0 0 6px rgba(74,222,128,.05); }
}
/* hors plage horaire (si OPEN_FROM/OPEN_TO sont resserrés) */
.nyc-live__status.is-closed{ color:var(--brass-lit); }
.nyc-live__status.is-closed .nyc-live__dot{
  background:var(--brass); box-shadow:0 0 0 3px rgba(156,123,58,.18); animation:none;
}

/* horloge */
.nyc-live__clock{
  margin:0; display:flex; align-items:baseline; gap:.5rem;
  font-family:var(--f-display);
  font-size:clamp(1.7rem,3.4vw,2.2rem); line-height:1;
  color:#f2ede2;
}
.nyc-live__clock time{
  font-variant-numeric:tabular-nums;   /* largeur fixe : pas de tremblement */
  letter-spacing:.02em;
}
.nyc-live__tz{
  font-family:var(--f-ui); font-size:.58rem; font-weight:700;
  letter-spacing:.22em; color:var(--brass);
}
.nyc-live__note{
  margin:.7rem 0 0;
  font-family:var(--f-ui); font-size:.68rem; line-height:1.5;
  color:#9d9486;
}

/* ============================================================
   CTA TEMPORISÉ — encart de coin, jamais bloquant
   ============================================================ */
.cta-nudge{
  position:fixed; right:24px; bottom:100px; z-index:280;
  width:min(310px, calc(100vw - 48px));
  padding:1.15rem 1.2rem 1.1rem;
  background:var(--paper); border:1px solid var(--brass);
  box-shadow:0 10px 34px rgba(0,0,0,.24);
  opacity:0; transform:translateY(14px);
  transition:opacity .34s var(--ease), transform .34s var(--ease);
}
.cta-nudge::before{
  content:""; position:absolute; inset:5px;
  border:1px solid var(--brass-in); pointer-events:none;
}
.cta-nudge.is-in{ opacity:1; transform:translateY(0); }
.cta-nudge > *{ position:relative; z-index:1; }

.cta-nudge__close{
  position:absolute; top:.5rem; right:.6rem; z-index:2;
  width:26px; height:26px; padding:0; line-height:1;
  background:transparent; border:0; cursor:pointer;
  font-size:1.3rem; color:var(--slate);
  transition:color .2s var(--ease);
}
.cta-nudge__close:hover{ color:var(--ox); }

.cta-nudge__title{
  margin:0 0 .5rem; padding-right:1.4rem;
  font-family:var(--f-display); font-size:1.08rem; line-height:1.3; color:var(--ink);
}
.cta-nudge__body{
  margin:0 0 1rem;
  font-size:.85rem; line-height:1.6; color:var(--ink-soft);
}
.cta-nudge .btn--sm{ padding:.6rem 1rem; font-size:.78rem; }

/* jamais sur mobile : la .mobilebar occupe déjà cet espace */
@media(max-width:760px){ .cta-nudge{ display:none !important; } }
/* laisse la place au bouton WhatsApp flottant */
@media(min-width:761px){ .cta-nudge{ bottom:100px; } }

/* ============================================================
   À PROPOS — mise en page « frontispice »
   Rompt avec le gabarit 2 colonnes de #nyc et #contact :
   en-tête centré → portrait en pleine composition → texte en
   double colonne (page d'ouvrage) → chronologie horizontale.
   ============================================================ */

/* ---------- En-tête centré ---------- */
.about__head{ text-align:center; max-width:56ch; margin-inline:auto; }
.about__title{
  font-family:var(--f-display); font-weight:400;
  font-size:clamp(1.9rem,4.2vw,3rem); line-height:1.14;
  color:var(--ink); margin:.5rem 0 0;
}
/* filet losangé sous le titre */
.about__rule{
  display:block; width:120px; height:9px; margin:1.5rem auto 0;
  position:relative;
}
.about__rule::before{
  content:""; position:absolute; top:4px; left:0; right:0;
  height:1px; background:var(--brass-in);
}
.about__rule::after{
  content:""; position:absolute; top:1px; left:50%; translate:-50% 0;
  width:7px; height:7px; background:var(--paper-2);
  border:1px solid var(--brass); rotate:45deg;
}

/* ---------- Portrait : composition complète, centré ---------- */
.about__plate{
  position:relative; margin:clamp(30px,4.4vw,52px) auto 0;
  max-width:680px;
  border:1px solid var(--brass); background:var(--plate);
  overflow:hidden;
}
.about__plate::before{
  content:""; position:absolute; inset:6px; z-index:2;
  border:1px solid var(--brass-in); pointer-events:none;
}
.about__plate img{
  display:block; width:100%; height:auto;
  aspect-ratio:1300/1040;          /* ratio natif : rien n'est rogné */
  object-fit:cover;
}
.about__plate::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:34%;
  background:linear-gradient(180deg,transparent,rgba(11,8,5,.8));
  z-index:2; pointer-events:none;
}
.about__plate .about__caption{ z-index:3; }

/* ---------- Texte en double colonne ---------- */
.about__columns{
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(24px,3.6vw,54px);
  max-width:960px; margin:clamp(28px,3.8vw,46px) auto 0;
}
.about__col p{ margin:0; color:var(--ink-soft); line-height:1.78; }
/* lettrine sur la première colonne seulement */
.about__col:first-child p::first-letter{
  font-family:var(--f-display); float:left;
  font-size:3.4em; line-height:.8; padding:.06em .1em 0 0;
  color:var(--ox); font-weight:400;
}

/* ---------- Chronologie horizontale ---------- */
.about__line{
  list-style:none; margin:clamp(34px,4.6vw,58px) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:1px; background:var(--rule);          /* le gap fait les filets */
  border-block:1px solid var(--rule);
}
.about__step{
  position:relative;
  background:var(--paper-2);
  padding:clamp(20px,2.4vw,26px) clamp(14px,1.8vw,20px);
}
.about__step-mark{
  display:block; width:8px; height:8px; margin-bottom:.9rem;
  background:var(--ox); rotate:45deg;
}
.about__step b{
  display:block; font-family:var(--f-ui); font-size:.63rem; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--brass);
  margin-bottom:.5rem; line-height:1.4;
}
.about__step span{
  display:block; font-size:.87rem; line-height:1.62; color:var(--ink-soft);
}

/* ---------- Adaptations ---------- */
@media(max-width:860px){
  .about__columns{ grid-template-columns:1fr; }
  .about__col:first-child p{ margin-bottom:1.1rem; }
  .about__line{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:520px){
  .about__line{ grid-template-columns:1fr; }
}

/* ============================================================
   RÉGION — bascule US / International
   Même principe que la langue : les deux variantes restent dans
   le DOM et sont masquées en CSS. Indispensable pour le SEO —
   Googlebot explore depuis des IP américaines, retirer le variant
   international du DOM le rendrait définitivement non indexable.
   ============================================================ */
html[data-region="us"]   [data-region="intl"]{ display:none !important; }
html[data-region="intl"] [data-region="us"]  { display:none !important; }

/* Avant que le JS ne se prononce, on affiche la variante US
   (marché principal) plutôt que rien : évite tout flash vide. */
html:not([data-region]) [data-region="intl"]{ display:none !important; }

/* ---------- Sélecteur de région dans l'en-tête ---------- */
.region-toggle button{ min-width:2.6em; }
@media(max-width:1180px){
  /* nav déjà serrée à 7 items : on réduit le sélecteur */
  .region-toggle button{ min-width:2.2em; font-size:.6rem; }
}
@media(max-width:1000px){
  /* place limitée à côté du hamburger : le sélecteur passe dans le menu */
  .region-toggle{ display:none; }
  body.nav-open .region-toggle{
    display:inline-flex; position:fixed; top:calc(2rem + 46px); right:var(--gutter); z-index:1002;
  }
}

/* ---------- Horloge : décalage du visiteur ---------- */
.nyc-live__visitor{
  display:flex; align-items:baseline; gap:.5rem;
  margin:.55rem 0 0; padding-top:.55rem;
  border-top:1px solid rgba(192,160,92,.22);
  font-family:var(--f-ui); font-size:.63rem;
  letter-spacing:.14em; text-transform:uppercase; color:#9d9486;
}
.nyc-live__visitor b{
  font-family:var(--f-display); font-size:1.05rem; font-weight:400;
  letter-spacing:.02em; color:#cfc6b6; text-transform:none;
  font-variant-numeric:tabular-nums;
}
.nyc-live__visitor em{
  font-style:normal; font-size:.58rem; font-weight:700;
  letter-spacing:.1em; color:var(--brass);
}

/* ---------- Note internationale sous le bouton d'appel ---------- */
.contact__intl-note{
  margin:.6rem 0 0; text-align:center;
  font-family:var(--f-ui); font-size:.7rem; line-height:1.5;
  color:var(--slate);
}

/* ============================================================
   SECTION FRANCE — pendant de #nyc pour la région internationale
   ============================================================ */
.france{ background:var(--paper-2); border-block:1px solid var(--rule); }
.france__grid{
  display:grid; grid-template-columns:1.1fr .9fr;
  gap:clamp(28px,4.5vw,64px); align-items:center;
}
.france__coverage{
  margin:1.6rem 0 0; padding-top:1.2rem;
  border-top:1px solid var(--rule);
  font-family:var(--f-ui); font-size:.68rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--brass);
}

/* carte de droite */
.france__card{
  position:relative; background:var(--paper);
  border:1px solid var(--brass);
  padding:clamp(24px,3vw,34px);
}
.france__card::before{
  content:""; position:absolute; inset:6px;
  border:1px solid var(--brass-in); pointer-events:none;
}
.france__card > *{ position:relative; z-index:1; }

/* le numéro, traité comme une plaque gravée */
.france__phone{
  display:block; text-align:center; text-decoration:none;
  margin:0 0 1.6rem; padding:1.1rem 1rem;
  background:radial-gradient(ellipse at 50% 120%, var(--plate-2), var(--plate) 78%);
  border:1px solid var(--brass);
  transition:transform .22s var(--ease);
}
.france__phone:hover{ transform:translateY(-2px); }
.france__phone-label{
  display:block; font-family:var(--f-ui); font-size:.58rem; font-weight:700;
  letter-spacing:.26em; text-transform:uppercase; color:var(--brass);
  margin-bottom:.5rem;
}
.france__phone-num{
  display:block; font-family:var(--f-display);
  font-size:clamp(1.5rem,3.1vw,1.95rem); line-height:1;
  color:#f2ede2; letter-spacing:.02em;
  font-variant-numeric:tabular-nums;
}
.france__phone-intl{
  display:block; margin-top:.45rem;
  font-family:var(--f-ui); font-size:.64rem; letter-spacing:.1em; color:#9d9486;
}

@media(max-width:1000px){
  .france__grid{ grid-template-columns:1fr; }
}

/* adresse du cabinet France */
.france__address{
  display:flex; align-items:flex-start; gap:.6rem;
  margin:1.4rem 0 0; padding:.9rem 1rem;
  background:var(--panel); border-left:3px solid var(--brass);
  font-style:normal; font-size:.9rem; line-height:1.55; color:var(--ink-soft);
}
.france__address svg{ width:18px; height:18px; color:var(--ox); flex:none; margin-top:.15rem; }
.france__address b{ display:block; color:var(--ink); font-weight:600; }

/* puce mise en avant dans les listes (ex. appel non surtaxé) */
.nyc__list-hi{ position:relative; }
.nyc__list-hi svg{ color:var(--purif-mark) !important; }
.nyc__list-hi strong{ color:var(--purif-mark); }