﻿/* ============================================================
   KÉVIN VIGREUX — MENTIONS LÉGALES — STYLES
   Base identique au reste du site (nav, footer, boutons),
   charte STRICTEMENT monochrome. Page volontairement sobre :
   pas d'animation, pas de filigrane, lecture directe.
   ============================================================ */
:root {
  --black: #000000;
  --white: #FFFFFF;
  --gray: #9A9A9A;
  --gray-soft: #b8b8b8;
  --gray-dark: #767676;
  --line: #1a1a1a;
  --line-soft: rgba(255,255,255,0.12);
  --surface: #0a0a0a;
  --serif: 'Bodoni Moda', 'Didot', Georgia, serif;
  --sans: 'Inter', 'Helvetica Neue', Arial, sans-serif;
  --gut: 6vw;
  --maxw: 1320px;
  --ease-in: cubic-bezier(0.16, 1, 0.3, 1);
  --gold: #C9A227;
  --gold-soft: #E4C766;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
img { display: block; max-width: 100%; }

/* NAVIGATION (identique au reste du site) */
.nav-logo img { width: 30px; height: auto; display: block; }
.nav-links a:hover, .nav-links a:focus-visible { opacity: 1; }
.nav-links a:hover::after, .nav-links a:focus-visible::after { width: 100%; }

/* BOUTON D'ACTION — style LED bleu unique, dominant sur tout le site (voir aussi .nav-cta). */

/* CONTENU — mentions légales */
.legal-hero { padding: 160px var(--gut) 40px; }
.legal-hero .wrap { max-width: 780px; }
.legal-kicker { display: block; text-transform: uppercase; letter-spacing: .3em; font-size: .68rem; color: var(--gold-soft); margin-bottom: 18px; }
.legal-hero h1 { font-family: var(--serif); font-weight: 500; font-size: clamp(2.1rem, 5vw, 3rem); line-height: 1.1; }
.legal-hero p { color: var(--gray-soft); max-width: 56ch; margin-top: 18px; font-size: .95rem; }

.legal-content { padding: 64px var(--gut) 120px; }
.legal-content .wrap { max-width: 780px; }
.legal-section { padding: 40px 0; }
.legal-section:first-child { padding-top: 0; }
.legal-section h2 { font-family: var(--serif); font-weight: 500; font-size: 1.5rem; margin-bottom: 18px; }
.legal-section p { color: var(--gray-soft); font-size: .95rem; line-height: 1.8; margin-bottom: 14px; }
.legal-section p:last-child { margin-bottom: 0; }
.legal-field { display: flex; gap: 8px; margin-bottom: 6px; font-size: .95rem; }
.legal-field dt { color: var(--gray-dark); min-width: 130px; flex-shrink: 0; }
.legal-field dd { color: var(--gray-soft); }
.legal-fields { margin-bottom: 18px; }
.legal-todo { display: inline-flex; align-items: center; gap: 8px; background: rgba(201,162,39,.1); border: 1px solid rgba(201,162,39,.4); color: var(--gold-soft); font-size: .74rem; text-transform: uppercase; letter-spacing: .1em; padding: 4px 12px; border-radius: 100px; margin-left: 4px; }
.legal-section a { color: var(--gold-soft); border-bottom: 1px solid rgba(230,199,121,.4); }
.legal-section a:hover, .legal-section a:focus-visible { border-color: var(--gold-soft); }

/* FOOTER (identique au reste du site) */
.footer { padding: 30px var(--gut) 44px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; color: var(--gray-dark); font-size: .68rem; text-transform: uppercase; letter-spacing: .18em; }

@media (max-width: 560px) {
  .legal-hero { padding-top: 130px; }
  .legal-field { flex-direction: column; gap: 2px; }
  .legal-field dt { min-width: 0; }
}

/* Halo LED renforcé au repos sur mobile : pas de survol tactile, donc le halo "hover" ne se voit jamais sans ce coup de pouce. */

/* ============================================================
   Volontairement exclu : titres/Bodoni Moda, nav, boutons, footer,
   badge "à compléter", champs adresse/email/téléphone (données,
   pas du texte de contenu).
   ============================================================ */
.legal-hero p,
.legal-section p {
  background: linear-gradient(to bottom, #ffffff, #c4c2c0);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
