:root {
  --bg-dark: #0a0908;
  --bg-warm: #14110e;
  --bg-accent: #d9cba9;
  --text-on-dark: #f2ece1;
  --text-on-accent: #16120d;
  --muted: #a89d8a;
  --gold: #c9b48a;
  --hairline: rgba(201, 180, 138, 0.35);
  --font-display: 'Cormorant Garamond', 'Times New Roman', serif;
  --font-body: 'Hanken Grotesk', sans-serif;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

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

html { background: var(--bg-dark); overflow-x: clip; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }

body {
  font-family: var(--font-body);
  font-weight: 300;
  background: var(--bg-dark);
  color: var(--text-on-dark);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }
ul { list-style: none; }
em { font-style: italic; color: var(--gold); }

/* ---------- Loader ---------- */
#loader {
  position: fixed; inset: 0; z-index: 100;
  background: var(--bg-dark);
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2rem;
}
.loader-brand {
  font-family: var(--font-display);
  font-size: clamp(1.6rem, 4.6vw, 3.4rem);
  letter-spacing: 0.3em;
  text-indent: 0.3em;
  text-align: center;
  text-transform: uppercase;
  font-weight: 500;
}
.loader-brand span { color: var(--gold); }
.loader-track { width: min(240px, 50vw); height: 1px; background: rgba(242, 236, 225, 0.15); }
#loader-bar { height: 100%; width: 0; background: var(--gold); }
#loader-percent {
  font-size: 0.7rem; letter-spacing: 0.3em; color: var(--muted);
  font-variant-numeric: tabular-nums;
}
#loader-percent::after { content: ' %'; }

/* ---------- Header ---------- */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  mix-blend-mode: normal;
}
.site-header nav {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.6rem 3.5vw;
}
.logo {
  font-family: var(--font-display);
  font-size: 1.5rem; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  display: flex; align-items: baseline; gap: 0.9rem;
}
.logo span {
  font-family: var(--font-body); font-size: 0.6rem; font-weight: 400;
  letter-spacing: 0.3em; color: var(--gold);
}
.nav-links { display: flex; gap: 2.8rem; }
.nav-links a, .nav-cta {
  font-size: 0.7rem; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 400;
  position: relative; padding-bottom: 4px;
  transition: color 0.4s var(--ease);
}
.nav-links a::after, .nav-cta::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
  background: var(--gold); transform: scaleX(0); transform-origin: left;
  transition: transform 0.5s var(--ease);
}
.nav-links a:hover, .nav-cta:hover { color: var(--gold); }
.nav-links a:hover::after, .nav-cta:hover::after { transform: scaleX(1); }
.nav-cta { border: 1px solid var(--hairline); padding: 0.75rem 1.4rem; }
.nav-cta::after { display: none; }
.nav-cta:hover { background: var(--gold); color: var(--text-on-accent); border-color: var(--gold); }
.progress { position: absolute; top: 0; left: 0; right: 0; height: 2px; }
#progress-bar { height: 100%; width: 100%; background: var(--gold); transform: scaleX(0); transform-origin: left; opacity: 0.7; }

/* ---------- Hero ---------- */
.hero-bg {
  position: fixed; inset: 0; z-index: 1;
  background:
    radial-gradient(ellipse 70% 60% at 75% 110%, rgba(201, 180, 138, 0.12), transparent 70%),
    var(--bg-dark);
}
.hero-standalone {
  position: fixed; inset: 0; z-index: 6;
  height: 100vh;
  display: flex; align-items: center;
  padding: 0 3.5vw;
  pointer-events: none;
}
.hero-inner { max-width: 1500px; }
.hero-label { display: block; margin-bottom: 2.4rem; }
.hero-heading {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(5rem, 14.5vw, 16rem);
  line-height: 0.88;
  letter-spacing: -0.02em;
}
.hero-heading .line { display: block; }
.hero-heading .word { display: inline-block; overflow: hidden; padding: 0 0.04em 0.12em; margin: 0 -0.04em -0.12em; vertical-align: top; }
.hero-heading .word > span { display: inline-block; }
.hero-tagline {
  margin-top: 2.6rem;
  font-size: clamp(0.85rem, 1.1vw, 1.05rem);
  line-height: 1.8; letter-spacing: 0.08em;
  color: var(--muted);
  max-width: 40rem;
  padding-left: 1.5rem; border-left: 1px solid var(--gold);
}
.scroll-indicator {
  position: absolute; right: 3.5vw; bottom: 3rem;
  display: flex; flex-direction: column; align-items: center; gap: 1rem;
  font-size: 0.65rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--muted);
}
.scroll-indicator svg { color: var(--gold); animation: nudge 2.4s var(--ease) infinite; }
@keyframes nudge { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(8px); } }

/* ---------- Canvas ---------- */
.canvas-wrap {
  position: fixed; inset: 0; z-index: 2;
  clip-path: circle(0% at 50% 50%);
  background: var(--bg-dark);
}
#canvas { width: 100%; height: 100%; display: block; }

.scrim {
  position: fixed; top: 0; bottom: 0; z-index: 3; width: 62vw;
  pointer-events: none; opacity: 0;
}
.scrim-left { left: 0; background: linear-gradient(90deg, rgba(10, 9, 8, 0.86) 0%, rgba(10, 9, 8, 0.6) 45%, transparent 100%); }
.scrim-right { right: 0; background: linear-gradient(270deg, rgba(10, 9, 8, 0.86) 0%, rgba(10, 9, 8, 0.6) 45%, transparent 100%); }

/* ---------- Overlays ---------- */
#dark-overlay, #accent-overlay {
  position: fixed; inset: 0; z-index: 5; pointer-events: none; opacity: 0;
}
#dark-overlay { background: var(--bg-dark); }
#accent-overlay { background: var(--bg-accent); }

/* ---------- Scroll container ---------- */
#scroll-container { position: relative; z-index: 10; height: 900vh; }

.scroll-section {
  position: absolute; left: 0; right: 0;
  transform: translateY(-50%);
  pointer-events: none;
}
.scroll-section a, .scroll-section button { pointer-events: auto; }

.align-left  { padding-left: 3.5vw; padding-right: 58vw; }
.align-right { padding-left: 58vw; padding-right: 3.5vw; }
.align-left .section-inner,
.align-right .section-inner { max-width: 38vw; }

.section-label {
  display: block;
  font-size: 0.7rem; font-weight: 400;
  letter-spacing: 0.3em; text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 1.8rem;
}
.section-label::before {
  content: ''; display: inline-block; vertical-align: middle;
  width: 2.4rem; height: 1px; background: var(--gold); margin-right: 1rem;
}
.section-heading {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: clamp(3rem, 5.4vw, 6rem);
  line-height: 0.98; letter-spacing: -0.01em;
  margin-bottom: 1.8rem;
  text-shadow: 0 2px 30px rgba(0, 0, 0, 0.4);
}
.section-body {
  font-size: clamp(0.92rem, 1.05vw, 1.05rem);
  line-height: 1.85; color: #d3cabb; font-weight: 300;
  max-width: 30rem;
}

.heading-sub {
  display: flex; align-items: center; gap: 0.9rem; margin-top: 0.9rem;
  font-family: var(--font-body); font-size: clamp(0.72rem, 0.95vw, 0.9rem); font-weight: 400;
  letter-spacing: 0.22em; text-transform: uppercase; line-height: 1.4; color: var(--text-on-dark);
}
.clock { flex: none; color: var(--gold); }
.clock-m, .clock-h { transform-origin: 13px 13px; animation: tick 24s linear infinite; }
.clock-h { animation-duration: 288s; }
@keyframes tick { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .clock-m, .clock-h { animation: none; } }

/* Services list */
.service-list { border-top: 1px solid var(--hairline); max-width: 28rem; }
.service-item { border-bottom: 1px solid var(--hairline); font-family: var(--font-display); font-size: clamp(1.4rem, 1.9vw, 2rem); font-weight: 500; }
.service-toggle {
  display: flex; align-items: baseline; gap: 1.6rem; width: 100%;
  padding: 1.15rem 0; background: none; border: 0; cursor: pointer;
  color: inherit; font: inherit; text-align: left; transition: color 0.4s var(--ease);
}
.service-toggle span { font-family: var(--font-body); font-size: 0.68rem; letter-spacing: 0.2em; color: var(--gold); }
.service-toggle i { position: relative; margin-left: auto; align-self: center; width: 0.9rem; height: 0.9rem; flex: none; }
.service-toggle i::before, .service-toggle i::after { content: ''; position: absolute; background: var(--gold); transition: transform 0.5s var(--ease); }
.service-toggle i::before { left: 0; right: 0; top: 50%; height: 1px; }
.service-toggle i::after { top: 0; bottom: 0; left: 50%; width: 1px; }
.service-toggle:hover, .service-toggle[aria-expanded="true"] { color: var(--gold); }
.service-toggle[aria-expanded="true"] i::after { transform: scaleY(0); }
.service-toggle:focus-visible { outline: 1px solid var(--gold); outline-offset: 2px; }
.service-desc { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.55s var(--ease); }
.service-desc > p {
  overflow: hidden; min-height: 0; font-family: var(--font-body); font-size: 0.92rem; font-weight: 300;
  line-height: 1.75; color: #d3cabb; padding-left: 2.6rem; opacity: 0; transition: opacity 0.4s;
}
.service-item.is-open .service-desc { grid-template-rows: 1fr; }
.service-item.is-open .service-desc > p { opacity: 1; padding-bottom: 1.2rem; transition: opacity 0.6s 0.15s; }

/* Stats */
.section-stats {
  top: 50%; padding: 0 6vw; text-align: center;
}
.section-stats .section-label { margin-bottom: 4rem; }
.section-stats .section-label::before { display: none; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; }
.stat { display: flex; flex-direction: column; align-items: center; gap: 1.1rem; position: relative; }
.stat + .stat::before {
  content: ''; position: absolute; left: -1rem; top: 12%; bottom: 12%; width: 1px; background: var(--hairline);
}
.stat-figure { display: flex; align-items: baseline; justify-content: center; gap: 0.35rem; }
.stat-number {
  font-family: var(--font-display); font-weight: 500;
  font-size: clamp(4rem, 8vw, 8.5rem); line-height: 0.9;
  font-variant-numeric: lining-nums tabular-nums;
  color: var(--text-on-dark);
}
.stat-suffix { font-family: var(--font-display); font-size: clamp(1.4rem, 2.4vw, 2.6rem); color: var(--gold); font-style: italic; }
.stat-label { font-size: 0.7rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--muted); }

/* Zone d'intervention */
.section-zone { padding: 0 5vw; }
.zone-grid { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 4vw; align-items: center; max-width: 1300px; margin: 0 auto; }
.zone-text .section-body { margin-bottom: 2rem; }
.zone-legend { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; max-width: 30rem; border-top: 1px solid var(--hairline); }
.zone-legend li {
  display: flex; align-items: baseline; gap: 1rem; padding: 0.7rem 0; border-bottom: 1px solid var(--hairline);
  font-family: var(--font-display); font-size: 1.2rem; font-weight: 500; cursor: default; transition: color 0.3s;
}
.zone-legend li span { font-family: var(--font-body); font-size: 0.66rem; letter-spacing: 0.18em; color: var(--gold); min-width: 1.4rem; }
.zone-legend li.is-hot { color: var(--gold); }
.zone-map { display: flex; flex-direction: column; align-items: center; gap: 1rem; }
.zone-svg { width: 100%; max-height: 66vh; height: auto; overflow: visible; }
.dep { stroke-linejoin: round; transition: fill 0.35s, stroke 0.35s; }
.dep-out { fill: rgba(242, 236, 225, 0.035); stroke: rgba(201, 180, 138, 0.28); stroke-width: 0.6; }
.dep-in { fill: rgba(201, 180, 138, 0.2); stroke: var(--gold); stroke-width: 0.8; cursor: pointer; }
.dep-in[data-dep="75"] { fill: rgba(201, 180, 138, 0.55); }
.dep-in:hover, .dep-in.is-hot { fill: rgba(201, 180, 138, 0.5); }
.lbl-out { font-family: var(--font-body); font-size: 6.2px; letter-spacing: 0.08em; text-transform: uppercase; fill: rgba(242, 236, 225, 0.42); pointer-events: none; }
.lbl-in { font-family: var(--font-body); font-size: 7px; letter-spacing: 0.1em; fill: var(--text-on-dark); pointer-events: none; }
.hq { pointer-events: none; }
.hq-dot { fill: var(--text-on-dark); }
.hq-pulse { fill: none; stroke: var(--text-on-dark); stroke-width: 0.6; transform-box: fill-box; transform-origin: center; animation: pulse 2.6s var(--ease) infinite; }
@keyframes pulse { from { transform: scale(0.6); opacity: 0.9; } to { transform: scale(3.4); opacity: 0; } }
.zone-key { display: flex; align-items: center; gap: 0.6rem; font-size: 0.66rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted); }
.zone-key i { width: 0.8rem; height: 0.8rem; border: 1px solid var(--gold); display: inline-block; }
.zone-key .key-in { background: rgba(201, 180, 138, 0.35); }
.zone-key .key-out { margin-left: 1rem; border-color: rgba(201, 180, 138, 0.35); background: rgba(242, 236, 225, 0.05); }
@media (prefers-reduced-motion: reduce) { .hq-pulse { animation: none; opacity: 0; } }

/* CTA — accent zone (dark text on champagne) */
.section-cta .section-label { color: #6d5a34; }
.section-cta .section-label::before { background: #6d5a34; }
.section-cta .section-heading { color: var(--text-on-accent); text-shadow: none; }
.section-cta .section-heading em { color: #7a6438; }
.section-cta .section-body { color: #3b3222; }
.section-note { margin-top: 2rem; font-size: 0.75rem; letter-spacing: 0.14em; color: #5a4d33; }
.cta-button {
  display: inline-flex; align-items: center; gap: 1.2rem;
  margin-top: 2.4rem; padding: 1.15rem 2.2rem;
  background: var(--text-on-accent); color: var(--bg-accent);
  font-size: 0.72rem; letter-spacing: 0.24em; text-transform: uppercase; font-weight: 500;
  transition: gap 0.5s var(--ease), background 0.4s;
}
.cta-button:hover { gap: 2rem; background: #2a2318; }

.cta-row { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.4rem; }
.cta-row .cta-button { margin-top: 0; }
.cta-button.cta-whatsapp { background: transparent; color: var(--text-on-accent); border: 1px solid var(--text-on-accent); }
.cta-whatsapp:hover { background: var(--text-on-accent); color: var(--bg-accent); gap: 1.6rem; }

/* ---------- Quote modal ---------- */
.cta-button { border: 0; cursor: pointer; font-family: var(--font-body); }
.quote-modal { position: fixed; inset: 0; z-index: 90; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.quote-modal[hidden] { display: none; }
.quote-backdrop { position: absolute; inset: 0; background: rgba(6, 5, 4, 0.78); backdrop-filter: blur(6px); }
.quote-panel {
  position: relative; width: min(680px, 100%); max-height: calc(100vh - 2rem); overflow-y: auto;
  background: var(--bg-warm); color: var(--text-on-dark);
  border: 1px solid var(--hairline); padding: clamp(1.6rem, 4vw, 3rem);
  box-shadow: 0 40px 120px rgba(0, 0, 0, 0.6);
}
.quote-modal:not([hidden]) .quote-panel { animation: panelIn 0.6s var(--ease); }
@keyframes panelIn { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
.quote-close { position: absolute; top: 1.1rem; right: 1.1rem; background: none; border: 0; color: var(--muted); cursor: pointer; padding: 0.5rem; }
.quote-close:hover { color: var(--gold); }
.quote-title { font-family: var(--font-display); font-weight: 500; font-size: clamp(2rem, 4vw, 2.9rem); line-height: 1; margin-bottom: 2rem; }
.q-group { border: 0; margin-bottom: 1.7rem; min-width: 0; }
.q-group legend { font-size: 0.66rem; letter-spacing: 0.26em; text-transform: uppercase; color: var(--gold); margin-bottom: 0.9rem; padding: 0; }
.q-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.q-grid--client { grid-template-columns: auto 1fr; align-items: end; }
.q-field { display: flex; flex-direction: column; gap: 0.4rem; }
.q-field label { font-size: 0.68rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); }
.q-field input, .q-field textarea {
  font: inherit; font-size: 1rem; font-weight: 300; color: var(--text-on-dark);
  background: transparent; border: 0; border-bottom: 1px solid var(--hairline);
  padding: 0.6rem 0; border-radius: 0; outline: none; width: 100%;
  transition: border-color 0.3s;
}
.q-field textarea { resize: vertical; min-height: 6rem; border: 1px solid var(--hairline); padding: 0.8rem; line-height: 1.6; }
.q-field input:focus, .q-field textarea:focus { border-color: var(--gold); }
.q-field textarea::placeholder { color: #6f6759; }
.q-field .invalid, .q-field input:user-invalid, .q-field textarea:user-invalid { border-color: #c98a7a; }
.q-field[hidden] { display: none; }
.q-field--area { margin-bottom: 1.4rem; }
.q-segment { display: inline-flex; border: 1px solid var(--hairline); }
.q-segment label, .q-options label { cursor: pointer; position: relative; }
.q-segment input, .q-options input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.q-segment span { display: block; padding: 0.75rem 1.2rem; font-size: 0.7rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted); transition: background 0.3s, color 0.3s; }
.q-segment input:checked + span { background: var(--gold); color: var(--text-on-accent); }
.q-options { border-top: 1px solid var(--hairline); }
.q-options span { display: flex; align-items: center; gap: 1rem; padding: 0.95rem 0; border-bottom: 1px solid var(--hairline); font-family: var(--font-display); font-size: 1.35rem; transition: color 0.3s, padding 0.4s var(--ease); }
.q-options span::before { content: ''; width: 0.75rem; height: 0.75rem; border: 1px solid var(--gold); border-radius: 50%; flex: none; transition: background 0.3s; }
.q-options input:checked + span { color: var(--gold); padding-left: 0.5rem; }
.q-options input:checked + span::before { background: var(--gold); }
.q-segment input:focus-visible + span, .q-options input:focus-visible + span, .quote-close:focus-visible, .cta-button:focus-visible { outline: 1px solid var(--gold); outline-offset: 3px; }
.q-error { color: #d9a293; font-size: 0.85rem; margin-bottom: 1rem; }
.q-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.2rem; }
.q-actions .cta-button, .q-done .cta-button { margin-top: 0; background: var(--gold); color: var(--text-on-accent); }
.q-actions .cta-button:hover, .q-done .cta-button:hover { background: var(--text-on-dark); }
.q-hint { font-size: 0.75rem; color: var(--muted); max-width: 16rem; line-height: 1.5; }
.q-done .section-body { margin-bottom: 0; }
.q-done .cta-row { margin-top: 2rem; }
.q-done .cta-ghost { background: transparent; color: var(--text-on-dark); border: 1px solid var(--hairline); }
.q-done .cta-ghost:hover { background: var(--text-on-dark); color: var(--bg-dark); }
@media (max-width: 560px) {
  .q-grid, .q-grid--client { grid-template-columns: 1fr; }
  .q-segment { display: flex; } .q-segment label { flex: 1; } .q-segment span { text-align: center; padding-inline: 0.5rem; }
}

/* Grain */
.grain {
  position: fixed; inset: 0; z-index: 60; pointer-events: none; opacity: 0.06; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* ---------- Mobile ---------- */
@media (max-width: 767px) {
  #scroll-container { height: 600vh; }
  .nav-links { display: none; }
  .site-header nav { padding: 1.2rem 6vw; }
  .logo { font-size: 1.15rem; }
  .logo span { font-size: 0.5rem; }
  .nav-cta { padding: 0.6rem 1rem; }
  .hero-standalone { padding: 0 6vw; }
  .hero-heading { font-size: clamp(3.6rem, 19vw, 6rem); }
  .scroll-indicator { right: 6vw; bottom: 2rem; }

  .scroll-section.section-content {
    padding: 4rem 6vw 3rem;
    background: linear-gradient(180deg, transparent 0%, rgba(10, 9, 8, 0.88) 35%, rgba(10, 9, 8, 0.92) 100%);
    text-align: left;
  }
  .scroll-section.section-cta { background: none; }
  .align-left .section-inner, .align-right .section-inner { max-width: 100%; }
  .scroll-section.section-content { top: auto; }
  .scrim { display: none; }
  .section-heading { font-size: clamp(2.4rem, 11vw, 3.6rem); }
  .section-zone { padding: 0 6vw; }
  .zone-grid { grid-template-columns: 1fr; gap: 1.2rem; }
  .zone-text .section-body { display: none; }
  .zone-legend { grid-template-columns: 1fr 1fr; gap: 0 1rem; }
  .zone-legend li { font-size: 1rem; padding: 0.45rem 0; }
  .zone-svg { max-height: 34vh; }
  .zone-key { font-size: 0.56rem; letter-spacing: 0.12em; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 2.6rem 1rem; }
  .stat + .stat::before { display: none; }
  .stat-number { font-size: clamp(3.2rem, 15vw, 4.6rem); }
}

@media (prefers-reduced-motion: reduce) {
  .scroll-indicator svg { animation: none; }
}

/* Header adapts to the champagne zone */
.site-header, .site-header * { transition: color 0.5s var(--ease), border-color 0.5s var(--ease), background 0.5s var(--ease); }
body.on-accent .site-header { color: var(--text-on-accent); }
body.on-accent .logo span { color: #6d5a34; }
body.on-accent .nav-cta { border-color: rgba(22, 18, 13, 0.35); }
body.on-accent .nav-cta:hover { background: var(--text-on-accent); color: var(--bg-accent); }
body.on-accent #progress-bar { background: var(--text-on-accent); }

.zone-text .section-heading em { white-space: nowrap; }

.lbl-in { font-size: 5px; }
.lbl-sm { font-size: 3.2px; }
.dep-in { stroke-width: 0.5; }
.hq-dot { r: 1.4; }
.zone-svg { max-height: 70vh; }

.zone-note { margin-top: 1.4rem; max-width: 30rem; font-size: 0.9rem; line-height: 1.7; font-style: italic; color: var(--gold); }
@media (max-width: 767px) { .zone-note { margin-top: 0.8rem; font-size: 0.8rem; } }
.zone-link { font-family: inherit; font-size: inherit; line-height: inherit; font-weight: inherit; font-style: italic; display: inline; color: var(--text-on-dark); background: none; border: 0; padding: 0 0 1px; cursor: pointer; border-bottom: 1px solid var(--gold); transition: color 0.3s, border-color 0.3s; }
.zone-link:hover { color: var(--gold); }
.zone-link:focus-visible { outline: 1px solid var(--gold); outline-offset: 3px; }

/* ---------- FAQ page ---------- */
.faq-page { position: fixed; inset: 0; z-index: 55; background: var(--bg-dark); }
.faq-page[hidden] { display: none; }
.faq-page:not([hidden]) { animation: faqIn 0.7s var(--ease); }
@keyframes faqIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
.faq-page::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse 60% 50% at 85% 0%, rgba(201, 180, 138, 0.1), transparent 70%); }
.faq-scroll { position: absolute; inset: 0; overflow-y: auto; overscroll-behavior: contain; }
.faq-bar { display: flex; align-items: center; justify-content: space-between; padding: 1.6rem 3.5vw; }
.faq-back { background: none; border: 1px solid var(--hairline); color: var(--text-on-dark); cursor: pointer; font-family: var(--font-body); font-size: 0.7rem; letter-spacing: 0.22em; text-transform: uppercase; padding: 0.75rem 1.4rem; transition: background 0.4s, color 0.4s; }
.faq-back:hover { background: var(--gold); color: var(--text-on-accent); border-color: var(--gold); }
.faq-main { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 6vw; padding: 5vh 3.5vw 10vh; max-width: 1500px; margin: 0 auto; }
.faq-intro { align-self: start; position: sticky; top: 3rem; }
.faq-title { font-family: var(--font-display); font-weight: 500; font-size: clamp(3rem, 6vw, 6.5rem); line-height: 0.95; letter-spacing: -0.01em; margin-bottom: 1.8rem; }
.faq-cta { margin-top: 2.2rem; background: var(--gold); color: var(--text-on-accent); }
.faq-cta:hover { background: var(--text-on-dark); }
.faq-list { border-top: 1px solid var(--hairline); }
.faq-item { border-bottom: 1px solid var(--hairline); }
.faq-toggle {
  display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; width: 100%;
  padding: 1.5rem 0; background: none; border: 0; cursor: pointer; text-align: left;
  color: var(--text-on-dark); font-family: var(--font-display); font-size: clamp(1.4rem, 2vw, 2rem); font-weight: 500; line-height: 1.2;
  transition: color 0.4s var(--ease);
}
.faq-toggle i { position: relative; width: 0.9rem; height: 0.9rem; flex: none; }
.faq-toggle i::before, .faq-toggle i::after { content: ''; position: absolute; background: var(--gold); transition: transform 0.5s var(--ease); }
.faq-toggle i::before { left: 0; right: 0; top: 50%; height: 1px; }
.faq-toggle i::after { top: 0; bottom: 0; left: 50%; width: 1px; }
.faq-toggle:hover, .faq-toggle[aria-expanded="true"] { color: var(--gold); }
.faq-toggle[aria-expanded="true"] i::after { transform: scaleY(0); }
.faq-toggle:focus-visible, .faq-back:focus-visible { outline: 1px solid var(--gold); outline-offset: 3px; }
.faq-desc { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 0.55s var(--ease); }
.faq-desc > p { overflow: hidden; min-height: 0; max-width: 38rem; font-size: 1rem; line-height: 1.8; color: #d3cabb; opacity: 0; transition: opacity 0.4s; }
.faq-desc a { color: var(--gold); border-bottom: 1px solid var(--hairline); }
.faq-item.is-open .faq-desc { grid-template-rows: 1fr; }
.faq-item.is-open .faq-desc > p { opacity: 1; padding-bottom: 1.6rem; transition: opacity 0.6s 0.15s; }
@media (max-width: 767px) {
  .faq-bar { padding: 1.2rem 6vw; gap: 1rem; }
  .faq-bar .logo { font-size: 1.05rem; white-space: nowrap; }
  .faq-bar .logo span { display: none; }
  .faq-back { white-space: nowrap; padding: 0.65rem 1rem; font-size: 0.62rem; letter-spacing: 0.16em; }
  .faq-main { grid-template-columns: 1fr; gap: 2.5rem; padding: 2rem 6vw 8vh; }
  .faq-intro { position: static; }
  .nav-links { display: flex; }
  .nav-links li:not(.nav-faq) { display: none; }
}

/* ---------- Footer: quick links (closing screen) ---------- */
.site-footer {
  position: fixed; right: 3.5vw; bottom: 3rem; z-index: 12;
  min-width: 13rem; padding-top: 1.1rem; border-top: 1px solid rgba(22, 18, 13, 0.35);
  opacity: 0; transform: translateY(14px); pointer-events: none;
  transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}
body.on-accent .site-footer { opacity: 1; transform: none; pointer-events: auto; }
.footer-title { display: block; margin-bottom: 1rem; font-size: 0.66rem; font-weight: 500; letter-spacing: 0.28em; text-transform: uppercase; color: #6d5a34; }
.site-footer ul { display: flex; flex-direction: column; gap: 0.5rem; }
.site-footer a {
  font-family: var(--font-display); font-size: 1.5rem; font-weight: 500; line-height: 1.2; color: var(--text-on-accent);
  background: linear-gradient(currentColor, currentColor) left bottom / 0 1px no-repeat; padding-bottom: 2px;
  transition: background-size 0.5s var(--ease), color 0.3s;
}
.site-footer a:hover { background-size: 100% 1px; }
.site-footer a:focus-visible { outline: 1px solid var(--text-on-accent); outline-offset: 3px; }
@media (max-width: 767px) {
  .site-footer { left: 6vw; right: 6vw; bottom: 1.6rem; padding-top: 0.9rem; }
  .footer-title { margin-bottom: 0.6rem; }
  .site-footer ul { flex-direction: row; gap: 1.6rem; flex-wrap: wrap; }
  .site-footer a { font-size: 1.2rem; }
}
@media (max-width: 767px) { .site-header nav { gap: 1rem; } .nav-links { margin-left: auto; margin-right: 0.4rem; } }

/* ---------- About page ---------- */
.about-content { max-width: 44rem; }
.about-lead { font-family: var(--font-display); font-size: clamp(1.6rem, 2.4vw, 2.3rem); line-height: 1.25; font-weight: 500; margin-bottom: 1.8rem; }
.about-text { font-size: 1rem; line-height: 1.85; color: #d3cabb; margin-bottom: 2.2rem; }
.about-values { border-top: 1px solid var(--hairline); margin-bottom: 2.2rem; }
.about-values li { display: grid; grid-template-columns: 11rem 1fr; gap: 1.5rem; padding: 1.5rem 0; border-bottom: 1px solid var(--hairline); align-items: baseline; }
.about-values h2 { font-family: var(--font-display); font-size: 1.9rem; font-weight: 500; color: var(--gold); line-height: 1.1; }
.about-values p { font-size: 0.98rem; line-height: 1.75; color: #d3cabb; }
@media (max-width: 767px) { .about-values li { grid-template-columns: 1fr; gap: 0.5rem; } }
@media (max-width: 767px) { .site-header .logo { white-space: nowrap; } .site-header .logo span { display: none; } }

/* ---------- Legal pages, legal bar, consent ---------- */
.legal-main { max-width: 52rem; margin: 0 auto; padding: 5vh 6vw 14vh; }
.legal-main .faq-title { margin-bottom: 0.8rem; }
.legal-update { font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted); margin-bottom: 2.4rem; }
.legal-main h2 { font-family: var(--font-display); font-weight: 500; font-size: clamp(1.5rem, 2.2vw, 1.9rem); color: var(--gold); margin: 2.6rem 0 0.9rem; line-height: 1.15; }
.legal-main p, .legal-main li { font-size: 0.98rem; line-height: 1.8; color: #d3cabb; }
.legal-main p { margin-bottom: 1rem; }
.legal-main ul { margin: 0 0 1rem; padding-left: 1.1rem; list-style: disc; }
.legal-main li { margin-bottom: 0.4rem; padding-left: 0.2rem; }
.legal-main li::marker { color: var(--gold); }
.legal-main strong { color: var(--text-on-dark); font-weight: 500; }
.legal-main a { color: var(--gold); border-bottom: 1px solid var(--hairline); }
.legal-main a:hover { border-bottom-color: var(--gold); }
.legal-links { margin-top: 3rem; }
.todo { background: rgba(201, 180, 138, 0.16); color: var(--gold); padding: 0.05em 0.35em; font-style: italic; }

.legal-bar {
  position: fixed; left: 3.5vw; bottom: 1.1rem; z-index: 12;
  display: flex; align-items: center; gap: 1.4rem;
  font-size: 0.62rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted);
  transition: color 0.5s var(--ease);
}
.legal-bar a { transition: color 0.3s; }
.legal-bar a:hover { color: var(--gold); }
.legal-bar a:focus-visible { outline: 1px solid var(--gold); outline-offset: 3px; }
body.on-accent .legal-bar { color: #5a4d33; }
body.on-accent .legal-bar a:hover { color: var(--text-on-accent); }

.q-consent { display: flex; align-items: flex-start; gap: 0.8rem; margin-bottom: 1.4rem; }
.q-consent input { flex: none; width: 1.05rem; height: 1.05rem; margin-top: 0.2rem; accent-color: var(--gold); cursor: pointer; }
.q-consent label { font-size: 0.78rem; line-height: 1.6; color: var(--muted); cursor: pointer; }
.q-consent label a { color: var(--gold); border-bottom: 1px solid var(--hairline); }
.q-consent input.invalid { outline: 1px solid #c98a7a; outline-offset: 2px; }

@media (max-width: 767px) {
  .legal-bar { left: 6vw; bottom: 0.7rem; gap: 1.1rem; font-size: 0.58rem; }
  .legal-copy { display: none; }
  .site-footer { bottom: 2.6rem; }
}

/* ---------- Quick contact buttons (always visible) ---------- */
.quick-contact { position: fixed; right: 1.6rem; bottom: 1.6rem; z-index: 13; display: flex; flex-direction: column; gap: 0.7rem; }
.qc-btn {
  width: 3.2rem; height: 3.2rem; display: grid; place-items: center; border-radius: 50%;
  background: var(--gold); color: var(--text-on-accent);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
  transition: transform 0.4s var(--ease), background 0.4s, color 0.4s;
}
.qc-btn:hover { transform: translateY(-3px); background: var(--text-on-dark); }
.qc-btn:focus-visible { outline: 2px solid var(--text-on-dark); outline-offset: 3px; }
body.on-accent .qc-btn { background: var(--text-on-accent); color: var(--bg-accent); box-shadow: 0 8px 28px rgba(22, 18, 13, 0.3); }
body.on-accent .qc-btn:hover { background: #2a2318; }
.scroll-indicator { right: auto; left: 50%; transform: translateX(-50%); }
.site-footer { bottom: 7.5rem; }
@media (max-width: 767px) {
  .quick-contact { right: 1rem; bottom: 1rem; gap: 0.6rem; }
  .qc-btn { width: 2.9rem; height: 2.9rem; }
  .scroll-indicator { left: 6vw; transform: none; bottom: 3.2rem; }
  .site-footer { right: 5rem; bottom: 2.6rem; }
}