/* ============================================================
   Rubrique — Traiteur Mariage Paris
   Export maquette Pencil (traiteurmaquette.pen · frame k7koRa)
   ============================================================ */

:root {
  --anthracite:     var(--wp--preset--color--primary, #13243C);
  --bg-cream:       var(--wp--preset--color--bg, #FAFAF8);
  --bg-gray:        var(--wp--preset--color--bg-alt, #F5F5F3);
  --border-subtle:  var(--wp--preset--color--border, #E8E8E3);
  --brass:          var(--wp--preset--color--secondary, #C6A24F);
  --footer-bg:      var(--wp--preset--color--primary-dark, #0E1B2E);
  --accent:         var(--wp--preset--color--accent, #1E3A5C);
  --accent-soft:    rgba(30,58,92,.13);
  --text-light:     var(--wp--preset--color--light, #E5E5E0);
  --text-muted:     var(--wp--preset--color--muted, #9A9A95);
  --text-primary:   var(--wp--preset--color--text, #1A1A1A);
  --text-secondary: var(--wp--preset--color--text-secondary, #5C5C58);
  --white:          var(--wp--preset--color--white, #FFFFFF);
  --serif: var(--wp--preset--font-family--display, "Ysabeau SC", Georgia, serif);
  --sans:  var(--wp--preset--font-family--body, "Ysabeau", system-ui, -apple-system, sans-serif);
  --radius: 2px;
  --radius-pill: 9999px;
  --content: 1280px;
  --side: 80px;
}

*,*::before,*::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--sans);
  color: var(--text-primary);
  background: var(--bg-cream);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }
h1,h2,h3,h4,p { margin: 0; }
ul { list-style: none; margin: 0; padding: 0; }
.serif { font-family: var(--serif); }
.material-symbols-rounded { font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24; line-height:1; user-select:none; }

.page { width: 100%; background: var(--bg-cream); overflow-x: clip; }
.section { padding: 88px 80px; }
.eyebrow { font-size: 13px; font-weight:600; letter-spacing:2px; color:var(--accent); text-transform:uppercase; }
.hero-headline .eyebrow { color: var(--brass); }
.h2 { font-family:var(--serif); font-weight:500; font-size:38px; color:var(--text-primary); line-height:1.15; }
.section-head { max-width:760px; display:flex; flex-direction:column; gap:12px; }
.section-head.center { margin: 0 auto 52px; text-align:center; align-items:center; }
.section-sub { font-size: 17px; color:var(--text-secondary); line-height:1.6; }

/* ─── Google colors helpers ─────────────────────────────── */
.g-b  { color:#4285F4; }
.g-r  { color:#EA4335; }
.g-y  { color:#FBBC05; }
.g-gr { color:#34A853; }

/* ─── HEADER ─────────────────────────────────────────────── */
.header {
  position: sticky; top:0; z-index:50;
  display: flex; align-items:center; justify-content:space-between;
  height:80px; padding:0 48px;
  background: rgba(250,250,248,.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border-subtle);
}
.header-logo { display:flex; align-items:center; gap:10px; }
.header-logo .logo-icon { color:var(--accent); width:22px; height:22px; }
.header-wordmark { font-size:22px; font-weight:500; color:var(--text-primary); }
.header-nav { display:flex; gap:26px; }
.header-nav a { font-size: 15px; color:var(--text-secondary); transition:color .2s; }
.header-nav a:hover { color:var(--accent); }
.header-actions { display:flex; align-items:center; gap:12px; }
.btn-phone {
  display:flex; align-items:center; gap:8px;
  font-size: 15px; font-weight:500; padding:10px 16px;
  border:1px solid var(--border-subtle); border-radius:var(--radius);
  color:var(--text-primary); background:var(--white);
  transition: border-color .2s;
}
.btn-phone:hover { border-color:var(--accent); }
.btn-cta {
  padding:11px 20px; border-radius:var(--radius);
  font-size: 15px; font-weight:600;
  background:var(--accent); color:var(--white);
  transition:opacity .2s;
}
.btn-cta:hover { opacity:.88; }
.header-burger { display:none; flex-direction:column; gap:5px; padding:8px; }
.header-burger span { display:block; width:22px; height:2px; background:var(--text-primary); }

/* ─── HERO ───────────────────────────────────────────────── */
.hero-wrap { display:flex; flex-direction:column; gap:0; }

.hero-banner {
  position:relative;
  background-size:cover; background-position:center;
  min-height:680px;
  display:flex; flex-direction:column; justify-content:space-between;
  padding:40px 40px 56px;
}
.hero-tint { position:absolute;inset:0; background:rgba(26,26,26,.45); }
.hero-gradient {
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(26,26,26,.18) 0%,rgba(26,26,26,.06) 38%,rgba(26,26,26,.92) 100%);
}
.hero-banner > .hero-top, .hero-banner > .hero-bottom { position:relative; z-index:1; }

/* top row */
.hero-top { display:flex; align-items:center; justify-content:space-between; }
.breadcrumb {
  display: flex; align-items: center; gap: 8px;
  background: rgba(26,26,26,0.45);
  backdrop-filter: blur(10px);
  border-radius: var(--radius);
  padding: 8px 15px;
  font-size: 14px;
}
.breadcrumb span { color: var(--text-light); }
.breadcrumb__sep { color: var(--text-muted); }
.breadcrumb__current { color: var(--white); font-weight: 600; }
.hero-google-rating { display:flex; align-items:center; gap:10px; }
.g-logo { display:flex; font-size: 16px; font-weight:700; letter-spacing:-0.5px; }
.hero-excellent { font-size: 15px; font-weight:600; color:var(--white); }
.hero-stars { color:var(--brass); font-size: 15px; letter-spacing:1px; }
.hero-rating-count { font-size: 14px; color:rgba(255,255,255,.75); }

/* bottom row */
.hero-bottom { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; }
.hero-headline { display:flex; flex-direction:column; gap:16px; max-width:680px; }
.hero-h1 { font-size:52px; font-weight:500; color:var(--white); line-height:1.08; }
.hero-chapeau { font-size: 18px; color:rgba(255,255,255,.85); line-height:1.55; max-width:560px; }
.hero-ctas { display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.btn-hero-primary {
  display:flex; align-items:center; gap:8px;
  padding:14px 28px; border-radius:var(--radius);
  font-size: 17px; font-weight:600; color:var(--white);
  background:var(--brass); transition:opacity .2s;
}
.btn-hero-primary:hover { opacity:.88; }
.btn-hero-phone {
  display:flex; align-items:center; gap:8px;
  padding:14px 24px; border-radius:var(--radius);
  font-size: 17px; font-weight:600; color:var(--white);
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.3);
}
.btn-hero-phone:hover { background:rgba(255,255,255,.2); }
.hero-microtrust {
  display:flex; align-items:center; gap:8px;
  font-size: 14px; color:rgba(255,255,255,.7);
}

/* devis card */
.devis-card {
  flex-shrink:0;
  background:var(--white);
  border:1px solid var(--border-subtle); border-radius:var(--radius);
  padding:28px; width:340px;
  display:flex; flex-direction:column; gap:14px;
}
.devis-pulse { display:flex; align-items:center; gap:8px; font-size: 13px; font-weight:500; color:var(--text-secondary); }
.pulse-dot {
  width:8px; height:8px; border-radius:50%;
  background:#22c55e; flex-shrink:0;
  animation:pulse 2s infinite;
}
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.4} }
.devis-eyebrow { font-size: 12px; letter-spacing:1.5px; }
.devis-title { font-family:var(--serif); font-size:20px; font-weight:500; color:var(--text-primary); }
.devis-form { display:flex; flex-direction:column; gap:10px; }
.devis-field { position:relative; }
.devis-select,.devis-input {
  width:100%; padding:10px 14px;
  border:1px solid var(--border-subtle); border-radius:var(--radius);
  font-family:var(--sans); font-size: 15px; color:var(--text-primary);
  background:var(--bg-cream); appearance:none; -webkit-appearance:none;
}
.devis-select:focus,.devis-input:focus { outline:none; border-color:var(--accent); }
.select-chev { position:absolute; right:12px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:var(--text-muted); pointer-events:none; }
.devis-submit {
  padding:12px; border-radius:var(--radius);
  font-size: 16px; font-weight:600; color:var(--white);
  background:var(--accent); transition:opacity .2s;
}
.devis-submit:hover { opacity:.88; }
.devis-rr { display:flex; align-items:center; gap:6px; font-size: 13px; color:var(--text-muted); }

/* galerie strip */
.hero-galerie { padding:28px 80px 4px; background:var(--bg-cream); display:flex; flex-direction:column; gap:22px; }
.hero-galerie-hd { display:flex; align-items:center; justify-content:space-between; }
.hero-galerie-hd-left { display:flex; flex-direction:column; gap:4px; }
.hero-galerie-title { font-family:var(--serif); font-size:20px; font-weight:500; color:var(--text-primary); }
.hero-galerie-link { display:flex; align-items:center; gap:8px; font-size: 15px; font-weight:600; color:var(--accent); }
.photo-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.photo-card { position:relative; border-radius:var(--radius); overflow:hidden; height:250px; cursor:pointer; }
.photo-card img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.photo-card:hover img { transform:scale(1.05); }
.photo-caption {
  position:absolute; bottom:0; left:0; right:0;
  padding:42px 16px 16px;
  background:linear-gradient(0deg,rgba(16,16,14,.95) 0%,transparent 100%);
  display:flex; flex-direction:column; gap:4px;
}
.pc-type { font-size: 15px; font-weight:600; color:var(--white); line-height:1.25; }
.pc-meta { display:flex; align-items:center; gap:6px; font-size: 13px; color:var(--text-light); }
.pc-meta i { width:12px; height:12px; color:var(--brass); }
.photo-overlay {
  position:absolute; top:12px; right:12px;
  display:flex; align-items:center; gap:6px;
  background:rgba(255,255,255,.95); border-radius:var(--radius);
  padding:6px 12px; font-size: 13px; font-weight:600;
  opacity:0; transition:opacity .2s;
}
.photo-card:hover .photo-overlay { opacity:1; }

/* trust bar */
.trust-bar-wrap { padding:0 80px; background:var(--bg-cream); }
.trust-bar {
  display:flex; align-items:center;
  background:var(--white); border:1px solid var(--border-subtle); border-radius:var(--radius);
  padding:22px 36px; gap:10px;
}
.trust-seg { display:flex; align-items:center; gap:13px; flex:1; justify-content:center; }
.trust-sep { width:1px; height:40px; background:var(--border-subtle); flex-shrink:0; }
.trust-google-g {
  width:34px; height:34px; border-radius:50%;
  background:var(--white); border:1px solid var(--border-subtle);
  display:flex; align-items:center; justify-content:center;
  font-size: 18px; font-weight:700; color:#4285F4; flex-shrink:0;
}
.trust-col { display:flex; flex-direction:column; gap:2px; }
.trust-main { font-size: 17px; font-weight:700; color:var(--text-primary); line-height:1; }
.trust-sub { font-size: 13px; color:var(--text-muted); letter-spacing:.2px; }
.trust-avatars { display:flex; position:relative; width:80px; height:36px; flex-shrink:0; }
.av { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size: 12px; font-weight:700; color:var(--white); border:2px solid var(--white); position:absolute; }
.av:nth-child(1){left:0;z-index:4;} .av:nth-child(2){left:18px;z-index:3;} .av:nth-child(3){left:36px;z-index:2;} .av:nth-child(4){left:54px;z-index:1;}
.av-blue   { background:var(--accent); }
.av-dark   { background:var(--anthracite); }
.av-brass  { background:var(--brass); }
.av-accent { background:var(--accent); }
.trust-ic-wrap {
  width:34px; height:34px; border-radius:50%;
  background:var(--accent-soft); display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.trust-ic-wrap i { width:17px; height:17px; color:var(--accent); }
.mariages-logo { display:flex; align-items:center; gap:6px; font-family:Inter,sans-serif; font-size:20px; font-weight:700; }
.mariages-heart { width:20px; height:20px; color:#E0457B; }
.mariages-pink { color:#E0457B; }
.mariages-dot { color:var(--text-primary); }

/* ─── EN BREF ─────────────────────────────────────────────── */
.en-bref { background:var(--bg-gray); }
.en-bref-layout { display:flex; gap:60px; align-items:flex-start; max-width:1100px; margin:0 auto; }
.en-bref-lede { display:flex; flex-direction:column; gap:22px; width:450px; flex-shrink:0; }
.en-bref-answer { font-size: 18px; color:var(--text-secondary); line-height:1.65; }
.key-figures { display:flex; gap:32px; }
.kf { display:flex; flex-direction:column; gap:4px; }
.kf-val { font-size:28px; font-weight:500; color:var(--accent); }
.kf-lbl { font-size: 14px; color:var(--text-muted); }

/* breakdown card */
.breakdown-card {
  flex:1; background:var(--white);
  border:1px solid var(--border-subtle); border-radius:var(--radius);
  overflow:hidden;
}
.bc-head { padding:24px 28px 20px; display:flex; flex-direction:column; gap:10px; }
.bc-head-row { display:flex; align-items:center; justify-content:space-between; }
.pill {
  padding:4px 12px; border-radius:var(--radius-pill);
  font-size: 12px; font-weight:600; color:var(--accent);
  background:var(--accent-soft); letter-spacing:.5px;
}
.bc-title { font-family:var(--serif); font-size: 18px; font-weight:500; color:var(--text-primary); }
.bc-div { border:none; border-top:1px solid var(--border-subtle); margin:0; }
.bc-items { padding:8px 28px; display:flex; flex-direction:column; }
.bc-item {
  display:flex; align-items:center; gap:12px;
  padding:12px 0; border-bottom:1px solid var(--border-subtle);
}
.bc-item:last-child { border-bottom:none; }
.bc-ic { width:32px; height:32px; border-radius:50%; background:var(--accent-soft); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.bc-ic i { width:15px; height:15px; color:var(--accent); }
.bc-lbl { flex:1; font-size: 15px; color:var(--text-primary); }
.bc-amt { font-size: 16px; font-weight:600; color:var(--text-primary); }
.bc-amt.included { color:var(--brass); }
.bc-total { display:flex; align-items:center; justify-content:space-between; padding:20px 28px; }
.bc-total-left { display:flex; flex-direction:column; gap:3px; }
.bc-total-label { font-size: 14px; font-weight:600; color:var(--text-muted); text-transform:uppercase; letter-spacing:1px; }
.bc-total-sub { font-size: 13px; color:var(--text-muted); }
.bc-total-right { display:flex; flex-direction:column; align-items:flex-end; gap:2px; }
.bc-total-price { font-size:28px; font-weight:500; color:var(--accent); }
.bc-total-per { font-size: 14px; color:var(--text-muted); }
.bc-formules-strip { display:flex; align-items:center; gap:16px; padding:16px 28px; background:var(--bg-gray); }
.bc-des { font-size: 14px; color:var(--text-muted); }
.bc-f { display:flex; gap:8px; align-items:center; padding:6px 14px; border-radius:var(--radius-pill); background:var(--white); border:1px solid var(--border-subtle); }
.bc-fn { font-size: 14px; color:var(--text-secondary); }
.bc-fp { font-size: 14px; font-weight:700; color:var(--accent); }

/* ─── MENU DE MARIAGE ────────────────────────────────────── */
.menu-section { background:var(--bg-cream); }
.menu-card {
  max-width:1080px; margin:0 auto 32px;
  background:var(--white); border:1px solid var(--border-subtle); border-radius:var(--radius); overflow:hidden;
}
.menu-photo-strip { display:grid; grid-template-columns:1fr 1fr; }
.menu-photo-strip img { width:100%; height:300px; object-fit:cover; display:block; }
.menu-courses { padding:56px; }
.menu-kicker-row { display:flex; flex-direction:column; gap:8px; align-items:center; }
.menu-kicker { font-size: 13px; font-weight:600; letter-spacing:2.5px; color:var(--brass); text-transform:uppercase; }
.menu-season { font-size:24px; font-weight:500; color:var(--text-primary); }
.menu-div { border:none; border-top:1px solid var(--border-subtle); margin:24px 0; }
.menu-cols { display:grid; grid-template-columns:1fr 1fr; gap:56px; }
.menu-col { display:flex; flex-direction:column; gap:34px; }
.menu-course { display:flex; flex-direction:column; gap:16px; }
.mcl-row { display:flex; flex-direction:column; gap:9px; }
.mc-label { font-size: 13px; font-weight:600; letter-spacing:2px; color:var(--accent); text-transform:uppercase; }
.mc-rule { border:none; border-top:1px solid var(--border-subtle); margin:0; }
.dishes { display:flex; flex-direction:column; gap:16px; }
.dish { display:flex; flex-direction:column; gap:4px; }
.dish-n { font-family:var(--serif); font-size:19px; font-weight:500; color:var(--text-primary); line-height:1.25; }
.dish-d { font-size:14.5px; color:var(--text-secondary); line-height:1.5; }
.accord-note {
  display:flex; align-items:flex-start; gap:11px;
  background:var(--bg-cream); border-radius:12px; padding:14px 18px;
}
.accord-note i { width:18px; height:18px; color:var(--brass); flex-shrink:0; margin-top:1px; }
.accord-note span { font-size: 14.5px; color:var(--text-secondary); line-height:1.45; }
.menu-chips { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.menu-chip {
  display:flex; align-items:center; gap:9px;
  padding:11px 20px; border-radius:var(--radius);
  border:1px solid var(--border-subtle); background:var(--white);
  font-size: 15px; color:var(--text-secondary);
}
.menu-chip i { width:16px; height:16px; color:var(--accent); }

/* ─── PRESENTATION ───────────────────────────────────────── */
.presentation { background:var(--white); }
.presentation-intro { display:flex; flex-direction:column; gap:14px; max-width:760px; margin-bottom:56px; }

/* ── Quinconce layout ──────────────────────────────────────── */
.quinconce { display:flex; align-items:center; gap:48px; margin-bottom:72px; }
.quinconce-rev { flex-direction:row-reverse; }
.quinconce-media { flex:0 0 520px; }
.quinconce-txt { flex:1; display:flex; flex-direction:column; gap:24px; min-width:0; }

/* ── Stacked image composition ─────────────────────────────── */
.qstack {
  position:relative;
  width:100%;
  height:480px;
}

/* Grande image principale */
.qstack-primary {
  position:absolute;
  left:0; top:45px;           /* correspond à y:45 maquette */
  width:380px; height:435px;
  border-radius:var(--radius);
  overflow:hidden;
}
/* Version décalée à droite pour rangée 2 */
.qstack-primary--offset-right {
  left:140px;                  /* correspond à x:140 maquette */
}
.qstack-primary img {
  width:100%; height:100%; object-fit:cover; display:block;
}

/* Petite image chevauchante */
.qstack-secondary {
  position:absolute;
  width:262px; height:175px;
  border-radius:var(--radius);
  overflow:hidden;
  outline:5px solid var(--white); /* stroke blanc maquette */
  box-shadow:0 4px 16px rgba(0,0,0,.12);
}
/* coin bas-droit (rangée 1) */
.qstack-secondary--br {
  right:0; bottom:0;           /* x:248 dans 520px = right side ; y:300 dans 480 */
}
/* coin bas-gauche (rangée 2) */
.qstack-secondary--bl {
  left:0; bottom:0;            /* x:10 dans 520px */
}
.qstack-secondary img {
  width:100%; height:100%; object-fit:cover; display:block;
}

/* ── Badges flottants ──────────────────────────────────────── */
.qbadge {
  position:absolute;
  display:flex; align-items:center; gap:9px;
  border-radius:var(--radius);
  padding:10px 16px;
  z-index:10;
}

/* Badge sombre (caption blurred) */
.qbadge--dark {
  background:rgba(26,26,26,.80);
  backdrop-filter:blur(8px);
  z-index:20;
}
.qbadge--dark .qbadge-ic {
  width:15px; height:15px; color:var(--white); flex-shrink:0;
}
.qbadge--dark .qbadge-title { font-size:14px; font-weight:600; color:var(--white); }
.qbadge--dark .qbadge-sub   { font-size:12px; color:var(--text-light); }

/* Badge clair (stat badge) */
.qbadge--light {
  background:var(--white);
  border:1px solid var(--border-subtle);
  box-shadow:0 2px 12px rgba(0,0,0,.08);
}
.qbadge-icon-wrap {
  width:26px; height:26px; border-radius:50%;
  background:var(--accent-soft);
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.qbadge-leaf { width:15px; height:15px; color:var(--accent); }
.qbadge-title--dark { font-size:14px; font-weight:700; color:var(--text-primary); }
.qbadge-sub--muted  { font-size:11px; color:var(--text-muted); }

.qbadge-tx { display:flex; flex-direction:column; gap:2px; }

/* Positions des badges — rangée 1 */
/* bas-gauche : x:18, y=480-(10+76)≈bas → bottom depuis le bas du stack */
.qbadge--bl { left:18px; bottom:62px; }
/* haut-droit : x:278 dans conteneur 520px → on positionne depuis la gauche */
.qbadge--tr { left:278px; top:18px; }

/* Positions des badges — rangée 2 */
/* bas : x:130+centre badge ≈ sur la primary décalée (left:140) + un peu dedans */
.qbadge--bc { left:158px; bottom:62px; white-space:nowrap; }
/* haut : x:118 dans conteneur 520px */
.qbadge--tc { left:118px; top:18px; white-space:nowrap; }

/* ── Texte quinconce ───────────────────────────────────────── */
.q-h3 { font-size:26px; font-weight:500; color:var(--text-primary); line-height:1.2; }
.q-p { font-size: 16px; color:var(--text-secondary); line-height:1.6; }
.q-includes { display:flex; flex-direction:column; gap:12px; }
.incl-lh { font-size: 14px; font-weight:600; color:var(--text-primary); }
.q-includes ul { display:flex; flex-direction:column; gap:10px; }
.q-includes li { display:flex; align-items:center; gap:10px; font-size: 15px; color:var(--text-secondary); }
.q-includes li i, .q-includes li svg { width:18px; height:18px; color:var(--accent); flex-shrink:0; }

/* comparatif */
.comparatif { margin-top:20px; }
.comparatif-head { display:flex; flex-direction:column; gap:12px; align-items:center; text-align:center; margin-bottom:36px; }
.comp-title { font-family:var(--serif); font-size:32px; font-weight:500; color:var(--text-primary); }
.comp-sub { font-size: 16px; color:var(--text-secondary); max-width:640px; }
.formule-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.formule-card {
  display:flex; flex-direction:column; gap:14px;
  background:var(--white); border:1px solid var(--border-subtle); border-radius:var(--radius);
  padding:0 0 24px; overflow:hidden;
}
.formule-featured { border-color:var(--accent); }
.fc-top { padding:16px 24px 0; min-height:40px; }
.fc-icon i { width:22px; height:22px; color:var(--accent); }
.fc-popular {
  display:inline-block; padding:5px 12px;
  font-size: 12px; font-weight:600; letter-spacing:.5px; text-transform:uppercase;
  background:var(--accent); color:var(--white); border-radius:var(--radius-pill);
}
.fc-name { font-family:var(--serif); font-size:20px; font-weight:500; padding:0 24px; }
.fc-tag { font-size: 14px; color:var(--text-muted); padding:0 24px; }
.fc-price { display:flex; align-items:baseline; gap:6px; padding:0 24px; }
.fc-from { font-size: 14px; color:var(--text-muted); }
.fc-amt { font-size:32px; font-weight:500; color:var(--accent); }
.fc-per { font-size: 14px; color:var(--text-muted); }
.fc-div { border:none; border-top:1px solid var(--border-subtle); margin:0 24px; }
.fc-specs { display:flex; flex-direction:column; gap:6px; padding:0 24px; }
.fc-specs span { display:flex; align-items:center; gap:8px; font-size: 14px; color:var(--text-secondary); }
.fc-specs i { width:14px; height:14px; }
.fc-includes { display:flex; flex-direction:column; gap:8px; padding:0 24px; flex:1; }
.fc-includes li { display:flex; align-items:center; gap:8px; font-size: 14px; color:var(--text-secondary); }
.fc-includes i { width:15px; height:15px; color:var(--brass); flex-shrink:0; }
.fc-cta {
  display:flex; align-items:center; gap:8px;
  margin:8px 24px 0; padding:10px 16px;
  border-radius:var(--radius); font-size: 15px; font-weight:600;
  color:var(--accent); background:var(--accent-soft);
  transition:background .2s;
}
.fc-cta:hover { background:rgba(30,58,92,.2); }
.formule-featured .fc-cta { background:var(--accent); color:var(--white); }
.formule-featured .fc-cta:hover { opacity:.88; }

/* ─── FORMULES GRID ──────────────────────────────────────── */
.fg-section { background:var(--bg-cream); }
.fg-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.fg-card {
  display:flex; flex-direction:column; gap:12px;
  padding:28px; border:1px solid var(--border-subtle); border-radius:var(--radius);
  background:var(--white); transition:box-shadow .2s;
}
.fg-card:hover { box-shadow:0 4px 20px rgba(30,58,92,.08); }
.fg-ic { width:44px; height:44px; border-radius:50%; background:var(--accent-soft); display:flex; align-items:center; justify-content:center; }
.fg-ic i { width:20px; height:20px; color:var(--accent); }
.fg-title { font-family:var(--serif); font-size: 19px; font-weight:500; color:var(--text-primary); }
.fg-desc { font-size: 15px; color:var(--text-secondary); line-height:1.55; flex:1; }
.fg-link { display:flex; align-items:center; gap:6px; font-size: 15px; font-weight:600; color:var(--accent); }
.fg-link i { width:14px; height:14px; }

/* ─── RÉALISATIONS ───────────────────────────────────────── */
.realisations { background:var(--white); }

/* avant/après slider */
.avant-apres {
  position:relative; width:100%; height:460px;
  border:1px solid var(--border-subtle); border-radius:var(--radius);
  overflow:hidden; cursor:ew-resize; user-select:none; margin-bottom:24px;
}
.aa-apres-img { position:absolute;inset:0; width:100%; height:100%; object-fit:cover; }
.aa-avant-clip { position:absolute;inset:0; width:50%; overflow:hidden; }
.aa-avant-img { width:100%; height:100%; object-fit:cover; object-position:left; min-width:200%; }
/* the before image must show at native coords even as clip width changes */
.aa-avant-img { min-width: calc(var(--aa-total-w, 100vw)); max-width: none; }
.aa-handle {
  position:absolute; top:0; bottom:0; left:50%;
  width:4px; background:var(--white); cursor:ew-resize;
  display:flex; align-items:center; justify-content:center;
}
.aa-handle::before,.aa-handle::after {
  content:''; position:absolute; width:40px; height:40px;
  background:var(--white); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  top:50%; transform:translateY(-50%);
}
.aa-handle i { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:20px; height:20px; z-index:1; }
.aa-label {
  position:absolute; top:16px;
  display:flex; align-items:center; gap:6px;
  background:rgba(255,255,255,.95); border-radius:var(--radius-pill); padding:6px 14px;
  font-size: 14px; font-weight:500;
}
.aa-label-avant { left:16px; }
.aa-label-apres { right:16px; }
.aa-dot { width:8px; height:8px; border-radius:50%; background:var(--text-muted); display:inline-block; }
.aa-dot-green { background:#22c55e; }
.aa-hint {
  position:absolute; bottom:16px; left:50%; transform:translateX(-50%);
  display:flex; align-items:center; gap:8px;
  background:rgba(255,255,255,.9); border-radius:var(--radius-pill); padding:8px 16px;
  font-size: 14px; color:var(--text-secondary); white-space:nowrap;
}
.aa-hint i { width:16px; height:16px; }

/* filtres */
.gallery-filtres { display:flex; gap:10px; margin-bottom:20px; flex-wrap:wrap; }
.filtre {
  padding:8px 18px; border-radius:var(--radius-pill);
  font-size: 15px; color:var(--text-secondary);
  border:1px solid var(--border-subtle); background:var(--white);
  transition:all .2s; cursor:pointer;
}
.filtre.is-active,.filtre:hover { background:var(--accent); color:var(--white); border-color:var(--accent); }

/* gallery grid */
.gallery-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.gallery-card { position:relative; border-radius:var(--radius); overflow:hidden; height:250px; }
.gallery-card.hidden { display:none; }
.gallery-card img { width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.gallery-card:hover img { transform:scale(1.05); }
.gc-cap {
  position:absolute; bottom:0; left:0; right:0;
  padding:40px 16px 16px;
  background:linear-gradient(0deg,rgba(16,16,14,.92) 0%,transparent 100%);
  display:flex; flex-direction:column; gap:4px;
}
.gc-type { font-size: 15px; font-weight:600; color:var(--white); }
.gc-place { display:flex; align-items:center; gap:6px; font-size: 13px; color:var(--text-light); }
.gc-place i { width:12px; height:12px; color:var(--brass); }

/* ─── PROCESS ────────────────────────────────────────────── */
.process { background:var(--bg-gray); }
.process-steps {
  display:grid; grid-template-columns:repeat(4,1fr); gap:20px;
  margin-bottom:60px;
}
.process-step { display:flex; flex-direction:column; gap:10px; }
.ps-chip {
  width:44px; height:44px; border-radius:50%;
  background:var(--accent-soft); display:flex; align-items:center; justify-content:center;
}
.ps-num { font-size: 19px; font-weight:700; color:var(--accent); }
.ps-tag {
  display:inline-block; padding:4px 12px;
  border-radius:var(--radius-pill); background:var(--white); border:1px solid var(--border-subtle);
  font-size: 13px; font-weight:500; color:var(--text-secondary); align-self:flex-start;
}
.ps-title { font-family:var(--serif); font-size: 19px; font-weight:500; color:var(--text-primary); }
.ps-desc { font-size: 15px; color:var(--text-secondary); line-height:1.55; }

/* simulateur v2 */
.simulateur-v2 { padding-top:20px; }
.sim-row { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-bottom:28px; }
.sim-card {
  display:flex; flex-direction:column; gap:14px;
  background:var(--white); border:1px solid var(--border-subtle); border-radius:var(--radius);
  padding:24px;
}
.sim-card-dark { background:var(--anthracite); border-color:var(--anthracite); }
.sim-card-top { display:flex; align-items:center; gap:8px; }
.sim-num {
  width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size: 13px; font-weight:700; background:var(--accent); color:var(--white); flex-shrink:0;
}
.sim-card-dark .sim-num { background:rgba(255,255,255,.15); }
.sim-lbl { font-size: 13px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; color:var(--text-muted); }
.sim-card-dark .sim-lbl { color:rgba(255,255,255,.5); }
.sim-q { font-size: 16px; font-weight:500; color:var(--text-primary); }
.sim-card-dark .sim-q,.sim-result-title { color:var(--white); }
.sim-guest-pill {
  padding:10px 16px; border-radius:var(--radius-pill);
  background:var(--accent-soft); text-align:center;
  font-size: 19px; font-weight:700; color:var(--accent);
}
.sim-stepper { display:flex; align-items:center; gap:16px; justify-content:center; }
.sim-btn {
  width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:var(--accent); color:var(--white); font-size:20px; font-weight:600; cursor:pointer;
}
#sim-count-disp { font-size:22px; font-weight:700; color:var(--text-primary); min-width:40px; text-align:center; }
.sim-chips { display:flex; gap:8px; flex-wrap:wrap; }
.sim-chip {
  padding:6px 14px; border-radius:var(--radius-pill);
  font-size: 14px; border:1px solid var(--border-subtle); background:var(--bg-gray);
  color:var(--text-secondary); cursor:pointer; transition:all .15s;
}
.sim-chip.is-active { background:var(--accent); color:var(--white); border-color:var(--accent); }
.sim-type-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.type-opt {
  display:flex; align-items:center; gap:8px; padding:10px 12px;
  border:1px solid var(--border-subtle); border-radius:var(--radius);
  font-size: 14px; color:var(--text-secondary); background:var(--bg-gray); cursor:pointer;
}
.type-opt i { width:15px; height:15px; }
.type-opt.is-active { border-color:var(--accent); background:var(--accent-soft); color:var(--accent); font-weight:600; }
.sim-formula-list { display:flex; flex-direction:column; gap:8px; }
.formula-opt {
  display:flex; align-items:center; justify-content:space-between; padding:12px 14px;
  border:1px solid var(--border-subtle); border-radius:var(--radius);
  font-size: 15px; color:var(--text-primary); background:var(--bg-gray); cursor:pointer;
}
.formula-opt span { font-size: 13px; color:var(--text-muted); }
.formula-opt.is-active { border-color:var(--accent); background:var(--accent-soft); font-weight:600; color:var(--accent); }
.sim-result-title { font-family:var(--serif); font-size: 19px; font-weight:500; }
.sim-result-sub { font-size: 14px; color:var(--text-light); line-height:1.55; }
.sim-estimate-box {
  background:rgba(255,255,255,.08); border-radius:var(--radius);
  padding:16px; display:flex; flex-direction:column; gap:4px;
}
.sim-price { font-size:28px; font-weight:500; color:var(--white); }
.sim-note { font-size: 13px; color:rgba(255,255,255,.55); }
.sim-email {
  padding:10px 14px; border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.08);
  color:var(--white); font-family:var(--sans); font-size: 15px;
}
.sim-email::placeholder { color:rgba(255,255,255,.4); }
.sim-email:focus { outline:none; border-color:rgba(255,255,255,.5); }
.sim-cta-btn {
  padding:12px; border-radius:var(--radius);
  background:var(--brass); color:var(--white); font-size: 15px; font-weight:600; cursor:pointer;
}
.sim-reassure { display:flex; align-items:center; gap:6px; font-size: 13px; color:rgba(255,255,255,.5); }
.sim-reassure i { width:14px; height:14px; }
.sim-foot {
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  background:var(--white); border:1px solid var(--border-subtle); border-radius:var(--radius);
  padding:20px 28px;
}
.sim-trust { display:flex; gap:28px; flex-wrap:wrap; }
.sim-trust span { display:flex; align-items:center; gap:8px; font-size: 14px; color:var(--text-secondary); }
.sim-trust i { width:16px; height:16px; color:var(--accent); }
.sim-start {
  display:flex; align-items:center; gap:8px;
  padding:12px 24px; border-radius:var(--radius);
  background:var(--accent); color:var(--white); font-size: 15px; font-weight:600; white-space:nowrap;
}

/* ─── AVIS ───────────────────────────────────────────────── */
.avis { background:var(--bg-cream); }
.google-widget {
  max-width:1180px; margin:0 auto;
  background:var(--white); border:1px solid var(--border-subtle); border-radius:var(--radius);
  padding:36px;
}
.gw-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:28px; }
.gw-rating { display:flex; align-items:center; gap:12px; }
.g-logo-sm { font-size: 16px; font-weight:700; letter-spacing:-0.5px; display:flex; }
.gw-excellent { font-size: 16px; font-weight:600; }
.gw-stars { color:var(--brass); font-size: 17px; letter-spacing:2px; }
.gw-count { font-size: 15px; color:var(--text-muted); }
.gw-write {
  padding:8px 18px; border:1px solid var(--border-subtle); border-radius:var(--radius);
  font-size: 15px; font-weight:500; color:var(--accent);
  transition:background .2s;
}
.gw-write:hover { background:var(--accent-soft); }
.avis-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:20px; }
.avis-card { background:var(--bg-gray); border-radius:var(--radius); padding:24px; display:flex; flex-direction:column; gap:12px; }
.avis-head { display:flex; align-items:center; gap:12px; }
.avis-av {
  width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size: 17px; font-weight:700; color:var(--white); flex-shrink:0;
}
.avis-name { font-size: 16px; font-weight:600; color:var(--text-primary); }
.avis-date { font-size: 13px; color:var(--text-muted); }
.avis-stars { color:var(--brass); font-size: 15px; letter-spacing:2px; }
.avis-txt { font-size: 15px; color:var(--text-secondary); line-height:1.6; flex:1; }
.avis-more { font-size: 14px; font-weight:600; color:var(--accent); }
.dots { display:flex; gap:6px; justify-content:center; }
.dot { width:8px; height:8px; border-radius:50%; background:var(--border-subtle); cursor:pointer; transition:background .2s; }
.dot.is-active { background:var(--accent); }

/* ─── ESTIMATEUR ─────────────────────────────────────────── */
.estimateur { background:var(--bg-gray); }
.estimateur-head { display:flex; flex-direction:column; gap:12px; align-items:center; margin-bottom:36px; }
.live-tag {
  display:flex; align-items:center; gap:8px; padding:7px 14px; border-radius:var(--radius-pill);
  background:var(--accent-soft); font-size: 13px; font-weight:600; letter-spacing:1px; color:var(--accent);
}
.live-dot { width:8px; height:8px; border-radius:50%; background:#22c55e; animation:pulse 2s infinite; flex-shrink:0; }
.est-card {
  max-width:980px; margin:0 auto;
  background:var(--white); border:1px solid var(--border-subtle); border-radius:var(--radius); padding:40px;
  display:flex; flex-direction:column; gap:30px;
}
.est-field { display:flex; flex-direction:column; gap:12px; }
.est-lbl { font-size: 15px; font-weight:600; color:var(--text-primary); }
.est-lbl-row { display:flex; align-items:center; justify-content:space-between; }
.est-val-pill {
  padding:4px 12px; border-radius:var(--radius-pill);
  background:var(--accent-soft); font-size: 15px; font-weight:700; color:var(--accent);
}
.est-seg { display:flex; gap:0; border:1px solid var(--border-subtle); border-radius:var(--radius); overflow:hidden; }
.seg-btn {
  flex:1; padding:11px 14px;
  font-size: 15px; color:var(--text-secondary); background:var(--bg-gray); cursor:pointer;
  border-right:1px solid var(--border-subtle); transition:all .15s;
}
.seg-btn:last-child { border-right:none; }
.seg-btn.is-active { background:var(--accent); color:var(--white); font-weight:600; }
/* range slider */
.est-slider-wrap { position:relative; height:24px; display:flex; align-items:center; }
.est-track { position:absolute; left:0; right:0; height:4px; background:var(--border-subtle); border-radius:2px; }
.est-fill { position:absolute; left:0; top:0; height:100%; background:var(--accent); border-radius:2px; pointer-events:none; transition:width .05s; }
.est-range {
  position:relative; width:100%; height:4px; appearance:none; background:transparent; cursor:pointer; z-index:1;
}
.est-range::-webkit-slider-thumb {
  appearance:none; width:20px; height:20px; border-radius:50%;
  background:var(--accent); border:3px solid var(--white); box-shadow:0 1px 4px rgba(0,0,0,.25);
}
.est-range::-moz-range-thumb { width:20px; height:20px; border-radius:50%; background:var(--accent); border:3px solid var(--white); }
.est-minmax { display:flex; justify-content:space-between; font-size: 13px; color:var(--text-muted); }
.est-opt-chips { display:flex; gap:10px; flex-wrap:wrap; }
.opt-chip {
  padding:8px 16px; border-radius:var(--radius-pill);
  font-size: 15px; border:1px solid var(--border-subtle); background:var(--bg-gray);
  color:var(--text-secondary); cursor:pointer; transition:all .15s;
}
.opt-chip.is-active { background:var(--accent); color:var(--white); border-color:var(--accent); }
.est-div { border:none; border-top:1px solid var(--border-subtle); margin:0; }
.est-result {
  display:flex; align-items:center; justify-content:space-between;
  background:var(--anthracite); border-radius:var(--radius); padding:22px 28px;
}
.est-rl { display:flex; flex-direction:column; gap:4px; }
.est-rl-lbl { font-size: 13px; font-weight:600; letter-spacing:1.5px; color:var(--text-light); }
.est-rl-meta { font-size: 14px; color:rgba(229,229,224,.6); }
.est-rr { display:flex; flex-direction:column; align-items:flex-end; gap:3px; }
.est-price { font-size:32px; font-weight:500; color:var(--white); }
.est-note { font-size: 13px; color:rgba(229,229,224,.55); }
.est-foot { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.est-hint { display:flex; align-items:center; gap:8px; font-size: 15px; color:var(--text-muted); }
.est-hint i { width:18px; height:18px; }
.est-cta {
  display:flex; align-items:center; gap:8px;
  padding:10px 24px; border-radius:var(--radius);
  background:var(--accent); color:var(--white); font-size: 15px; font-weight:600;
}

/* ─── GARANTIES ─────────────────────────────────────────── */
.garanties { background:var(--white); }
.garanties-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.gar-card {
  display:flex; flex-direction:column; gap:14px;
  padding:28px; border:1px solid var(--border-subtle); border-radius:var(--radius);
  background:var(--bg-gray);
}
.gar-ic { width:44px; height:44px; border-radius:50%; background:var(--accent-soft); display:flex; align-items:center; justify-content:center; }
.gar-ic i { width:20px; height:20px; color:var(--accent); }
.gar-title { font-family:var(--serif); font-size: 18px; font-weight:500; color:var(--text-primary); }
.gar-desc { font-size: 15px; color:var(--text-secondary); line-height:1.55; }

/* ─── FAQ ────────────────────────────────────────────────── */
.faq { background:var(--bg-cream); }
.faq-body { display:flex; gap:48px; align-items:flex-start; max-width:1180px; margin:0 auto; }
.faq-img { width:440px; height:760px; object-fit:cover; border-radius:var(--radius); flex-shrink:0; }
.faq-list { flex:1; display:flex; flex-direction:column; gap:14px; }
.faq-item {
  background:var(--white); border:1px solid var(--border-subtle); border-radius:var(--radius);
  overflow:hidden; transition:border-color .2s;
}
.faq-item.is-open { border-color:var(--accent); }
.faq-q {
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  width:100%; padding:20px 24px; text-align:left;
  font-size: 17px; font-weight:600; color:var(--text-primary); cursor:pointer;
  background:none;
}
.faq-ic { flex-shrink:0; width:20px; height:20px; color:var(--accent); transition:transform .3s; }
.faq-a {
  max-height:0; overflow:hidden; transition:max-height .3s ease;
  padding:0 24px;
}
.faq-item.is-open .faq-a { padding:0 24px 20px; }
.faq-a p { font-size: 16px; color:var(--text-secondary); line-height:1.65; }

/* ─── ZONE ───────────────────────────────────────────────── */
.zone { background:var(--bg-gray); }
.zone-inner { display:flex; align-items:center; gap:64px; }
.zone-left { display:flex; flex-direction:column; gap:24px; flex:1; }
.zone-p { font-size: 17px; color:var(--text-secondary); line-height:1.65; }
.zone-tags { display:flex; flex-direction:column; gap:10px; }
.zone-tag-row { display:flex; gap:10px; flex-wrap:wrap; }
.zone-tag {
  padding:7px 14px; border-radius:var(--radius-pill);
  font-size: 14px; font-weight:500; color:var(--accent);
  background:var(--accent-soft); border:1px solid rgba(30,58,92,.15);
}
.zone-map {
  width:560px; height:380px; flex-shrink:0;
  border:1px solid var(--border-subtle); border-radius:var(--radius);
  background:var(--bg-cream); position:relative; overflow:hidden;
}
.map-center {
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  display:flex; align-items:center; gap:8px;
  background:var(--accent); color:var(--white);
  border-radius:var(--radius-pill); padding:10px 18px;
  font-size: 15px; font-weight:600; box-shadow:0 2px 12px rgba(30,58,92,.3);
}
.map-center i { width:18px; height:18px; }
.map-pin {
  position:absolute; color:var(--accent);
  animation:pin-bounce 2s ease-in-out infinite;
}
.map-pin i { width:22px; height:22px; }
@keyframes pin-bounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-4px)} }

/* ─── CTA FINAL ──────────────────────────────────────────── */
.cta-final { background:var(--anthracite); }
.cta-final-inner {
  max-width:900px; margin:0 auto;
  display:flex; flex-direction:column; gap:22px; align-items:center; text-align:center;
}
.cta-final-sub { font-size: 18px; color:var(--text-light); line-height:1.6; max-width:620px; }
.cta-final-btns { display:flex; gap:14px; align-items:center; flex-wrap:wrap; justify-content:center; }
.cta-btn-primary {
  display:flex; align-items:center; gap:8px;
  padding:16px 32px; border-radius:var(--radius);
  font-size: 17px; font-weight:600; color:var(--white);
  background:var(--accent); transition:opacity .2s;
}
.cta-btn-primary:hover { opacity:.88; }
.cta-btn-phone {
  display:flex; align-items:center; gap:8px;
  padding:16px 28px; border-radius:var(--radius);
  font-size: 17px; font-weight:600; color:var(--white);
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2);
}
.cta-rr { display:flex; gap:22px; flex-wrap:wrap; justify-content:center; }
.cta-rr span { display:flex; align-items:center; gap:8px; font-size: 15px; font-weight:500; color:var(--text-light); }
.cta-rr i { width:16px; height:16px; color:var(--accent); }

/* ─── FOOTER ─────────────────────────────────────────────── */
.footer { background:var(--footer-bg); color:var(--text-light); }
.footer-inner { max-width:none; margin:0; padding:72px 0 32px; display:flex; flex-direction:column; gap:44px; }
.footer-top { display:flex; justify-content:space-between; gap:64px; }
.footer-brand { display:flex; flex-direction:column; gap:16px; width:340px; flex-shrink:0; }
.footer-logo { display:flex; align-items:center; gap:10px; font-size: 19px; font-weight:500; }
.footer-logo i { width:20px; height:20px; color:var(--accent); }
.footer-desc { font-size: 15px; color:var(--text-muted); line-height:1.55; }
.footer-nap { display:flex; flex-direction:column; gap:10px; }
.nap { display:flex; align-items:center; gap:10px; font-size: 15px; color:var(--text-muted); }
.nap i { width:16px; height:16px; flex-shrink:0; }
.footer-col { display:flex; flex-direction:column; gap:14px; }
.footer-col h5 { font-size: 15px; font-weight:600; color:var(--text-light); margin:0; }
.footer-col a { font-size: 15px; color:var(--text-muted); transition:color .2s; }
.footer-col a:hover { color:var(--text-light); }
.horaire { display:flex; justify-content:space-between; gap:16px; font-size: 15px; color:var(--text-muted); }
.footer-div { border:none; border-top:1px solid rgba(255,255,255,.1); }
.footer-legal { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.footer-legal span { font-size: 14px; color:var(--text-muted); }
.footer-legal-links { display:flex; gap:20px; }
.footer-legal-links a { font-size: 14px; color:var(--text-muted); transition:color .2s; }
.footer-legal-links a:hover { color:var(--text-light); }

/* ─── CONTENT WIDTH SYSTEM ──────────────────────────────── */
/* Full-width bands with content capped at --content, minimum gutter --side */
.header,
.section,
.hero-banner,
.hero-galerie,
.trust-bar-wrap,
.footer {
  padding-inline: max(var(--side), calc((100% - var(--content)) / 2));
}

/* ─── RESPONSIVE ─────────────────────────────────────────── */
@media (max-width:1100px) {
  :root { --side: 48px; }
  .section { padding-block: 64px; }
  .hero-banner { padding-block: 24px 32px; }
  .hero-galerie { padding-block: 24px 4px; }
  .footer-inner { padding-block: 56px 28px; }
  .formule-cards { grid-template-columns:1fr 1fr 1fr; }
  .fg-grid,.garanties-grid { grid-template-columns:repeat(2,1fr); }
  .process-steps,.sim-row { grid-template-columns:repeat(2,1fr); }
  .photo-strip { grid-template-columns:repeat(2,1fr); }
  .en-bref-layout { flex-direction:column; gap:32px; }
  .en-bref-lede { width:100%; }
  .footer-top { flex-wrap:wrap; gap:32px; }
  .footer-brand { width:100%; }
  .quinconce,.quinconce-rev { flex-direction:column; }
  .quinconce-media { width:100%; flex:unset; }
  /* Composition à % pour s'adapter à toute largeur de conteneur */
  .qstack { height:380px; }
  .qstack-primary { width:73%; top:40px; height:calc(100% - 40px); }
  .qstack-primary--offset-right { left:27%; width:73%; }
  .qstack-secondary { width:48%; height:38%; }
  /* Repositionner les badges fixes en coordonnées relatives */
  .qbadge--tr { left:auto; right:0; }
  .qbadge--tc { left:auto; right:0; }
  .qbadge--bc { left:auto; right:10px; }
}
@media (max-width:720px) {
  :root { --side: 20px; }
  .section { padding-block: 48px; }
  .header-nav,.header-actions { display:none; }
  .header-burger { display:flex; }
  .hero-banner { padding-block: 20px 28px; min-height:520px; }
  .hero-h1 { font-size:34px; }
  .hero-bottom { flex-direction:column; }
  .devis-card { width:100%; }
  .hero-galerie { padding-block: 20px 4px; }
  .trust-bar { flex-direction:column; gap:16px; }
  .trust-sep { display:none; }
  .photo-strip { grid-template-columns:1fr 1fr; }
  .gallery-grid { grid-template-columns:repeat(2,1fr); }
  .formule-cards { grid-template-columns:1fr; }
  .fg-grid,.garanties-grid,.process-steps,.sim-row { grid-template-columns:1fr; }
  .menu-cols { grid-template-columns:1fr; }
  .menu-photo-strip { grid-template-columns:1fr; height:auto; }
  .faq-body { flex-direction:column; }
  .faq-img { width:100%; height:280px; }
  .zone-inner { flex-direction:column; }
  .zone-map { width:100%; }
  .avis-cards { grid-template-columns:1fr; }
  .footer-inner { padding-block: 40px 24px; }
  .footer-top { gap:28px; }
  .qstack { height:320px; }
  .qstack-primary { width:78%; top:30px; height:calc(100% - 30px); }
  .qstack-primary--offset-right { left:22%; width:78%; }
  .qstack-secondary { width:46%; height:36%; }
  .qbadge { font-size:11px; padding:7px 10px; gap:6px; max-width:calc(100% - 16px); white-space:normal; }
  .qbadge-icon-wrap { width:20px; height:20px; flex-shrink:0; }
  .qbadge-leaf,.qbadge-ic { width:12px; height:12px; }
  .qbadge--tr { left:auto; right:4px; top:10px; }
  .qbadge--tc { left:auto; right:4px; top:10px; }
  .qbadge--bl { left:6px; bottom:44px; }
  .qbadge--bc { left:auto; right:6px; bottom:44px; }
}

/* Header commun — page active + logo cliquable */
.header-nav a[aria-current="page"], .nav a[aria-current="page"] { color: var(--accent, #1E3A5C); font-weight: 600; }
.header-logo { text-decoration: none; color: inherit; cursor: pointer; }

/* ============================================================
   SIMULATEUR DEVIS WIZARD (5 étapes)
   Porté depuis maison_ephemere/styles.css
   Les classes .type-opt et .formula-opt sont scopées dans
   .sim-wizard pour éviter les collisions avec le reste de la page.
   ============================================================ */

/* Section wrapper */
.simulator { background: var(--bg-cream); padding: 96px 80px; display: flex; flex-direction: column; gap: 48px; align-items: center; }
.simulator { padding-inline: max(var(--side), calc((100% - var(--content)) / 2)); }
.simulator__head { max-width: 760px; text-align: center; display: flex; flex-direction: column; gap: 14px; }
.simulator__head h2 { font-family: var(--serif); font-weight: 500; font-size: 44px; }
.simulator__head .sub { font-size: 17px; color: var(--text-secondary); line-height: 1.5; }

/* Wizard container */
.sim-wizard { width: 100%; max-width: 720px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; }
.sim-progress { display: flex; align-items: center; gap: 16px; }
.sim-progress__steps { display: flex; gap: 8px; flex: 1; }
.sim-progress__seg { flex: 1; height: 5px; border-radius: 3px; background: var(--border-subtle); transition: background .35s ease; }
.sim-progress__seg.is-done { background: var(--accent); }
.sim-progress__label { font-size: 14px; font-weight: 600; color: var(--text-secondary); white-space: nowrap; }

/* Step cards */
.sim-panel { position: relative; }
.sim-wizard .step-card {
  display: none; min-height: 0; width: 100%;
  border-radius: var(--radius); padding: 24px; background: var(--white); border: 1px solid var(--border-subtle);
  flex-direction: column; gap: 18px; box-shadow: 0 10px 30px rgba(26,26,26,0.05);
}
.sim-wizard .step-card.is-current { display: flex; }
.sim-wizard .step-card--recap { background: var(--white); }

/* Step num badges */
.step-num { width: 38px; height: 38px; border-radius: 19px; display: flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; flex: none; }
.step-num--accent { background: var(--accent); color: var(--white); }
.step-num--muted { background: var(--bg-gray); color: var(--text-secondary); }
.step-num--brass { background: var(--brass); color: var(--anthracite); }
.step-label { font-size: 12px; font-weight: 600; letter-spacing: 1.5px; color: var(--text-muted); }
.step-card__top { display: flex; align-items: center; gap: 12px; }
.step-q { display: flex; flex-direction: column; gap: 6px; }
.step-q .qtitle { font-family: var(--serif); font-weight: 500; font-size: 26px; line-height: 1.1; }
.sim-wizard .step-card__title { font-family: var(--serif); font-weight: 500; font-size: 22px; }
.step-q .qhelper, .sim-wizard .step-card .helper { font-size: 14px; color: var(--text-secondary); line-height: 1.45; }

/* Guest pill */
.guest-pill { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: var(--radius); background: var(--accent-soft); color: var(--accent); font-size: 13px; font-weight: 600; }
.guest-pill .material-symbols-rounded { font-size: 16px; }

/* Stepper */
.stepper { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 8px 0; }
.stepper__btn { width: 48px; height: 48px; border-radius: 24px; display: flex; align-items: center; justify-content: center; flex: none; }
.stepper__btn--minus { background: var(--bg-gray); border: 1px solid var(--border-subtle); color: var(--text-primary); }
.stepper__btn--plus { background: var(--accent); color: var(--white); }
.countbox { flex: 1; display: flex; flex-direction: column; align-items: center; }
.countbox .count-num { font-family: var(--serif); font-size: 58px; font-weight: 600; line-height: 1; color: var(--text-primary); }
.countbox .count-unit { font-size: 13px; color: var(--text-muted); letter-spacing: .5px; }

/* Quick chips */
.quickselect { display: flex; flex-direction: column; gap: 8px; }
.quickselect .qslabel { font-size: 12px; font-weight: 600; letter-spacing: .5px; color: var(--text-muted); }
.qs-chips { display: flex; gap: 8px; }
.qs-chip { flex: 1; height: 42px; border-radius: var(--radius); display: flex; align-items: center; justify-content: center;
  font-size: 15px; font-weight: 600; background: var(--bg-gray); border: 1px solid var(--border-subtle); color: var(--text-primary); transition: all .2s; cursor: pointer; }
.qs-chip.is-active { background: var(--accent); color: var(--white); border-color: var(--accent); }

/* Type grid — scopé .sim-wizard pour éviter collision avec .type-opt existant */
.sim-wizard .type-grid { display: flex; flex-direction: column; gap: 12px; flex: none; height: auto; }
.sim-wizard .type-grid .row { display: flex; gap: 12px; flex: 1; }
.sim-wizard .type-opt {
  position: relative; flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  padding: 14px; border-radius: var(--radius); background: var(--bg-cream); border: 1px solid var(--border-subtle); cursor: pointer; transition: all .2s;
  min-height: 92px; font-size: inherit; font-family: inherit; color: inherit;
}
.sim-wizard .type-opt .material-symbols-rounded { font-size: 28px; color: var(--text-secondary); }
.sim-wizard .type-opt span.label { font-size: 15px; font-weight: 500; }
.sim-wizard .type-opt.is-active { background: var(--accent-soft); border: 1.5px solid var(--accent); }
.sim-wizard .type-opt.is-active .material-symbols-rounded,
.sim-wizard .type-opt.is-active span.label { color: var(--accent); font-weight: 600; }
.sim-wizard .type-opt .check {
  position: absolute; top: 10px; right: 10px; width: 22px; height: 22px; border-radius: 11px; background: var(--accent);
  display: none; align-items: center; justify-content: center; color: var(--white);
}
.sim-wizard .type-opt .check .material-symbols-rounded { font-size: 14px; color: var(--white); }
.sim-wizard .type-opt.is-active .check { display: flex; }

/* Formula options — scopé .sim-wizard */
.sim-wizard .options { display: flex; flex-direction: column; gap: 12px; flex: none; height: auto; }
.sim-wizard .formula-opt {
  display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: var(--radius);
  background: var(--bg-cream); border: 1px solid var(--border-subtle); cursor: pointer; transition: all .2s;
  text-align: left; font-family: inherit; font-size: inherit; color: inherit; justify-content: flex-start;
}
.sim-wizard .formula-opt.is-active { background: var(--accent-soft); border: 1.5px solid var(--accent); }
.sim-wizard .formula-opt img { width: 56px; height: 56px; object-fit: cover; border-radius: var(--radius); flex: none; }
.sim-wizard .formula-opt .text { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.sim-wizard .formula-opt .name { font-size: 16px; font-weight: 600; }
.sim-wizard .formula-opt .desc { font-size: 12px; color: var(--text-secondary); line-height: 1.4; }
.sim-wizard .formula-opt .pricerow { display: flex; align-items: flex-end; gap: 3px; padding-top: 2px; }
.sim-wizard .formula-opt .amt { font-size: 16px; font-weight: 700; }
.sim-wizard .formula-opt.is-active .amt { color: var(--accent); }
.sim-wizard .formula-opt .per { font-size: 12px; font-weight: 500; color: var(--text-muted); }
.sim-wizard .radio { width: 22px; height: 22px; border-radius: 11px; background: var(--white); border: 1.5px solid var(--border-subtle); display: flex; align-items: center; justify-content: center; flex: none; }
.sim-wizard .formula-opt.is-active .radio { background: var(--accent); border-color: var(--accent); }
.sim-wizard .formula-opt.is-active .radio .material-symbols-rounded { font-size: 13px; color: var(--white); display: block; }
.sim-wizard .radio .material-symbols-rounded { display: none; }
.sim-wizard .formula-opt span { font-size: inherit; color: inherit; } /* reset rubrique_mariage formula-opt span override */

/* Formula custom (Autre / sur-mesure) */
.formula-opt__icon {
  width: 56px; height: 56px; flex: none; border-radius: var(--radius); background: var(--accent-soft);
  display: flex; align-items: center; justify-content: center;
}
.formula-opt__icon .material-symbols-rounded { color: var(--accent); font-size: 26px; }
.sim-wizard .formula-opt--custom .amt { color: var(--accent); }
.formula-custom { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.formula-custom__label { font-size: 14px; font-weight: 600; color: var(--text-primary); }
.formula-custom textarea {
  width: 100%; padding: 12px 14px; border-radius: var(--radius); font-family: inherit; font-size: 15px;
  background: var(--bg-cream); border: 1px solid var(--border-subtle); color: var(--text-primary); resize: vertical; min-height: 76px;
}
.formula-custom textarea:focus { outline: none; border-color: var(--accent); background: var(--white); }

/* Options multi-select */
.opt-grid { display: flex; flex-direction: column; gap: 10px; }
.opt-add {
  display: flex; align-items: center; gap: 14px; width: 100%; text-align: left;
  padding: 12px 14px; border-radius: var(--radius); background: var(--bg-cream);
  border: 1px solid var(--border-subtle); transition: background .2s, border-color .2s; cursor: pointer;
}
.opt-add:hover { border-color: var(--accent); }
.opt-add.is-active { background: var(--accent-soft); border: 1.5px solid var(--accent); }
.opt-add__ic { width: 44px; height: 44px; flex: none; border-radius: var(--radius); background: var(--white); border: 1px solid var(--border-subtle); display: flex; align-items: center; justify-content: center; }
.opt-add__ic .material-symbols-rounded { color: var(--accent); font-size: 22px; }
.opt-add__txt { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.opt-add__name { font-size: 16px; font-weight: 600; color: var(--text-primary); }
.opt-add__price { font-size: 13px; font-weight: 600; color: var(--text-secondary); }
.opt-add__check { width: 24px; height: 24px; flex: none; border-radius: 6px; background: var(--white); border: 1.5px solid var(--border-subtle); display: flex; align-items: center; justify-content: center; }
.opt-add__check .material-symbols-rounded { font-size: 16px; color: var(--white); display: none; }
.opt-add.is-active .opt-add__check { background: var(--accent); border-color: var(--accent); }
.opt-add.is-active .opt-add__check .material-symbols-rounded { display: block; }

/* Recap (étape 5) */
.recap { display: flex; flex-direction: column; border: 1px solid var(--border-subtle); border-radius: var(--radius); overflow: hidden; }
.recap__row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 16px; font-size: 15px; color: var(--text-secondary); border-bottom: 1px solid var(--border-subtle); }
.recap__row strong { color: var(--text-primary); font-weight: 600; text-align: right; }
.recap__total { display: flex; align-items: center; justify-content: space-between; padding: 16px; background: var(--accent-soft); }
.recap__total span { font-size: 13px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: var(--accent); }
.recap__total strong { font-family: var(--serif); font-size: 30px; font-weight: 600; color: var(--accent); }
.reassure { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 12px; color: var(--text-muted); }
.reassure .material-symbols-rounded { font-size: 13px; }

/* Lead form */
.lead-form { display: flex; flex-direction: column; gap: 10px; }
.lead-form input {
  width: 100%; padding: 13px 14px; border-radius: var(--radius); font-family: inherit; font-size: 15px;
  background: var(--bg-cream); border: 1px solid var(--border-subtle); color: var(--text-primary);
}
.lead-form input::placeholder { color: var(--text-muted); }
.lead-form input:focus { outline: none; border-color: var(--accent); background: var(--white); }

/* Bouton block */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: var(--radius); font-weight: 600; font-size: 15px; transition: transform .15s ease, filter .2s ease; }
.btn:hover { filter: brightness(1.06); }
.btn:active { transform: translateY(1px); }
.btn--accent { background: var(--accent); color: var(--white); padding: 11px 20px; }
.btn--block { width: 100%; }

/* Foot strip */
.foot-strip {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  padding: 20px 32px; border-radius: var(--radius); background: var(--white); border: 1px solid var(--border-subtle);
}
.foot-strip .trust-items { display: flex; gap: 32px; flex-wrap: wrap; }
.foot-strip .trust-item { display: flex; align-items: center; gap: 9px; font-size: 15px; font-weight: 500; color: var(--text-secondary); }
.foot-strip .trust-item .material-symbols-rounded { color: var(--accent); font-size: 18px; }
.foot-strip--center { justify-content: center; }

/* Sim Nav */
.sim-nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.sim-live { display: flex; flex-direction: column; gap: 5px; padding: 14px 18px; border-radius: var(--radius); background: var(--accent-soft); border: 1px solid rgba(30, 58, 92, 0.22); }
.sim-live__lbl { display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; letter-spacing: 1px; color: var(--accent); text-transform: uppercase; }
.sim-live__dot { width: 7px; height: 7px; border-radius: 50%; background: #3DBE6B; box-shadow: 0 0 0 0 rgba(61,190,107,.5); animation: livePulse 1.8s infinite; }
@keyframes livePulse { 0% { box-shadow: 0 0 0 0 rgba(61,190,107,.5); } 70% { box-shadow: 0 0 0 7px rgba(61,190,107,0); } 100% { box-shadow: 0 0 0 0 rgba(61,190,107,0); } }
.sim-live__amount { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.sim-live__val { font-family: var(--serif); font-size: 30px; font-weight: 600; color: var(--accent); line-height: 1; }
.sim-live__val.bump { animation: liveBump .35s ease; }
@keyframes liveBump { 0% { transform: scale(1); } 40% { transform: scale(1.09); } 100% { transform: scale(1); } }
.sim-live__per { font-size: 13px; font-weight: 600; color: var(--text-secondary); }
.sim-live__hint { font-size: 12px; color: var(--text-muted); }
@media (prefers-reduced-motion: reduce) { .sim-live__dot, .sim-live__val.bump { animation: none; } }
.sim-nav__btns { display: flex; gap: 12px; }
.sim-nav__btns .material-symbols-rounded { font-size: 18px; }
.sim-nav__btns .btn { padding: 13px 26px; }

/* Ghost button (Retour) */
.btn-ghost {
  display: inline-flex; align-items: center; gap: 8px; padding: 13px 22px;
  border-radius: var(--radius); border: 1px solid var(--border-subtle); background: var(--white);
  font-size: 15px; font-weight: 600; color: var(--text-primary); transition: background .2s, opacity .2s; cursor: pointer;
}
.btn-ghost:hover:not(:disabled) { background: var(--bg-gray); }
.btn-ghost:disabled { opacity: .4; cursor: not-allowed; }


/* fil d'Ariane dynamique : liens réels stylés comme les spans maquette */
.breadcrumb a { color: var(--text-light); text-decoration: none; }
.breadcrumb a:hover { color: var(--white); }