/* ────────────────────────────────────────────────────────────────
   Galifar — Refonte 2026
   Light dominant · Space Grotesk + Inter · Single green accent
   ──────────────────────────────────────────────────────────────── */

/* Space Grotesk from the project font files */
@font-face { font-family:'Space Grotesk'; src:url('fonts/SpaceGrotesk-Light.ttf') format('truetype'); font-weight:300; font-style:normal; font-display:swap; }
@font-face { font-family:'Space Grotesk'; src:url('fonts/SpaceGrotesk-Regular.ttf') format('truetype'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:'Space Grotesk'; src:url('fonts/SpaceGrotesk-Medium.ttf') format('truetype'); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:'Space Grotesk'; src:url('fonts/SpaceGrotesk-SemiBold.ttf') format('truetype'); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:'Space Grotesk'; src:url('fonts/SpaceGrotesk-Bold.ttf') format('truetype'); font-weight:700; font-style:normal; font-display:swap; }

:root {
  /* Brand */
  --green-50:#effaf4; --green-100:#d6f0e2; --green-200:#aee0c5;
  --green-300:#82cca5; --green-400:#5bac8b; --green-500:#4a9577;
  --green-600:#3a7a61; --green-700:#2f604c; --green-800:#25483a;

  --ink-1000:#000;
  --ink-900:#0e1413;
  --ink-800:#1a2220;
  --ink-700:#2a3431;

  --paper:#ffffff;
  --paper-2:#f7f8f6;
  --paper-3:#eef0ed;
  --line:#dde1dc;
  --line-2:#c6cbc4;
  --mute:#6b7470;
  --mute-2:#8a928d;

  /* Semantic — driven by tweaks */
  --accent:var(--green-400);
  --accent-ink:var(--green-700);
  --accent-soft:var(--green-100);
  --bg:var(--paper);
  --bg-soft:var(--paper-2);
  --bg-invert:var(--ink-900);
  --fg:var(--ink-900);
  --fg-soft:var(--ink-800);
  --fg-mute:var(--mute);
  --border:var(--line);
  --border-strong:var(--line-2);

  --font-display:'Space Grotesk','Helvetica Neue',Helvetica,Arial,sans-serif;
  --font-body:'Inter','Helvetica Neue',Helvetica,Arial,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  --r-sm:8px; --r-md:12px; --r-lg:18px; --r-xl:24px; --r-pill:999px;
  --ease:cubic-bezier(0.22,1,0.36,1);

  --container:1240px;
  --section-pad:120px; /* desktop */
}

/* ───── Reset ───── */
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; overflow-x:hidden; }
body { overflow-x:hidden; }
body {
  margin:0;
  font-family:var(--font-body);
  color:var(--fg);
  background:var(--bg);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg,video { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
button { font:inherit; cursor:pointer; }

::selection { background:var(--accent); color:var(--ink-900); }

/* ───── Container & sections ───── */
.container { max-width:var(--container); margin:0 auto; padding:0 32px; }
@media (max-width:720px) { .container { padding:0 20px; } }

section { padding:var(--section-pad) 0; }
section.compact { padding:80px 0; }
section.ink { background:var(--bg-invert); color:var(--paper); }
section.ink .eyebrow { color:var(--green-300); }
section.ink .fg-mute { color:#a0a8a4; }

@media (max-width:720px) {
  :root { --section-pad:80px; }
}
@media (max-width:520px) {
  :root { --section-pad:64px; }
}

/* ====== Responsive polish (phone / tablet / desktop) ====== */
@media (max-width:1180px) {
  :root { --container:1080px; }
}
@media (max-width:1080px) {
  .header .inner { height:84px; }
  .header .logo img { height:56px; }
}
@media (max-width:720px) {
  .container { padding:0 20px; }
  .header .inner { height:72px; }
  .header .logo img { height:44px; }
  .header .btn { padding:8px 14px; font-size:12.5px; }
}
@media (max-width:520px) {
  .header .inner { height:64px; }
  .header .logo img { height:38px; }
  .header .btn { padding:8px 12px; font-size:12px; }
}

/* ───── Eyebrow ───── */
.eyebrow {
  font-family:var(--font-body);
  font-weight:600;
  font-size:12px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--accent-ink);
  display:inline-flex;
  align-items:center;
  gap:14px;
  margin:0 0 28px;
}
.eyebrow::before {
  content:"";
  width:32px; height:1px;
  background:currentColor;
}
.eyebrow.no-rule { gap:0; }
.eyebrow.no-rule::before { display:none; }

/* ───── Display type ───── */
.h1, .h2, .h3 {
  font-family:var(--font-display);
  letter-spacing:-0.025em;
  margin:0;
  color:var(--fg);
  text-wrap:balance;
}
.h1 {
  font-weight:700;
  font-size:clamp(40px, 7.8vw, 108px);
  line-height:0.96;
}
.h2 {
  font-weight:700;
  font-size:clamp(30px, 4.4vw, 64px);
  line-height:1.04;
  letter-spacing:-0.025em;
}
.h3 {
  font-weight:600;
  font-size:clamp(22px, 2vw, 28px);
  line-height:1.2;
  letter-spacing:-0.02em;
}

/* Signature italic — Space Grotesk has no italic file → CSS skew + accent */
.h1 em, .h2 em, .em-accent {
  font-style:normal;
  display:inline-block;
  transform:skewX(-8deg);
  color:var(--accent);
  font-weight:700;
}
section.ink .h1 em, section.ink .h2 em { color:var(--green-300); }

/* ───── Lead & body ───── */
.lead {
  font-family:var(--font-body);
  font-weight:400;
  font-size:clamp(17px, 1.4vw, 21px);
  line-height:1.55;
  color:var(--fg-soft);
  max-width:58ch;
  text-wrap:pretty;
}
section.ink .lead { color:#cfd5d1; }
.muted { color:var(--fg-mute); }
.mono { font-family:var(--font-mono); font-size:12px; letter-spacing:0; }

/* ───── Buttons ───── */
.btn {
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 22px;
  border-radius:var(--r-pill);
  font-family:var(--font-body);
  font-weight:600;
  font-size:14.5px;
  line-height:1;
  letter-spacing:-0.005em;
  border:1px solid transparent;
  transition:transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease), color .18s var(--ease);
  white-space:nowrap;
  cursor:pointer;
}
.btn:active { transform:translateY(1px); }
.btn .arrow { transition:transform .22s var(--ease); }
.btn:hover .arrow { transform:translateX(3px); }

.btn-primary {
  background:var(--accent);
  color:var(--ink-900);
  border-color:var(--accent);
}
.btn-primary:hover {
  background:var(--green-500);
  border-color:var(--green-500);
}
.btn-ghost {
  background:transparent;
  color:var(--fg);
  border-color:var(--border-strong);
}
.btn-ghost:hover {
  background:var(--paper-2);
  border-color:var(--ink-900);
}
section.ink .btn-ghost { color:var(--paper); border-color:rgba(255,255,255,0.22); }
section.ink .btn-ghost:hover { background:rgba(255,255,255,0.06); border-color:rgba(255,255,255,0.4); }

.btn-link {
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:600;
  font-size:14px;
  color:var(--accent-ink);
  padding:0;
}
.btn-link:hover { color:var(--green-500); }
.btn-link .arrow { transition:transform .22s var(--ease); }
.btn-link:hover .arrow { transform:translateX(3px); }

/* ───── Header ───── */
.header {
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,255,255,0.85);
  backdrop-filter:saturate(150%) blur(12px);
  -webkit-backdrop-filter:saturate(150%) blur(12px);
  border-bottom:1px solid var(--border);
}
.header .inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  height:100px;
  gap:32px;
}
.header .logo {
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-display); font-weight:700;
  font-size:20px; letter-spacing:-0.02em;
}
.header .logo img { height:72px; width:auto; }
.header nav {
  display:flex; align-items:center; gap:28px;
  font-size:14px; font-weight:500;
}
.header nav a { color:var(--fg-soft); transition:color .18s var(--ease); }
.header nav a:hover { color:var(--fg); }
.header nav a.active { color:var(--fg); }
.header .right { display:flex; align-items:center; gap:14px; }
.header .secondary { color:var(--fg-mute); font-size:13.5px; font-weight:500; }
.header .secondary:hover { color:var(--fg); }
.header .btn { padding:10px 18px; font-size:13.5px; }
.burger { display:none; background:none; border:0; padding:8px; color:var(--fg); }
@media (max-width:1080px) {
  .header nav { display:none; }
  .burger { display:block; }
  .header .secondary { display:none; }
  .header .inner { height:84px; }
  .header .logo img { height:56px; }
}
@media (max-width:720px) {
  .header .inner { height:72px; }
  .header .logo img { height:44px; }
}
@media (max-width:520px) {
  .header .inner { height:64px; }
  .header .logo img { height:38px; }
}

/* ───── Hero ───── */
.hero {
  padding:84px 0 var(--section-pad);
  position:relative;
}
.hero .grid {
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(0,0.95fr);
  gap:72px;
  align-items:end;
}
.hero h1 {
  margin:0 0 28px;
  max-width:11ch;
}
.hero .lead { margin-bottom:36px; max-width:42ch; }
.hero .actions { display:flex; flex-wrap:wrap; gap:12px; }

.hero .photo {
  border-radius:var(--r-lg);
  overflow:hidden;
  background:var(--paper-3);
  border:1px solid var(--border);
  aspect-ratio:4/5;
  position:relative;
}
.hero .photo img {
  width:100%; height:100%;
  object-fit:cover;
  transition:transform 8s var(--ease);
}
.hero:hover .photo img { transform:scale(1.03); }
.hero .photo .tag {
  position:absolute;
  left:20px; bottom:20px;
  background:rgba(14,20,19,0.85);
  color:var(--paper);
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:0.06em;
  padding:8px 12px;
  border-radius:var(--r-pill);
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.hero .photo .tag::before {
  content:"";
  width:6px; height:6px; border-radius:50%;
  background:var(--green-300);
  box-shadow:0 0 0 0 rgba(130,204,165,0.6);
  animation:pulse 2.2s var(--ease) infinite;
}
@keyframes pulse {
  0% { box-shadow:0 0 0 0 rgba(130,204,165,0.6); }
  70% { box-shadow:0 0 0 10px rgba(130,204,165,0); }
  100% { box-shadow:0 0 0 0 rgba(130,204,165,0); }
}

@media (max-width:980px) {
  .hero { padding:48px 0 80px; }
  .hero .grid { grid-template-columns:1fr; gap:40px; }
  .hero .photo { aspect-ratio:4/3; order:2; }
}

/* ───── KPI strip ───── */
.kpi-strip {
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  background:var(--paper-2);
}
.kpi-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  align-items:stretch;
}
.kpi {
  padding:48px 32px;
  border-right:1px solid var(--border);
  position:relative;
}
.kpi:last-child { border-right:0; }
.kpi .label {
  font-family:var(--font-mono);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:0.1em;
  color:var(--accent-ink);
  margin:0 0 14px;
}
.kpi .num {
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(36px, 4.4vw, 68px);
  letter-spacing:-0.04em;
  line-height:1;
  color:var(--fg);
  display:flex;
  align-items:baseline;
  gap:6px;
}
.kpi .num .unit {
  font-size:0.45em;
  font-weight:600;
  color:var(--fg-mute);
  letter-spacing:0;
}
.kpi .sub {
  margin:14px 0 0;
  font-size:14px;
  color:var(--fg-mute);
  line-height:1.45;
}
@media (max-width:980px) {
  .kpi-grid { grid-template-columns:repeat(2,1fr); }
  .kpi { padding:32px 24px; }
  .kpi:nth-child(2) { border-right:0; }
  .kpi:nth-child(1), .kpi:nth-child(2) { border-bottom:1px solid var(--border); }
}
@media (max-width:520px) {
  .kpi-grid { grid-template-columns:1fr; }
  .kpi { border-right:0; border-bottom:1px solid var(--border); padding:28px 20px; }
  .kpi:last-child { border-bottom:0; }
  .kpi .label { font-size:10px; margin-bottom:10px; }
}

/* Tablet section padding */
@media (max-width:1080px) {
  :root { --section-pad:96px; }
}

/* Fleet showcase mobile */
@media (max-width:720px) {
  .fleet-showcase .photo { height:clamp(280px, 90vw, 480px); }
  .fleet-showcase .overlay { padding:64px 20px 28px; }
  .fleet-showcase .caption { font-size:24px; max-width:18ch; }
}

/* Footer compact */
@media (max-width:520px) {
  .footer { padding:56px 0 28px; }
  .footer-grid { gap:28px; margin-bottom:40px; }
  .footer .brand { font-size:28px; }
  .footer .bottom { font-size:11.5px; gap:14px; }
}

/* Hero photo mobile + tag */
@media (max-width:720px) {
  .hero .photo { aspect-ratio:5/4; }
  .hero .photo .tag { left:14px; bottom:14px; font-size:10px; padding:6px 10px; }
}

/* Final CTA form compact */
@media (max-width:720px) {
  .final-cta .ink-meta { gap:20px; font-size:13px; }
  .final-cta .form { padding:24px 20px; }
}

/* ───── Section heads ───── */
.section-head { max-width:780px; margin:0 0 64px; }
.section-head h2 { margin:0 0 20px; }
.section-head .lead { max-width:52ch; }
@media (max-width:720px) {
  .section-head { margin-bottom:40px; }
  .section-head h2 { margin-bottom:14px; }
}

/* ───── Verticales (3 cards) ───── */
.verticals {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.verticals.verticals-4 { grid-template-columns:repeat(4,1fr); }
@media (max-width:1180px) { .verticals.verticals-4 { grid-template-columns:repeat(2,1fr); } }
.vcard {
  background:var(--paper);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:32px;
  display:flex;
  flex-direction:column;
  gap:20px;
  transition:border-color .22s var(--ease), transform .22s var(--ease);
  color:inherit;
  position:relative;
  min-width:0;
}
.vcard:hover {
  border-color:var(--ink-900);
  transform:translateY(-2px);
}
.vcard:hover .vcard-arrow { transform:translateX(4px); color:var(--accent-ink); }
.vcard .glyph {
  width:48px; height:48px;
  display:flex; align-items:center; justify-content:center;
  color:var(--accent-ink);
}
.vcard .glyph svg { width:100%; height:100%; }
.vcard .tag {
  font-family:var(--font-mono);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:0.1em;
  color:var(--fg-mute);
}
.vcard h3 { margin:0; }
.vcard .promise { color:var(--fg-soft); font-size:15.5px; line-height:1.5; margin:0; }
.vcard .stats {
  display:flex; gap:20px;
  margin-top:auto;
  padding-top:20px;
  border-top:1px solid var(--border);
}
.vcard .stat .n {
  font-family:var(--font-display);
  font-weight:700;
  font-size:24px;
  letter-spacing:-0.02em;
  color:var(--fg);
  line-height:1;
}
.vcard .stat .l {
  font-size:12px;
  color:var(--fg-mute);
  margin-top:4px;
}
.vcard .more {
  display:inline-flex; align-items:center; gap:8px;
  font-size:13.5px;
  font-weight:600;
  color:var(--accent-ink);
  margin-top:-4px;
}
.vcard-arrow { display:inline-block; transition:transform .22s var(--ease), color .22s var(--ease); }

@media (max-width:980px) {
  .verticals,
  .verticals.verticals-4 { grid-template-columns:1fr; }
}

/* ───── Comparatif ───── */
.compare-wrap { border:1px solid var(--border); border-radius:var(--r-lg); overflow:hidden; background:var(--paper); }
.compare { width:100%; border-collapse:collapse; }
.compare th, .compare td {
  text-align:left;
  padding:20px 24px;
  font-size:15px;
  border-bottom:1px solid var(--border);
}
.compare thead th {
  background:var(--paper-2);
  font-family:var(--font-body);
  font-weight:600;
  font-size:13px;
  color:var(--fg-mute);
  vertical-align:bottom;
  padding:24px 24px 22px;
}
.compare thead th .name {
  font-family:var(--font-display);
  font-weight:600;
  font-size:18px;
  color:var(--fg);
  display:block;
  letter-spacing:-0.01em;
  margin-bottom:4px;
}
.compare thead th .meta { font-weight:400; }
.compare thead th.us {
  background:var(--ink-900);
  color:var(--paper);
  position:relative;
}
.compare thead th.us .name { color:var(--paper); }
.compare thead th.us::after {
  content:"notre offre";
  position:absolute;
  top:14px; right:14px;
  background:var(--accent);
  color:var(--ink-900);
  font-family:var(--font-body);
  font-size:10px;
  font-weight:600;
  letter-spacing:0.08em;
  text-transform:uppercase;
  padding:4px 8px;
  border-radius:var(--r-pill);
}
.compare tbody td:first-child {
  font-weight:600;
  color:var(--fg);
  font-family:var(--font-display);
  font-size:15px;
  letter-spacing:-0.01em;
}
.compare td.us {
  background:var(--ink-900);
  color:var(--paper);
  font-weight:600;
}
.compare td.us .pill {
  display:inline-flex; align-items:center; gap:6px;
  color:var(--green-300);
  white-space:nowrap;
}
.compare td.bad { color:var(--mute-2); }
.compare tbody tr { transition:background .15s var(--ease); }
.compare tbody tr:hover { background:rgba(91,172,139,0.04); }
.compare tbody tr:hover td.us { background:#1a2220; }
.compare tbody tr:last-child td { border-bottom:0; }
.compare-note {
  margin-top:14px;
  font-size:12px;
  color:var(--fg-mute);
}

/* Compare mobile cards */
.compare-cards { display:none; }
@media (max-width:860px) {
  .compare-wrap { display:none; }
  .compare-cards {
    display:flex;
    gap:16px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    padding:0 20px 8px;
    margin:0 -20px;
    -webkit-overflow-scrolling:touch;
  }
  .compare-cards::-webkit-scrollbar { display:none; }
  .ccard {
    flex:0 0 86%;
    scroll-snap-align:start;
    background:var(--paper);
    border:1px solid var(--border);
    border-radius:var(--r-lg);
    padding:24px;
  }
  .ccard.us { background:var(--ink-900); color:var(--paper); border-color:var(--ink-900); }
  .ccard.us .ccard-row { border-bottom-color:rgba(255,255,255,0.08); }
  .ccard.us .ccard-row .v { color:var(--green-300); }
  .ccard-head .name { font-family:var(--font-display); font-weight:600; font-size:20px; letter-spacing:-0.02em; }
  .ccard-head .meta { font-size:12px; color:var(--fg-mute); margin-top:4px; }
  .ccard.us .ccard-head .meta { color:#a0a8a4; }
  .ccard-head .badge {
    display:inline-block; margin-top:10px;
    background:var(--accent); color:var(--ink-900);
    font-size:10px; font-weight:600; letter-spacing:0.08em;
    text-transform:uppercase;
    padding:4px 10px; border-radius:var(--r-pill);
  }
  .ccard-rows { margin-top:18px; }
  .ccard-row {
    display:flex; justify-content:space-between; align-items:baseline;
    padding:12px 0;
    border-bottom:1px solid var(--border);
    font-size:14px;
  }
  .ccard-row:last-child { border-bottom:0; }
  .ccard-row .k { color:var(--fg-mute); }
  .ccard.us .ccard-row .k { color:#a0a8a4; }
  .ccard-row .v { font-weight:600; color:var(--fg); }
  .compare-dots { display:flex; gap:6px; justify-content:center; margin-top:16px; }
  .compare-dots span { width:6px; height:6px; border-radius:50%; background:var(--border-strong); }
  .compare-dots span.on { background:var(--ink-900); width:20px; border-radius:3px; }
}

/* ───── Vinted case ───── */
.case-grid {
  display:grid;
  grid-template-columns:1.15fr 1fr;
  gap:56px;
  align-items:center;
}
.case-grid .photo {
  border-radius:var(--r-lg);
  overflow:hidden;
  aspect-ratio:5/4;
  background:var(--paper-3);
}
.case-grid .photo img { width:100%; height:100%; object-fit:cover; }
.case-list { list-style:none; padding:0; margin:0 0 32px; }
.case-list li {
  display:grid;
  grid-template-columns:60px 1fr;
  align-items:baseline;
  gap:16px;
  padding:18px 0;
  border-bottom:1px solid var(--border);
}
.case-list li .n {
  font-family:var(--font-mono);
  font-size:11px;
  color:var(--accent-ink);
  letter-spacing:0.08em;
}
.case-list li .t strong {
  font-family:var(--font-display);
  font-weight:700;
  font-size:18px;
  letter-spacing:-0.01em;
  color:var(--fg);
  display:block;
  margin-bottom:2px;
}
.case-list li .t span { color:var(--fg-mute); font-size:14px; }

@media (max-width:980px) {
  .case-grid { grid-template-columns:1fr; gap:32px; }
}

/* ───── Ressources ───── */
.resources {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.rcard {
  display:flex; flex-direction:column;
  background:var(--paper);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:28px;
  gap:14px;
  color:inherit;
  transition:border-color .22s var(--ease), transform .22s var(--ease);
}
.rcard:hover { border-color:var(--ink-900); transform:translateY(-2px); }
.rcard .tag { font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:0.1em; color:var(--fg-mute); }
.rcard h3 { margin:0; font-family:var(--font-display); font-weight:600; font-size:20px; letter-spacing:-0.02em; line-height:1.25; }
.rcard p { margin:0; color:var(--fg-soft); font-size:14.5px; }
.rcard .more { margin-top:auto; padding-top:10px; font-size:13px; font-weight:600; color:var(--accent-ink); display:inline-flex; gap:6px; align-items:center; }
@media (max-width:860px) { .resources { grid-template-columns:1fr; } }

/* ───── FAQ ───── */
.faq { max-width:760px; margin:0 auto; }
.faq details {
  border-bottom:1px solid var(--border);
  padding:24px 0;
  transition:padding .2s var(--ease);
}
.faq details[open] { padding:28px 0 24px; }
.faq summary {
  list-style:none;
  cursor:pointer;
  display:flex; justify-content:space-between; align-items:center;
  gap:24px;
  font-family:var(--font-display);
  font-weight:600;
  font-size:clamp(18px, 1.7vw, 22px);
  letter-spacing:-0.015em;
  color:var(--fg);
}
.faq summary::-webkit-details-marker { display:none; }
.faq summary .plus {
  flex:0 0 28px; width:28px; height:28px;
  border:1px solid var(--border-strong);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  transition:transform .22s var(--ease), border-color .22s var(--ease), background .22s var(--ease);
}
.faq summary .plus svg { width:12px; height:12px; }
.faq details[open] summary .plus { transform:rotate(45deg); background:var(--ink-900); border-color:var(--ink-900); color:var(--paper); }
.faq p {
  margin:16px 0 0;
  color:var(--fg-soft);
  font-size:15.5px;
  line-height:1.6;
  max-width:60ch;
}

/* ───── Final CTA ───── */
.final-cta {
  background:var(--ink-900);
  color:var(--paper);
}
.final-cta .grid {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:72px;
  align-items:start;
}
.final-cta h2 { color:var(--paper); margin-bottom:20px; }
.final-cta .lead { color:#cfd5d1; max-width:42ch; margin-bottom:32px; }
.final-cta .ink-meta {
  margin-top:48px;
  padding-top:32px;
  border-top:1px solid rgba(255,255,255,0.12);
  display:flex; gap:32px; flex-wrap:wrap;
  font-size:13.5px; color:#a0a8a4;
}
.final-cta .ink-meta strong { color:var(--paper); font-weight:600; display:block; margin-bottom:2px; }

.form {
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.1);
  border-radius:var(--r-lg);
  padding:32px;
}
.form .field { display:block; margin-bottom:18px; }
.form .field span {
  display:block;
  font-size:12px; font-weight:600;
  letter-spacing:0.08em; text-transform:uppercase;
  color:#a0a8a4;
  margin-bottom:8px;
}
.form input, .form select {
  width:100%;
  background:rgba(255,255,255,0.03);
  border:1px solid rgba(255,255,255,0.14);
  border-radius:10px;
  padding:14px 16px;
  color:var(--paper);
  font-family:var(--font-body);
  font-size:15px;
  transition:border-color .18s var(--ease), background .18s var(--ease);
}
.form input::placeholder { color:#6c7470; }
.form input:focus, .form select:focus {
  outline:0;
  border-color:var(--accent);
  background:rgba(91,172,139,0.06);
}
.form select { appearance:none; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%23a0a8a4' stroke-width='1.5' fill='none' stroke-linecap='round'/></svg>"); background-repeat:no-repeat; background-position:right 16px center; padding-right:42px; }
.form .btn-primary { width:100%; justify-content:center; padding:16px 22px; }
.form .small { font-size:12px; color:#8b938e; margin:14px 0 0; }
.form .small a { color:var(--green-300); }

@media (max-width:980px) {
  .final-cta .grid { grid-template-columns:1fr; gap:40px; }
}

/* ───── Footer ───── */
.footer {
  background:var(--ink-900);
  color:#c2c7c4;
  border-top:1px solid rgba(255,255,255,0.06);
  padding:80px 0 32px;
}
.footer-grid {
  display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr;
  gap:56px;
  margin-bottom:64px;
}
.footer h4 {
  margin:0 0 18px;
  font-family:var(--font-body);
  font-weight:600;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:0.12em;
  color:var(--paper);
}
.footer .col a {
  display:block;
  padding:6px 0;
  font-size:14.5px;
  color:#a0a8a4;
  transition:color .18s var(--ease);
}
.footer .col a:hover { color:var(--paper); }
.footer .brand {
  font-family:var(--font-display);
  font-weight:700;
  font-size:36px;
  letter-spacing:-0.025em;
  color:var(--paper);
  display:inline-block;
  transform:skewX(-8deg);
  margin-bottom:18px;
}
.footer .brand-desc { font-size:14.5px; color:#a0a8a4; max-width:36ch; margin-bottom:24px; }
.footer .ig {
  display:inline-flex; align-items:center; gap:8px;
  border:1px solid rgba(255,255,255,0.14);
  border-radius:var(--r-pill);
  padding:8px 14px;
  font-size:13px;
  color:#cfd5d1;
  transition:border-color .18s var(--ease), color .18s var(--ease);
}
.footer .ig:hover { border-color:var(--accent); color:var(--paper); }
.footer .bottom {
  padding-top:32px;
  border-top:1px solid rgba(255,255,255,0.08);
  display:flex; justify-content:space-between; align-items:center; gap:24px;
  font-size:12.5px;
  color:#7a8280;
  flex-wrap:wrap;
}
.footer .legal-row { display:flex; gap:18px; }
.footer .legal-row a { color:#7a8280; }
.footer .legal-row a:hover { color:var(--paper); }
@media (max-width:860px) {
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
  .footer .brand-col { grid-column:1 / -1; }
}

/* ───── Reveal animation ───── */
.reveal { opacity:0; transform:translateY(12px); transition:opacity .5s var(--ease), transform .5s var(--ease); }
.reveal.in { opacity:1; transform:none; }
.reveal[data-d="1"] { transition-delay:.08s; }
.reveal[data-d="2"] { transition-delay:.16s; }
.reveal[data-d="3"] { transition-delay:.24s; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity:1; transform:none; transition:none; }
  .hero .photo img { transition:none; }
}

/* ───── Wave divider ───── */
.wave {
  display:block;
  width:100%; height:64px;
  color:var(--accent);
  opacity:.18;
}
.wave svg { width:100%; height:100%; }

/* ───── Tweak-driven density ───── */
:root[data-density="cozy"] { --section-pad:88px; }
:root[data-density="cozy"] .hero { padding:64px 0 88px; }
:root[data-density="cozy"] .section-head { margin-bottom:48px; }

/* ───── Palette tweaks (applied via data-palette on :root) ───── */
:root[data-palette="ink"] {
  /* navy/ink dominant variant — keeps green accent */
  --bg:var(--ink-900);
  --bg-soft:#13191a;
  --bg-invert:#0a0f0f;
  --fg:#f1f3f0;
  --fg-soft:#c2c7c4;
  --fg-mute:#8b938e;
  --border:rgba(255,255,255,0.10);
  --border-strong:rgba(255,255,255,0.22);
  --paper-2:#13191a;
  --paper-3:#1a2220;
}
:root[data-palette="ink"] body { background:var(--bg); color:var(--fg); }
:root[data-palette="ink"] .header { background:rgba(14,20,19,0.78); border-bottom-color:rgba(255,255,255,0.08); }
:root[data-palette="ink"] .header nav a { color:#c2c7c4; }
:root[data-palette="ink"] .header nav a:hover { color:#fff; }
:root[data-palette="ink"] .kpi-strip { background:#13191a; border-color:var(--border); }
:root[data-palette="ink"] .vcard { background:#13191a; }
:root[data-palette="ink"] .rcard { background:#13191a; }
:root[data-palette="ink"] .ccard { background:#13191a; border-color:var(--border); }
:root[data-palette="ink"] .ccard .ccard-row .v { color:#f1f3f0; }
:root[data-palette="ink"] .compare-wrap { background:#13191a; }
:root[data-palette="ink"] .compare thead th { background:#1a2220; color:#a0a8a4; }
:root[data-palette="ink"] .compare thead th .name { color:#fff; }
:root[data-palette="ink"] .h1, :root[data-palette="ink"] .h2, :root[data-palette="ink"] .h3,
:root[data-palette="ink"] .kpi .num, :root[data-palette="ink"] .vcard h3,
:root[data-palette="ink"] .rcard h3, :root[data-palette="ink"] .faq summary,
:root[data-palette="ink"] .compare tbody td:first-child { color:#f1f3f0; }
:root[data-palette="ink"] .footer { background:#0a0f0f; }
:root[data-palette="ink"] section.ink, :root[data-palette="ink"] .final-cta { background:#0a0f0f; }
:root[data-palette="ink"] .vcard:hover, :root[data-palette="ink"] .rcard:hover { border-color:var(--accent); }
:root[data-palette="ink"] .btn-ghost { color:#f1f3f0; border-color:rgba(255,255,255,0.22); }
:root[data-palette="ink"] .btn-ghost:hover { background:rgba(255,255,255,0.06); border-color:#fff; }
:root[data-palette="ink"] .eyebrow { color:var(--green-300); }
:root[data-palette="ink"] .accent-ink-fallback { color:var(--green-300); }

:root[data-palette="amber"] {
  --accent:#e9b949;
  --accent-ink:#946b14;
  --accent-soft:#fff5d6;
}
:root[data-palette="amber"] .h1 em, :root[data-palette="amber"] .h2 em, :root[data-palette="amber"] .em-accent { color:#e9b949; }
:root[data-palette="amber"] section.ink .h1 em, :root[data-palette="amber"] section.ink .h2 em { color:#f5cd6e; }
:root[data-palette="amber"] .btn-primary { background:#e9b949; border-color:#e9b949; color:var(--ink-900); }
:root[data-palette="amber"] .btn-primary:hover { background:#d6a832; border-color:#d6a832; }

/* Accent-ink helper that adapts when palette dims it */
.accent-ink-fallback { color:var(--accent-ink); }
:root[data-palette="ink"] .vcard .more,
:root[data-palette="ink"] .rcard .more,
:root[data-palette="ink"] .case-list li .n,
:root[data-palette="ink"] .btn-link { color:var(--green-300); }

/* ───── Header on ink palette ───── */
:root[data-palette="ink"] .footer { color:#a0a8a4; }

/* ===== Fleet strip — animated road with cargo bike + van ===== */
.fleet-strip {
  position: relative;
  height: 150px;
  overflow: hidden;
  background:
    radial-gradient(ellipse at center, rgba(91,172,139,0.08), transparent 70%),
    var(--bg);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.fleet-strip .road {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 100%;
  pointer-events: none;
}
.fleet-strip .road::after {
  content: "";
  position: absolute;
  bottom: 22px;
  left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, var(--border-strong) 10%, var(--border-strong) 90%, transparent 100%);
}
.fleet-strip .road::before {
  content: "";
  position: absolute;
  bottom: 18px;
  left: 0; right: 0;
  height: 2px;
  background-image: repeating-linear-gradient(90deg, var(--fg-mute-2) 0 8px, transparent 8px 24px);
  opacity: 0.18;
}
.fleet-strip .vehicle {
  position: absolute;
  bottom: 18px;
  will-change: transform;
  animation: gx-roll 30s linear infinite;
}
.fleet-strip .vehicle.v1 { animation-delay: 0s; }
.fleet-strip .vehicle.v2 { animation-delay: -10s; }
.fleet-strip .vehicle.v3 { animation-delay: -20s; }
.fleet-strip .wheel {
  transform-origin: center;
  transform-box: fill-box;
  animation: gx-spin 1.1s linear infinite;
}
:root[data-palette="ink"] .fleet-strip svg circle.wheel,
:root[data-palette="ink"] .fleet-strip svg path[stroke="#0e1413"] { stroke:#c2c7c4; }
:root[data-palette="ink"] .fleet-strip svg text { fill:#0e1413; }
@keyframes gx-roll {
  from { transform: translateX(-30vw); }
  to   { transform: translateX(110vw); }
}
@keyframes gx-spin {
  to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  .fleet-strip .vehicle, .fleet-strip .wheel { animation: none; }
}
@media (max-width:720px) {
  .fleet-strip { height: 120px; }
  .fleet-strip .vehicle { transform: scale(0.78); transform-origin: bottom left; }
}

/* ===== Splash screen (home only, ~1s) ===== */
.gd-splash {
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--ink-900);
  color:#fff;
  pointer-events:none;
  opacity:1;
  animation:gd-splash-auto 1050ms cubic-bezier(.4,0,.2,1) forwards;
}
.gd-splash__inner {
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:22px;
  opacity:0;
  transform:translateY(6px);
  animation:gd-splash-content 800ms cubic-bezier(.2,.8,.2,1) 60ms forwards;
}
.gd-splash__logo {
  width:clamp(120px, 18vw, 200px);
  height:auto;
  display:block;
}
.gd-splash__tagline {
  font-family:var(--font-body);
  font-size:12px;
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.7);
}
@keyframes gd-splash-auto {
  0%   { opacity:1; visibility:visible; }
  60%  { opacity:1; }
  100% { opacity:0; visibility:hidden; }
}
@keyframes gd-splash-content {
  0%   { opacity:0; transform:translateY(6px); }
  35%  { opacity:1; transform:translateY(0); }
  75%  { opacity:1; transform:translateY(0); }
  100% { opacity:0; transform:translateY(-4px); }
}
@media (prefers-reduced-motion: reduce) {
  .gd-splash { animation:none; opacity:0; visibility:hidden; }
  .gd-splash__inner { animation:none; }
}

/* ===== App Galifar announcement banner ===== */
.app-banner {
  position:relative;
  z-index:48;
  background:linear-gradient(90deg, rgba(91,172,139,0.18), rgba(91,172,139,0.06) 60%, transparent);
  border-bottom:1px solid rgba(91,172,139,0.25);
  color:var(--fg);
  font-family:var(--font-body);
  overflow:hidden;
}
.app-banner .inner {
  max-width:var(--container);
  margin:0 auto;
  padding:10px 32px;
  display:flex;
  align-items:center;
  gap:16px;
}
.app-banner .badge {
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:var(--accent);
  color:var(--ink-900);
  font-family:var(--font-body);
  font-weight:700;
  font-size:10px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  padding:4px 10px;
  border-radius:var(--r-pill);
  flex:0 0 auto;
}
.app-banner .badge .dot {
  width:6px; height:6px; border-radius:50%;
  background:var(--ink-900);
  animation:pulse 2.2s var(--ease) infinite;
}
.app-banner .text {
  flex:1;
  font-size:13.5px;
  color:var(--fg);
  display:flex; align-items:baseline; gap:6px;
}
.app-banner .text strong { font-weight:600; color:var(--fg); }
.app-banner .text em { font-style:normal; color:var(--accent); font-weight:600; }
:root[data-palette="ink"] .app-banner .text em { color:var(--green-300); }
.app-banner .cta {
  font-size:13px;
  font-weight:600;
  color:var(--accent);
  text-decoration:none;
  display:inline-flex; align-items:center; gap:6px;
  white-space:nowrap;
  flex:0 0 auto;
  padding:6px 0;
  transition:color .18s var(--ease);
}
:root[data-palette="ink"] .app-banner .cta { color:var(--green-300); }
.app-banner .cta:hover { color:var(--fg); }
.app-banner .cta .arrow { transition:transform .22s var(--ease); }
.app-banner .cta:hover .arrow { transform:translateX(3px); }
.app-banner .close {
  background:transparent;
  border:0;
  padding:6px;
  color:var(--fg-mute);
  cursor:pointer;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  transition:color .18s var(--ease), background .18s var(--ease);
  flex:0 0 auto;
}
.app-banner .close:hover { color:var(--fg); background:rgba(255,255,255,0.06); }
.app-banner.hidden { display:none; }
@media (max-width:720px) {
  .app-banner .inner { padding:10px 20px; gap:10px; flex-wrap:nowrap; }
  .app-banner .text { font-size:12.5px; line-height:1.35; }
  .app-banner .text .app-em { display:none; }
  .app-banner .text .app-tail { display:none; }
  .app-banner .badge { font-size:9px; padding:3px 8px; }
  .app-banner .cta { font-size:12.5px; margin-left:auto; }
}
@media (max-width:520px) {
  .app-banner .inner { padding:8px 16px; gap:8px; }
  .app-banner .text { font-size:12px; }
  .app-banner .badge { display:none; }
  .app-banner .cta { font-size:12px; gap:4px; }
}
@media (max-width:380px) {
  .app-banner .text { font-size:11.5px; }
  .app-banner .text strong { display:block; }
}

/* ===== Mobile nav drawer ===== */
.burger { display:none; background:none; border:0; padding:8px; color:var(--fg); cursor:pointer; z-index:60; position:relative; }
.burger svg { display:block; }
@media (max-width:1080px) {
  .burger { display:block; }
}
.mobile-nav {
  position:fixed;
  inset:0;
  height:100dvh;
  background:var(--bg);
  z-index:55;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-8px);
  transition:opacity .32s var(--ease), transform .32s var(--ease), visibility 0s linear .32s;
  display:flex;
  flex-direction:column;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
.mobile-nav.open {
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
  transition:opacity .32s var(--ease), transform .42s var(--ease), visibility 0s;
}
.mobile-nav .top {
  display:flex; align-items:center; justify-content:space-between;
  height:84px;
  flex:0 0 auto;
  padding:0 32px;
  border-bottom:1px solid var(--border);
}
.mobile-nav .top .logo img { height:56px; width:auto; }
.mobile-nav .top .close {
  background:transparent; border:0; padding:8px; cursor:pointer; color:var(--fg);
  display:flex; align-items:center; justify-content:center;
  margin-right:-8px;
  transition:transform .22s var(--ease), color .18s var(--ease);
}
.mobile-nav .top .close:hover { color:var(--accent); transform:rotate(90deg); }
.mobile-nav .links {
  display:flex; flex-direction:column;
  padding:24px 32px;
  gap:4px;
}
.mobile-nav .links a {
  font-family:var(--font-display);
  font-weight:600;
  font-size:28px;
  letter-spacing:-0.02em;
  color:var(--fg);
  padding:16px 0;
  border-bottom:1px solid var(--border);
  transition:color .18s var(--ease);
  display:flex; align-items:center; justify-content:space-between;
  /* staggered entrance */
  opacity:0;
  transform:translateY(10px);
}
.mobile-nav.open .links a {
  opacity:1;
  transform:none;
  transition:opacity .4s var(--ease), transform .4s var(--ease), color .18s var(--ease);
}
.mobile-nav.open .links a:nth-child(1) { transition-delay:.08s; }
.mobile-nav.open .links a:nth-child(2) { transition-delay:.13s; }
.mobile-nav.open .links a:nth-child(3) { transition-delay:.18s; }
.mobile-nav.open .links a:nth-child(4) { transition-delay:.23s; }
.mobile-nav.open .links a:nth-child(5) { transition-delay:.28s; }
.mobile-nav.open .links a:nth-child(6) { transition-delay:.33s; }
.mobile-nav.open .links a:nth-child(7) { transition-delay:.38s; }
.mobile-nav .links a:hover, .mobile-nav .links a.active { color:var(--accent); }
.mobile-nav .links a::after {
  content:"→";
  font-family:var(--font-body);
  font-weight:500;
  font-size:20px;
  color:var(--fg-mute);
  transition:transform .22s var(--ease), color .22s var(--ease);
}
.mobile-nav .links a:hover::after { transform:translateX(4px); color:var(--accent); }
.mobile-nav .footer-cta {
  margin-top:auto;
  padding:24px 32px calc(24px + env(safe-area-inset-bottom));
  border-top:1px solid var(--border);
  display:flex; flex-direction:column; gap:14px;
  opacity:0;
  transform:translateY(10px);
}
.mobile-nav.open .footer-cta {
  opacity:1; transform:none;
  transition:opacity .4s var(--ease) .42s, transform .4s var(--ease) .42s;
}
.mobile-nav .footer-cta .btn { justify-content:center; padding:16px 22px; }
.mobile-nav .footer-cta .meta { font-size:13px; color:var(--fg-mute); text-align:center; }
body.nav-open { overflow:hidden; }
@media (prefers-reduced-motion:reduce) {
  .mobile-nav, .mobile-nav.open,
  .mobile-nav .links a, .mobile-nav.open .links a,
  .mobile-nav .footer-cta, .mobile-nav.open .footer-cta {
    transform:none; transition-duration:.2s; transition-delay:0s;
  }
}
@media (max-width:720px) {
  .mobile-nav .top { height:72px; padding-left:20px; padding-right:20px; }
  .mobile-nav .top .logo img { height:44px; }
  .mobile-nav .links, .mobile-nav .footer-cta { padding-left:20px; padding-right:20px; }
}
@media (max-width:520px) {
  .mobile-nav .top { height:64px; }
  .mobile-nav .top .logo img { height:38px; }
  .mobile-nav .links a { font-size:24px; padding:14px 0; }
}

/* Featured resource card — accent treatment for the sondage promo */
.rcard.rcard-featured {
  background:linear-gradient(180deg, rgba(91,172,139,0.10), rgba(91,172,139,0.02));
  border-color:var(--accent);
  position:relative;
}
.rcard.rcard-featured::before {
  content:"· à la une ·";
  position:absolute;
  top:-10px; left:24px;
  background:var(--accent);
  color:var(--ink-900);
  font-family:var(--font-body);
  font-weight:600;
  font-size:10px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  padding:5px 12px;
  border-radius:var(--r-pill);
}
.rcard.rcard-featured .tag { color:var(--accent-ink); }
:root[data-palette="ink"] .rcard.rcard-featured { background:linear-gradient(180deg, rgba(91,172,139,0.14), rgba(91,172,139,0.02)); }
:root[data-palette="ink"] .rcard.rcard-featured .tag { color:var(--green-300); }

/* ===== Token aliases for legacy components (sondage, etc.) ===== */
:root {
  --bg-mute:var(--paper-3);
  --accent-hover:var(--green-500);
  --ease-out:var(--ease);
  --shadow-2:0 4px 12px rgba(14,20,19,0.06), 0 1px 2px rgba(14,20,19,0.04);
  --shadow-green:0 8px 24px rgba(91,172,139,0.28);
  --danger:#c8483a;
  --gd-rouge:#c8483a;
}
:root[data-palette="ink"] {
  --shadow-2:0 4px 16px rgba(0,0,0,0.4), 0 1px 2px rgba(0,0,0,0.5);
}

/* Logo (single img — swapped via JS when palette changes) */
.header .logo img { height:72px; width:auto; display:block; }
@media (max-width:1080px) { .header .logo img { height:56px; } }
@media (max-width:720px)  { .header .logo img { height:44px; } }
@media (max-width:520px)  { .header .logo img { height:38px; } }

/* ===== Fleet showcase (full-bleed photo section) ===== */
.fleet-showcase { padding:0; position:relative; }
.fleet-showcase .photo {
  position:relative;
  height:clamp(360px, 56vw, 720px);
  overflow:hidden;
  background:var(--paper-3);
}
.fleet-showcase .photo img {
  width:100%; height:100%;
  object-fit:cover;
  object-position:center 65%;
}
.fleet-showcase .overlay {
  position:absolute;
  inset:auto 0 0 0;
  background:linear-gradient(180deg, transparent 0%, rgba(14,20,19,0.0) 30%, rgba(14,20,19,0.85) 100%);
  padding:120px 32px 56px;
  color:var(--paper);
}
.fleet-showcase .overlay .container { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; flex-wrap:wrap; }
.fleet-showcase .caption {
  font-family:var(--font-display);
  font-weight:700;
  font-size:clamp(28px, 3.4vw, 48px);
  letter-spacing:-0.025em;
  line-height:1.05;
  max-width:24ch;
  margin:0;
}
.fleet-showcase .caption em {
  font-style:normal;
  display:inline-block;
  transform:skewX(-8deg);
  color:var(--green-300);
}
.fleet-showcase .meta {
  font-family:var(--font-mono);
  font-size:11px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:#cfd5d1;
  margin:0;
  align-self:flex-end;
  white-space:nowrap;
}
.fleet-showcase .meta .dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--green-300); margin-right:8px; vertical-align:middle; }
@media (max-width:720px) {
  .fleet-showcase .overlay { padding:80px 20px 32px; }
  .fleet-showcase .meta { font-size:10px; }
}