/* ============================================================
   V-TRAX — Feuille de styles partagée pour les pages annexes
   (Mentions légales, CGV, Politique de confidentialité, Contact)
   ============================================================ */
:root{
  --bg:#000;--bg-1:#0A0A0C;--bg-2:#101013;--bg-3:#16161A;
  --line:#26262C;--line-2:#1A1A1F;
  --ink:#F4F4F5;--ink-dim:#A1A1A8;--ink-mute:#5C5C63;--ink-faint:#3A3A40;
  --red:#E10600;--red-bright:#FF1A0D;--red-deep:#9A0400;
  --green:#3FB95C;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{
  background:#000;color:var(--ink);
  font-family:'Inter Tight',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  font-feature-settings:"ss01","cv11","tnum";
}
::selection{background:var(--red);color:#fff}
a{color:inherit;text-decoration:none}
body{
  min-height:100vh;
  background:
    radial-gradient(1200px 600px at 50% -10%, rgba(225,6,0,0.06), transparent 70%),
    linear-gradient(180deg, #000 0%, #050507 50%, #000 100%);
  background-attachment:fixed;
  position:relative;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(to right, rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size:80px 80px;
  mask-image:radial-gradient(ellipse 80% 70% at 50% 30%, black 30%, transparent 80%);
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 30%, black 30%, transparent 80%);
  opacity:.4;
}

.wrap{position:relative;z-index:1;max-width:980px;margin:0 auto;padding:36px 32px 80px}

/* ============ TOPBAR ============ */
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:14px 18px;border:1px solid var(--line-2);
  background:rgba(10,10,12,0.7);backdrop-filter:blur(8px);
  margin-bottom:48px;
}
.logo{
  display:inline-flex;align-items:center;gap:10px;
  font-family:'Inter Tight',sans-serif;font-weight:800;font-size:15.5px;letter-spacing:-.01em;
  color:var(--ink);
}
.logo-mark{
  width:10px;height:10px;background:var(--red);
  box-shadow:0 0 12px rgba(225,6,0,0.7);
}
.topbar .back{
  font-family:'JetBrains Mono',monospace;font-size:11.5px;font-weight:500;
  color:var(--ink-dim);letter-spacing:.22em;text-transform:uppercase;
  padding:8px 14px;border:1px solid var(--line);transition:.15s;
}
.topbar .back:hover{color:var(--red);border-color:var(--red);background:rgba(225,6,0,0.04)}

/* ============ HERO ============ */
.hero{
  position:relative;
  padding:42px 38px;
  margin-bottom:32px;
  border:1px solid var(--line-2);
  background:
    radial-gradient(900px 360px at 50% -10%, rgba(225,6,0,0.07), transparent 70%),
    linear-gradient(180deg, rgba(10,10,12,0.7), rgba(8,8,10,0.35));
}
.hero .corner{position:absolute;width:18px;height:18px;border-color:var(--red);z-index:2}
.hero .corner.tl{top:-1px;left:-1px;border-top:1px solid;border-left:1px solid}
.hero .corner.tr{top:-1px;right:-1px;border-top:1px solid;border-right:1px solid}
.hero .corner.bl{bottom:-1px;left:-1px;border-bottom:1px solid;border-left:1px solid}
.hero .corner.br{bottom:-1px;right:-1px;border-bottom:1px solid;border-right:1px solid}

.eyebrow{
  font-family:'JetBrains Mono',monospace;
  font-size:12.5px;font-weight:500;letter-spacing:.32em;text-transform:uppercase;
  color:var(--ink-mute);display:flex;align-items:center;gap:14px;margin-bottom:20px;flex-wrap:wrap;
}
.eyebrow .pill{display:inline-block;width:32px;height:2px;background:var(--red)}
.eyebrow .num{color:var(--red)}
.eyebrow .sep{color:var(--ink-faint)}

h1{
  font-family:'Inter Tight',sans-serif;font-weight:800;
  font-size:clamp(28px,4vw,46px);line-height:1.05;letter-spacing:-.03em;color:var(--ink);
}
h1 .accent{color:var(--red)}
.lead{
  margin-top:14px;color:var(--ink-dim);font-size:15.5px;
  font-weight:300;line-height:1.55;max-width:780px;
}

/* ============ CONTENT BLOCK ============ */
.content{
  padding:36px 40px;
  border:1px solid var(--line-2);background:var(--bg-1);
  position:relative;
}
.content::before{
  content:"";position:absolute;top:-1px;left:24px;width:60px;height:2px;background:var(--red);
}
.content + .content{margin-top:18px}
.content h2{
  font-family:'Inter Tight',sans-serif;font-weight:700;font-size:22px;
  letter-spacing:-.02em;color:var(--ink);margin:32px 0 14px;
  display:flex;align-items:baseline;gap:0;
}
.content h2:first-child{margin-top:0}
.content h2 .num{
  font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--red);
  letter-spacing:.22em;margin-right:14px;font-weight:600;
}
.content h3{
  font-family:'Inter Tight',sans-serif;font-weight:600;font-size:16.5px;
  letter-spacing:-.01em;color:var(--ink);margin:22px 0 8px;
}
.content p{
  font-size:14.5px;color:var(--ink-dim);font-weight:300;line-height:1.65;
  margin-bottom:10px;
}
.content p b, .content p strong{color:var(--ink);font-weight:600}
.content p code{
  font-family:'JetBrains Mono',monospace;font-size:12.5px;
  color:var(--red);padding:1px 5px;background:rgba(225,6,0,0.08);
  border:1px solid rgba(225,6,0,0.2);
}
.content ul{margin:8px 0 16px 0;padding:0;list-style:none}
.content li{
  position:relative;padding:5px 0 5px 22px;
  font-size:14.5px;color:var(--ink-dim);line-height:1.6;font-weight:300;
}
.content li::before{
  content:"";position:absolute;left:0;top:14px;width:12px;height:2px;background:var(--red);
}
.content li strong{color:var(--ink);font-weight:600}
.content a{color:var(--red);border-bottom:1px solid rgba(225,6,0,0.3);transition:.15s}
.content a:hover{color:var(--red-bright);border-bottom-color:var(--red)}

.warn-block{
  margin:18px 0;padding:16px 20px;
  background:linear-gradient(90deg, rgba(225,6,0,0.10), rgba(225,6,0,0.02));
  border-left:3px solid var(--red);
  color:var(--ink);font-size:14.5px;line-height:1.6;font-weight:400;
}
.warn-block strong{color:var(--ink);font-weight:700}

/* Formulaire-type de rétractation (annexe CGV) — bloc imprimable beige */
.content p[style*="#f4f1ec"],
.retract-form{
  color:#1a1410 !important;
}

.placeholder-note{
  margin-bottom:28px;padding:14px 18px;
  border-left:2px solid var(--red);
  background:rgba(225,6,0,0.05);
  font-family:'JetBrains Mono',monospace;font-size:12px;
  color:var(--ink-mute);letter-spacing:.04em;line-height:1.65;
}
.placeholder-note b{color:var(--red);font-family:'Inter Tight',sans-serif;font-weight:600;letter-spacing:0}
.placeholder-note code{
  font-family:'JetBrains Mono',monospace;font-size:11.5px;
  color:var(--ink);padding:1px 4px;background:rgba(225,6,0,0.1);
}

.kv-grid{
  display:grid;grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));gap:12px;
  margin:14px 0 20px;
}
.kv-item{
  border:1px solid var(--line-2);background:rgba(0,0,0,0.3);padding:12px 14px;
}
.kv-item .k{
  font-family:'JetBrains Mono',monospace;font-size:10.5px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:6px;
}
.kv-item .v{
  font-family:'Inter Tight',sans-serif;font-size:14.5px;color:var(--ink);font-weight:500;
}

/* ============ CONTACT SPECIFIC ============ */
.contact-card{
  display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;
  padding:22px 26px;margin-bottom:14px;
  border:1px solid var(--line-2);background:rgba(0,0,0,0.3);
}
@media(max-width:640px){.contact-card{grid-template-columns:1fr}}
.contact-card .cc-ic{
  width:48px;height:48px;border:1px solid var(--red);
  display:flex;align-items:center;justify-content:center;color:var(--red);
  flex:none;
}
.contact-card .cc-ic svg{width:22px;height:22px}
.contact-card .cc-name{
  font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:4px;
}
.contact-card .cc-val{
  font-family:'Inter Tight',sans-serif;font-size:16.5px;font-weight:600;color:var(--ink);
}
.contact-card .cc-val a{color:var(--red);border:none}

/* ============ FOOTER ============ */
footer{
  margin-top:56px;padding-top:32px;border-top:1px solid var(--line-2);
  font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink-mute);
  text-align:center;line-height:1.9;letter-spacing:.22em;text-transform:uppercase;
}
footer .bn{color:var(--ink);font-weight:600;letter-spacing:.28em}
footer .dot-sep{color:var(--red);margin:0 12px}
footer .f-links{
  margin-top:14px;display:flex;justify-content:center;align-items:center;
  flex-wrap:wrap;gap:0;
}
footer .f-links a{
  color:var(--ink-dim);padding:6px 14px;
  text-transform:uppercase;letter-spacing:.22em;font-size:11.5px;
  transition:color .15s;position:relative;
}
footer .f-links a:hover{color:var(--red)}
footer .f-links a + a::before{
  content:"";position:absolute;left:-1px;top:50%;transform:translateY(-50%);
  width:1px;height:11px;background:var(--line);
}
footer .f-copy{
  margin-top:18px;padding-top:14px;border-top:1px solid var(--line-2);
  font-size:11px;color:var(--ink-mute);letter-spacing:.22em;
}
footer .f-copy .red{color:var(--red)}

/* ============ DISCORD BANNER ============ */
footer .f-discord-wrap{margin-bottom:26px}
footer .f-discord{
  display:inline-flex;align-items:center;gap:13px;
  padding:13px 24px;max-width:560px;
  border:1px solid rgba(88,101,242,0.5);background:rgba(88,101,242,0.08);
  color:var(--ink-dim);text-transform:none;letter-spacing:normal;
  font-family:'Inter Tight',sans-serif;font-size:14.5px;font-weight:400;line-height:1.4;
  transition:.15s;
}
footer .f-discord:hover{background:rgba(88,101,242,0.16);border-color:rgba(88,101,242,0.85);color:var(--ink)}
footer .f-discord svg{width:28px;height:28px;flex:none;color:#5865F2}
footer .f-discord b{color:var(--ink);font-weight:700}


/* === Marqueur de version (CGV / Mentions légales / Confidentialité) === */
.cgv-version{
  margin:18px 0 6px;padding:14px 18px;
  border:1px solid var(--line-2);
  background:linear-gradient(180deg,rgba(225,6,0,0.05),rgba(0,0,0,0.4));
  display:flex;flex-wrap:wrap;align-items:center;gap:14px;
  font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--ink-dim);
  line-height:1.6;
}
.cgv-version .cv-tag{
  display:inline-block;background:var(--red);color:#fff;
  font-weight:700;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  padding:5px 10px;border-radius:2px;flex:none;
}
.cgv-version .cv-meta{flex:1 1 280px}
.cgv-version a{color:var(--red);border-bottom:1px dotted rgba(225,6,0,.5)}
.cgv-version a:hover{color:var(--red-bright);border-bottom-color:var(--red-bright)}
.cgv-version strong{color:var(--ink);font-weight:600}