*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
:root {
  --noir:#0b1614; --teal-prof:#0f2220; --teal-mid:#1a3d3a; --teal-clair:#2a5550;
  --rose:#c8a48a; --rose-pale:#e8c5a0; --or:#c4a96b; --blanc:#f0ece3; --gris:#8a9490;
  --serif:'Bodoni Moda',Georgia,serif; --sans:'DM Sans',sans-serif;
}
html { scroll-behavior:smooth; }
body { background:var(--noir); color:var(--blanc); font-family:var(--sans); font-weight:300; overflow-x:hidden; cursor:none; }
body::before {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:1000; opacity:.03;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:180px;
}
#cur { position:fixed; width:6px; height:6px; background:var(--or); border-radius:50%; pointer-events:none; z-index:9999; transform:translate(-50%,-50%); transition:width .3s,height .3s; }
#cur-ring { position:fixed; width:28px; height:28px; border:1px solid rgba(196,169,107,.3); border-radius:50%; pointer-events:none; z-index:9998; transform:translate(-50%,-50%); }
@media(max-width:900px){#cur,#cur-ring{display:none}body{cursor:auto}}

/* ── NAV ── */
nav { position:fixed; top:0; left:0; right:0; z-index:500; display:flex; align-items:center; justify-content:space-between; padding:1.4rem 4rem; transition:background .4s; }
nav.scrolled { background:rgba(11,22,20,.94); backdrop-filter:blur(12px); border-bottom:1px solid rgba(196,169,107,.1); }
.nav-logo { display:flex; align-items:center; gap:1rem; text-decoration:none; }
.nav-logo-icon { width:36px; height:36px; object-fit:contain; }
.nav-logo-txt { display:flex; flex-direction:column; line-height:1.1; }
.nav-logo-txt .name { font-family:var(--serif); font-size:1rem; font-weight:500; color:var(--blanc); letter-spacing:.04em; }
.nav-logo-txt .sub { font-family:var(--sans); font-size:.5rem; font-weight:300; letter-spacing:.3em; text-transform:uppercase; color:var(--gris); }
.nav-links { display:flex; gap:2.5rem; list-style:none; }
.nav-links a { font-family:var(--sans); font-size:.78rem; font-weight:400; letter-spacing:.2em; text-transform:uppercase; color:rgba(240,236,227,.82); text-decoration:none; transition:color .3s; }
.nav-links a:hover { color:var(--or); }
/* Bouton fermer masqué sur desktop */
.nav-close { display:none; }
.nav-links a:hover { color:var(--or); }
.nav-cta { font-family:var(--sans); font-size:.62rem; font-weight:300; letter-spacing:.25em; text-transform:uppercase; color:var(--noir); background:var(--or); padding:.65rem 1.4rem; text-decoration:none; transition:background .3s; }
.nav-cta:hover { background:var(--rose-pale); }
@media(max-width:900px){ .nav-links,.nav-cta { display:none; } nav { padding:1.2rem 1.5rem; } }

/* ── HERO ── */
#hero { position:relative; height:100vh; display:flex; flex-direction:column; justify-content:flex-end; padding:0 4rem 7rem; overflow:hidden; }
.hero-bg { position:absolute; inset:0; z-index:0; background-image:var(--hero-bg-url); background-size:cover; background-position:center; opacity:.42; }
.hero-overlay { position:absolute; inset:0; z-index:1; background:linear-gradient(to top,rgba(11,22,20,.95) 0%,rgba(11,22,20,.45) 45%,rgba(11,22,20,.15) 100%),linear-gradient(to right,rgba(11,22,20,.35) 0%,transparent 65%); }
.hero-tag { position:relative; z-index:2; font-family:var(--sans); font-size:.58rem; font-weight:100; letter-spacing:.4em; text-transform:uppercase; color:var(--or); display:flex; align-items:center; gap:1rem; margin-bottom:1.8rem; opacity:0; animation:fadeUp .9s ease .3s forwards; }
.hero-tag::before { content:''; width:30px; height:1px; background:var(--or); opacity:.5; }
.hero-title { position:relative; z-index:2; font-family:var(--serif); font-size:clamp(3.4rem,7.5vw,7.8rem); font-weight:400; line-height:.88; font-variation-settings:'opsz' 96; letter-spacing:-.02em; color:var(--blanc); opacity:0; animation:fadeUp 1s ease .55s forwards; }
.hero-title em { font-style:italic; color:var(--or); }
.hero-sub { position:relative; z-index:2; margin-top:2.5rem; max-width:500px; font-family:var(--sans); font-size:.98rem; font-weight:200; line-height:1.9; color:var(--gris); opacity:0; animation:fadeUp .9s ease .8s forwards; }
.hero-cta { position:relative; z-index:2; margin-top:3rem; display:flex; gap:2rem; align-items:center; opacity:0; animation:fadeUp .9s ease 1.05s forwards; }
.btn-or { font-family:var(--sans); font-size:.68rem; font-weight:300; letter-spacing:.2em; text-transform:uppercase; color:var(--noir); background:var(--or); padding:1rem 2.8rem; text-decoration:none; transition:background .3s,transform .2s; }
.btn-or:hover { background:var(--rose-pale); transform:translateY(-2px); }
.btn-outline { font-family:var(--sans); font-size:.68rem; font-weight:300; letter-spacing:.2em; text-transform:uppercase; color:var(--gris); text-decoration:none; padding-bottom:2px; border-bottom:1px solid rgba(138,148,144,.3); transition:color .3s,border-color .3s; }
.btn-outline:hover { color:var(--blanc); border-color:var(--blanc); }
.hero-scroll { position:absolute; right:4rem; bottom:3.5rem; z-index:2; display:flex; flex-direction:column; align-items:center; gap:.6rem; opacity:0; animation:fadeUp .9s ease 1.3s forwards; }
.hero-scroll span { font-family:var(--sans); font-size:.55rem; font-weight:300; letter-spacing:.3em; text-transform:uppercase; color:var(--gris); writing-mode:vertical-rl; }
@media(max-width:900px){
  .hero-scroll { display:none; }
  .hero-cta { flex-direction:column; align-items:flex-start; gap:1.2rem; }
  .btn-outline { border-bottom:1px solid rgba(138,148,144,.3); }
}
.scroll-line { width:1px; height:55px; background:linear-gradient(to bottom,var(--or),transparent); animation:pulse 2.2s ease-in-out infinite; }
@keyframes pulse { 0%,100%{opacity:.25} 50%{opacity:1} }
@keyframes fadeUp { from{opacity:0;transform:translateY(22px)} to{opacity:1;transform:translateY(0)} }
@media(max-width:900px){ #hero { padding:0 1.5rem 4rem; } }

.divider { width:100%; height:1px; background:linear-gradient(to right,transparent,rgba(196,169,107,.2),transparent); }

/* ── SECTIONS ── */
section { padding:8rem 4rem; }
.s-label { font-family:var(--sans); font-size:.56rem; font-weight:200; letter-spacing:.35em; text-transform:uppercase; color:var(--or); display:flex; align-items:center; gap:.8rem; margin-bottom:2.5rem; }
.s-label::after { content:''; width:50px; height:1px; background:var(--or); opacity:.4; }
h2 { font-family:var(--serif); font-size:clamp(2.3rem,4.2vw,3.7rem); font-weight:400; line-height:1.05; letter-spacing:-.01em; color:var(--blanc); font-variation-settings:'opsz' 72; }
h2 em { font-style:italic; color:var(--or); }
.reveal { opacity:0; transform:translateY(28px); transition:opacity .85s ease,transform .85s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.d1 { transition-delay:.1s; } .d2 { transition-delay:.2s; } .d3 { transition-delay:.3s; }
@media(max-width:900px){ section { padding:4.5rem 1.5rem; } }

/* ── À PROPOS ── */
#apropos { background:var(--teal-prof); display:grid; grid-template-columns:1fr 1fr; gap:6rem; align-items:center; }
.apropos-body { margin-top:2rem; }
.apropos-body p { font-size:1rem; line-height:1.9; color:var(--gris); margin-top:1.2rem; }
.apropos-body strong { color:var(--rose-pale); font-weight:300; }
.atouts { margin-top:2.5rem; display:flex; flex-direction:column; gap:.8rem; }
.atout { display:flex; align-items:flex-start; gap:1rem; padding:.9rem 1.1rem; border:1px solid rgba(196,169,107,.1); background:rgba(196,169,107,.03); transition:border-color .3s,background .3s; }
.atout:hover { border-color:rgba(196,169,107,.25); background:rgba(196,169,107,.06); }
.atout-icon { color:var(--or); flex-shrink:0; margin-top:.1rem; }
.atout-text { font-size:.88rem; line-height:1.65; color:var(--gris); }
.atout-text strong { font-family:var(--serif); font-style:italic; font-weight:400; color:var(--blanc); display:block; margin-bottom:.15rem; font-variation-settings:'opsz' 24; }

/* LOGO SIDE */
.apropos-right { display:flex; flex-direction:column; align-items:center; gap:3rem; }
.logo-block { display:flex; flex-direction:column; align-items:center; gap:.6rem; }
.logo-block img { width:160px; height:160px; object-fit:contain; }
.logo-block .brand-name { font-family:var(--serif); font-size:1.5rem; font-weight:500; color:var(--blanc); letter-spacing:.06em; text-align:center; margin-top:.3rem; }
.logo-block .brand-sub { font-family:var(--sans); font-size:.58rem; font-weight:300; letter-spacing:.35em; text-transform:uppercase; color:var(--gris); }
.apropos-chiffres { display:grid; grid-template-columns:1fr 1fr; gap:2px; width:100%; }
.chiffre { background:rgba(196,169,107,.05); border:1px solid rgba(196,169,107,.08); padding:1.6rem 1.5rem; transition:background .3s; }
.chiffre:hover { background:rgba(196,169,107,.1); }
.chiffre-val { font-family:var(--serif); font-size:2.3rem; font-weight:400; color:var(--or); letter-spacing:-.03em; display:block; font-variation-settings:'opsz' 96; }
.chiffre-lbl { font-family:var(--serif-sc); font-size:.6rem; font-weight:300; letter-spacing:.2em; text-transform:uppercase; color:var(--gris); margin-top:.3rem; display:block; }
@media(max-width:900px){ #apropos { grid-template-columns:1fr; gap:3rem; } }

/* ── SERVICES ── */
#services { background:var(--noir); }
.services-head { display:grid; grid-template-columns:1fr 1fr; gap:4rem; margin-bottom:5rem; align-items:end; }
.services-head p { font-size:1rem; line-height:1.85; color:var(--gris); }
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; }
.srv { background:var(--teal-prof); padding:2.8rem 2.2rem; position:relative; overflow:hidden; transition:background .4s; display:flex; flex-direction:column; gap:1rem; }
.srv::before { content:''; position:absolute; top:0; left:0; width:100%; height:2px; background:var(--or); transform:scaleX(0); transform-origin:left; transition:transform .4s; }
.srv:hover::before { transform:scaleX(1); }
.srv:hover { background:var(--teal-mid); }
.srv-num { font-family:var(--sans); font-size:.58rem; font-weight:300; letter-spacing:.25em; text-transform:uppercase; color:var(--or); opacity:.5; }
.srv-icon { width:34px; height:34px; border:1px solid rgba(196,169,107,.2); display:flex; align-items:center; justify-content:center; color:var(--or); }
.srv-title { font-family:var(--serif); font-size:1.18rem; font-weight:400; font-style:italic; color:var(--blanc); line-height:1.2; font-variation-settings:'opsz' 36; }
.srv-desc { font-size:.87rem; line-height:1.75; color:var(--gris); flex:1; }
.srv-tags { display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.4rem; }
.srv-tag { font-family:var(--sans); font-size:.52rem; font-weight:300; letter-spacing:.13em; text-transform:uppercase; color:var(--or); border:1px solid rgba(196,169,107,.2); padding:.2rem .6rem; }
@media(max-width:1024px){ .services-grid { grid-template-columns:1fr 1fr; } }
@media(max-width:900px){ .services-head { grid-template-columns:1fr; gap:1.5rem; } .services-grid { grid-template-columns:1fr; } }

/* ── RÉALISATIONS + INSTAGRAM WIDGET ── */
#realisations { background:var(--teal-prof); }
.real-head { display:grid; grid-template-columns:1fr 1fr; gap:4rem; margin-bottom:4rem; align-items:end; }
.real-head p { font-size:1rem; line-height:1.85; color:var(--gris); }

.ig-widget {
  border:1px solid rgba(196,169,107,.15);
  background:rgba(196,169,107,.03);
  overflow:hidden;
}
.ig-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:1.2rem 1.5rem;
  border-bottom:1px solid rgba(196,169,107,.1);
}
.ig-profile { display:flex; align-items:center; gap:1rem; }
.ig-avatar {
  width:44px; height:44px; border-radius:50%;
  background:linear-gradient(135deg,var(--teal-mid),var(--or));
  display:flex; align-items:center; justify-content:center;
  font-family:var(--serif); font-size:1.1rem; color:var(--blanc); font-weight:400;
  flex-shrink:0;
}
.ig-info { display:flex; flex-direction:column; gap:.2rem; }
.ig-handle { font-family:var(--sans); font-size:.85rem; font-weight:400; color:var(--blanc); }
.ig-name { font-family:var(--sans); font-size:.65rem; font-weight:300; color:var(--gris); letter-spacing:.05em; }
.ig-btn {
  font-family:var(--sans); font-size:.62rem; font-weight:300; letter-spacing:.18em; text-transform:uppercase;
  color:var(--noir); background:var(--or); padding:.5rem 1.2rem; text-decoration:none;
  display:flex; align-items:center; gap:.4rem; transition:background .3s;
  flex-shrink:0;
}
.ig-btn:hover { background:var(--rose-pale); }
.ig-btn svg { width:12px; height:12px; }

.ig-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:2px;
  padding:2px;
}
.ig-cell {
  aspect-ratio:1/1; position:relative; overflow:hidden;
  background:var(--teal-mid); cursor:pointer;
}
.ig-cell img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease,opacity .4s; }
.ig-cell:hover img { transform:scale(1.05); opacity:.8; }
.ig-cell-overlay {
  position:absolute; inset:0; z-index:1;
  background:rgba(11,22,20,.65);
  display:flex; align-items:center; justify-content:center;
  opacity:0; transition:opacity .3s;
}
.ig-cell:hover .ig-cell-overlay { opacity:1; }
.ig-cell-overlay svg { color:var(--blanc); }

/* Placeholder cells pour les cases vides */
.ig-cell-empty {
  aspect-ratio:1/1; background:var(--teal-mid);
  border:1px solid rgba(196,169,107,.08);
  display:flex; align-items:center; justify-content:center;
}
.ig-cell-empty svg { opacity:.15; }

.ig-footer {
  padding:1rem 1.5rem;
  border-top:1px solid rgba(196,169,107,.1);
  display:flex; align-items:center; justify-content:space-between;
}
.ig-footer span { font-family:var(--sans); font-size:.65rem; font-weight:300; color:var(--gris); }
.ig-footer a { font-family:var(--sans); font-size:.65rem; font-weight:300; color:var(--or); text-decoration:none; letter-spacing:.1em; }
.ig-footer a:hover { text-decoration:underline; }
@media(max-width:900px){ .real-head { grid-template-columns:1fr; gap:1.5rem; } .ig-grid { grid-template-columns:repeat(3,1fr); } }

/* ── PROCESSUS ── */
#processus { background:var(--noir); }
.proc-intro { margin-bottom:4rem; max-width:600px; }
.proc-intro p { font-size:1rem; line-height:1.85; color:var(--gris); margin-top:1.5rem; }
.proc-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; }
.etape { background:var(--teal-prof); padding:2.8rem 2rem; border-top:1px solid rgba(196,169,107,.08); transition:background .3s; }
.etape:hover { background:var(--teal-mid); }
.etape-n { font-family:var(--serif); font-size:5rem; font-weight:400; color:rgba(196,169,107,.07); line-height:1; letter-spacing:-.05em; margin-bottom:.8rem; }
.etape-title { font-family:var(--serif); font-size:1.1rem; font-weight:400; font-style:italic; color:var(--blanc); margin-bottom:.8rem; font-variation-settings:'opsz' 36; }
.etape-desc { font-size:.85rem; line-height:1.75; color:var(--gris); }
@media(max-width:1024px){ .proc-grid { grid-template-columns:1fr 1fr; } }

/* ── CONTACT ── */
#contact { background:var(--teal-prof); display:grid; grid-template-columns:1fr 1fr; gap:7rem; align-items:start; }
.contact-left p { font-size:1rem; line-height:1.85; color:var(--gris); margin-top:1.8rem; margin-bottom:3rem; }
.contact-details { display:flex; flex-direction:column; gap:1.5rem; }
.cd-item { display:flex; flex-direction:column; gap:.3rem; }
.cd-item .lbl { font-family:var(--serif-sc); font-size:.58rem; font-weight:300; letter-spacing:.25em; text-transform:uppercase; color:var(--or); opacity:.6; }
.cd-item a,.cd-item span { font-size:.98rem; font-weight:300; color:var(--rose-pale); text-decoration:none; transition:color .3s; }
.cd-item a:hover { color:var(--or); }
.form { display:flex; flex-direction:column; gap:1.4rem; }
.fg { display:flex; flex-direction:column; gap:.4rem; }
.fg label { font-family:var(--sans); font-size:.54rem; font-weight:300; letter-spacing:.3em; text-transform:uppercase; color:var(--gris); }
.fg input,.fg select,.fg textarea { background:rgba(255,255,255,.03); border:none; border-bottom:1px solid rgba(196,169,107,.2); color:var(--blanc); font-family:var(--sans); font-size:.95rem; font-weight:300; padding:.85rem .2rem; outline:none; resize:none; appearance:none; transition:border-color .3s; }
.fg input:focus,.fg select:focus,.fg textarea:focus { border-color:var(--or); }
.fg select option { background:var(--teal-prof); color:var(--blanc); }
.fg input::placeholder,.fg textarea::placeholder { color:rgba(138,148,144,.35); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; }
.btn-submit { font-family:var(--sans); font-size:.68rem; font-weight:300; letter-spacing:.2em; text-transform:uppercase; color:var(--noir); background:var(--or); border:none; padding:1rem 2.5rem; cursor:pointer; align-self:flex-start; transition:background .3s,transform .2s; margin-top:.5rem; }
.btn-submit:hover { background:var(--rose-pale); transform:translateY(-2px); }
@media(max-width:900px){ #contact { grid-template-columns:1fr; gap:3rem; } .form-row { grid-template-columns:1fr; } }

/* ── FOOTER ── */
footer { background:var(--noir); padding:2.5rem 4rem; display:flex; align-items:center; justify-content:space-between; border-top:1px solid rgba(196,169,107,.08); }
.ft-logo { display:flex; align-items:center; gap:.9rem; text-decoration:none; }
.ft-logo img { width:28px; height:28px; object-fit:contain; }
.ft-logo-txt { display:flex; flex-direction:column; line-height:1.1; }
.ft-logo-txt .name { font-family:var(--serif); font-size:.9rem; font-weight:500; color:var(--blanc); letter-spacing:.04em; }
.ft-logo-txt .sub { font-family:var(--sans); font-size:.48rem; font-weight:300; letter-spacing:.28em; text-transform:uppercase; color:var(--gris); }
.ft-copy { font-family:var(--sans); font-size:.57rem; font-weight:100; letter-spacing:.15em; color:var(--gris); }
.ft-links { display:flex; gap:2rem; list-style:none; }
.ft-links a { font-family:var(--sans); font-size:.57rem; font-weight:300; letter-spacing:.13em; text-transform:uppercase; color:var(--gris); text-decoration:none; transition:color .3s; }
.ft-links a:hover { color:var(--or); }
@media(max-width:900px){ footer { flex-direction:column; gap:1.5rem; text-align:center; } }

/* ── INSTAGRAM NOTE ── */
.ig-note {
  padding:1rem 1.5rem;
  border-top:1px solid rgba(196,169,107,.1);
  font-family:var(--sans); font-size:.8rem; line-height:1.7; color:var(--gris);
}
.ig-note a { color:var(--or); text-decoration:none; }
.ig-note a:hover { text-decoration:underline; }
.ig-note strong { color:var(--blanc); font-weight:300; }
.ig-feed-plugin { padding:1rem; }
.ig-ph { width:100%; height:100%; }

/* ── PHRASE ACCOMPAGNEMENT SERVICES ── */
.services-note {
  margin-top: 3px;
}
.services-note-inner {
  display: flex;
  align-items: flex-start;
  gap: 1.2rem;
  padding: 2rem 2.5rem;
  background: var(--teal-mid);
  border-left: 2px solid var(--or);
}
.services-note-icon {
  color: var(--or);
  flex-shrink: 0;
  margin-top: .15rem;
}
.services-note-inner p {
  font-family: var(--serif);
  font-size: 1.05rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1.75;
  color: var(--rose-pale);
  margin: 0;
}




/* ══════════════════════════════════════
   WPFORMS — Charte Trajectoire v4
   ══════════════════════════════════════ */

/* Reset général */
.wpforms-container { width:100% !important; }
.wpforms-form { display:flex !important; flex-direction:column !important; gap:1.2rem !important; }
.wpforms-title, .wpforms-description, .wpforms-required-label { display:none !important; }
.wpforms-form * { box-sizing:border-box !important; }

/* Chaque champ */
.wpforms-field { padding:0 !important; margin:0 0 1.2rem 0 !important; }

/* Label principal */
.wpforms-field-label {
  font-family:'DM Sans',sans-serif !important;
  font-size:.54rem !important;
  font-weight:300 !important;
  letter-spacing:.3em !important;
  text-transform:uppercase !important;
  color:#8a9490 !important;
  margin:0 0 .5rem 0 !important;
  padding:0 !important;
  display:block !important;
  float:none !important;
  width:100% !important;
}

/* Sous-labels (Prénom/Nom) — invisibles mais sans impact layout */
.wpforms-field-sublabel {
  visibility:hidden !important;
  height:0 !important;
  line-height:0 !important;
  font-size:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  display:block !important;
}

/* Champ Nom : deux colonnes */
.wpforms-field-name > .wpforms-field-row {
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-end !important;
  gap:1.5rem !important;
  width:100% !important;
  float:none !important;
}
.wpforms-field-name > .wpforms-field-row::before,
.wpforms-field-name > .wpforms-field-row::after { display:none !important; }
.wpforms-field-name .wpforms-field-row-block {
  flex:1 1 0 !important;
  width:auto !important;
  float:none !important;
  padding:0 !important;
  margin:0 !important;
  min-width:0 !important;
}
.wpforms-field-name .wpforms-field-row-block input {
  width:100% !important;
}

/* Tous les inputs / select / textarea */
.wpforms-form input[type=text],
.wpforms-form input[type=email],
.wpforms-form input[type=tel],
.wpforms-form input[type=url],
.wpforms-form input[type=number],
.wpforms-form textarea,
.wpforms-form select {
  display:block !important;
  float:none !important;
  width:100% !important;
  background:transparent !important;
  border:none !important;
  border-bottom:1px solid rgba(196,169,107,.3) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  -webkit-box-shadow:none !important;
  color:#f0ece3 !important;
  font-family:'DM Sans',sans-serif !important;
  font-size:.95rem !important;
  font-weight:300 !important;
  line-height:1.5 !important;
  padding:.7rem 0 !important;
  margin:0 !important;
  outline:none !important;
  transition:border-color .3s !important;
  -webkit-appearance:none !important;
  appearance:none !important;
}
.wpforms-form input[type=text]:focus,
.wpforms-form input[type=email]:focus,
.wpforms-form input[type=tel]:focus,
.wpforms-form textarea:focus,
.wpforms-form select:focus {
  border-bottom-color:#c4a96b !important;
  box-shadow:none !important;
  outline:none !important;
}

/* Placeholder */
.wpforms-form input::placeholder,
.wpforms-form textarea::placeholder {
  color:rgba(240,236,227,.45) !important;
  font-family:'DM Sans',sans-serif !important;
  font-weight:300 !important;
}

/* Select options */
.wpforms-form select option { background:#0f2220 !important; color:#f0ece3 !important; }

/* Textarea */
.wpforms-form textarea { resize:vertical !important; min-height:130px !important; }

/* Bouton submit */
.wpforms-submit-container { padding:0 !important; margin:0 !important; }
.wpforms-form .wpforms-submit,
.wpforms-form button[type=submit],
.wpforms-form input[type=submit] {
  display:inline-block !important;
  float:none !important;
  width:auto !important;
  font-family:'DM Sans',sans-serif !important;
  font-size:.68rem !important;
  font-weight:300 !important;
  letter-spacing:.2em !important;
  text-transform:uppercase !important;
  color:#0b1614 !important;
  background:#c4a96b !important;
  border:none !important;
  border-radius:0 !important;
  padding:1rem 2.5rem !important;
  cursor:pointer !important;
  box-shadow:none !important;
  -webkit-box-shadow:none !important;
  transition:background .3s, transform .2s !important;
  margin-top:.5rem !important;
}
.wpforms-form .wpforms-submit:hover { background:#e8c5a0 !important; transform:translateY(-2px) !important; }

/* Confirmation */
.wpforms-confirmation-container-full,
.wpforms-confirmation-container {
  background:rgba(196,169,107,.06) !important;
  border:1px solid rgba(196,169,107,.2) !important;
  border-radius:0 !important;
  color:#f0ece3 !important;
  font-family:'DM Sans',sans-serif !important;
  font-weight:300 !important;
  font-size:.95rem !important;
  padding:1.5rem 2rem !important;
  margin-top:1rem !important;
}

/* Erreurs */
.wpforms-form label.wpforms-error {
  display:block !important;
  float:none !important;
  color:#c8a48a !important;
  font-family:'DM Sans',sans-serif !important;
  font-size:.72rem !important;
  font-weight:300 !important;
  letter-spacing:.05em !important;
  margin-top:.25rem !important;
  padding:0 !important;
  background:none !important;
  border:none !important;
}
.wpforms-form input.wpforms-error,
.wpforms-form textarea.wpforms-error { border-bottom-color:#c8a48a !important; }

/* Nettoyage clearfix */
.wpforms-field::before, .wpforms-field::after,
.wpforms-field-row::before, .wpforms-field-row::after,
.wpforms-form::before, .wpforms-form::after { display:none !important; content:none !important; }

/* ── Alignement précis Prénom / Nom ── */
.wpforms-field-name .wpforms-field-row-block.wpforms-first,
.wpforms-field-name .wpforms-field-row-block.wpforms-last {
  flex: 1 1 0 !important;
  width: auto !important;
  float: none !important;
  padding: 0 !important;
  margin: 0 !important;
  vertical-align: bottom !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
}
.wpforms-field-name .wpforms-field-row-block.wpforms-first input,
.wpforms-field-name .wpforms-field-row-block.wpforms-last input {
  width: 100% !important;
  margin: 0 !important;
  padding: .7rem 0 !important;
  vertical-align: bottom !important;
}

/* ── Corrections finales formulaire ── */

/* Séparateur entre Prénom et Nom */
.wpforms-field-name .wpforms-field-row {
  gap: 0 !important;
}
.wpforms-field-name .wpforms-field-row-block.wpforms-first {
  padding-right: 1.5rem !important;
  border-right: 1px solid rgba(196,169,107,.2) !important;
}
.wpforms-field-name .wpforms-field-row-block.wpforms-last {
  padding-left: 1.5rem !important;
}

/* Supprimer le fond blanc au focus et à l'autofill */
.wpforms-form input:focus,
.wpforms-form input:active,
.wpforms-form textarea:focus {
  background: transparent !important;
  background-color: transparent !important;
  color: #f0ece3 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

/* Supprimer le fond blanc de l'autofill navigateur */
.wpforms-form input:-webkit-autofill,
.wpforms-form input:-webkit-autofill:hover,
.wpforms-form input:-webkit-autofill:focus,
.wpforms-form input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 100px #0f2220 inset !important;
  -webkit-text-fill-color: #f0ece3 !important;
  caret-color: #f0ece3 !important;
  border-bottom: 1px solid rgba(196,169,107,.3) !important;
  transition: background-color 9999s ease-in-out 0s !important;
}

/* Police cohérente partout */
.wpforms-form input,
.wpforms-form textarea,
.wpforms-form select {
  font-family:'DM Sans',sans-serif !important;
  font-weight: 300 !important;
  font-size: .95rem !important;
  letter-spacing: .02em !important;
}

/* Retirer la barre verticale dorée entre Prénom et Nom */
.wpforms-field-name .wpforms-field-row-block.wpforms-first {
  border-right: none !important;
}

/* ── Message de confirmation WPForms ── */
@keyframes confirmFadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

.wpforms-confirmation-container-full,
.wpforms-confirmation-container,
div[submit-success] .wpforms-confirmation-container-full,
.wpforms-form .wpforms-confirmation-container-full {
  animation: confirmFadeUp .8s ease forwards !important;
  background: transparent !important;
  border: none !important;
  border-left: 2px solid #c4a96b !important;
  border-radius: 0 !important;
  padding: 2rem 2.5rem !important;
  margin: 0 !important;
  box-shadow: none !important;
}

.wpforms-confirmation-container-full p,
.wpforms-confirmation-container p {
  font-family:'Bodoni Moda',Georgia,serif !important;
  font-size: 1.3rem !important;
  font-weight: 400 !important;
  font-style: italic !important;
  color: #f0ece3 !important;
  line-height: 1.7 !important;
  margin: 0 0 .8rem 0 !important;
  opacity: 1 !important;
}

.wpforms-confirmation-container-full::before,
.wpforms-confirmation-container::before {
  content: '✓' !important;
  display: block !important;
  font-family:'DM Sans',sans-serif !important;
  font-size: .6rem !important;
  font-weight: 300 !important;
  font-style: normal !important;
  letter-spacing: .4em !important;
  text-transform: uppercase !important;
  color: #c4a96b !important;
  margin-bottom: 1rem !important;
}

/* ── Corrections message confirmation ── */
.wpforms-confirmation-container-full p,
.wpforms-confirmation-container p {
  font-family:'DM Sans',sans-serif !important;
  font-size: 1.1rem !important;
  font-weight: 300 !important;
  font-style: normal !important;
  color: #f0ece3 !important;
  line-height: 1.8 !important;
  letter-spacing: .03em !important;
}
.wpforms-confirmation-container-full::before,
.wpforms-confirmation-container::before {
  font-size: 1.2rem !important;
  letter-spacing: .5em !important;
  margin-bottom: 1.2rem !important;
}

/* ── PAGES LÉGALES — fond grain + curseur ── */
body.page-template-default,
body.error404 {
  cursor: none !important;
  background: #0b1614 !important;
}

/* Fond grain sur pages légales */
body.page-template-default::after,
body.error404::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  background-image: var(--hero-bg-url);
  background-size: cover;
  background-position: center;
  opacity: .18;
}

/* Overlay teal par-dessus le grain */
body.page-template-default::before,
body.error404::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: -1;
  background: rgba(11,22,20,.82);
}

/* Curseur custom sur toutes les pages */
body.page-template-default #cur,
body.page-template-default #cur-ring { display: block !important; }

/* ── LANGUAGE SWITCHER ── */
.lang-switcher {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-right: 1.2rem;
  background: rgba(196,169,107,.22);
  border: 1px solid rgba(196,169,107,.65);
  border-radius: 2px;
  overflow: hidden;
  flex-shrink: 0;
}
.lang-btn {
  display: flex;
  align-items: center;
  gap: .3rem;
  font-family: var(--sans);
  font-size: .58rem;
  font-weight: 400;
  letter-spacing: .18em;
  text-transform: uppercase;
  text-decoration: none;
  padding: .5rem .75rem;
  color: rgba(240,236,227,.85);
  transition: color .25s, background .25s;
  line-height: 1;
  white-space: nowrap;
}
.lang-btn:hover { color: var(--blanc); background: rgba(196,169,107,.15); }
.lang-btn.active {
  color: var(--or);
  background: rgba(196,169,107,.32);
}
.lang-btn .flag { font-size: .8rem; line-height: 1; }
.lang-sep {
  width: 1px; height: 100%;
  min-height: 28px;
  background: rgba(196,169,107,.2);
  flex-shrink: 0;
}

/* ══════════════════════════════════════════════════════
   V6 — Animations, mobile, compteurs, hamburger
   ══════════════════════════════════════════════════════ */

/* ── Hero title — animation mot par mot ─────────────── */
.hw { display:inline-block; opacity:0; transform:translateY(30px); }
.hw-anim { animation: hwReveal .7s cubic-bezier(.22,1,.36,1) forwards; }
@keyframes hwReveal {
  to { opacity:1; transform:translateY(0); }
}

/* ── Back to top ──────────────────────────────────────── */
#back-to-top {
  position:fixed; bottom:2rem; right:2rem; z-index:200;
  width:44px; height:44px;
  background:rgba(196,169,107,.15);
  border:1px solid rgba(196,169,107,.3);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  cursor:none;
  opacity:0; transform:translateY(12px);
  transition:opacity .4s, transform .4s, background .3s;
  pointer-events:none;
}
#back-to-top.visible { opacity:1; transform:translateY(0); pointer-events:auto; }
#back-to-top:hover { background:rgba(196,169,107,.3); }
#back-to-top svg { color:var(--or); }

/* ── Compteurs — highlight au survol ─────────────────── */
.chiffre-val { display:inline-block; transition:color .3s; }
.chiffre:hover .chiffre-val { color:var(--blanc); }

/* ── Étapes — ligne de progression ───────────────────── */
.proc-grid { position:relative; }
.proc-line {
  position:absolute;
  top:2.5rem; left:0; right:0; height:1px;
  background:linear-gradient(to right, transparent, rgba(196,169,107,.15), transparent);
  transform:scaleX(0); transform-origin:left;
  transition:transform 1.2s cubic-bezier(.22,1,.36,1) .3s;
}
.proc-line.animate { transform:scaleX(1); }
@media(max-width:768px) { .proc-line { display:none; } }

/* ── Services — tilt 3D ──────────────────────────────── */
.srv { transform-style:preserve-3d; perspective:600px; transition:transform .15s ease,box-shadow .3s; }

/* ── Hamburger menu mobile ───────────────────────────── */
#burger {
  display:none;
  flex-direction:column;
  gap:5px;
  background:none;
  border:none;
  cursor:pointer;
  padding:.5rem;
  z-index:201;
}
#burger span {
  display:block;
  width:24px; height:1.5px;
  background:var(--blanc);
  transition:transform .35s cubic-bezier(.22,1,.36,1), opacity .25s, width .3s;
  transform-origin:center;
}
#burger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
#burger.open span:nth-child(2) { opacity:0; width:0; }
#burger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }

/* ── Nav mobile — Drawer latéral ────────────────────── */
@media(max-width:900px) {
  .nav-right { display:none !important; }
  #burger { display:flex; z-index:400; position:relative; }
  /* Masquer le burger entièrement quand le menu est ouvert */
  #burger.open { opacity:0 !important; pointer-events:none !important; }
  /* Bouton fermer visible sur mobile */
  .nav-close { display:flex !important; }

  /* Overlay sombre derrière le drawer */
  .nav-overlay {
    position:fixed; inset:0; z-index:290;
    background:rgba(0,0,0,.55);
    opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .35s ease, visibility 0s linear .35s;
  }
  .nav-overlay.open {
    opacity:1; visibility:visible; pointer-events:auto;
    transition:opacity .35s ease, visibility 0s linear 0s;
  }

  /* Drawer — glisse depuis la droite, 60% de largeur */
  .nav-links {
    position:fixed !important;
    top:0 !important; right:0 !important; bottom:0 !important;
    width:62vw !important; max-width:300px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    gap:0 !important;
    list-style:none !important;
    padding:4.5rem 2rem 3rem !important;
    margin:0 !important;
    background:rgba(11,22,20,.98) !important;
    border-left:1px solid rgba(196,169,107,.12) !important;
    z-index:300 !important;
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
    transform:translateX(100%) !important;
    transition:transform .38s cubic-bezier(.22,1,.36,1), opacity .3s ease, visibility 0s linear .38s !important;
    overflow-y:auto !important;
  }
  .nav-links.open {
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
    transform:translateX(0) !important;
    transition:transform .38s cubic-bezier(.22,1,.36,1), opacity .3s ease, visibility 0s linear 0s !important;
  }

  /* Bouton fermer dans le drawer */
  .nav-close {
    position:absolute;
    top:1.2rem; right:1.5rem;
    background:none; border:none;
    color:var(--or); cursor:pointer;
    font-size:1.6rem; line-height:1;
    padding:.4rem; opacity:.85;
    transition:opacity .2s;
    display:flex; align-items:center; justify-content:center;
    width:40px; height:40px;
  }
  .nav-close:hover { opacity:1; }

  /* Liens nav dans le drawer */
  .nav-links > li { width:100%; padding:.65rem 0; border-bottom:1px solid rgba(196,169,107,.07); }
  .nav-links > li:last-child { border-bottom:none; }
  .nav-links > li > a:not(.lang-btn):not(.nav-cta-mobile) {
    font-size:1.25rem !important;
    font-family:'Bodoni Moda',Georgia,serif !important;
    font-weight:400 !important;
    color:rgba(240,236,227,.88) !important;
    text-decoration:none !important;
    letter-spacing:.02em !important;
    display:block !important;
    transition:color .25s, padding-left .25s !important;
    text-transform:none !important;
  }
  .nav-links > li > a:hover:not(.lang-btn):not(.nav-cta-mobile) {
    color:var(--or) !important;
    padding-left:.4rem !important;
  }

  /* Switcher langue — EN HAUT du drawer */
  .nav-links-lang {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:.3rem !important;
    order:-1 !important;
    align-self:center !important;
    width:auto !important;
    margin-bottom:1.8rem !important;
    margin-top:0 !important;
    padding:.5rem 1.2rem !important;
    border:1px solid rgba(196,169,107,.35) !important;
    border-bottom:1px solid rgba(196,169,107,.35) !important;
    background:rgba(196,169,107,.08) !important;
  }
  .nav-links-lang .lang-btn {
    font-family:'DM Sans',sans-serif !important;
    font-size:.62rem !important; font-weight:300 !important;
    letter-spacing:.18em !important; text-transform:uppercase !important;
    color:rgba(240,236,227,.65) !important;
    text-decoration:none !important; padding:.3rem .4rem !important;
    display:flex !important; align-items:center !important; gap:.3rem !important;
    background:none !important; border:none !important;
    transition:color .25s !important;
  }
  .nav-links-lang .lang-btn.active { color:var(--or) !important; }
  .nav-links-lang .lang-sep { width:1px; height:10px; background:rgba(196,169,107,.3); display:inline-block; }

  /* CTA */
  .nav-links-cta { margin-top:2rem !important; display:block !important; width:100% !important; border-bottom:none !important; padding:0 !important; }
  .nav-cta-mobile {
    font-family:'DM Sans',sans-serif !important;
    font-size:.62rem !important; font-weight:300 !important;
    letter-spacing:.18em !important; text-transform:uppercase !important;
    color:#0b1614 !important; background:var(--or) !important;
    padding:.85rem 1.5rem !important; text-decoration:none !important;
    display:block !important; text-align:center !important;
    transition:background .3s !important; width:100% !important;
    box-sizing:border-box !important;
  }
  .nav-cta-mobile:hover { background:#e8c5a0 !important; }

  /* scroll lock géré en JS pour iOS Safari */
}

/* ── SEO — titres pages légales ──────────────────────── */
@media(max-width:768px) {
  .hero-title { font-size:clamp(3.5rem,14vw,6rem); }
  .apropos-chiffres { grid-template-columns:1fr 1fr; }
  .services-grid { grid-template-columns:1fr; }
  .proc-grid { grid-template-columns:1fr; gap:2rem; }
  .contact-section { flex-direction:column; }
}

/* ── Scroll indicator hero ───────────────────────────── */
.hero-scroll { opacity:.6; }
.hero-scroll:hover { opacity:1; }

/* ── Masquer les éléments mobile-only sur desktop ──── */
.nav-links-lang, .nav-links-cta { display:none; }

/* ── Stagger reveal amélioré ─────────────────────────── */
.reveal { transition-duration:.75s; }
.reveal.d1 { transition-delay:.12s; }
.reveal.d2 { transition-delay:.24s; }
.reveal.d3 { transition-delay:.36s; }

/* ── Section processus — réassurance ────────────────── */
.proc-reassurance {
  grid-column:1/-1;
  display:flex;
  align-items:flex-start;
  gap:1.2rem;
  padding:1.8rem 2rem;
  border:1px solid rgba(196,169,107,.12);
  border-left:2px solid var(--or);
  background:rgba(196,169,107,.03);
  margin-top:1rem;
}
.proc-reassurance-icon { color:var(--or); opacity:.7; flex-shrink:0; margin-top:.2rem; }
.proc-reassurance p { font-family:var(--sans); font-size:.9rem; font-weight:300; color:var(--gris); line-height:1.8; margin:0; }
.proc-reassurance strong { color:var(--or); font-weight:300; }


.nav-right { display:flex; align-items:center; gap:.8rem; flex-shrink:0; }

/* ══════════════════════════════════════════════════════
   MOBILE — Services carrousel + Méthode 2 colonnes
   ══════════════════════════════════════════════════════ */
@media(max-width:768px) {

  /* ── Services — carrousel horizontal ─────────────── */
  .services-grid {
    display:flex !important;
    flex-direction:row !important;
    overflow-x:auto !important;
    scroll-snap-type:x mandatory !important;
    -webkit-overflow-scrolling:touch !important;
    gap:1rem !important;
    padding:0 1.5rem 1.5rem !important;
    margin:0 -1.5rem !important;
    scrollbar-width:none !important;
    /* Indicateur de scroll */
    cursor:grab;
  }
  .services-grid::-webkit-scrollbar { display:none !important; }
  .services-grid:active { cursor:grabbing; }

  .srv {
    flex:0 0 80vw !important;
    max-width:300px !important;
    scroll-snap-align:start !important;
    scroll-snap-stop:always !important;
    height:auto !important;
    transform:none !important;
  }

  /* Indicateur de swipe sous le carrousel */
  .services-grid::after {
    content:'';
    flex:0 0 1px;
    /* Espace de fin pour voir qu'il y a une carte suivante */
  }

  /* Hint visuel — "swipeable" */
  .services-head::after {
    content:'→ Balayer pour voir tous les services';
    display:block;
    font-family:'DM Sans',sans-serif;
    font-size:.6rem;
    font-weight:300;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:rgba(196,169,107,.5);
    margin-top:.8rem;
  }

  /* Dots indicateurs */
  .services-dots {
    display:flex !important;
    justify-content:center;
    gap:.4rem;
    margin-top:1rem;
  }
  .services-dots span {
    width:20px; height:2px;
    background:rgba(196,169,107,.25);
    transition:background .3s, width .3s;
  }
  .services-dots span.active {
    background:var(--or);
    width:32px;
  }

  /* ── Méthode — 2 colonnes ─────────────────────────── */
  .proc-grid {
    grid-template-columns:1fr 1fr !important;
    gap:1rem !important;
  }
  .etape {
    padding:1.4rem 1.2rem !important;
  }
  .etape-n {
    font-size:3rem !important;
    margin-bottom:.5rem !important;
  }
  .etape-title {
    font-size:1rem !important;
    margin-bottom:.5rem !important;
  }
  .etape-desc {
    font-size:.8rem !important;
    line-height:1.6 !important;
  }
}

/* ══════════════════════════════════════════════════════
   V7 — PREMIUM — Loader, magnétique, scramble, noise
   ══════════════════════════════════════════════════════ */

/* ── LOADER ──────────────────────────────────────────── */
#tp-loader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: #0b1614;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 2rem;
  transition: opacity .7s ease .1s, transform .7s cubic-bezier(.22,1,.36,1);
}
#tp-loader.out {
  opacity: 0;
  pointer-events: none;
}
.loader-logo {
  width: 72px;
  height: 72px;
  animation: loaderPulse 1.2s ease infinite;
  filter: brightness(0) invert(1);
  opacity: .9;
}
.loader-bar {
  width: 120px;
  height: 1px;
  background: rgba(196,169,107,.2);
  position: relative;
  overflow: hidden;
}
.loader-bar::after {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, #c4a96b, transparent);
  animation: loaderSweep 1.1s ease infinite;
}
@keyframes loaderPulse {
  0%,100% { transform: scale(1); opacity: .7; }
  50%      { transform: scale(1.04); opacity: 1; }
}
@keyframes loaderSweep {
  0%   { left: -100%; }
  100% { left: 100%; }
}

/* ── CURSEUR DOUBLE ANNEAU ──────────────────────────── */
#cur {
  position: fixed; width: 6px; height: 6px;
  background: #c4a96b; border-radius: 50%;
  pointer-events: none; z-index: 9999;
  transform: translate(-50%,-50%);
  transition: width .25s, height .25s, background .25s;
  mix-blend-mode: normal;
}
#cur.hover-big { width: 0; height: 0; background: transparent; }

#cur-ring {
  position: fixed; width: 32px; height: 32px;
  border: 1px solid rgba(196,169,107,.5);
  border-radius: 50%;
  pointer-events: none; z-index: 9998;
  transform: translate(-50%,-50%);
  transition: width .35s cubic-bezier(.22,1,.36,1),
              height .35s cubic-bezier(.22,1,.36,1),
              border-color .35s;
}
#cur-ring.hover-big {
  width: 56px; height: 56px;
  border-color: rgba(196,169,107,.7);
  mix-blend-mode: difference;
}
#cur-ring2 {
  position: fixed; width: 64px; height: 64px;
  border: 1px solid rgba(196,169,107,.12);
  border-radius: 50%;
  pointer-events: none; z-index: 9997;
  transform: translate(-50%,-50%);
  transition: width .6s cubic-bezier(.22,1,.36,1), height .6s;
}
#cur-ring2.hover-big { width: 80px; height: 80px; border-color: rgba(196,169,107,.2); }

/* ── NOISE OVERLAY ──────────────────────────────────── */
.noise-overlay {
  position: fixed; inset: 0; z-index: 2;
  pointer-events: none;
  opacity: .025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 256px 256px;
}

/* ── BOUTONS — fill reveal ──────────────────────────── */
.nav-cta, .btn-or {
  position: relative;
  overflow: hidden;
  transition: color .4s ease, transform .5s cubic-bezier(.22,1,.36,1);
}
.nav-cta::before, .btn-or::before {
  content: '';
  position: absolute;
  inset: 0;
  background: #e8c98a;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s cubic-bezier(.22,1,.36,1);
  z-index: 0;
}
.nav-cta:hover::before, .btn-or:hover::before { transform: scaleX(1); }
.nav-cta > *, .btn-or > *,
.nav-cta, .btn-or { position: relative; z-index: 1; }

/* btn-outline hover */
.btn-outline {
  position: relative; overflow: hidden;
  transition: color .4s ease, transform .5s cubic-bezier(.22,1,.36,1);
}
.btn-outline::before {
  content: '';
  position: absolute; inset: 0;
  background: rgba(196,169,107,.1);
  transform: scaleX(0); transform-origin: left;
  transition: transform .4s cubic-bezier(.22,1,.36,1);
}
.btn-outline:hover::before { transform: scaleX(1); }
.btn-outline:hover { color: var(--or); }

/* ── MARQUEE TICKER ─────────────────────────────────── */
.tp-ticker {
  overflow: hidden;
  white-space: nowrap;
  padding: 14px 0;
  border-top: 1px solid rgba(196,169,107,.1);
  border-bottom: 1px solid rgba(196,169,107,.1);
  background: rgba(11,22,20,.6);
  position: relative;
}
.tp-ticker::before, .tp-ticker::after {
  content: '';
  position: absolute; top: 0; bottom: 0; width: 80px; z-index: 2;
}
.tp-ticker::before { left: 0; background: linear-gradient(90deg, #0b1614, transparent); }
.tp-ticker::after  { right: 0; background: linear-gradient(-90deg, #0b1614, transparent); }
.tp-ticker-inner {
  display: inline-block;
  animation: tickerScroll 28s linear infinite;
  font-family: var(--sans);
  font-size: .55rem;
  font-weight: 300;
  letter-spacing: .35em;
  text-transform: uppercase;
  color: rgba(196,169,107,.45);
}
.tp-ticker-inner:hover { animation-play-state: paused; }
.tp-ticker-sep {
  display: inline-block;
  margin: 0 2.5rem;
  color: rgba(196,169,107,.25);
  font-size: .8rem;
}
@keyframes tickerScroll {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ── NAV LINK ACTIVE ──────────────────────────────────── */
.nav-links a.active { color: var(--or) !important; }

/* ── SERVICE CARDS — hover premium ─────────────────── */
.srv {
  transform-style: preserve-3d;
  perspective: 800px;
  transition: transform .2s ease, box-shadow .3s ease;
  cursor: none;
}
.srv:hover {
  box-shadow: 0 20px 60px rgba(0,0,0,.4), 0 0 0 1px rgba(196,169,107,.18);
}
/* Numéro de service — reveal au hover */
.srv-num {
  transition: color .4s ease, opacity .4s ease;
}
.srv:hover .srv-num { color: var(--or); opacity: .8; }

/* ── REVEAL — base propre ───────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .85s cubic-bezier(.22,1,.36,1),
              transform .85s cubic-bezier(.22,1,.36,1);
}
.reveal.d1 { transition-delay: .1s; }
.reveal.d2 { transition-delay: .2s; }
.reveal.d3 { transition-delay: .3s; }
.reveal.visible {
  opacity: 1 !important;
  transform: translate(0,0) !important;
}

/* ── SECTION TRANSITIONS — clip-path ───────────────── */
.divider {
  position: relative; height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(196,169,107,.12) 20%,
              rgba(196,169,107,.12) 80%, transparent 100%);
  overflow: visible;
}
.divider::after {
  content: '';
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-50%,-50%);
  width: 5px; height: 5px;
  background: rgba(196,169,107,.35);
  border-radius: 50%;
}

/* ── PROCLINE ─────────────────────────────────────────── */
.proc-grid { position: relative; }
.proc-line {
  position: absolute; top: 2.5rem; left: 0; right: 0; height: 1px;
  background: linear-gradient(to right, transparent, rgba(196,169,107,.1), transparent);
  transform: scaleX(0); transform-origin: left;
  transition: transform 1.4s cubic-bezier(.22,1,.36,1) .3s;
}
.proc-line.animate { transform: scaleX(1); }
@media(max-width:768px) { .proc-line { display:none; } }

/* ── BACK TO TOP ──────────────────────────────────────── */
#back-to-top {
  position: fixed; bottom: 2rem; right: 2rem; z-index: 200;
  width: 44px; height: 44px;
  background: rgba(196,169,107,.1);
  border: 1px solid rgba(196,169,107,.25);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  cursor: none; opacity: 0; transform: translateY(14px);
  transition: opacity .4s, transform .4s, background .3s;
  pointer-events: none;
}
#back-to-top.visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
#back-to-top:hover { background: rgba(196,169,107,.22); }
#back-to-top svg { color: var(--or); }

/* ── TYPING / SCRAMBLE ─────────────────────────────── */
.hero-title { font-variant-ligatures: common-ligatures; }

/* ── SERVICES DOTS MOBILE ───────────────────────────── */
.services-dots {
  display: none;
  justify-content: center; gap: .4rem; margin-top: 1rem;
}
.services-dots span {
  width: 18px; height: 2px;
  background: rgba(196,169,107,.22);
  transition: background .3s, width .3s;
  border-radius: 1px;
}
.services-dots span.active { background: var(--or); width: 28px; }

/* ── PROC REASSURANCE ─────────────────────────────── */
.proc-reassurance {
  grid-column: 1/-1;
  display: flex; align-items: flex-start; gap: 1.2rem;
  padding: 1.8rem 2rem;
  border: 1px solid rgba(196,169,107,.1);
  border-left: 2px solid var(--or);
  background: rgba(196,169,107,.025);
  margin-top: 1rem;
}
.proc-reassurance-icon { color: var(--or); opacity: .6; flex-shrink: 0; margin-top: .15rem; }
.proc-reassurance p { font-size: .88rem; font-weight: 300; color: var(--gris); line-height: 1.8; margin: 0; }
.proc-reassurance strong { color: var(--or); font-weight: 300; }

/* ── MOBILE CAROUSEL SERVICES ─────────────────────── */
@media(max-width:768px) {
  .services-grid {
    display: flex !important; flex-direction: row !important;
    overflow-x: auto !important; scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 1rem !important; padding: 0 1.5rem 1.5rem !important;
    margin: 0 -1.5rem !important; scrollbar-width: none !important;
  }
  .services-grid::-webkit-scrollbar { display: none !important; }
  .srv {
    flex: 0 0 80vw !important; max-width: 300px !important;
    scroll-snap-align: start !important;
  }
  .services-dots { display: flex; }
  .proc-grid { grid-template-columns: 1fr 1fr !important; gap: 1rem !important; }
  .etape { padding: 1.4rem 1.2rem !important; }
  .etape-n { font-size: 3rem !important; margin-bottom: .5rem !important; }
  .etape-title { font-size: 1rem !important; }
  .etape-desc { font-size: .8rem !important; line-height: 1.6 !important; }
}

/* ── NAV MOBILE ─────────────────────────────────────── */
@media(max-width:900px) {
  .nav-right { display: none !important; }
  .nav-links-lang, .nav-links-cta { display: none; }
  #burger { display: flex; z-index: 400; position: relative; }
  #burger.open { opacity: 0 !important; pointer-events: none !important; }
  .nav-overlay {
    position: fixed; inset: 0; z-index: 290;
    background: rgba(0,0,0,.5);
    opacity: 0; visibility: hidden; pointer-events: none;
    transition: opacity .35s ease, visibility 0s linear .35s;
  }
  .nav-overlay.open {
    opacity: 1; visibility: visible; pointer-events: auto;
    transition: opacity .35s ease, visibility 0s linear 0s;
  }
  .nav-links {
    position: fixed !important; top: 0 !important; right: 0 !important;
    bottom: 0 !important; width: 62vw !important; max-width: 300px !important;
    display: flex !important; flex-direction: column !important;
    align-items: flex-start !important; justify-content: flex-start !important;
    gap: 0 !important; list-style: none !important;
    padding: 4.5rem 2rem 3rem !important; margin: 0 !important;
    background: rgba(11,22,20,.98) !important;
    border-left: 1px solid rgba(196,169,107,.1) !important;
    z-index: 300 !important; overflow-y: auto !important;
    visibility: hidden !important; opacity: 0 !important;
    pointer-events: none !important; transform: translateX(100%) !important;
    transition: transform .38s cubic-bezier(.22,1,.36,1), opacity .3s ease, visibility 0s linear .38s !important;
  }
  .nav-links.open {
    visibility: visible !important; opacity: 1 !important;
    pointer-events: auto !important; transform: translateX(0) !important;
    transition: transform .38s cubic-bezier(.22,1,.36,1), opacity .3s ease, visibility 0s linear 0s !important;
  }
  .nav-close {
    position: absolute; top: 1.2rem; right: 1.5rem;
    background: none; border: none; color: var(--or); cursor: pointer;
    font-size: 1.6rem; line-height: 1; padding: .4rem;
    display: flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; opacity: .85;
    transition: opacity .2s;
  }
  .nav-close:hover { opacity: 1; }
  .nav-links > li {
    width: 100%; padding: .65rem 0;
    border-bottom: 1px solid rgba(196,169,107,.07);
  }
  .nav-links > li:last-child { border-bottom: none; }
  .nav-links > li > a:not(.lang-btn):not(.nav-cta-mobile) {
    font-size: 1.2rem !important; font-family: var(--serif) !important;
    font-style: italic !important; font-weight: 400 !important;
    color: rgba(240,236,227,.88) !important; text-decoration: none !important;
    display: block !important; transition: color .25s, padding-left .25s !important;
    text-transform: none !important;
  }
  .nav-links > li > a:hover:not(.lang-btn):not(.nav-cta-mobile) {
    color: var(--or) !important; padding-left: .4rem !important;
  }
  .nav-links-lang {
    display: flex !important; align-items: center !important;
    gap: .3rem !important; order: -1 !important; align-self: center !important;
    width: auto !important; margin-bottom: 1.8rem !important; margin-top: 0 !important;
    padding: .5rem 1.2rem !important;
    border: 1px solid rgba(196,169,107,.3) !important;
    background: rgba(196,169,107,.07) !important;
  }
  .nav-links-lang .lang-btn {
    font-family: var(--sans) !important; font-size: .62rem !important;
    font-weight: 200 !important; letter-spacing: .18em !important;
    text-transform: uppercase !important; color: rgba(240,236,227,.6) !important;
    text-decoration: none !important; padding: .3rem .4rem !important;
    display: flex !important; align-items: center !important; gap: .3rem !important;
    background: none !important; border: none !important; transition: color .25s !important;
  }
  .nav-links-lang .lang-btn.active { color: var(--or) !important; }
  .nav-links-lang .lang-sep { width: 1px; height: 10px; background: rgba(196,169,107,.3); display: inline-block; }
  .nav-links-cta { margin-top: 2rem !important; display: block !important; width: 100% !important; border-bottom: none !important; padding: 0 !important; }
  .nav-cta-mobile {
    font-family: var(--sans) !important; font-size: .62rem !important;
    font-weight: 300 !important; letter-spacing: .18em !important;
    text-transform: uppercase !important; color: #0b1614 !important;
    background: var(--or) !important; padding: .85rem 1.5rem !important;
    text-decoration: none !important; display: block !important;
    text-align: center !important; width: 100% !important; box-sizing: border-box !important;
  }
  body.menu-open { overflow: hidden !important; }
  #back-to-top { cursor: auto; }
  #cur, #cur-ring, #cur-ring2 { display: none !important; }
  .noise-overlay { display: none; }
}

/* ── LANG SWITCHER DESKTOP ──────────────────────────── */
.lang-switcher {
  display: flex; align-items: center; gap: 2px;
  margin-right: 1.2rem;
  background: rgba(196,169,107,.22);
  border: 1px solid rgba(196,169,107,.65);
  border-radius: 2px; overflow: hidden; flex-shrink: 0;
}
.lang-btn {
  display: flex; align-items: center; gap: .3rem;
  font-family: var(--sans); font-size: .58rem; font-weight: 400;
  letter-spacing: .18em; text-transform: uppercase; text-decoration: none;
  padding: .5rem .75rem; color: rgba(240,236,227,.85);
  transition: color .25s, background .25s; line-height: 1; white-space: nowrap;
}
.lang-btn:hover { color: var(--blanc); background: rgba(196,169,107,.15); }
.lang-btn.active { color: var(--or); background: rgba(196,169,107,.32); }
.lang-btn .flag { font-size: .8rem; line-height: 1; }
.lang-sep { width: 1px; min-height: 28px; background: rgba(196,169,107,.2); flex-shrink: 0; }

/* ── HAMBURGER BARS ─────────────────────────────────── */
#burger {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: none; cursor: pointer; padding: .5rem; z-index: 201;
}
#burger span {
  display: block; width: 24px; height: 1.5px;
  background: var(--blanc);
  transition: transform .35s cubic-bezier(.22,1,.36,1), opacity .25s, width .3s;
  transform-origin: center;
}


/* ══════════════════════════════════════════════════════
   V7 — SCROLL PREMIUM CSS
   ══════════════════════════════════════════════════════ */


/* ── WARP — smooth sur les éléments ─────────────────── */

/* Masquer dots sur mobile */
@media(max-width:900px) {
  
  #scroll-progress { display: none; }
  }




/* ══════════════════════════════════════════════════════
   V7 FINAL — SECTION FLASH + DOTS propres
   ══════════════════════════════════════════════════════ */






/* ── SECTION DOTS ───────────────────────────────────── */












/* ── SCROLL PROGRESS ─────────────────────────────────── */
#scroll-progress {
  position: fixed; right: 0; top: 0;
  width: 2px; height: 100vh;
  background: var(--or);
  transform: scaleY(0); transform-origin: top;
  z-index: 500; opacity: .45;
  pointer-events: none;
}

/* Mobile */
@media(max-width:900px) {
  
  
  }

/* ══════════════════════════════════════════════════════
   V8 — SCROLL-DRIVEN PREMIUM
   ══════════════════════════════════════════════════════ */

/* Hero éléments — transition désactivée (géré par JS scroll) */
.hero-title,
.hero-sub,
.hero-tag,
.hero-scroll,
.hero-bg {
  will-change: transform, opacity;
}

/* Logo block — légère rotation scroll-driven */
.logo-block {
  will-change: transform;
  transition: none;
}

/* Proc line */
.proc-grid { position: relative; }
.proc-line {
  position: absolute; top: 2.5rem; left: 0; right: 0; height: 1px;
  background: linear-gradient(to right, transparent, rgba(196,169,107,.1), transparent);
  transform: scaleX(0); transform-origin: left;
  transition: transform 1.4s cubic-bezier(.22,1,.36,1) .3s;
}
.proc-line.animate { transform: scaleX(1); }
@media(max-width:768px) { .proc-line { display:none; } }

/* Reveal propre */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .85s cubic-bezier(.22,1,.36,1),
              transform .85s cubic-bezier(.22,1,.36,1);
}
.reveal.d1 { transition-delay: .1s; }
.reveal.d2 { transition-delay: .2s; }
.reveal.d3 { transition-delay: .3s; }
.reveal.visible { opacity: 1 !important; transform: translate(0,0) !important; }

/* Scroll wrapper */

/* Progress bar */
#scroll-progress {
  position: fixed; right: 0; top: 0;
  width: 2px; height: 100vh;
  background: var(--or);
  transform: scaleY(0); transform-origin: top;
  z-index: 500; opacity: .4; pointer-events: none;
}

@media(max-width:900px) {
  
  }

/* ══════════════════════════════════════════════════════
   V7 FINAL — Scroll premium propre
   ══════════════════════════════════════════════════════ */


/* ── SECTION DOTS ────────────────────────────────────── */
.section-dots {
  position: fixed;
  left: auto;
  right: 1.5rem;
  top: 50%;
  bottom: auto;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 11pt;
  padding: 0;
  width: auto;
  z-index: 500;
  pointer-events: none;
}

.sdot {
  display: block;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: rgba(196,169,107,.2);
  border: 1px solid rgba(196,169,107,.28);
  transition: background .4s, transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s;
  position: relative;
  cursor: none;
  text-decoration: none;
  pointer-events: auto;
}

.sdot::before {
  content: attr(data-label);
  position: absolute;
  right: 18px; top: 50%;
  transform: translateY(-50%) translateX(6px);
  font-family: var(--sans);
  font-size: .48rem;
  font-weight: 200;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: rgba(196,169,107,0);
  white-space: nowrap;
  transition: color .3s, transform .3s;
  pointer-events: none;
}
.sdot:hover::before, .sdot.active::before {
  color: rgba(196,169,107,.5);
  transform: translateY(-50%) translateX(0);
}
.sdot.active {
  background: var(--or);
  border-color: var(--or);
  transform: scale(1.5);
  box-shadow: 0 0 10px rgba(196,169,107,.3);
}
.sdot:hover { background: rgba(196,169,107,.5); transform: scale(1.2); }

/* ── SCROLL PROGRESS BAR ─────────────────────────────── */
#scroll-progress {
  position: fixed; right: 0; top: 0;
  width: 2px; height: 100vh;
  background: var(--or);
  transform: scaleY(0); transform-origin: top;
  z-index: 500; opacity: .4;
  pointer-events: none;
}

/* ── HERO — scroll driven  ───────────────────────────── */
.hero-bg {
  transform-origin: center center;
  will-change: transform;
}
.hero-title, .hero-sub, .hero-tag {
  will-change: transform, opacity;
}

/* ── REVEAL ──────────────────────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .9s cubic-bezier(.22,1,.36,1),
              transform .9s cubic-bezier(.22,1,.36,1);
}
.reveal.d1 { transition-delay: .1s; }
.reveal.d2 { transition-delay: .2s; }
.reveal.d3 { transition-delay: .3s; }
.reveal.visible { opacity: 1 !important; transform: translate(0,0) !important; }

/* ── PARALLAXE TITRES h2 ─────────────────────────────── */
section:not(#hero) h2 { will-change: transform; }

/* ── SERVICES parallaxe ──────────────────────────────── */
.srv { will-change: transform; }

/* Mobile — tout désactivé */
@media(max-width:900px) {
  .section-dots, #scroll-progress, #section-num { display: none; }
    .hero-title, .hero-sub, .hero-tag, .hero-bg { will-change: auto; }
  .reveal { opacity: 1 !important; transform: none !important; }
}


/* ══════════════════════════════════════════════════════
   SERVICES PINNED — Apple scroll style
   ══════════════════════════════════════════════════════ */

/* Section haute pour le scroll-through */
.services-pinned {
  position: relative;
  min-height: 120vh;
}
.services-pinned.is-done {
  min-height: 0;
}

/* Container sticky — reste à l'écran pendant le scroll */
.sps-sticky {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  grid-template-columns: 1fr 1.4fr 0.5fr;
  grid-template-rows: 1fr;
  align-items: start;
  gap: 0 5vw;
  padding: 7vh 8vw 4vh;
  overflow: hidden;
  background: var(--bg);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .3s ease, visibility 0s linear .3s;
}
.sps-sticky.sps-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity .3s ease, visibility 0s linear 0s;
}

/* Header — colonne gauche haut */
.sps-header {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  padding-top: 2vh;
}

.sps-title {
  font-size: clamp(1.6rem, 2.8vw, 2.6rem);
  margin-top: .6rem;
  line-height: 1.05;
}

/* Grand numéro décoratif */
.sps-big-num {
  position: absolute;
  left: 5vw;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--serif);
  font-size: clamp(16rem, 24vw, 30rem);
  font-weight: 400;
  font-variation-settings: 'opsz' 96;
  color: transparent;
  -webkit-text-stroke: 2px rgba(196,169,107,.18);
  line-height: 1;
  pointer-events: none;
  user-select: none;
  transition: opacity .6s ease, -webkit-text-stroke .4s ease;
  z-index: 0;
}

/* Services — colonne centre */
.sps-services {
  grid-column: 2;
  grid-row: 1;
  position: relative;
  height: 72vh;
  z-index: 2;
  align-self: start;
  padding-top: 2vh;
}

.sps-service {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1.2rem;
  opacity: 0;
  transform: translateY(30px);
  transition: opacity .7s cubic-bezier(.22,1,.36,1),
              transform .7s cubic-bezier(.22,1,.36,1);
  pointer-events: none;
}

.sps-service.active {
  opacity: 1;
  transform: translateY(0);
}

.sps-sticky.sps-active .sps-service.active {
  pointer-events: auto;
}

.sps-service.exit-up {
  opacity: 0;
  transform: translateY(-25px);
  transition: opacity .5s ease, transform .5s ease;
}

.sps-icon {
  width: 40px; height: 40px;
  border: 1px solid rgba(196,169,107,.2);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--or);
}

.sps-srv-title {
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  font-weight: 400;
  font-variation-settings: 'opsz' 48;
  color: var(--blanc);
  line-height: 1.1;
}

.sps-srv-desc {
  font-family: var(--sans);
  font-size: .95rem;
  font-weight: 200;
  color: var(--gris);
  line-height: 1.75;
  max-width: 440px;
}

.sps-link {
  font-family: var(--sans);
  font-size: .6rem;
  font-weight: 300;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(196,169,107,.5);
  text-decoration: none;
  transition: color .3s;
}
.sps-link:hover { color: var(--or); }

/* Progress wrap — colonne droite */
.sps-progress-wrap {
  grid-column: 3;
  grid-row: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-self: center;
  z-index: 2;
  padding-top: 2vh;
}

.sps-tick {
  display: flex;
  align-items: center;
  gap: .6rem;
  cursor: pointer;
  opacity: .3;
  transition: opacity .4s ease;
}

.sps-tick.active { opacity: 1; }

.sps-tick-num {
  font-family: var(--sans);
  font-size: .52rem;
  font-weight: 300;
  letter-spacing: .12em;
  color: var(--or);
  width: 18px;
  flex-shrink: 0;
}

.sps-tick-line {
  width: 32px; height: 1px;
  background: rgba(196,169,107,.15);
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}

.sps-tick-fill {
  position: absolute;
  inset: 0;
  background: var(--or);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .6s cubic-bezier(.22,1,.36,1);
}

.sps-tick.active .sps-tick-fill { transform: scaleX(1); }

.sps-tick-label {
  font-family: var(--sans);
  font-size: .52rem;
  font-weight: 200;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gris);
  white-space: nowrap;
  display: none;
}

.sps-tick.active .sps-tick-label { display: block; color: rgba(196,169,107,.7); }

/* Note sous la section */
.sps-note {
  margin-top: 3.5rem;
  margin-left: 8vw;
  margin-right: 8vw;
  margin-bottom: 2rem;
  position: relative;
}

/* ── MOBILE — retour au grid ─────────────────────────── */
@media(max-width:900px) {
  .services-pinned {
    height: auto !important;
    padding-bottom: 4rem !important;
  }
  .sps-sticky {
    position: static;
    height: auto;
    display: block;
    padding: 0;
  }
  .sps-big-num { display: none; }
  .sps-header { margin-bottom: 2rem; }
  .sps-services {
    position: static;
    height: auto;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }
  .sps-service {
    position: static;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto;
  }
  .sps-progress-wrap { display: none; }
  .sps-note { position: static; margin-top: 2rem; }
}


/* ══════════════════════════════════════════════════════
   SERVICES — Récapitulatif + Mobile carousel
   ══════════════════════════════════════════════════════ */

/* ── GRILLE RÉCAPITULATIF (desktop) ─────────────────── */
.sps-recap {
  opacity: 0;
  transform: translateY(30px);
  pointer-events: none;
  transition: opacity .9s cubic-bezier(.22,1,.36,1),
              transform .9s cubic-bezier(.22,1,.36,1);
  padding: 2rem 0 2rem;
  position: relative;
  z-index: 2;
}

/* Une fois révélé → reste indéfiniment */
.sps-recap.visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.sps-recap-inner {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.sps-recap-card {
  padding: 1.6rem 1.4rem;
  border: 1px solid rgba(196,169,107,.1);
  background: rgba(196,169,107,.03);
  transition: border-color .3s, background .3s;
  position: relative;
}
.sps-recap-card:hover {
  border-color: rgba(196,169,107,.2);
  background: rgba(196,169,107,.06);
}

.sps-recap-card .srv-num {
  display: block;
  font-family: var(--sans);
  font-size: .56rem;
  font-weight: 200;
  letter-spacing: .2em;
  color: rgba(196,169,107,.4);
  margin-bottom: .6rem;
}

.sps-recap-icon {
  color: var(--or);
  opacity: .6;
  margin-bottom: .8rem;
}

.sps-recap-title {
  font-family: var(--serif);
  font-style: italic;
  font-size: 1rem;
  font-weight: 400;
  color: var(--blanc);
  margin-bottom: .5rem;
  font-variation-settings: 'opsz' 24;
}

.sps-recap-desc {
  font-family: var(--sans);
  font-size: .78rem;
  font-weight: 200;
  color: var(--gris);
  line-height: 1.65;
}

/* ── MOBILE — carousel swipe (restauré) ─────────────── */
@media(max-width:900px) {
  /* Cacher le pinned layout sur mobile */
  .sps-sticky { display: none !important; }
  .sps-recap  { display: none !important; }

  /* Hauteur normale + flexbox pour réordonner */
  .services-pinned {
    height: auto !important;
    padding-bottom: 3rem !important;
    display: flex !important;
    flex-direction: column !important;
  }

  /* Carousel avant la note */
  .sps-mobile-carousel { order: 1 !important; }
  .sps-note            { order: 2 !important; margin: 1.5rem 1.5rem 0 !important; }

  /* Afficher le carousel mobile */
  .sps-mobile-carousel {
    display: block !important;
  }

  /* Carousel swipe */
  .sps-mobile-carousel .services-grid {
    display: flex !important;
    flex-direction: row !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 1rem !important;
    padding: 0 1.5rem 1.5rem !important;
    margin: 0 -1.5rem !important;
    scrollbar-width: none !important;
  }
  .sps-mobile-carousel .services-grid::-webkit-scrollbar { display: none !important; }

  .sps-mobile-carousel .srv {
    flex: 0 0 80vw !important;
    max-width: 300px !important;
    scroll-snap-align: start !important;
  }

  .services-dots { display: flex; }
}

/* Cacher le carousel mobile sur desktop */
.sps-mobile-carousel { display: none; }



/* ══════════════════════════════════════════════════════
   SERVICES — Scroll Intercept (Apple-style)
   ══════════════════════════════════════════════════════ */

/* Section hauteur auto, pas de reserve de scroll */
.services-pinned {
  position: relative;
}

/* Le sticky occupe 100vh */
.sps-sticky {
  min-height: 100vh;
}

/* Indicateur de progression globale — barre en bas du sticky */
.sps-global-bar {
  position: absolute;
  bottom: 0; left: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--or), rgba(196,169,107,.3));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s cubic-bezier(.22,1,.36,1);
  width: 100%;
  z-index: 10;
}

/* Overlay hint "scroll" au début */
.sps-hint {
  position: absolute;
  bottom: 2.5rem;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--sans);
  font-size: .5rem;
  font-weight: 200;
  letter-spacing: .35em;
  text-transform: uppercase;
  color: rgba(196,169,107,.35);
  display: flex;
  align-items: center;
  gap: .6rem;
  animation: hintBounce 2s ease infinite;
  pointer-events: none;
}

@keyframes hintBounce {
  0%, 100% { transform: translateX(-50%) translateY(0); opacity: .6; }
  50%       { transform: translateX(-50%) translateY(5px); opacity: .3; }
}

/* Fade out du hint après premier scroll */
.sps-hint.hide { opacity: 0; transition: opacity .4s ease; }

/* État completé */
/* sps-done géré par .sps-active uniquement */

/* Récapitulatif */
.sps-recap {
  position: relative;
  z-index: 10;
}

/* ── Titre dans le récapitulatif — utilise le style s-label/h2 standard ── */
.sps-recap-header {
  margin-bottom: 3.5rem;
}