/* ════════════════════════════════════════════════════════════════════════════
   SH SERVICES — v0.1 — design by LapCorporation
   ════════════════════════════════════════════════════════════════════════════ */
:root {
  --charcoal: #54565A;       /* brand gray from logo */
  --charcoal-dk: #3B3D40;
  --ink: #232427;
  --accent: #1B87C9;         /* azure — water */
  --accent-lt: #4FAEE3;
  --blue: #155E8E;           /* deep water blue */
  --heat: #E25744;           /* warm red — heating */
  --bg: #F7F7F6;
  --white: #FFFFFF;
  --text: #3C3D40;
  --text-soft: #74767B;
  --radius: 14px;
  --shadow: 0 10px 35px rgba(35,36,39,.10);
  --font: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--font); color:var(--text); background:var(--bg); line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img { max-width:100%; }
a { color:inherit; text-decoration:none; }

h1,h2,h3,h4 { font-family:var(--font); font-weight:600; color:var(--ink); line-height:1.15; letter-spacing:-.01em; }
h1 { font-size:clamp(2.2rem, 5.5vw, 3.6rem); }
h2 { font-size:clamp(1.7rem, 4vw, 2.5rem); }

.container { max-width:1180px; margin:0 auto; padding:0 1.5rem; }
.section { padding:5.5rem 0; }
.section-alt { background:#EFEFED; }
.section-dark { background:var(--charcoal-dk); }
.section-dark h2, .section-dark h3, .section-dark h4 { color:var(--white); }
.section-dark p { color:rgba(255,255,255,.75); }

.eyebrow {
  font-size:.72rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent); margin-bottom:.7rem;
}
.section-header { text-align:center; max-width:680px; margin:0 auto 3rem; }
.section-desc { margin-top:1rem; color:var(--text-soft); }
.section-dark .section-desc { color:rgba(255,255,255,.65); }

/* ══ LOADER — security check ════════════════════════════════════════════════
   Same background recipe as the hero (accent glows + 56px grid, masked to the
   centre), in the dark tone used by the footer, so the splash reads as part of
   the site rather than a separate screen.
   ══════════════════════════════════════════════════════════════════════════ */
#loader {
  position:fixed; inset:0; z-index:9999;
  background:
    radial-gradient(1000px 560px at 82% 8%, rgba(27,135,201,.20), transparent 60%),
    radial-gradient(800px 520px at 8% 92%, rgba(21,94,142,.20), transparent 60%),
    linear-gradient(180deg, #2B2C30 0%, var(--ink) 100%);
  display:flex; align-items:center; justify-content:center;
  padding:2rem 1.25rem;
  transition:opacity .6s ease, visibility .6s ease;
}
#loader::before {
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 75% 65% at 50% 45%, #000 30%, transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse 75% 65% at 50% 45%, #000 30%, transparent 75%);
}
#loader.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.loader-inner { position:relative; text-align:center; width:min(276px, 100%); }

.loader-logo-img {
  display:block; height:60px; width:auto; margin:0 auto 1.9rem;
  filter:brightness(0) invert(1); opacity:.95;
  animation:loaderFadeUp .6s ease both;
}
.loader-sub {
  font-size:.66rem; font-weight:700; letter-spacing:.22em;
  text-transform:uppercase; color:var(--accent-lt);
  min-height:1.2em;
  animation:loaderFadeUp .6s ease .1s both;
}
.loader-bar {
  position:relative; width:100%; height:4px;
  background:rgba(255,255,255,.09);
  margin:1.4rem auto 0; border-radius:4px; overflow:hidden;
  animation:loaderFadeUp .4s ease .18s both;
}
.loader-bar span {
  display:block; height:100%; width:0%; border-radius:4px;
  background:linear-gradient(90deg, var(--accent), var(--accent-lt), var(--accent));
  background-size:200% 100%;
  box-shadow:0 0 12px rgba(27,135,201,.65);
  animation:loaderShimmer 1.4s ease infinite;
  transition:width .6s cubic-bezier(.22,.61,.36,1);
}
.loader-meta {
  display:flex; align-items:baseline; justify-content:space-between; gap:1rem;
  margin:.7rem auto 0;
  animation:loaderFadeUp .4s ease .26s both;
}
.loader-tech {
  flex:1; text-align:left; font-size:.68rem; color:rgba(255,255,255,.42);
  font-family:Consolas, "SF Mono", Menlo, monospace; line-height:1.4; min-height:1.4em;
}
.loader-pct {
  font-size:.78rem; font-weight:700; color:rgba(255,255,255,.75);
  font-variant-numeric:tabular-nums; font-family:Consolas, "SF Mono", Menlo, monospace;
}
.loader-pct span { font-size:.62rem; opacity:.55; margin-left:.08em; }
.loader-steps {
  display:flex; justify-content:center; gap:.45rem; margin-top:1.4rem;
  animation:loaderFadeUp .4s ease .32s both;
}
.loader-steps i {
  width:22px; height:3px; border-radius:3px; background:rgba(255,255,255,.12);
  transition:background .35s ease, box-shadow .35s ease;
}
.loader-steps i.done { background:var(--accent-lt); box-shadow:0 0 8px rgba(27,135,201,.6); }
@keyframes loaderFadeUp { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
@keyframes loaderShimmer { 0% { background-position:0% 0; } 100% { background-position:-200% 0; } }

/* ══ VERSION BANNER ═════════════════════════════════════════════════════════ */
#versionBanner {
  position:fixed; top:0; left:0; right:0; z-index:1002;
  display:flex; align-items:center; justify-content:center; gap:1rem;
  padding:.5rem 2.6rem .5rem 1rem; text-align:center;
  background:linear-gradient(100deg, var(--charcoal-dk), #2C4A5E);
  color:rgba(255,255,255,.85); font-size:.8rem; letter-spacing:.01em;
}
#versionBanner strong { color:var(--accent-lt); }
.version-banner-close {
  position:absolute; right:.6rem; top:50%; transform:translateY(-50%);
  background:none; border:none; cursor:pointer; color:rgba(255,255,255,.6);
  font-size:1.25rem; line-height:1; padding:.2rem .5rem; border-radius:6px;
}
.version-banner-close:hover { color:#fff; background:rgba(255,255,255,.1); }
body.has-banner #navbar { top:34px; }
body.has-banner #hero { padding-top:10rem; }
@media (max-width:768px) {
  #versionBanner { font-size:.72rem; }
  body.has-banner #navbar { top:50px; }
  body.has-banner .nav-links { top:112px; }
}

/* ══ SCROLL PROGRESS ════════════════════════════════════════════════════════ */
#scrollProgress {
  position:fixed; top:0; left:0; height:3px; width:0%;
  background:linear-gradient(90deg, var(--accent), var(--accent-lt));
  z-index:1001;
}

/* ══ NAV ════════════════════════════════════════════════════════════════════ */
#navbar {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:rgba(255,255,255,.92);
  border-bottom:1px solid rgba(0,0,0,.06);
  transition:box-shadow .3s;
}
/* Blur sits on a pseudo-element: backdrop-filter on #navbar itself would make it the
   containing block for the fixed mobile drawer and trap the drawer inside the bar */
#navbar::before { content:""; position:absolute; inset:0; z-index:-1; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); }
#navbar.scrolled { box-shadow:0 4px 20px rgba(0,0,0,.08); }
.nav-inner {
  max-width:1180px; margin:0 auto; padding:.65rem 1.5rem;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
}
.nav-brand { display:flex; align-items:center; gap:.75rem; }
.nav-logo { display:flex; align-items:center; }
.nav-logo-img { height:46px; width:auto; display:block; }
.nav-flags { display:flex; align-items:center; gap:.35rem; }
.nav-flags .lang-btn {
  display:inline-flex; align-items:center; justify-content:center;
  background:none; border:none; cursor:pointer; padding:0;
  border-radius:3px; opacity:.55; transition:opacity .2s, box-shadow .2s, transform .15s;
}
.nav-flags .lang-btn img {
  width:22px; height:15px; border-radius:3px; object-fit:cover;
  box-shadow:0 1px 3px rgba(0,0,0,.20);
  display:block;
}
.nav-flags .lang-btn:hover { opacity:.85; }
.nav-flags .lang-btn.active {
  opacity:1;
  box-shadow:0 0 0 2px var(--accent);
}
.nav-links { display:flex; align-items:center; gap:1.6rem; }
.nav-links a { font-size:.92rem; font-weight:500; color:var(--text); transition:color .2s; }
.nav-links a:hover { color:var(--accent); }
.btn-nav {
  background:var(--accent); color:#fff !important; padding:.55rem 1.2rem;
  border-radius:50px; font-weight:600; transition:background .2s;
}
.btn-nav:hover { background:var(--accent-lt); }

.hamburger { display:none; background:none; border:none; cursor:pointer; flex-direction:column; gap:5px; padding:.4rem; }
.hamburger span { width:24px; height:2px; background:var(--ink); transition:transform .3s ease, opacity .3s ease; display:block; }
.hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity:0; }
.hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

/* ══ HERO ═══════════════════════════════════════════════════════════════════ */
#hero {
  position:relative; min-height:92vh; display:flex; align-items:center; justify-content:center;
  text-align:center; padding:8rem 1.5rem 5rem; overflow:hidden;
}
.hero-bg {
  position:absolute; inset:0;
  background:
    radial-gradient(1000px 560px at 82% 8%, rgba(27,135,201,.14), transparent 60%),
    radial-gradient(800px 520px at 8% 90%, rgba(21,94,142,.13), transparent 60%),
    linear-gradient(180deg, #FDFDFC 0%, #F1F1EF 100%);
}
.hero-bg::after {
  content:""; position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(35,36,39,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(35,36,39,.035) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 75% 65% at 50% 40%, #000 30%, transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse 75% 65% at 50% 40%, #000 30%, transparent 75%);
}
.hero-content { position:relative; max-width:820px; }
.grad-text {
  background:linear-gradient(100deg, var(--accent) 10%, var(--accent-lt) 55%, var(--blue) 110%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero-eyebrow {
  display:inline-block; font-size:.72rem; font-weight:700; letter-spacing:.24em; text-transform:uppercase;
  color:var(--accent); margin-bottom:1.2rem;
  padding:.45rem 1.1rem; border:1px solid rgba(27,135,201,.30); border-radius:50px;
  background:rgba(27,135,201,.06); backdrop-filter:blur(6px);
}
.hero-desc { margin:1.4rem auto 2.4rem; max-width:580px; color:var(--text-soft); font-size:1.1rem; }
.hero-cta { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
.hero-note {
  margin:2.4rem auto 0; font-size:.86rem; color:var(--text-soft);
  display:inline-flex; align-items:center; gap:.55rem; flex-wrap:wrap; justify-content:center;
  padding:.65rem 1.3rem; border-radius:50px; background:rgba(255,255,255,.65);
  border:1px solid rgba(0,0,0,.06); box-shadow:0 4px 18px rgba(35,36,39,.06); backdrop-filter:blur(8px);
}
.hero-note a { color:var(--accent); font-weight:600; }
.note-inline-icon { width:16px; height:16px; stroke:var(--accent); flex:0 0 auto; }
.hero-scroll { position:absolute; bottom:1.6rem; left:50%; transform:translateX(-50%); width:22px; height:36px; border:2px solid rgba(0,0,0,.18); border-radius:12px; }
.hero-scroll span { position:absolute; top:6px; left:50%; width:3px; height:7px; margin-left:-1.5px; background:var(--accent); border-radius:2px; animation:scrollAnim 1.6s ease infinite; }
@keyframes scrollAnim { 0%{opacity:1;transform:translateY(0)} 70%{opacity:0;transform:translateY(12px)} 100%{opacity:0} }

/* ══ BUTTONS ════════════════════════════════════════════════════════════════ */
.btn-primary, .btn-ghost {
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.85rem 1.8rem; border-radius:50px; font-weight:600; font-size:.96rem;
  font-family:var(--font); cursor:pointer; border:none;
  transition:background .25s ease, color .25s ease, transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.btn-primary {
  background:linear-gradient(120deg, var(--accent), var(--accent-lt));
  color:#fff; box-shadow:0 10px 28px rgba(27,135,201,.35);
}
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 14px 34px rgba(27,135,201,.45); filter:brightness(1.05); }
.btn-ghost { background:transparent; color:var(--ink); border:1.5px solid rgba(0,0,0,.2); }
.btn-ghost:hover { border-color:var(--accent); color:var(--accent); }
.btn-full { width:100%; justify-content:center; }
.btn-icon { width:18px; height:18px; stroke:currentColor; }

/* ══ FEATURE STRIP ══════════════════════════════════════════════════════════ */
.feature-strip { background:var(--white); border-top:1px solid rgba(0,0,0,.05); border-bottom:1px solid rgba(0,0,0,.05); }
.feature-strip-inner {
  max-width:1180px; margin:0 auto; padding:2rem 1.5rem;
  display:grid; grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); gap:1.4rem;
}
.feature-item { display:flex; align-items:center; gap:.85rem; }
.feature-icon-wrap {
  flex:0 0 46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:rgba(27,135,201,.10);
}
.ficon { width:22px; height:22px; stroke:var(--accent); }
.feature-item p { font-size:.9rem; font-weight:600; color:var(--ink); line-height:1.35; }
.feature-item p span { font-weight:400; font-size:.78rem; color:var(--text-soft); }

/* ══ STATS STRIP ════════════════════════════════════════════════════════════ */
.stats-strip {
  background:var(--charcoal-dk);
  display:flex; align-items:center; justify-content:center; gap:clamp(1.5rem, 5vw, 4rem);
  padding:2.2rem 1.5rem; flex-wrap:wrap;
}
.stat-item { text-align:center; }
.stat-num {
  display:block; font-size:2.3rem; font-weight:700; line-height:1;
  background:linear-gradient(120deg, var(--accent-lt), #A8D8F0);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.stat-label { display:block; margin-top:.4rem; font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.55); }
.stat-divider { width:1px; height:42px; background:rgba(255,255,255,.12); }

/* ══ STEPS ══════════════════════════════════════════════════════════════════ */
.steps-wrap {
  margin-top:3.5rem; display:flex; align-items:stretch; justify-content:center;
  gap:1rem; flex-wrap:wrap;
}
.step-card {
  position:relative; flex:1 1 220px; max-width:320px;
  background:var(--white); border:1px solid rgba(0,0,0,.05); border-radius:18px;
  padding:2.2rem 1.6rem 1.8rem; text-align:center;
  box-shadow:0 4px 18px rgba(35,36,39,.05);
}
.step-num {
  position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(120deg, var(--accent), var(--accent-lt)); color:#fff;
  font-size:.82rem; font-weight:700; box-shadow:0 6px 16px rgba(27,135,201,.35);
}
.step-icon-wrap {
  width:50px; height:50px; margin:0 auto 1rem; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(27,135,201,.12), rgba(21,94,142,.10));
}
.step-card h3 { font-size:1.02rem; margin-bottom:.4rem; }
.step-card p { font-size:.88rem; color:var(--text-soft); }
.step-arrow { align-self:center; font-size:1.4rem; color:var(--accent); opacity:.6; }

/* ══ FAQ ════════════════════════════════════════════════════════════════════ */
.faq-list { max-width:760px; margin:0 auto; display:flex; flex-direction:column; gap:.8rem; }
.faq-item {
  background:var(--white); border:1px solid rgba(0,0,0,.06); border-radius:14px;
  box-shadow:0 3px 14px rgba(35,36,39,.04); overflow:hidden;
  transition:border-color .25s, box-shadow .25s;
}
.faq-item:hover { border-color:rgba(27,135,201,.30); }
.faq-item[open] { border-color:rgba(27,135,201,.45); box-shadow:0 10px 28px rgba(35,36,39,.08); }
.faq-item summary {
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between;
  gap:1rem; padding:1.1rem 1.4rem; font-weight:600; color:var(--ink); font-size:.97rem;
}
.faq-item summary::-webkit-details-marker { display:none; }
.faq-chevron { flex:0 0 18px; width:18px; height:18px; stroke:var(--accent); transition:transform .25s; }
.faq-item[open] .faq-chevron { transform:rotate(180deg); }
.faq-item p { padding:0 1.4rem 1.2rem; font-size:.92rem; color:var(--text-soft); }

/* ══ SERVICES ═══════════════════════════════════════════════════════════════ */
.services-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:1.4rem; }
.service-card {
  background:var(--white); border-radius:18px; padding:2rem 1.6rem;
  border:1px solid rgba(0,0,0,.05); box-shadow:0 4px 18px rgba(35,36,39,.05);
  transition:transform .25s, box-shadow .25s, border-color .25s;
}
.service-card:hover {
  transform:translateY(-5px); border-color:rgba(27,135,201,.35);
  box-shadow:0 18px 40px rgba(35,36,39,.12);
}
.service-icon-wrap {
  width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, rgba(27,135,201,.12), rgba(21,94,142,.10)); margin-bottom:1.1rem;
}
.sicon { width:25px; height:25px; stroke:var(--accent); }
.icon-heat { stroke:var(--heat) !important; }
.service-card h3 { margin-bottom:.5rem; font-size:1.08rem; }
.service-card p { font-size:.92rem; color:var(--text-soft); }

.rdv-callout {
  margin-top:3rem;
  background:linear-gradient(115deg, var(--charcoal-dk) 55%, #4A4147 85%, #2C4A5E 110%);
  border-radius:18px;
  padding:2.2rem 2.4rem; display:flex; align-items:center; justify-content:space-between;
  gap:1.5rem; flex-wrap:wrap;
}
.rdv-callout h3 { color:#fff; font-size:1.3rem; margin-bottom:.3rem; }
.rdv-callout p { color:rgba(255,255,255,.7); font-size:.94rem; }

/* ══ ZONES ══════════════════════════════════════════════════════════════════ */
.zones-layout {
  display:grid; grid-template-columns:minmax(0, 1.1fr) minmax(0, .9fr);
  gap:2.4rem; align-items:center; max-width:1240px; margin:0 auto;
}

/* ── Schematic coverage map ── */
.zones-map { min-width:0; margin:0; padding:0; background:none; border:0; border-radius:0; box-shadow:none; }
.zones-map::before {
  content:""; display:block; width:100%; aspect-ratio:1.05 / 1;
  background:url("../images/southwest-departments.svg?v=3") center / contain no-repeat;
}
.zones-map > .zmap { display:none; }
.zdept {
  fill:#F1F5F6; stroke:#fff; stroke-width:3; stroke-linejoin:round;
  transition:fill .28s ease, stroke .28s ease;
}
.zdept:not(.is-base) { stroke:#fff; }
.zdept.is-base { fill:#CDEAF8; stroke:var(--accent); stroke-width:3.5; }
.zmap-labels { pointer-events:none; }
.zmap-labels .zn {
  font-size:27px; font-weight:700; text-anchor:middle;
  fill:var(--accent); font-variant-numeric:tabular-nums;
}
.zmap-labels .zl {
  font-size:10.5px; text-anchor:middle; letter-spacing:0;
  fill:var(--ink);
}
.zmap-labels .zn, .zmap-labels .zl { paint-order:stroke; stroke:rgba(255,255,255,.8); stroke-width:2px; stroke-linejoin:round; }

/* Base marker */
.zb-dot { fill:var(--accent); stroke:#fff; stroke-width:2; }
.zb-pulse { fill:rgba(27,135,201,.3); transform-origin:109px 145px; animation:zmapPulse 2.6s ease-out infinite; }

/* Hover / focus a list row → highlight its department on the map */
.zdept[data-dept]:hover,
.zones-layout:has(.zone-row[data-dept="24"]:hover) .zdept[data-dept="24"],
.zones-layout:has(.zone-row[data-dept="32"]:hover) .zdept[data-dept="32"],
.zones-layout:has(.zone-row[data-dept="46"]:hover) .zdept[data-dept="46"],
.zones-layout:has(.zone-row[data-dept="47"]:hover) .zdept[data-dept="47"],
.zones-layout:has(.zone-row[data-dept="82"]:hover) .zdept[data-dept="82"] {
  fill:#A8DCF3; stroke:var(--accent);
}

.zmap-legend { display:none;
  justify-content:center; gap:1.4rem; flex-wrap:wrap;
  margin-top:1rem; font-size:.72rem; color:var(--text-soft); letter-spacing:.02em;
}
.zleg { display:inline-flex; align-items:center; gap:.4rem; }
.zleg i {
  width:10px; height:10px; border-radius:3px;
  background:#F3F4F3; border:1px solid rgba(84,86,90,.28);
}
.zleg-base i { background:rgba(27,135,201,.5); border-color:var(--accent); border-radius:50%; }

/* ── Department list ── */
.zones-list {
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:.85rem;
}
.zone-row {
  position:relative; display:flex; align-items:flex-start; gap:.95rem;
  min-height:104px; padding:1rem;
  background:#fff;
  border:1px solid rgba(35,36,39,.08); border-radius:8px;
  box-shadow:0 10px 26px rgba(35,36,39,.055);
  transition:transform .22s, border-color .22s, box-shadow .22s;
}
.zone-row:hover {
  transform:translateY(-3px); border-color:rgba(27,135,201,.42);
  box-shadow:0 16px 34px rgba(35,36,39,.10);
}
.zone-row.featured {
  grid-column:1 / -1;
  min-height:96px;
  border-color:rgba(27,135,201,.45);
  background:linear-gradient(120deg, rgba(27,135,201,.12), #fff 78%);
}
.zone-num {
  flex:0 0 auto; width:48px; height:48px; display:grid; place-items:center;
  font-size:1.35rem; font-weight:700; line-height:1; color:var(--accent);
  background:rgba(27,135,201,.10); border-radius:8px;
  font-variant-numeric:tabular-nums;
}
.zone-body { min-width:0; display:block; }
.zone-name {
  display:block; font-size:1rem; font-weight:700; color:var(--ink); letter-spacing:.01em;
}
.zone-towns {
  display:block; margin-top:.3rem; font-size:.8rem; line-height:1.45;
  color:var(--text-soft); letter-spacing:.01em;
}
.zone-base {
  display:inline-block; vertical-align:middle; margin-left:.45rem;
  font-size:.58rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:#fff; background:var(--accent); padding:.18rem .5rem; border-radius:50px;
}

.zones-cta {
  display:flex; align-items:center; justify-content:center; gap:.6rem; flex-wrap:wrap;
  max-width:720px; margin:2.6rem auto 0; text-align:center;
  font-size:.9rem; color:var(--text-soft);
}
.zones-cta .note-icon { width:18px; height:18px; flex:0 0 auto; stroke:var(--accent); fill:none; }
.zones-cta a { color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
.zones-cta a:hover { color:var(--blue); }

@keyframes zmapPulse {
  0%   { transform:scale(1);   opacity:.75; }
  70%  { transform:scale(3.2); opacity:0; }
  100% { transform:scale(3.2); opacity:0; }
}
@keyframes zmapFlow { to { stroke-dashoffset:-100; } }

.langs-strip.contact-langs { margin:2.2rem 0 0; justify-content:flex-start; }
.langs-strip {
  margin:2.8rem auto 0; max-width:640px;
  display:flex; align-items:center; justify-content:center; gap:1.2rem; flex-wrap:wrap;
  padding:1.1rem 1.6rem; border-radius:50px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
}
.langs-label { font-size:.82rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.55) !important; margin:0; }
.langs-list { display:flex; gap:.8rem; flex-wrap:wrap; justify-content:center; }
.lang-chip {
  display:inline-flex; align-items:center; gap:.5rem;
  border:0; cursor:pointer; font-family:inherit; line-height:1.25;
  font-size:.9rem; font-weight:600; color:rgba(255,255,255,.9);
  background:rgba(255,255,255,.08); padding:.4rem .95rem; border-radius:50px;
  transition:background .2s, box-shadow .2s;
}
.lang-chip:hover { background:rgba(255,255,255,.14); }
.lang-chip img { width:22px; height:15px; border-radius:3px; object-fit:cover; box-shadow:0 1px 3px rgba(0,0,0,.35); }
.lang-chip.active { background:rgba(255,255,255,.18); color:#fff; box-shadow:0 0 0 2px var(--accent); }
.lang-chip:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }

/* ══ PARTNERS ═══════════════════════════════════════════════════════════════ */
.partners-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(190px, 1fr)); gap:1.2rem; }
.partner-card {
  background:var(--white); border-radius:18px; padding:2rem 1.2rem; text-align:center;
  border:1px solid rgba(0,0,0,.05); box-shadow:0 4px 18px rgba(35,36,39,.05);
  transition:transform .25s, box-shadow .25s, border-color .25s;
}
.partner-card:hover {
  transform:translateY(-4px); border-color:rgba(27,135,201,.35);
  box-shadow:0 16px 36px rgba(35,36,39,.11);
}
.partner-card.pending { border:1.5px dashed rgba(27,135,201,.5); background:rgba(27,135,201,.04); }
.partner-logo {
  display:block; height:56px; max-width:82%; width:auto; margin:0 auto;
  object-fit:contain; filter:grayscale(35%); opacity:.92; transition:filter .25s, opacity .25s;
}
.partner-card:hover .partner-logo { filter:none; opacity:1; }
.partner-name { display:block; font-size:1.05rem; font-weight:700; letter-spacing:.08em; color:var(--charcoal); }
.partner-tag {
  display:inline-block; margin-top:.6rem; font-size:.68rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--accent);
  background:rgba(27,135,201,.10); padding:.25rem .7rem; border-radius:50px;
}
.partners-note {
  margin-top:2.2rem; text-align:center; color:var(--text-soft); font-size:.92rem;
  display:flex; align-items:center; justify-content:center; gap:.5rem; flex-wrap:wrap;
}
.note-icon { width:20px; height:20px; stroke:var(--accent); flex:0 0 auto; }

/* ══ MANUALS / PLACEHOLDERS ═════════════════════════════════════════════════ */
.manuals-placeholder {
  background:var(--white); border:2px dashed rgba(0,0,0,.14); border-radius:var(--radius);
  padding:4rem 2rem; text-align:center; max-width:640px; margin:0 auto;
}
.ph-icon { width:46px; height:46px; stroke:var(--charcoal); opacity:.45; }
.ph-icon.sm { width:30px; height:30px; }
.ph-title { margin-top:1rem; font-weight:600; color:var(--ink); font-size:1.1rem; }
.ph-sub { margin-top:.4rem; font-size:.9rem; color:var(--text-soft); }

/* ══ GALLERY ════════════════════════════════════════════════════════════════ */
.gallery-grid {
  display:grid; gap:1rem;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  grid-auto-rows:170px; grid-auto-flow:dense;
}
.gallery-ph {
  background:linear-gradient(135deg, #ECECEA, #E2E2E0);
  border:2px dashed rgba(0,0,0,.10); border-radius:var(--radius);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.5rem;
  color:var(--text-soft); font-size:.82rem; letter-spacing:.04em;
}
.gallery-ph.tall { grid-row:span 2; }
.gallery-ph.wide { grid-column:span 2; }

/* ══ CONTACT ════════════════════════════════════════════════════════════════ */
.contact-layout { display:grid; grid-template-columns:1fr 1.15fr; gap:3.5rem; align-items:start; }
.contact-info > p { margin-top:1rem; }
.contact-details { margin-top:2rem; display:flex; flex-direction:column; gap:1rem; }
.contact-item { display:flex; align-items:center; gap:.9rem; color:rgba(255,255,255,.85); font-size:.95rem; transition:color .2s; }
.contact-item:hover { color:var(--accent-lt); }
.contact-icon-wrap {
  flex:0 0 42px; height:42px; border-radius:11px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.08);
}
.cicon { width:20px; height:20px; stroke:var(--accent-lt); }
.sms-badge {
  display:inline-block; margin-left:.4rem; font-size:.66rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase; color:#fff;
  background:var(--accent); padding:.18rem .55rem; border-radius:50px; vertical-align:middle;
}
.contact-warning span { font-size:.85rem; color:rgba(255,255,255,.6); }

.contact-form { background:var(--white); border-radius:var(--radius); padding:2.2rem; box-shadow:var(--shadow); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-group { margin-bottom:1.1rem; }
.form-group label { display:block; font-size:.82rem; font-weight:600; color:var(--ink); margin-bottom:.35rem; }
.form-group label em { font-weight:400; color:var(--text-soft); font-style:normal; font-size:.76rem; }
.form-group input, .form-group select, .form-group textarea {
  width:100%; padding:.7rem .9rem; border:1.5px solid rgba(0,0,0,.12); border-radius:9px;
  font-family:var(--font); font-size:.94rem; color:var(--text); background:#FBFBFA;
  transition:border-color .2s;
}
.form-group input:focus-visible, .form-group textarea:focus-visible { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(27,135,201,.22); }
.form-group input.invalid { border-color:#D24A43; }
.contact-form .form-note, .section-dark .contact-form p { margin-top:1rem; font-size:.78rem; color:var(--text-soft); text-align:center; }
.form-note a { color:var(--accent); }
.form-success { margin-top:1rem; padding:.9rem; border-radius:9px; background:rgba(64,160,90,.12); color:#2C7A44; font-weight:600; text-align:center; font-size:.92rem; }
.form-success.hidden { display:none; }

/* ══ FOOTER ═════════════════════════════════════════════════════════════════ */
#footer { background:var(--ink); color:rgba(255,255,255,.7); padding:3.5rem 0 1.5rem; }
.footer-top { display:grid; grid-template-columns:1.3fr 1fr 1.2fr; gap:2.5rem; padding-bottom:2.5rem; border-bottom:1px solid rgba(255,255,255,.1); }
.footer-logo-img { height:54px; width:auto; filter:brightness(0) invert(1); opacity:.9; }
.footer-tagline { margin-top:.9rem; font-size:.88rem; color:rgba(255,255,255,.5); }
.footer-nav { display:flex; flex-direction:column; gap:.55rem; }
.footer-nav a, .footer-contact a { font-size:.9rem; color:rgba(255,255,255,.65); transition:color .2s; display:block; }
.footer-nav a:hover, .footer-contact a:hover { color:var(--accent-lt); }
.footer-contact { display:flex; flex-direction:column; gap:.55rem; }
.footer-contact p { font-size:.85rem; color:rgba(255,255,255,.45); }
.footer-bottom {
  padding-top:1.5rem; display:flex; align-items:center; justify-content:space-between;
  gap:1rem; flex-wrap:wrap; font-size:.8rem; color:rgba(255,255,255,.4);
}
.footer-links { display:flex; align-items:center; gap:1.1rem; flex-wrap:wrap; }
.footer-links > a { color:rgba(255,255,255,.5); transition:color .2s; }
.footer-links > a:hover { color:var(--accent-lt); }
.footer-sep { color:rgba(255,255,255,.25); }
.footer-lapcorp { font-size:.72rem; color:rgba(255,255,255,.25) !important; letter-spacing:.01em; }
.footer-lapcorp strong { font-weight:600; color:rgba(255,255,255,.38); }
.footer-lapcorp:hover { color:var(--accent-lt) !important; }
.footer-lapcorp:hover strong { color:var(--accent-lt); }
.footer-lapcorp-block { display:flex; align-items:center; gap:.6rem; }
.footer-lc-logo { height:22px; width:auto; opacity:.45; transition:opacity .2s; }
.footer-lapcorp-block:hover .footer-lc-logo { opacity:.75; }
.footer-lc-lines { display:flex; flex-direction:column; gap:.15rem; }

/* ══ BACK TO TOP ════════════════════════════════════════════════════════════ */
.back-to-top {
  position:fixed; bottom:2rem; right:2rem; z-index:900;
  width:44px; height:44px; border-radius:50%;
  background:var(--accent); color:#fff; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .3s ease, visibility .3s ease, transform .3s ease, background .3s ease;
  box-shadow:0 8px 22px rgba(27,135,201,.4);
}
.back-to-top svg { stroke:#fff; }
.back-to-top.visible { opacity:1; visibility:visible; transform:none; }
.back-to-top:hover { background:var(--accent-lt); }

/* ══ AOS ════════════════════════════════════════════════════════════════════ */
[data-aos] { opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
[data-aos].aos-in { opacity:1; transform:none; }

/* ══ LEGAL PAGE ═════════════════════════════════════════════════════════════ */
.legal-page { max-width:820px; margin:0 auto; padding:8rem 1.5rem 5rem; }
.legal-page h1 { margin-bottom:2rem; }
.legal-page h2 { font-size:1.45rem; margin:2.6rem 0 .9rem; scroll-margin-top:100px; }
.legal-page h3 { font-size:1.05rem; margin:1.6rem 0 .5rem; }
.legal-page h4 { font-size:.98rem; margin:1.25rem 0 .4rem; font-weight:600; }
.legal-page p, .legal-page li { font-size:.95rem; color:var(--text); margin-bottom:.7rem; }
.legal-page ul { padding-left:1.3rem; }
.legal-page a { color:var(--accent); }
.legal-meta { font-size:.88rem; color:var(--muted, #667); margin-top:-.4rem; margin-bottom:1.4rem; }
.legal-back { display:inline-block; margin-bottom:2rem; font-size:.88rem; color:var(--accent); font-weight:600; }

/* ══ RESPONSIVE ═════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .contact-layout { grid-template-columns:1fr; }
  .footer-top { grid-template-columns:1fr; gap:2rem; }
}
@media (max-width: 768px) {
  .hamburger { display:flex; }
  .nav-links {
    position:fixed; top:62px; right:0; bottom:0; width:min(78vw, 320px);
    background:var(--white); flex-direction:column; align-items:flex-start;
    padding:2rem 1.6rem; gap:1.2rem; box-shadow:-10px 0 30px rgba(0,0,0,.12);
    transform:translateX(100%); transition:transform .3s ease, visibility .3s;
    visibility:hidden;
  }
  .nav-links.open { transform:none; visibility:visible; }
  .form-row { grid-template-columns:1fr; }
  .gallery-ph.wide { grid-column:span 1; }
  .rdv-callout { flex-direction:column; text-align:center; }
}

/* ══════════════════════════════════════════════════════════════════════════
   ACCESSIBILITY, INPUT & MOTION POLISH
   ══════════════════════════════════════════════════════════════════════════ */

/* Focus rings — visible for keyboard, absent on mouse click */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:3px;
  border-radius:6px;
}
.section-dark a:focus-visible,
.section-dark button:focus-visible,
#footer a:focus-visible {
  outline-color:var(--accent-lt);
}

/* Skip link */
.skip-link {
  position:absolute; left:-9999px; top:0; z-index:2000;
  background:var(--accent); color:#fff; font-weight:600;
  padding:.75rem 1.25rem; border-radius:0 0 10px 0;
}
.skip-link:focus { left:0; }

/* Fixed navbar must not cover anchored headings */
section[id], .faq-item { scroll-margin-top:120px; }

/* Touch behaviour */
a, button, summary, .lang-btn, .faq-item summary {
  touch-action:manipulation;
  -webkit-tap-highlight-color:rgba(27,135,201,.18);
}

/* Long-content safety */
h1, h2, h3, h4 { text-wrap:balance; }
.hero-desc, .section-desc, .faq-item p { text-wrap:pretty; }
.feature-item, .contact-item, .lang-chip, .step-card, .zone-row { min-width:0; }
.feature-item p, .contact-item span, .footer-contact a { min-width:0; overflow-wrap:anywhere; }

/* Numeric alignment */
.stat-num, .zone-num { font-variant-numeric:tabular-nums; }

/* Inline form errors */
.field-error {
  display:none; margin-top:.35rem; font-size:.76rem; font-weight:600; color:#C4362C;
}
.form-group.has-error .field-error { display:block; }
.form-group.has-error input,
.form-group.has-error textarea { border-color:#C4362C; background:#FEF6F5; }

/* Safe areas for full-bleed fixed chrome */
#versionBanner { padding-left:max(1rem, env(safe-area-inset-left)); padding-right:max(2.6rem, env(safe-area-inset-right)); }
#footer { padding-bottom:max(1.5rem, env(safe-area-inset-bottom)); }
.back-to-top { right:max(2rem, env(safe-area-inset-right)); bottom:max(2rem, env(safe-area-inset-bottom)); }

/* Mobile drawer should not chain its scroll to the page */
@media (max-width:768px) {
  .nav-links { overscroll-behavior:contain; }
}

/* Respect reduced-motion preference */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  html { scroll-behavior:auto; }
  [data-aos] { opacity:1 !important; transform:none !important; }
  .hero-scroll span { animation:none; }
  .loader-bar span, .zb-pulse, .zmap-links line { animation:none; }
}

/* ══════════════════════════════════════════════════════════════════════════
   MOBILE REWORK
   Fixed-chrome heights come from main.js (--banner-h / --chrome-h): the
   version banner wraps to 1–3 lines depending on language and screen width.
   ══════════════════════════════════════════════════════════════════════════ */

.no-loader #loader { display:none; }
body.has-banner #navbar { top:var(--banner-h, 34px); }
.mobile-bar, .nav-backdrop { display:none; }

@media (max-width: 768px) {
  /* ── Header: slimmer, 44px tap targets ── */
  #versionBanner { font-size:.7rem; line-height:1.35; padding-top:.4rem; padding-bottom:.4rem; }
  .version-banner-close { top:0; bottom:0; right:0; width:44px; padding:0; transform:none; border-radius:0; }
  #navbar { background:#fff; }
  #navbar::before { display:none; }
  .nav-inner { padding:.35rem .75rem .35rem 1rem; gap:.5rem; }
  .nav-brand { gap:.35rem; min-width:0; }
  .nav-logo-img { height:36px; }
  .nav-flags { gap:0; }
  .nav-flags .lang-btn { width:32px; height:44px; }
  .hamburger { width:44px; height:44px; align-items:center; justify-content:center; padding:0; flex:0 0 auto; }

  /* ── Drawer ── */
  body .nav-links, body.has-banner .nav-links {
    top:var(--chrome-h, 60px); bottom:0; width:min(86vw, 340px);
    padding:.6rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom));
    gap:0; overflow-y:auto; align-items:stretch; background:#fff;
  }
  .nav-links a {
    display:flex; align-items:center; min-height:54px; font-size:1.05rem;
    border-bottom:1px solid rgba(0,0,0,.07);
  }
  .nav-links .btn-nav { margin-top:1.4rem; min-height:52px; justify-content:center; border-bottom:0; font-size:1rem; }
  .nav-backdrop {
    display:block; position:fixed; inset:0; z-index:999;
    background:rgba(20,21,23,.45); opacity:0; visibility:hidden;
    transition:opacity .3s ease, visibility .3s ease;
  }
  body.nav-open .nav-backdrop { opacity:1; visibility:visible; }
  body.nav-open { overflow:hidden; }
  section[id], .faq-item { scroll-margin-top:calc(var(--chrome-h, 60px) + 12px); }

  /* ── Hero ── */
  #hero, body.has-banner #hero { min-height:0; padding:calc(var(--chrome-h, 60px) + 2.25rem) 1.25rem 3rem; }
  h1 { font-size:clamp(1.85rem, 8.2vw, 2.35rem); }
  .hero-eyebrow { font-size:.64rem; letter-spacing:.16em; padding:.4rem .85rem; margin-bottom:1rem; }
  .hero-desc { font-size:1rem; margin:1.1rem auto 1.8rem; }
  .hero-cta { flex-direction:column; align-items:stretch; gap:.7rem; }
  .hero-cta .btn-primary, .hero-cta .btn-ghost { justify-content:center; min-height:52px; }
  .hero-note { margin-top:1.5rem; padding:.7rem 1rem; border-radius:16px; font-size:.82rem; }
  .hero-scroll { display:none; }

  /* ── Rhythm ── */
  .section { padding:3.5rem 0; }
  .container { padding:0 1.25rem; }
  .section-header { margin-bottom:2rem; }
  h2 { font-size:clamp(1.55rem, 6.6vw, 1.9rem); }
  .eyebrow { font-size:.68rem; letter-spacing:.18em; }
  [data-aos] { transform:translateY(14px); }

  /* ── Feature strip: 2 columns ── */
  .feature-strip-inner { grid-template-columns:1fr 1fr; gap:1rem .75rem; padding:1.4rem 1.25rem; }
  .feature-item { gap:.6rem; }
  .feature-item:last-child { grid-column:1 / -1; }
  .feature-icon-wrap { flex-basis:38px; height:38px; border-radius:10px; }
  .ficon { width:19px; height:19px; }
  .feature-item p { font-size:.84rem; }
  .feature-item p span { font-size:.74rem; }

  /* ── Stats: 2 × 2 ── */
  .stats-strip { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem .75rem; padding:1.8rem 1.25rem; }
  .stat-divider { display:none; }
  .stat-num { font-size:2rem; }
  .stat-label { font-size:.7rem; letter-spacing:.08em; }

  /* ── Services: icon beside text ── */
  .services-grid { grid-template-columns:1fr; gap:.8rem; }
  .service-card { display:grid; grid-template-columns:44px 1fr; column-gap:1rem; align-items:start; padding:1.15rem 1.1rem; border-radius:16px; }
  .service-card:hover { transform:none; }
  .service-icon-wrap { grid-row:1 / span 2; width:44px; height:44px; margin:0; border-radius:12px; }
  .service-card .sicon { width:22px; height:22px; }
  .service-card h3 { font-size:1.02rem; margin:.15rem 0 .3rem; }
  .service-card p { font-size:.88rem; }

  /* ── Steps: vertical list, number as marker ── */
  .steps-wrap { flex-direction:column; align-items:stretch; gap:.8rem; margin-top:2.25rem; }
  .step-arrow, .step-icon-wrap { display:none; }
  .step-card { flex:none; max-width:none; display:grid; grid-template-columns:36px 1fr; column-gap:.95rem; align-items:start; text-align:left; padding:1.1rem; border-radius:16px; }
  .step-num { position:static; transform:none; grid-row:1 / span 2; width:36px; height:36px; font-size:.95rem; }
  .step-card h3 { font-size:1rem; margin:.3rem 0 .2rem; }
  .step-card p { font-size:.86rem; }
  .rdv-callout { margin-top:2rem; padding:1.6rem 1.25rem; }
  .rdv-callout h3 { font-size:1.15rem; }
  .rdv-callout .btn-primary { width:100%; justify-content:center; min-height:52px; }

  /* ── Zones: base department first, full width ── */
  .zones-layout { grid-template-columns:1fr; gap:1.8rem; }
  .zones-map { max-width:560px; margin:0 auto; padding:0; }
  .zones-map::before { aspect-ratio:1 / 1; }
  .zones-list { grid-template-columns:1fr; gap:.7rem; }
  .zone-row, .zone-row.featured { min-height:0; grid-column:auto; padding:.85rem; gap:.8rem; border-radius:8px; }
  .zone-row:hover { transform:none; }
  .zone-num { width:42px; height:42px; font-size:1.18rem; }
  .zone-name { font-size:.92rem; }
  .zone-towns { font-size:.72rem; }
  .zone-base { font-size:.55rem; letter-spacing:.12em; }
  .zones-cta { margin-top:2rem; font-size:.84rem; }

  /* ── Partners: 2 columns ── */
  .partners-grid { grid-template-columns:1fr 1fr; gap:.75rem; }
  .partner-card { padding:1.25rem .6rem 1.1rem; border-radius:16px; }
  .partner-card:hover { transform:none; }
  .partner-card.pending { grid-column:1 / -1; }
  .partner-logo { height:40px; max-width:90%; }
  .partner-tag { font-size:.64rem; letter-spacing:.1em; }
  .partners-note { margin-top:1.5rem; font-size:.86rem; }

  /* ── Placeholders: keep them short ── */
  .manuals-placeholder { padding:2.25rem 1.25rem; }
  .gallery-grid { grid-template-columns:1fr 1fr; grid-auto-rows:120px; gap:.7rem; }
  .gallery-ph.tall { grid-row:span 1; }
  .gallery-ph.wide { grid-column:span 1; }
  .gallery-ph:nth-child(n+5) { display:none; }

  /* ── FAQ ── */
  .faq-item summary { min-height:56px; padding:.95rem 1.1rem; font-size:.95rem; }
  .faq-item p { padding:0 1.1rem 1.1rem; font-size:.9rem; }

  /* ── Contact ── */
  .contact-layout { gap:2rem; }
  .contact-item { min-height:48px; }
  .langs-strip.contact-langs { justify-content:center; border-radius:20px; padding:1rem; gap:.8rem; }
  .lang-chip { min-height:44px; padding:.5rem 1rem; }
  .contact-form { padding:1.4rem 1.1rem; border-radius:16px; }
  /* 16px minimum stops iOS Safari zooming in on focus */
  .form-group input, .form-group textarea { font-size:16px; padding:.8rem .9rem; }
  .contact-form .btn-full { min-height:52px; font-size:1rem; }
  .sms-badge { font-size:.66rem; }

  /* ── Footer ── */
  #footer { padding-top:2.5rem; padding-bottom:calc(6rem + env(safe-area-inset-bottom)); }
  .footer-top { grid-template-columns:1fr; gap:1.5rem; padding-bottom:1.75rem; }
  .footer-logo-img { height:44px; }
  .footer-nav { display:grid; grid-template-columns:1fr 1fr; gap:0 1rem; }
  .footer-nav a, .footer-contact a { padding:.6rem 0; }
  .footer-contact { gap:0; }
  .footer-bottom { flex-direction:column; align-items:flex-start; gap:.75rem; }
  .footer-links { gap:0 1.25rem; }
  .footer-links > a { padding:.6rem 0; }
  .footer-sep { display:none; }
  .footer-lapcorp-block { width:100%; margin-top:.5rem; padding-top:.5rem; border-top:1px solid rgba(255,255,255,.08); }
  .footer-lc-lines { gap:0; }
  .footer-lapcorp { display:block; padding:.6rem 0; }

  /* ── Quick-action bar ── */
  .mobile-bar {
    display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:.5rem;
    position:fixed; left:0; right:0; bottom:0; z-index:950;
    padding:.55rem max(.75rem, env(safe-area-inset-right)) calc(.55rem + env(safe-area-inset-bottom)) max(.75rem, env(safe-area-inset-left));
    background:rgba(255,255,255,.97); border-top:1px solid rgba(0,0,0,.08);
    box-shadow:0 -8px 24px rgba(35,36,39,.10);
    transform:translateY(110%); transition:transform .3s ease;
  }
  .mobile-bar.visible { transform:none; }
  body.nav-open .mobile-bar, body.is-typing .mobile-bar { transform:translateY(110%); }
  .mobile-bar-btn {
    display:flex; align-items:center; justify-content:center; gap:.4rem; min-height:46px;
    border-radius:12px; background:#EEF0F2; color:var(--ink); font-weight:600; font-size:.88rem;
  }
  .mobile-bar-btn .btn-icon { width:18px; height:18px; stroke:var(--accent); }
  .mobile-bar-rdv { background:linear-gradient(120deg, var(--accent), var(--accent-lt)); color:#fff; }
  .mobile-bar-rdv .btn-icon { stroke:#fff; }
  .back-to-top { bottom:calc(5.25rem + env(safe-area-inset-bottom)); right:max(1rem, env(safe-area-inset-right)); }

  /* ── Legal page: its single "back" link stays inline instead of becoming a drawer ── */
  body .nav-links.nav-links-static {
    position:static; transform:none; visibility:visible; width:auto; padding:0;
    background:none; box-shadow:none; flex-direction:row; overflow:visible;
  }
  .nav-links.nav-links-static a { min-height:44px; border-bottom:0; font-size:.9rem; }
  .legal-page { padding:calc(var(--chrome-h, 60px) + 2rem) 1.25rem 3rem; }
}

@media (max-width: 360px) {
  .nav-logo-img { height:32px; }
  .feature-strip-inner { grid-template-columns:1fr; }
  .feature-item:last-child { grid-column:auto; }
  .mobile-bar { grid-template-columns:1fr 1.4fr; }
  .mobile-bar-mail { display:none; }
}

/* ══════════════════════════════════════════════════════════════════════════
   PRICING PLANS — same card language as the A4 leaflet
   ══════════════════════════════════════════════════════════════════════════ */
.plans-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:1.4rem; align-items:start; }
.plan-card {
  position:relative; background:var(--white); border-radius:18px; overflow:hidden;
  border:1px solid rgba(0,0,0,.05); box-shadow:0 4px 18px rgba(35,36,39,.05);
  padding:1.9rem 1.5rem 1.6rem;
  transition:transform .25s, box-shadow .25s, border-color .25s;
}
.plan-card:hover { transform:translateY(-5px); border-color:rgba(27,135,201,.35); box-shadow:0 18px 40px rgba(35,36,39,.12); }
.plan-card::before { content:""; position:absolute; left:0; right:0; top:0; height:4px; background:linear-gradient(90deg, var(--accent), var(--accent-lt)); }
.plan-card.plus::before, .plan-card.premium::before { background:linear-gradient(90deg, var(--accent), var(--accent-lt)); }
.plan-card.premium.plus::before { background:linear-gradient(90deg, var(--blue), var(--accent), var(--accent-lt)); }
.plan-head { display:flex; flex-direction:column; align-items:flex-start; gap:.6rem; }
.plan-name {
  display:flex; align-items:center; font-size:.92rem; font-weight:700;
  letter-spacing:.2em; text-transform:uppercase; color:var(--ink);
}
.plus-badge {
  display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto;
  width:22px; height:22px; margin-left:.5rem; border-radius:50%; letter-spacing:0;
  background:var(--accent); color:#fff; box-shadow:0 2px 6px rgba(27,135,201,.35);
}
.plus-badge svg { width:13px; height:13px; stroke:currentColor; fill:none; }
.plan-tags { display:flex; gap:.4rem; flex-wrap:wrap; min-height:1.35rem; }
.plan-tag {
  font-size:.66rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; line-height:1.3;
  color:var(--accent); background:rgba(27,135,201,.10); padding:.25rem .7rem; border-radius:50px;
}
.plan-price { margin-top:1rem; display:flex; align-items:baseline; gap:.4rem; flex-wrap:wrap; color:var(--ink); }
.plan-amount { font-size:2.1rem; font-weight:700; line-height:1; font-variant-numeric:tabular-nums; letter-spacing:-.01em; }
.plan-cur { font-size:.95rem; font-weight:700; }
.plan-vat { margin-left:auto; font-size:.74rem; color:var(--text-soft); letter-spacing:.04em; }
.plan-features { list-style:none; margin-top:1.1rem; padding-top:1rem; border-top:1px solid rgba(0,0,0,.08); display:grid; gap:.7rem; }
.plan-features li { display:flex; gap:.6rem; font-size:.9rem; line-height:1.35; color:var(--text); }
.plan-check { width:16px; height:16px; flex:0 0 auto; margin-top:.15rem; stroke:var(--accent); stroke-width:2.6; fill:none; }
.plan-features .strong { color:var(--ink); font-weight:700; }
.plans-note { margin-top:1.8rem; text-align:center; font-size:.92rem; color:var(--text-soft); }
.plans-note strong { color:var(--ink); }
.plans-footnote { margin:.9rem auto 0; max-width:780px; text-align:center; font-size:.76rem; line-height:1.5; color:var(--text-soft); }
.plans-footnote a { color:var(--accent); }

@media (max-width: 768px) {
  .plans-grid { grid-template-columns:1fr; gap:.9rem; }
  .plan-card { padding:1.3rem 1.2rem 1.2rem; border-radius:16px; }
  .plan-card:hover { transform:none; }
  .plan-amount { font-size:1.9rem; }
  .plan-features li { font-size:.88rem; }
  .plans-note { margin-top:1.4rem; font-size:.88rem; text-align:left; }
  .plans-footnote { text-align:left; font-size:.74rem; }
}

/* ══ CONTACT FORM — sending states ══════════════════════════════════════════ */
.hp-field { position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; }
.contact-form { position:relative; }
.contact-form button[type="submit"].is-busy { opacity:.75; cursor:progress; }
.contact-form button[type="submit"].is-busy::after {
  content:""; width:14px; height:14px; margin-left:.6rem; border-radius:50%;
  border:2px solid rgba(255,255,255,.45); border-top-color:#fff;
  animation:formSpin .8s linear infinite;
}
.form-success:focus { outline:none; }
.form-error {
  margin-top:1rem; padding:.9rem 1rem; border-radius:9px;
  background:#FEF6F5; color:#A3291F; border:1px solid rgba(196,54,44,.25);
  font-weight:600; font-size:.9rem; line-height:1.45; text-align:center;
}
.form-error.hidden { display:none; }
.form-error-link { color:var(--accent); text-decoration:underline; text-underline-offset:3px; white-space:nowrap; }
@keyframes formSpin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .contact-form button[type="submit"].is-busy::after { animation:none; } }
