/* ==================================================
   AYAHUASKA — styles
   ================================================== */

:root{
  --navy: #1C2445;
  --navy-deep: #10142c;
  --navy-soft: #2c3568;
  --white: #ffffff;
  --ivory: #f5f4f1;
  --pink: #E44164;
  --pink-deep: #c4304f;
  --pale: #dfe3f2;
  --text-muted: #aeb3d1;
  --ink: #3c4260;
  --serif: 'Playfair Display', Georgia, serif;
  --sans: 'Jost', 'Helvetica Neue', Arial, sans-serif;
  --max: 1220px;
  --gutter: 24px;
  /* legacy aliases kept so nothing silently breaks */
  --red: var(--pink);
  --blue-accent: var(--navy-soft);
}

*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  font-family: var(--sans);
  color: var(--navy);
  background: var(--white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
h1,h2,h3{ font-family: var(--serif); font-weight:600; margin:0 0 .5em; line-height:1.1; letter-spacing:-.01em; }
p{ margin:0 0 1em; }
.container{ max-width: var(--max); margin:0 auto; padding: 0 var(--gutter); }
.eyebrow{
  font-family: var(--sans);
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: .75rem;
  font-weight: 500;
  color: var(--pink);
  margin-bottom: .9em;
  display:inline-flex; align-items:center; gap:.6em;
}
.eyebrow::before{
  content:""; display:inline-block; width:22px; height:2px; background: var(--pink);
}
.skip-link{
  position:absolute; left:-999px; top:0; background:var(--navy); color:var(--white);
  padding:.75em 1em; z-index:400;
}
.skip-link:focus{ left: 1em; top: 1em; }

/* ---------- FOCUS VISIBILITY (WCAG 2.2 AA) ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible{
  outline: 2px solid var(--pink);
  outline-offset: 3px;
  border-radius: 2px;
}

.btn{
  display:inline-block;
  padding: 1em 2.2em;
  clip-path: polygon(3% 0, 100% 0, 97% 100%, 0% 100%);
  font-size: .82rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  transition: all .25s ease;
  border: 1px solid transparent;
}
.btn-primary{ background: var(--pink); color: var(--white); }
.btn-primary:hover{ background: var(--pink-deep); transform: translateY(-2px); }
.btn-ghost{ border-color: rgba(255,255,255,.5); color: var(--white); }
.btn-ghost:hover{ background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.9); }

/* ---------- ACCENT MARK (motif du logo) ---------- */
.accent-mark{ display:inline-flex; gap:6px; }
.accent-mark span{
  display:block; width:26px; height:11px;
  clip-path: polygon(22% 0, 100% 0, 78% 100%, 0% 100%);
}
.accent-mark span:first-child{ background: var(--pink); }
.accent-mark span:last-child{ background: var(--pale); }

/* ---------- HEADER ---------- */
.site-header{
  position: fixed; top:0; left:0; right:0; z-index: 300;
  padding: env(safe-area-inset-top,0px) 0 0;
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding: 22px var(--gutter);
}
.logo{ display:flex; align-items:center; gap:.7rem; line-height:1; color:var(--white); }
.logo-word{
  font-family: var(--serif); font-weight:700; font-size:1.35rem; letter-spacing:.01em;
}
.logo-word.small{ font-size:1.1rem; color: var(--white); }
.logo-bar{ display:none; }
.logo-tagline{ display:none; }
.logo-img{ height: 34px; width:auto; display:block; }
.logo-img.logo-img-small{ height: 30px; }

/* Menu trigger (remplace l'ancien menu déroulant) */
.menu-trigger{
  display:flex; align-items:center; gap:.7rem;
  background:none; border:1px solid rgba(255,255,255,.4); clip-path: polygon(6% 0, 100% 0, 94% 100%, 0% 100%);
  color: var(--white); padding:.55em 1.3em .55em .6em; cursor:pointer;
  font-family: var(--sans); font-size:.8rem; letter-spacing:.08em; text-transform:uppercase;
  transition: border-color .2s ease, background .2s ease;
}
.menu-trigger:hover{ border-color: rgba(255,255,255,.9); background: rgba(255,255,255,.08); }
.menu-trigger .bars{ display:flex; flex-direction:column; gap:5px; width:22px; }
.menu-trigger .bars span{
  display:block; height:3px; background: var(--white);
  clip-path: polygon(15% 0, 100% 0, 85% 100%, 0% 100%);
  transition: transform .25s ease, opacity .25s ease;
}
.menu-trigger .bars span:nth-child(2){ background: var(--pink); }
.menu-trigger .label-open{ display:inline; }
.menu-trigger .label-close{ display:none; }
body.menu-open .menu-trigger .label-open{ display:none; }
body.menu-open .menu-trigger .label-close{ display:inline; }
body.menu-open .menu-trigger .bars span:nth-child(1){ transform: translateY(6px) rotate(45deg); }
body.menu-open .menu-trigger .bars span:nth-child(2){ opacity:0; }
body.menu-open .menu-trigger .bars span:nth-child(3){ transform: translateY(-6px) rotate(-45deg); }

/* Overlay plein écran */
.nav-overlay{
  position: fixed; inset:0; z-index: 250;
  background: var(--navy);
  visibility:hidden; opacity:0;
  transition: opacity .45s ease, visibility 0s linear .45s;
  display:flex; align-items:center;
}
.nav-overlay::before{
  content:""; position:absolute; inset:0;
  background: radial-gradient(circle at 85% 15%, var(--navy-soft) 0%, transparent 55%);
  opacity:.7;
}
body.menu-open .nav-overlay{ visibility:visible; opacity:1; transition-delay: 0s; }
body.menu-open{ overflow:hidden; }
.nav-overlay-inner{ position:relative; z-index:2; width:100%; }
.overlay-list{ list-style:none; margin:0; padding:0; }
.overlay-list li{
  border-top: 1px solid rgba(255,255,255,.12);
  overflow:hidden;
}
.overlay-list li:last-child{ border-bottom: 1px solid rgba(255,255,255,.12); }
.overlay-list a{
  display:flex; align-items:baseline; gap:1.2rem;
  padding: 1.1rem 0; color: var(--white);
  font-family: var(--serif); font-size: clamp(1.8rem, 6vw, 3.4rem); font-weight:600;
  transform: translateY(100%); transition: transform 0s;
}
body.menu-open .overlay-list a{ transform: translateY(0); transition: transform .5s cubic-bezier(.2,.7,.2,1); }
.overlay-list .idx{ font-family: var(--sans); font-size:.8rem; color: var(--pink); letter-spacing:.1em; }
.overlay-list a:hover, .overlay-list a.active{ color: var(--pink); }
.overlay-list a:hover .idx, .overlay-list a.active .idx{ color: var(--pale); }
.nav-overlay-foot{
  margin-top: 2.4rem; display:flex; flex-wrap:wrap; gap: 1.5rem 2.4rem;
  color: var(--text-muted); font-size:.85rem;
}
.nav-overlay-foot a{ color: var(--white); border-bottom:1px solid rgba(255,255,255,.3); }

/* ---------- HERO ---------- */
.hero{
  position:relative; min-height: 100vh; display:flex; align-items:center;
  color: var(--white); overflow:hidden; background: var(--navy);
}
.hero-media{
  position:absolute; inset:0;
  background:
    radial-gradient(circle at 82% 18%, var(--navy-soft) 0%, transparent 45%),
    radial-gradient(circle at 10% 90%, rgba(228,65,100,.25) 0%, transparent 40%),
    linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%);
}
.hero-shape-a, .hero-shape-b{
  position:absolute; clip-path: polygon(22% 0, 100% 0, 78% 100%, 0% 100%);
}
.hero-shape-a{ width: 46vw; max-width:620px; height: 60vh; background: rgba(228,65,100,.14); top:-10%; right:-6%; }
.hero-shape-b{ width: 30vw; max-width:420px; height: 46vh; background: rgba(223,227,242,.06); top:14%; right:10%; }
.hero-inner{ position:relative; z-index:2; padding-top: 90px; max-width: 820px; }
.hero .eyebrow{ color: var(--pink); }
.hero h1{ font-size: clamp(2.4rem, 6vw, 4.4rem); color:var(--white); }
.hero-sub{ font-size:1.08rem; color: var(--text-muted); max-width: 48ch; }
.hero-actions{ display:flex; gap:1rem; flex-wrap:wrap; margin-top:1.8rem; }
.scroll-cue{
  position:absolute; bottom: 34px; left: var(--gutter); z-index:2;
  display:flex; align-items:center; gap:.5em; color: var(--text-muted);
  font-size:.72rem; letter-spacing:.18em; text-transform:uppercase;
}
.scroll-cue svg{ animation: bob 1.6s ease-in-out infinite; }
@keyframes bob{ 0%,100%{ transform: translateY(0);} 50%{ transform: translateY(6px);} }

/* ---------- MARQUEE ---------- */
.marquee{
  background: var(--pink); color: var(--white); overflow:hidden;
  padding: 1.1rem 0; position:relative;
}
.marquee-track{
  display:flex; width:max-content; gap: 3rem;
  animation: marquee 26s linear infinite;
}
.marquee-track span{
  font-family: var(--serif); font-size:1.15rem; white-space:nowrap; display:flex; align-items:center; gap:1.2rem;
}
.marquee-track span::after{ content:"✦"; font-size:.8rem; opacity:.8; }
@keyframes marquee{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .marquee-track{ animation:none; } }

/* ---------- REASSURANCE / CLIENTS ---------- */
.reassurance{ background: var(--white); padding: 2.6rem 0; border-bottom: 1px solid rgba(28,36,69,.08); }
.reassurance-inner{ display:flex; flex-wrap:wrap; align-items:center; gap: 1.6rem 2.6rem; }
.reassurance-label{ font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; color:#7a8095; margin:0; flex-shrink:0; }
.client-list{
  list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; align-items:center; gap: 2.6rem;
}
.client-list li{ display:flex; align-items:center; }
.client-list img{
  height: 32px; width:auto; max-width:140px; object-fit:contain;
  filter: grayscale(1); opacity:.55; transition: filter .25s ease, opacity .25s ease;
}
.client-list img:hover{ filter:none; opacity:1; }

/* ---------- CLIENT LOGOS MARQUEE ---------- */
.client-marquee-section{
  background: var(--pink); overflow:hidden; padding: 2.6rem 0;
  position:relative;
}
.client-marquee-label{
  font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; color: rgba(255,255,255,.9);
  text-align:center; margin: 0 0 1.5rem;
}
.client-marquee-track{
  display:flex; width:max-content; gap: 2rem;
  animation: client-marquee 36s linear infinite;
}
.client-pill{
  background: var(--white); border-radius: 16px; padding: 1rem 2.2rem;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
  box-shadow: 0 10px 24px rgba(16,20,44,.14);
}
.client-pill img{ height: 48px; width:auto; max-width:190px; object-fit:contain; }
@keyframes client-marquee{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce){
  .client-marquee-track{ animation:none; flex-wrap:wrap; justify-content:center; width:auto; }
}
@media (max-width: 640px){
  .client-pill{ padding: .8rem 1.6rem; }
  .client-pill img{ height: 36px; }
}

/* ---------- ZONE D'INTERVENTION ---------- */
.zone{ padding: 6.5rem 0; background: var(--ivory); }
.zone-inner{ display:grid; grid-template-columns: 1.2fr .8fr; gap: 3rem; align-items:center; }
.zone h2{ font-size: clamp(1.6rem, 3.2vw, 2.2rem); max-width: 20ch; }
.zone p{ color: var(--ink); max-width: 46ch; }
.zone-tags{
  list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap: .9rem; align-content:flex-start;
}
.zone-tags li{
  border: 1px solid rgba(28,36,69,.2); padding: .7em 1.3em; clip-path: polygon(6% 0, 100% 0, 94% 100%, 0% 100%);
  font-size:.85rem; text-transform:uppercase; letter-spacing:.06em; color: var(--navy);
}
.zone-tags li:first-child{ background: var(--navy); color: var(--white); border-color: var(--navy); }

/* ---------- CASE STUDY (exemple de réalisation) ---------- */
.case-study{ padding: 7rem 0; background: var(--ivory); }
.case-study h2{ font-size: clamp(1.8rem, 3.6vw, 2.4rem); max-width: 26ch; }
.case-study-intro{ max-width: 68ch; color: var(--ink); font-size:1.05rem; margin-top:1rem; }
.case-study-stats{
  list-style:none; margin: 2.2rem 0 0; padding:0;
  display:flex; flex-wrap:wrap; gap: 2.4rem 3rem;
}
.case-study-stats strong{
  display:block; font-family: var(--serif); font-size:2rem; color: var(--pink); line-height:1;
}
.case-study-stats span{
  display:block; margin-top:.4rem; font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:#7a8095;
}
.case-study-gallery{
  display:grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 140px; gap: .9rem;
  margin-top: 3rem;
}
.case-study-gallery figure{ margin:0; overflow:hidden; border-radius: 10px; }
.case-study-gallery img{ width:100%; height:100%; object-fit:cover; display:block; transition: transform .5s ease; }
.case-study-gallery figure:hover img{ transform: scale(1.06); }
.case-study-gallery figure:first-child{ grid-column: span 2; grid-row: span 2; }
@media (max-width: 900px){
  .case-study-gallery{ grid-template-columns: repeat(3, 1fr); grid-auto-rows: 110px; }
}
@media (max-width: 640px){
  .case-study-gallery{ grid-template-columns: repeat(2, 1fr); grid-auto-rows: 130px; }
  .case-study-gallery figure:first-child{ grid-column: span 2; grid-row: span 1; }
}

/* ---------- ARTICLE HERO (photo pleine largeur) ---------- */
.article-hero{
  position:relative; min-height: 64vh; display:flex; align-items:flex-end;
  background-size: cover; background-position: center; color: var(--white);
  overflow:hidden;
}
.article-hero::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(16,20,44,.1) 0%, rgba(16,20,44,.5) 55%, rgba(16,20,44,.94) 100%);
}
.article-hero-inner{ position:relative; z-index:2; padding: 178px 0 4rem; }
.article-hero h1{ color: var(--white); font-size: clamp(2.2rem, 5vw, 3.4rem); max-width: 26ch; }
.article-hero .lead{ color: var(--pale); max-width: 60ch; font-size:1.05rem; margin-top:.9rem; margin-bottom:0; }
.article-hero .breadcrumb{ color: rgba(255,255,255,.75); }
.article-hero .breadcrumb a{ color: rgba(255,255,255,.75); }

/* ---------- STATS BAND ---------- */
.stats-band{ background: var(--ivory); padding: 3rem 0; border-bottom: 1px solid rgba(28,36,69,.08); }
.stats-band .case-study-stats{ justify-content:center; margin:0; text-align:center; }

/* ---------- ARTICLE BLOCK (texte + image alternés) ---------- */
.article-block{ padding: 5.5rem 0; }
.article-block:nth-of-type(even){ background: var(--ivory); }
.article-block-inner{
  display:grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items:center;
}
.article-block-media{ order:1; }
.article-block-text{ order:2; }
.article-block.reverse .article-block-media{ order:2; }
.article-block.reverse .article-block-text{ order:1; }
.article-block-media img{
  width:100%; height:100%; display:block; aspect-ratio: 4/3; object-fit:cover;
  border-radius: 14px; box-shadow: 0 24px 50px rgba(16,20,44,.16);
}
.article-block-media-duo{ display:grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.article-block-media-duo img{ aspect-ratio: 3/4; }
.article-block-media-grid4{ display:grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.article-block-media-grid4 img{ aspect-ratio: 1/1; }
.article-block-media-trio{ display:grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.article-block-media-trio img{ aspect-ratio: 1/1; }
.article-block-media-trio img:first-child{ grid-column: span 2; aspect-ratio: 16/9; }
.article-block-text h2{ font-size: clamp(1.6rem, 3vw, 2.1rem); margin-top:.5rem; }
.article-block-text p{ color: var(--ink); font-size:1.02rem; }
@media (max-width: 900px){
  .article-block{ padding: 3.5rem 0; }
  .article-block-inner{ grid-template-columns: 1fr; gap: 2rem; }
  .article-block-media{ order:1 !important; }
  .article-block-text{ order:2 !important; }
}

/* ---------- PRESTATIONS ---------- */
.prestations{ padding: 7rem 0; background: var(--ivory); }
.prestations h2{ font-size: clamp(1.8rem, 3.8vw, 2.6rem); max-width: 20ch; margin-bottom: 2.8rem; }
.prestations-grid{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 1px;
  background: rgba(28,36,69,.1);
  border: 1px solid rgba(28,36,69,.1);
}
.prestation-card{
  display:block; background: var(--ivory); padding: 2.6rem 2rem; position:relative;
  transition: background .3s ease, transform .3s ease, box-shadow .3s ease, color .3s ease;
}
.prestation-card:hover{
  background: var(--navy); color: var(--white); transform: translateY(-6px);
  box-shadow: 0 24px 40px rgba(16,20,44,.22); z-index: 1;
}
.prestation-num{
  font-family: var(--serif); font-size: 1.1rem; color: var(--pink); display:block; margin-bottom: 1.6rem;
}
.prestation-card h3{ font-size:1.3rem; margin-bottom:.6rem; }
.prestation-card p{ font-size:.92rem; color:#4a5170; margin:0 0 1.1rem; transition: color .3s ease; }
.prestation-card:hover p{ color: var(--text-muted); }
.prestation-card .card-link{
  font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color: var(--pink);
  display:inline-flex; align-items:center; gap:.4em;
}
.prestations-grid-4{ grid-template-columns: repeat(auto-fit, minmax(200px,1fr)); }

/* ---------- PAGE HERO (sous-pages) ---------- */
.page-hero{
  position:relative; overflow:hidden;
  background: linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%);
  color: var(--white); padding: 178px 0 76px;
}
.page-hero .hero-shape-a{ width:38vw; height:120%; top:-20%; opacity:.7; }
.page-hero .container{ position:relative; z-index:2; }
.page-hero h1{ color: var(--white); font-size: clamp(2rem, 4.4vw, 3rem); max-width: 32ch; }
.page-hero .lead{ color: var(--text-muted); max-width: 60ch; font-size:1.05rem; margin-top:.9rem; margin-bottom:0; }
.breadcrumb{ font-size:.78rem; color: var(--text-muted); margin-bottom: 1.3rem; letter-spacing:.02em; }
.breadcrumb a{ color: var(--text-muted); border-bottom:1px solid transparent; }
.breadcrumb a:hover{ border-color: var(--pink); }
.breadcrumb .sep{ opacity:.5; margin: 0 .1em; }
.breadcrumb [aria-current="page"]{ color: var(--white); }

/* ---------- PROSE / INCLUDED SECTIONS ---------- */
.prose-section{ padding: 5.5rem 0 1rem; }
.prose{ max-width: 68ch; }
.prose p{ color: var(--ink); font-size:1.05rem; }
.prose p + p{ margin-top: 1.2rem; }

.included-section{ padding: 3.5rem 0 5.5rem; }
.included-section h2{ font-size: clamp(1.5rem, 3vw, 2rem); max-width: 24ch; margin-bottom: 1.8rem; }
.included-list{
  list-style:none; margin:0; padding:0; max-width: 62ch;
  display:grid; gap: 1rem;
}
.included-list li{
  position:relative; padding-left: 1.8rem; color: var(--ink); font-size:.98rem;
}
.included-list li::before{
  content:""; position:absolute; left:0; top:.5em; width:10px; height:10px;
  background: var(--pink); clip-path: polygon(22% 0, 100% 0, 78% 100%, 0% 100%);
}

/* ---------- SECTION CTA / LINK ARROW ---------- */
.section-cta{ margin-top: 2.6rem; }
.link-arrow{
  font-size:.85rem; text-transform:uppercase; letter-spacing:.08em; color: var(--pink);
  border-bottom: 1px solid transparent;
}
.link-arrow:hover{ border-color: var(--pink); }

/* ---------- CTA BAND ---------- */
.cta-band{ background: var(--pink); color: var(--white); padding: 5rem 0; position:relative; overflow:hidden; }
.cta-band::before{
  content:""; position:absolute; width:50vw; max-width:640px; height:220%; top:-60%; right:-10%;
  background: rgba(255,255,255,.08); clip-path: polygon(22% 0, 100% 0, 78% 100%, 0% 100%);
}
.cta-band-inner{ position:relative; z-index:1; text-align:center; max-width: 640px; margin:0 auto; }
.cta-band h2{ color: var(--white); font-size: clamp(1.6rem, 3.2vw, 2.1rem); }
.cta-band p{ color: rgba(255,255,255,.85); margin-bottom: 1.8rem; }
.cta-band .btn-primary{ background: var(--navy); }
.cta-band .btn-primary:hover{ background: var(--navy-deep); }

/* ---------- POURQUOI ---------- */
.pourquoi{ padding: 7rem 0; background: var(--white); }
.pourquoi h2{ font-size: clamp(1.8rem, 3.8vw, 2.6rem); max-width: 24ch; margin-bottom: 3rem; }
.pourquoi-grid{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(230px,1fr)); gap: 2.4rem 2rem;
}
.pourquoi-card{ padding-right: 1rem; position:relative; padding-left: 1.6rem; }
.pourquoi-card::before{
  content:""; position:absolute; left:0; top:.3rem; width:4px; height: 2.6rem;
  background: var(--pink);
}
.pourquoi-num{
  font-family: var(--serif); font-size: 1.7rem; color: var(--navy-soft); display:block; margin-bottom: .8rem;
}
.pourquoi-card h3{ font-size: 1.15rem; margin-bottom:.5rem; }
.pourquoi-card p{ font-size:.92rem; color:#4a5170; margin:0; }

/* ---------- METHODE ---------- */
.methode{ padding: 7rem 0; background: var(--navy); color: var(--white); position:relative; overflow:hidden; }
.methode h2{ color: var(--white); font-size: clamp(1.8rem, 3.8vw, 2.6rem); max-width: 24ch; margin-bottom: 3rem; }
.methode-steps{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns: repeat(auto-fit, minmax(210px,1fr)); gap: 2.2rem 1.8rem;
  position:relative; z-index:1;
}
.methode-steps li{ position:relative; padding-top: .2rem; }
.methode-num{
  display:flex; align-items:center; justify-content:center;
  width: 44px; height:44px; border-radius:50%;
  border: 1px solid rgba(255,255,255,.35);
  font-family: var(--serif); font-size:1.05rem; margin-bottom: 1.3rem;
  color: var(--pink);
}
.methode-steps h3{ color: var(--white); font-size:1.08rem; margin-bottom:.5rem; }
.methode-steps p{ color: var(--text-muted); font-size:.9rem; margin:0; }

/* ---------- SCROLL REVEAL ---------- */
.reveal{ opacity:0; transform: translateY(26px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-visible{ opacity:1; transform: translateY(0); }
.reveal.gsap-managed{ transition: none; }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
}

/* ---------- AGENCE ---------- */
.agence{ padding: 7rem 0; background: var(--navy); color: var(--white); }
.agence-inner{ display:grid; grid-template-columns: 1.1fr .9fr; gap: 3.4rem; align-items:center; }
.agence h2{ color:var(--white); font-size: clamp(1.8rem, 3.6vw, 2.4rem); }
.agence p{ color: var(--text-muted); }
.agence-media{
  aspect-ratio: 4/5; position:relative;
  background: linear-gradient(150deg, var(--navy-soft), var(--navy-deep));
  border: 1px solid rgba(255,255,255,.08);
  clip-path: polygon(8% 0, 100% 0, 100% 92%, 92% 100%, 0 100%, 0 8%);
}

/* ---------- REALISATIONS ---------- */
.realisations{ padding: 7rem 0; }
.realisations h2{ font-size: clamp(1.8rem, 3.6vw, 2.4rem); max-width: 24ch; margin-bottom: 2.6rem; }
.gallery{ display:grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
#nos-evenements .gallery{ grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); max-width: 760px; }
.gallery-item{
  margin:0; aspect-ratio: 3/4; position:relative; overflow:hidden;
  display:flex; align-items:flex-end; transition: transform .4s ease;
}
.gallery-item:nth-child(3n+1){ clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%, 0 12%); }
.gallery-item:hover{ transform: scale(1.03); }
.gallery-item img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition: transform .5s ease;
}
.gallery-item:hover img{ transform: scale(1.08); }
.gallery-item figcaption, .gallery-item .gallery-caption{
  position:relative; z-index:1; color:var(--white); font-size:.8rem; padding: 1rem;
  background: linear-gradient(to top, rgba(16,20,44,.8), transparent);
  width:100%;
}
a.gallery-item .gallery-caption{ display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
a.gallery-item .gallery-caption::after{ content:"→"; opacity:.8; }

/* ---------- CONTACT ---------- */
.contact{ padding: 7rem 0; background: var(--ivory); }
.contact-inner{ display:grid; grid-template-columns: 1fr 1fr; gap: 3.4rem; }
.contact h2{ font-size: clamp(1.8rem, 3.6vw, 2.4rem); }
.contact-details{ list-style:none; padding:0; margin: 1.5rem 0; font-size:.95rem; }
.contact-details li{ margin-bottom:.5rem; }
.contact-details a{ border-bottom:1px solid var(--pink); }
.map-embed{ margin-top:1.8rem; overflow:hidden; border:1px solid rgba(28,36,69,.15); }
.map-embed iframe{ width:100%; height:260px; border:0; display:block; }

.contact-form{ display:flex; flex-direction:column; gap: .3rem; }
.contact-form label{ font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; margin-top:1rem; color:#4a5170; }
.contact-form input, .contact-form textarea{
  font-family: var(--sans); font-size:1rem; padding:.7em .2em; border:none; border-bottom:1px solid rgba(28,36,69,.3);
  background:transparent; color: var(--navy);
}
.contact-form input:focus, .contact-form textarea:focus{ border-color: var(--pink); }
.contact-form button{ margin-top:1.9rem; align-self:flex-start; cursor:pointer; }
.form-note{ font-size:.75rem; color:#9aa0b4; margin-top:.9rem; }

/* ---------- FOOTER ---------- */
.site-footer{ background: var(--navy-deep); color: var(--text-muted); padding: 4rem 0 2rem; }
.footer-grid{
  display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 2.4rem;
  padding-bottom: 2.6rem; border-bottom: 1px solid rgba(255,255,255,.08);
}
.footer-brand p{ font-size:.88rem; margin-top:1rem; max-width: 34ch; }
.footer-brand .logo{ color: var(--white); }
.footer-col-title{ color: var(--white); font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; margin-bottom:1rem; }
.footer-col nav{ display:flex; flex-direction:column; gap:.7rem; font-size:.9rem; }
.footer-col nav a:hover{ color: var(--white); }
.footer-copy{ margin-top:1.6rem; font-size:.75rem; color:#5e6480; }

/* ---------- FAQ ---------- */
.faq{ padding: 7rem 0; background: var(--ivory); }
.faq h2{ font-size: clamp(1.8rem, 3.6vw, 2.4rem); max-width: 26ch; margin-bottom: 2.6rem; }
.faq-list{ max-width: 820px; }
.faq-item{
  border-top: 1px solid rgba(28,36,69,.15);
}
.faq-item:last-child{ border-bottom: 1px solid rgba(28,36,69,.15); }
.faq-item summary{
  display:flex; align-items:center; gap:1.2rem; padding: 1.5rem 0; cursor:pointer;
  list-style:none; font-family: var(--serif); font-size:1.1rem;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-num{ font-family: var(--sans); font-size:.78rem; color: var(--pink); letter-spacing:.06em; flex-shrink:0; }
.faq-q{ flex:1; }
.faq-toggle{ position:relative; width:18px; height:18px; flex-shrink:0; }
.faq-toggle::before, .faq-toggle::after{
  content:""; position:absolute; background: var(--navy); top:50%; left:50%; transform: translate(-50%,-50%);
}
.faq-toggle::before{ width:14px; height:2px; }
.faq-toggle::after{ width:2px; height:14px; transition: opacity .2s ease; }
.faq-item[open] .faq-toggle::after{ opacity:0; }
.faq-item[open] summary{ color: var(--pink); }
.faq-item p{ padding: 0 0 1.6rem 2.8rem; color: var(--ink); font-size:.98rem; max-width: 62ch; }

/* ---------- EDITORIAL: DROP CAP & PULL QUOTE ---------- */
.prose .drop-cap::first-letter{
  font-family: var(--serif); font-weight:700; color: var(--pink);
  float:left; line-height:.82; font-size:4.2em; padding: .04em .1em 0 0;
}
.pull-quote{
  margin: 2.4rem 0; padding-left: 1.6rem; border-left: 3px solid var(--pink);
  max-width: 46ch;
}
.pull-quote p{
  font-family: var(--serif); font-style: italic; font-weight:600;
  font-size: clamp(1.3rem, 2.6vw, 1.7rem); color: var(--navy); line-height:1.35; margin:0;
}

/* ---------- LEGAL PROSE PAGES ---------- */
.prose h2{ font-size:1.3rem; margin-top:2.2rem; }
.prose ul{ color: var(--ink); padding-left:1.3rem; }
.prose li{ margin-bottom:.4em; }
.prose a{ color: var(--pink); border-bottom:1px solid var(--pink); }

/* ---------- 404 ---------- */
.not-found{ padding: 10rem 0 8rem; text-align:center; }
.not-found .code{ font-family: var(--serif); font-size: clamp(4rem, 14vw, 8rem); color: var(--pink); margin:0; line-height:1; }
.not-found h1{ margin-top:.4rem; }
.not-found p{ color: var(--ink); max-width:46ch; margin:0 auto 2rem; }

/* ---------- CONTACT FORM: consent / honeypot / recaptcha ---------- */
.hp-field{ position:absolute; left:-9999px; top:-9999px; opacity:0; height:0; overflow:hidden; }
.form-consent{
  display:flex; align-items:flex-start; gap:.6rem; margin-top:1.3rem;
  font-size:.82rem; color:#4a5170;
}
.form-consent input{ margin-top:.25rem; flex-shrink:0; }
.form-consent label{ text-transform:none; letter-spacing:normal; font-size:.82rem; margin-top:0; color:#4a5170; }
.form-consent a{ color: var(--pink); border-bottom:1px solid var(--pink); }
.g-recaptcha{ margin-top:1.3rem; }
.form-alert{
  margin-bottom:1.3rem; padding: .9em 1.1em; border-radius:6px; font-size:.9rem;
}
.form-alert.success{ background:#e4f5ea; color:#1d6b3d; border:1px solid #b7e2c6; }
.form-alert.error{ background:#fbe7e9; color:#a3283a; border:1px solid #f1bcc3; }

/* ---------- COOKIE BANNER ---------- */
.cookie-banner{
  position: fixed; left:0; right:0; bottom:0; z-index: 500;
  background: var(--navy-deep); color: var(--white);
  padding: 1.4rem var(--gutter);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:1.2rem 2rem;
  transform: translateY(110%); transition: transform .5s ease;
  box-shadow: 0 -10px 30px rgba(0,0,0,.2);
}
.cookie-banner.is-visible{ transform: translateY(0); }
.cookie-banner p{ margin:0; font-size:.85rem; color: var(--text-muted); max-width: 60ch; }
.cookie-banner a{ color: var(--white); border-bottom:1px solid rgba(255,255,255,.4); }
.cookie-banner-actions{ display:flex; gap:.8rem; flex-wrap:wrap; }
.cookie-banner .btn{ padding: .7em 1.5em; font-size:.72rem; cursor:pointer; }
.cookie-banner .btn-refuse{ background:transparent; color: var(--white); border-color: rgba(255,255,255,.4); }
.cookie-banner .btn-refuse:hover{ border-color: rgba(255,255,255,.9); background: rgba(255,255,255,.08); }
.cookie-settings-link{
  background:none; border:none; color: var(--text-muted); font-size:.75rem;
  text-decoration:underline; cursor:pointer; padding:0; font-family: var(--sans);
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 900px){
  .agence-inner, .contact-inner, .zone-inner{ grid-template-columns: 1fr; }
  .agence-media{ order:-1; aspect-ratio: 16/9; }
  .gallery{ grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 640px){
  .menu-trigger span.label-open{ display:none; }
  body:not(.menu-open) .menu-trigger{ padding: .6em; }
  .overlay-list a{ font-size: clamp(1.6rem, 9vw, 2.4rem); }
}
