/* ══════════════════════════════════════════════
   KATELL COUTURE v5 — Toulon
   Typographie : DM Serif Display + Cormorant Garamond
   Palette : Hero sombre · Corps ivoire chaud · Or
   ══════════════════════════════════════════════ */

/* ── RESET ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  /* Couleurs */
  --bg:     #FAF7F2;      /* Ivoire chaud */
  --bg2:    #F2EBE0;      /* Crème */
  --dark:   #2A2118;      /* Brun nocturne */
  --mid:    #6B5D4F;      /* Taupe */
  --gold:   #C4A056;      /* Or chaud */
  --gold2:  #8B6F3A;      /* Or sombre */
  --light:  #E6DDD0;      /* Lin */
  --white:  #FFFDF9;      /* Blanc chaud */
  --text:   #3A2D22;      /* Corps */
  --rose:   #D4A89A;      /* Accent cérémonie */

  /* Typo */
  --fd: 'DM Serif Display', Georgia, serif;
  --fs: 'Cormorant Garamond', Georgia, serif;

  /* Layout */
  --topbar-h: 32px;
  --nav-h:    60px;
  --offset:   calc(var(--topbar-h) + var(--nav-h));

  /* Transitions */
  --t:  .3s cubic-bezier(.4,0,.2,1);
  --ts: .65s cubic-bezier(.4,0,.2,1);
}

html {
  scroll-behavior: smooth;
  font-size: 16px;
  overflow-x: hidden;        /* iOS Safari nécessite aussi sur html */
}
body {
  background: var(--bg);
  color: var(--text);
  font-family: var(--fs);
  font-size: 1.1rem;
  line-height: 1.68;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  position: relative;        /* ancre pour overflow-x sur iOS */
  max-width: 100%;
}
a   { color: inherit; text-decoration: none; }
ul  { list-style: none; }
img { display: block; max-width: 100%; }

.container {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 clamp(1.25rem, 4vw, 2.5rem);
}

/* ── LABEL ── */
.label {
  display: block;
  font-family: var(--fs);
  font-size: .75rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold2);
  margin-bottom: .4rem;
}

/* ── SECTION HEADER ── */
.sec-head { text-align: center; margin-bottom: 2.25rem; }
.sec-head h2 {
  font-family: var(--fd);
  font-size: clamp(1.9rem, 4vw, 2.8rem);
  font-weight: 400;
  color: var(--dark);
  line-height: 1.15;
}
.sec-head h2 em { font-style: italic; color: var(--gold2); }
.sec-head__note { font-size: .85rem; color: var(--mid); font-style: italic; margin-top: .3rem; }

/* ── BOUTONS ── */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  font-family: var(--fs);
  font-size: .95rem;
  letter-spacing: .03em;
  cursor: pointer;
  border: none;
  transition: background var(--t), color var(--t), border-color var(--t), transform var(--t);
  text-decoration: none;
  padding: .65rem 1.35rem;
  white-space: nowrap;
}
.btn--gold    { background: var(--gold); color: var(--dark); }
.btn--gold:hover { background: var(--gold2); color: var(--white); transform: translateY(-1px); }
.btn--outline { background: transparent; color: rgba(255,253,249,.85); border: 1px solid rgba(255,253,249,.35); }
.btn--outline:hover { border-color: var(--gold); color: var(--gold); }
.btn--dark    { background: var(--dark); color: var(--white); }
.btn--dark:hover { background: var(--gold2); transform: translateY(-1px); }
.btn--ghost   { background: transparent; color: var(--gold2); border: 1px solid var(--gold); }
.btn--ghost:hover { background: var(--gold); color: var(--dark); }

/* ── REVEAL ── */
[data-reveal] {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity var(--ts), transform var(--ts);
}
[data-reveal].on { opacity: 1; transform: none; }

/* ══════════════════════════════════════════════
   TOPBAR — ruban défilant visuel
   ══════════════════════════════════════════════ */
.topbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  width: 100%;
  height: var(--topbar-h);
  background: var(--dark);
  border-bottom: 1px solid rgba(196,160,86,.25);
  overflow: hidden;
  z-index: 200;
  contain: layout;             /* isole le débordement de l'animation */
}
/* Dégradés latéraux pour effet fade */
.topbar::before,
.topbar::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 80px;
  z-index: 2;
  pointer-events: none;
}
.topbar::before { left: 0;  background: linear-gradient(to right, var(--dark), transparent); }
.topbar::after  { right: 0; background: linear-gradient(to left,  var(--dark), transparent); }

.topbar__track { height: 100%; overflow: hidden; }
.topbar__inner {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  height: 100%;
  white-space: nowrap;
  will-change: transform;      /* optimise l'animation GPU */
  animation: topbar-scroll 20s linear infinite;
}
.topbar__inner span {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  font-family: var(--fs);
  font-size: .72rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(255,253,249,.7);
  flex-shrink: 0;
}
.topbar__inner svg { color: var(--gold); flex-shrink: 0; }
@keyframes topbar-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ══════════════════════════════════════════════
   NAV
   ══════════════════════════════════════════════ */
.nav {
  position: fixed;
  top: var(--topbar-h);
  left: 0; right: 0;
  width: 100%;
  z-index: 150;
  background: rgba(42,33,24,.92);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(196,160,86,.15);
  transition: background var(--t), box-shadow var(--t);
}
.nav.scrolled {
  background: var(--dark);
  box-shadow: 0 2px 24px rgba(42,33,24,.3);
}
.nav__inner {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  height: var(--nav-h);
  padding: 0 clamp(1.25rem, 4vw, 2.5rem);
}
.nav__logo { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.nav__logo-k {
  width: 32px; height: 32px;
  background: var(--gold);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--fd);
  font-size: .95rem;
  font-style: italic;
  color: var(--dark);
  flex-shrink: 0;
}
.nav__logo-name {
  font-family: var(--fd);
  font-size: 1.15rem;
  font-style: italic;
  color: var(--white);
  letter-spacing: .02em;
}
.nav__links { display: flex; align-items: center; gap: 0; margin-left: auto; }
.nav__link {
  font-size: .75rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,253,249,.62);
  padding: .35rem .6rem;
  transition: color var(--t);
  position: relative;
}
.nav__link::after {
  content: '';
  position: absolute;
  bottom: -2px; left: .6rem; right: .6rem;
  height: 1px;
  background: var(--gold);
  transform: scaleX(0);
  transition: transform var(--t);
}
.nav__link:hover { color: var(--white); }
.nav__link:hover::after { transform: scaleX(1); }
.nav__tel {
  display: flex; align-items: center; gap: .4rem;
  background: var(--gold);
  color: var(--dark);
  font-size: .82rem;
  padding: .42rem 1rem;
  margin-left: .75rem;
  transition: background var(--t);
  flex-shrink: 0;
}
.nav__tel:hover { background: var(--gold2); color: var(--white); }
/* Burger */
.nav__burger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; margin-left: auto; }
.nav__burger span { display: block; width: 22px; height: 1.5px; background: var(--white); transition: transform var(--t), opacity var(--t); }
.nav__burger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav__burger.open span:nth-child(2) { opacity: 0; }
.nav__burger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
/* Mobile */
.nav__mobile { display: none; flex-direction: column; background: var(--dark); border-top: 1px solid rgba(196,160,86,.12); padding: .6rem 0 1rem; width: 100%; overflow: hidden; }
.nav__mobile.open { display: flex; }
.nav__mobile-link { display: block; padding: .55rem clamp(1.25rem, 4vw, 2.5rem); font-size: .98rem; color: rgba(255,253,249,.72); border-bottom: 1px solid rgba(255,253,249,.05); transition: color var(--t); }
.nav__mobile-link:hover { color: var(--gold); }
.nav__mobile-tel { display: flex; align-items: center; gap: .5rem; margin: .65rem clamp(1.25rem, 4vw, 2.5rem) 0; padding: .6rem 1rem; background: var(--gold); color: var(--dark); font-size: .92rem; width: fit-content; }

/* ══════════════════════════════════════════════
   HERO + CARROUSEL
   ══════════════════════════════════════════════ */
.hero {
  position: relative;
  height: 100svh;
  min-height: 580px;
  overflow: hidden;
  max-width: 100%;
  background: var(--dark);
  margin-top: var(--offset);
}
/* Carrousel */
.carousel { position: absolute; inset: 0; overflow: hidden; }
.slide {
  position: absolute; inset: 0;
  background-color: var(--dark);
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1.1s ease;
}
.slide--active { opacity: 1; }
/* Placeholder */
.slide__ph {
  position: absolute; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .75rem;
  color: rgba(196,160,86,.3);
}
.slide:nth-child(1) .slide__ph { background: linear-gradient(135deg, #2a2118 0%, #3a2e20 100%); }
.slide:nth-child(2) .slide__ph { background: linear-gradient(135deg, #231c12 0%, #32261a 100%); }
.slide:nth-child(3) .slide__ph { background: linear-gradient(135deg, #2e2318 0%, #3d3020 100%); }
.slide:nth-child(4) .slide__ph { background: linear-gradient(135deg, #251d13 0%, #342818 100%); }
.slide:nth-child(5) .slide__ph { background: linear-gradient(135deg, #2b2219 0%, #3b2e22 100%); }
.slide__ph svg { opacity: .4; }
.slide__ph span { font-family: var(--fs); font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; opacity: .45; }
/* Overlay gradient latéral */
.carousel__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(100deg, rgba(42,33,24,.88) 0%, rgba(42,33,24,.55) 45%, rgba(42,33,24,.25) 100%);
  pointer-events: none;
}
/* Boutons prev/next — desktop uniquement */
.carousel__btn {
  position: absolute; top: 50%; transform: translateY(-50%);
  z-index: 5; background: rgba(255,253,249,.08); border: 1px solid rgba(255,253,249,.18);
  color: var(--white); width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: background var(--t);
}
.carousel__btn:hover { background: rgba(196,160,86,.35); }
.carousel__btn--prev { left: 1.25rem; }
.carousel__btn--next { right: 1.25rem; }
/* Dots */
.carousel__dots { position: absolute; bottom: 1.4rem; left: 50%; transform: translateX(-50%); display: flex; gap: .4rem; z-index: 5; }
.carousel__dot { width: 5px; height: 5px; border-radius: 50%; background: rgba(255,253,249,.3); border: none; cursor: pointer; padding: 0; transition: background var(--t), transform var(--t); }
.carousel__dot.active { background: var(--gold); transform: scale(1.4); }
/* Label */
.carousel__label { position: absolute; bottom: 1.4rem; right: 1.5rem; font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,253,249,.42); z-index: 5; }
/* Contenu hero */
.hero__content {
  position: relative; z-index: 10;
  height: 100%;
  display: flex; flex-direction: column; justify-content: center;
  padding: 2rem clamp(1.5rem, 6vw, 5rem) 3rem;
  max-width: 680px;
}
.hero__badge {
  display: inline-flex; align-items: center; gap: .4rem;
  font-size: .68rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--gold); border: 1px solid rgba(196,160,86,.3); padding: .28rem .7rem;
  margin-bottom: 1.1rem; width: fit-content;
}
.hero__title {
  font-family: var(--fd);
  font-size: clamp(2.6rem, 7vw, 5.2rem);
  font-weight: 400;
  color: var(--white);
  line-height: 1.05;
  margin-bottom: .85rem;
}
.hero__title em { font-style: italic; color: var(--gold); }
.hero__sub {
  font-size: clamp(.95rem, 1.9vw, 1.12rem);
  color: rgba(255,253,249,.65);
  margin-bottom: 1.6rem;
  line-height: 1.7;
}
.hero__sub strong { color: var(--gold); font-weight: 400; }
.hero__actions { display: flex; flex-wrap: wrap; gap: .65rem; }

/* ══════════════════════════════════════════════
   BIO STRIP — fond ivoire (rupture avec le hero)
   ══════════════════════════════════════════════ */
.bio {
  background: var(--white);
  border-bottom: 1px solid var(--light);
  padding: 2rem 0;
}
.bio__inner { display: flex; align-items: center; gap: 3rem; flex-wrap: wrap; }
.bio__text { flex: 1; min-width: 250px; }
.bio__text .label { margin-bottom: .4rem; }
.bio__body { font-size: 1rem; color: var(--mid); line-height: 1.75; }
.bio__body strong { color: var(--dark); font-weight: 400; }
.bio__stats { display: flex; gap: 1.25rem; flex-shrink: 0; flex-wrap: wrap; }
.bio__stat {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: .7rem 1.1rem; border: 1px solid var(--light); min-width: 85px;
  background: var(--bg);
}
.bio__stat strong {
  font-family: var(--fd); font-size: 1.35rem; font-style: italic;
  color: var(--gold2); line-height: 1.1; display: block; margin-bottom: .2rem;
}
.bio__stat span { font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: var(--mid); line-height: 1.35; }

/* ══════════════════════════════════════════════
   SERVICES
   ══════════════════════════════════════════════ */
.services { padding: 3.5rem 0; background: var(--bg); }
.services__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin-bottom: 1rem;
}
/* Carte */
.scard {
  background: var(--white);
  border: 1px solid var(--light);
  padding: 1.4rem 1.15rem;
  position: relative;
  transition: box-shadow var(--t), transform var(--t);
}
.scard::after {
  content: ''; position: absolute; top: 0; left: 0;
  width: 0; height: 2px; background: var(--gold);
  transition: width var(--ts);
}
.scard:hover { box-shadow: 0 6px 24px rgba(42,33,24,.08); transform: translateY(-2px); }
.scard:hover::after { width: 100%; }
.scard__n { font-size: .7rem; letter-spacing: .2em; color: var(--gold); display: block; margin-bottom: .5rem; }
.scard h3 { font-family: var(--fd); font-size: 1.22rem; font-weight: 400; color: var(--dark); line-height: 1.2; margin-bottom: .55rem; }
.scard h3 em { font-style: italic; color: var(--gold2); }
.scard ul { display: flex; flex-direction: column; gap: .22rem; margin-bottom: .75rem; }
.scard ul li { font-size: .86rem; color: var(--mid); padding-left: .8rem; position: relative; }
.scard ul li::before { content: '—'; position: absolute; left: 0; color: var(--gold); font-size: .62rem; top: .22em; }
.scard__cta { font-size: .8rem; letter-spacing: .05em; color: var(--gold2); transition: color var(--t); }
.scard__cta:hover { color: var(--dark); }
.scard__devis-tag { font-size: .7rem; color: var(--rose); font-style: italic; }
/* Carte large */
.scard--wide { grid-column: 1 / -1; display: flex; gap: 1.25rem; align-items: flex-start; }
.scard--wide .scard__n { flex-shrink: 0; }
.scard--wide__body { flex: 1; }
.scard--wide p { font-size: .9rem; color: var(--mid); margin-bottom: .65rem; line-height: 1.65; }
.scard__list--cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: .2rem 1rem; margin-bottom: .75rem; }
/* Note enfants */
.services__enfants {
  display: flex; align-items: center; gap: .55rem;
  font-size: .87rem; color: var(--mid);
  background: var(--bg2); border-left: 2px solid var(--gold); padding: .6rem .9rem;
}
.services__enfants svg { flex-shrink: 0; color: var(--gold2); }
.services__enfants strong { color: var(--dark); font-weight: 400; }

/* ══════════════════════════════════════════════
   CÉRÉMONIE
   ══════════════════════════════════════════════ */
.ceremonie {
  background: var(--dark);
  padding: 3.5rem 0;
  position: relative;
  overflow: hidden;
}
/* Motif fond */
.ceremonie::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    repeating-linear-gradient(-45deg, transparent, transparent 24px, rgba(196,160,86,.035) 24px, rgba(196,160,86,.035) 25px);
  pointer-events: none;
}
.ceremonie__inner {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: 300px 1fr; gap: 3rem; align-items: start;
}
.ceremonie__left .label { color: var(--rose); margin-bottom: .4rem; }
.ceremonie__left h2 {
  font-family: var(--fd); font-size: clamp(1.6rem, 3.5vw, 2.4rem);
  font-weight: 400; color: var(--white); line-height: 1.15; margin-bottom: .85rem;
}
.ceremonie__left h2 em { font-style: italic; color: var(--rose); }
.ceremonie__desc { font-size: .97rem; color: rgba(255,253,249,.62); line-height: 1.75; margin-bottom: 1rem; }
.ceremonie__note {
  display: flex; align-items: flex-start; gap: .5rem;
  font-size: .86rem; color: rgba(255,253,249,.45);
  background: rgba(255,253,249,.04); border-left: 2px solid rgba(212,168,154,.4);
  padding: .65rem .9rem; margin-bottom: 1.25rem;
}
.ceremonie__note svg { flex-shrink: 0; margin-top: .15rem; color: var(--rose); }
.ceremonie__note strong { color: rgba(255,253,249,.75); font-weight: 400; }
/* Cards cérémonie */
.ceremonie__cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.ccard {
  background: rgba(255,253,249,.05);
  border: 1px solid rgba(196,160,86,.18);
  padding: 1.5rem 1.25rem;
  transition: background var(--t), border-color var(--t);
}
.ccard:hover { background: rgba(255,253,249,.08); border-color: rgba(212,168,154,.4); }
.ccard__icon {
  color: var(--rose); margin-bottom: 1rem;
  opacity: .7; height: 50px;
  display: flex; align-items: flex-end;
}
.ccard h4 {
  font-family: var(--fd); font-size: 1.1rem; font-weight: 400;
  color: var(--white); line-height: 1.25; margin-bottom: .65rem;
}
.ccard ul { display: flex; flex-direction: column; gap: .24rem; }
.ccard ul li { font-size: .82rem; color: rgba(255,253,249,.52); padding-left: .75rem; position: relative; }
.ccard ul li::before { content: '—'; position: absolute; left: 0; color: var(--rose); font-size: .6rem; opacity: .6; top: .22em; }

/* ══════════════════════════════════════════════
   ZONE
   ══════════════════════════════════════════════ */
.zone { background: var(--bg2); padding: 2.75rem 0; }
.zone__inner { display: grid; grid-template-columns: 280px 1fr; gap: 2.5rem; align-items: center; }
.zone__left .label { margin-bottom: .35rem; }
.zone__left h2 {
  font-family: var(--fd); font-size: clamp(1.5rem, 3.2vw, 2.1rem);
  font-weight: 400; color: var(--dark); line-height: 1.15; margin-bottom: .6rem;
}
.zone__left h2 em { font-style: italic; color: var(--gold2); }
.zone__left p { font-size: .93rem; color: var(--mid); line-height: 1.68; }
.zone__cities { display: flex; flex-wrap: wrap; gap: .45rem; }
.zone__cities span {
  background: var(--white); border: 1px solid var(--light);
  font-family: var(--fs); font-size: .88rem; font-style: italic;
  color: var(--text); padding: .28rem .7rem;
  transition: border-color var(--t), color var(--t);
}
.zone__cities span:hover { border-color: var(--gold); color: var(--dark); }
.zone__cities-more {
  background: var(--dark) !important; border-color: var(--dark) !important;
  color: rgba(255,253,249,.6) !important; font-style: normal !important;
  font-size: .72rem !important; letter-spacing: .08em;
}

/* ══════════════════════════════════════════════
   FORMULAIRE DEVIS
   ══════════════════════════════════════════════ */
.devis { padding: 3.25rem 0; background: var(--bg); }
.devis__grid { display: grid; grid-template-columns: 210px 1fr; gap: 2.25rem; align-items: start; }
/* Aside */
.devis__aside { background: var(--dark); padding: 1.4rem 1.15rem; display: flex; flex-direction: column; gap: 1rem; }
.aside__item { display: flex; align-items: flex-start; gap: .65rem; padding-bottom: .85rem; border-bottom: 1px solid rgba(196,160,86,.1); }
.aside__item:last-of-type { border-bottom: none; padding-bottom: 0; }
.aside__item svg { flex-shrink: 0; color: var(--gold); margin-top: .12rem; }
.aside__item strong { display: block; font-size: .68rem; letter-spacing: .15em; text-transform: uppercase; color: var(--gold); margin-bottom: .12rem; }
.aside__item a, .aside__item span { font-family: var(--fs); font-size: .95rem; color: rgba(255,253,249,.75); display: block; word-break: break-all; }
.aside__item a:hover { color: var(--gold); }
.aside__note { font-size: .72rem; font-style: italic; color: rgba(255,253,249,.3); }
/* Form */
.devis__form { background: var(--white); border: 1px solid var(--light); padding: 1.85rem 1.6rem; display: flex; flex-direction: column; gap: 1rem; }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.fg { display: flex; flex-direction: column; gap: .28rem; }
.fl { font-size: .73rem; letter-spacing: .14em; text-transform: uppercase; color: var(--mid); }
.fl span { color: var(--gold2); }
.fi {
  font-family: var(--fs); font-size: 1.05rem; color: var(--dark);
  background: var(--bg); border: 1px solid var(--light);
  padding: .6rem .85rem; width: 100%; outline: none;
  border-radius: 0; -webkit-appearance: none; appearance: none;
  transition: border-color var(--t), box-shadow var(--t);
}
.fi:focus { border-color: var(--gold2); box-shadow: 0 0 0 2px rgba(139,111,58,.1); }
.fi.err { border-color: #b94a3a; }
.fi::placeholder { color: rgba(107,93,79,.38); font-style: italic; }
.fi--ta { resize: vertical; min-height: 90px; line-height: 1.65; }
.fi-select { position: relative; }
.fi-select .fi { padding-right: 2rem; cursor: pointer; }
.fi-select svg { position: absolute; right: .65rem; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--gold2); }
/* Groupes option */
optgroup { font-size: .85rem; color: var(--mid); }
.form__foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .65rem; }
.form__req { font-size: .75rem; color: var(--mid); font-style: italic; }
.form__ok { display: none; align-items: center; gap: .55rem; background: #eef7f1; border: 1px solid #a3cdb5; padding: .65rem .9rem; font-size: .92rem; color: #2d6a4f; }
.form__ok.on { display: flex; }
.form__ok svg { flex-shrink: 0; }

/* ══════════════════════════════════════════════
   CONTACT
   ══════════════════════════════════════════════ */
.contact { padding: 3rem 0; background: var(--bg2); }
.contact__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; }
.contact__text .label { margin-bottom: .35rem; }
.contact__text h2 {
  font-family: var(--fd); font-size: clamp(1.5rem, 3.2vw, 2.1rem);
  font-weight: 400; color: var(--dark); line-height: 1.15; margin-bottom: .6rem;
}
.contact__text h2 em { font-style: italic; color: var(--gold2); }
.contact__text p { font-size: .95rem; color: var(--mid); line-height: 1.72; }
.contact__card { background: var(--white); border: 1px solid var(--light); overflow: hidden; }
.citem {
  display: flex; align-items: center; gap: .9rem;
  padding: 1rem 1.15rem; border-bottom: 1px solid var(--light);
  transition: background var(--t); text-decoration: none;
}
.citem:hover { background: var(--bg); }
.citem__icon { width: 38px; height: 38px; background: var(--bg2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--gold2); }
.citem__icon--fb { background: #1877F2; color: var(--white); }
.citem div span { display: block; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--mid); margin-bottom: .08rem; }
.citem div strong { font-family: var(--fs); font-size: 1.05rem; font-weight: 400; color: var(--dark); word-break: break-all; }
.citem__loc { display: flex; align-items: center; gap: .4rem; padding: .75rem 1.15rem; font-size: .8rem; color: var(--mid); letter-spacing: .03em; }
.citem__loc svg { color: var(--gold2); flex-shrink: 0; }

/* ══════════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════════ */
.footer { background: var(--dark); padding: 1.85rem 0 1.5rem; border-top: 1px solid rgba(196,160,86,.12); }
.footer__inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.1rem; }
.footer__brand { display: flex; flex-direction: column; gap: .12rem; }
.footer__brand strong { font-family: var(--fd); font-size: 1.1rem; font-style: italic; color: var(--white); }
.footer__brand span { font-size: .72rem; color: rgba(255,253,249,.35); letter-spacing: .06em; }
.footer__nav { display: flex; flex-wrap: wrap; gap: .4rem 1.1rem; }
.footer__nav a { font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,253,249,.35); transition: color var(--t); }
.footer__nav a:hover { color: var(--gold); }
.footer__copy { font-size: .7rem; color: rgba(255,253,249,.2); padding-top: 1rem; border-top: 1px solid rgba(255,253,249,.06); text-align: center; letter-spacing: .04em; }

/* ══════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════ */
@media (max-width: 1020px) {
  .services__grid    { grid-template-columns: repeat(2, 1fr); }
  .scard__list--cols { grid-template-columns: repeat(2, 1fr); }
  .ceremonie__inner  { grid-template-columns: 1fr; gap: 2rem; }
  .ceremonie__cards  { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 820px) {
  .nav__links  { display: none; }
  .nav__tel    { display: none; }
  .nav__burger { display: flex; }
  .zone__inner    { grid-template-columns: 1fr; gap: 1.5rem; }
  .contact__inner { grid-template-columns: 1fr; gap: 1.75rem; }
  .devis__grid    { grid-template-columns: 1fr; }
  .bio__inner     { gap: 1.5rem; }
  .bio__stats     { justify-content: flex-start; }
  /* Flèches carrousel : masquées sur mobile — navigation par dots + swipe */
  .carousel__btn  { display: none; }
  /* Hero content : padding réduit, plus de chevauchement */
  .hero__content  { padding: 2rem clamp(1.25rem, 5vw, 2.5rem) 2rem; }
}

@media (max-width: 640px) {
  .services__grid    { grid-template-columns: 1fr; }
  .scard--wide       { flex-direction: column; }
  .scard__list--cols { grid-template-columns: 1fr; }
  .ceremonie__cards  { grid-template-columns: 1fr; }
  .form__row         { grid-template-columns: 1fr; }
  .form__foot        { flex-direction: column; align-items: flex-start; }
  .hero__title       { font-size: clamp(2rem, 10vw, 3.2rem); }
  .hero__actions     { flex-direction: column; }
  .btn               { justify-content: center; width: 100%; }
  .carousel__label   { display: none; }
  /* Dots carrousel remontent légèrement sur très petits écrans */
  .carousel__dots    { bottom: 1rem; }
}