/* ══════════════════════════════════════════════════════════════
   GDN — CGV du forfait « Application Web 5 000 € » (/fr/cgv-application-web-5000)
   ──────────────────────────────────────────────────────────────
   Contenu source : .ai-commands/SWS_references/_sessions/_inbox/
   CGV_GDN_Application_Web_5000_18092026.md, transcrit sans reformulation.
   Mise en page inspiree de https://5000.dev/fr/cgv (articles numerotes,
   sobre, formelle) mais avec le systeme GDN : Inter, vert d'accent, cards
   a fond --gdn-hero-fill. Le sommaire reprend le motif deja utilise pour
   les articles de blog longs (.gdn-blogd2-toc dans style.css), sous des
   noms de classe propres a cette page.

   Feuille chargee par la seule route `cgv-application-web-5000`
   (router_fr.php), page elle-meme soumise a acces_preversion.php.

   CONTRASTE [2026-09-18] : un CGV se lit en diagonale a la recherche
   d'une clause precise, pas en continu comme un article de blog — le
   gris clair (--gdn-text-sec, --gdn-grey) qui allege un long texte
   marketing gene ici la lecture. Tout le texte de cette page passe
   donc en --gdn-black, y compris les elements qui restent gris
   ailleurs sur le site (eyebrow, sous-titre de hero) : les overrides
   ci-dessous sont scopes a cette feuille, donc sans effet sur les
   autres pages qui partagent ces classes.
   ══════════════════════════════════════════════════════════════ */

/* Sous-titre de hero (date de version) : gris partout ailleurs sur le
   site, noir ici pour la meme raison que le reste du texte. */
.gdn-hero__subtitle { color: var(--gdn-black); }

/* Préambule : identification GDN + périmètre de l'offre, avant le sommaire */
.gdn-cgv-preamble {
  position: relative;
  overflow: hidden;
  margin: 0 0 48px;
  padding: 32px 36px;
  background: var(--gdn-hero-fill);
  box-shadow: inset 0 0 60px rgba(0,0,0,.05);
  border-radius: var(--gdn-radius-card);
}
.gdn-cgv-preamble p {
  font-size: 1rem;
  line-height: 1.75;
  font-weight: 400;
  color: var(--gdn-black);
  margin: 0 0 16px;
}
.gdn-cgv-preamble p:last-child { margin-bottom: 0; }
.gdn-cgv-preamble strong { font-weight: 600; color: var(--gdn-black); }
@media (max-width: 767.98px) {
  .gdn-cgv-preamble { padding: 26px 24px; border-radius: 18px; }
}

/* Sommaire : deux colonnes, numéros verts, comme .gdn-blogd2-toc */
.gdn-cgv-toc {
  margin: 0 0 56px;
  padding: 28px 32px;
  border: 1px solid var(--gdn-border);
  border-radius: var(--gdn-radius-sm);
  background: rgba(119,119,119,.03);
}
.gdn-cgv-toc__label { margin-bottom: 18px; color: var(--gdn-black); }
.gdn-cgv-toc ol {
  margin: 0;
  padding: 0;
  list-style: none;
  columns: 2;
  column-gap: 32px;
  counter-reset: gdn-cgv-toc;
}
.gdn-cgv-toc li {
  counter-increment: gdn-cgv-toc;
  position: relative;
  padding-left: 1.9rem;
  margin-bottom: 12px;
  break-inside: avoid;
}
.gdn-cgv-toc li::before {
  content: counter(gdn-cgv-toc, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: .15em;
  font-size: .75rem;
  font-weight: 600;
  color: var(--gdn-green);
}
.gdn-cgv-toc a {
  font-size: .9375rem;
  line-height: 1.45;
  font-weight: 400;
  color: var(--gdn-black);
  text-decoration: none;
  transition: color var(--gdn-transition);
}
.gdn-cgv-toc a:hover { color: var(--gdn-green); }
@media (max-width: 575.98px) {
  .gdn-cgv-toc ol { columns: 1; }
}

/* Articles : numéro en éveil vert (.gdn-eyebrow du design system) + titre modéré,
   plus proche d'un document que des gros titres marketing de .gdn-section-title */
.gdn-cgv-article {
  padding: 40px 0;
  border-bottom: 1px solid var(--gdn-border);
  scroll-margin-top: 96px;
}
.gdn-cgv-article:first-child { padding-top: 0; }
.gdn-cgv-article:last-child { border-bottom: none; padding-bottom: 0; }
.gdn-cgv-article__title {
  font-size: clamp(1.375rem, 2.4vw, 1.75rem);
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: -.01em;
  color: var(--gdn-black);
  margin: 8px 0 20px;
}

.gdn-cgv-body p {
  font-size: 1.0625rem;
  line-height: 1.8;
  font-weight: 400;
  color: var(--gdn-black);
  margin: 0 0 20px;
}
.gdn-cgv-body p:last-child { margin-bottom: 0; }
.gdn-cgv-body p strong { font-weight: 600; color: var(--gdn-black); }
.gdn-cgv-body ul,
.gdn-cgv-body ol {
  margin: 0 0 20px;
  padding-left: 1.35rem;
}
.gdn-cgv-body li {
  font-size: 1.0625rem;
  line-height: 1.7;
  font-weight: 400;
  color: var(--gdn-black);
  margin-bottom: 10px;
}
.gdn-cgv-body li:last-child { margin-bottom: 0; }
.gdn-cgv-body li::marker { color: var(--gdn-green); font-weight: 600; }