/* Simulae · paywall, merci, pages légales : compléments de site.css (mêmes tokens, même préfixe .vy-lp). */
.tn { min-height: 100vh; display: flex; flex-direction: column; }
.tn-top { padding-block: 18px; }
.tn-logo { height: 40px; width: auto; display: block; }
.tn-main { flex: 1; padding-bottom: 56px; }
.tn-retour { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--doux); text-decoration: none; font-size: 15px; }
.tn-retour:hover { color: var(--clair); }
.tn-retour svg { width: 18px; height: 18px; }
.tn-lien { background: none; border: 0; padding: 8px 0; color: inherit; font: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Paywall ---------- */
.tn-grille { display: grid; gap: 22px; margin-top: 8px; }
.tn-sur { margin: 0 0 6px; font-size: 14px; font-weight: 600; letter-spacing: .02em; color: var(--laiton); }
.tn-lecture h1 { font-size: clamp(30px, 7.4vw, 46px); line-height: 1.08; margin: 0 0 10px; max-width: 18ch; }
.tn-chapo { color: var(--doux); font-size: 16px; max-width: 46ch; }
.tn-apercu { position: relative; margin-top: 18px; padding: 18px 18px 16px; border-radius: 18px; background: var(--nuit-2); box-shadow: inset 0 0 0 1px rgba(200, 161, 90, .28); }
.tn-apercu__texte { font-family: var(--serif); font-size: 18px; line-height: 1.5; color: var(--clair);
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.tn-apercu__suite { display: grid; gap: 9px; margin-top: 12px; filter: blur(3px); opacity: .55; }
.tn-apercu__suite span { height: 11px; border-radius: 6px; background: var(--doux); }
.tn-apercu__suite span:nth-child(2) { width: 92%; } .tn-apercu__suite span:nth-child(3) { width: 84%; } .tn-apercu__suite span:nth-child(4) { width: 60%; }
.tn-apercu__verrou { display: flex; align-items: center; gap: 8px; margin-top: 14px; font-size: 14px; font-weight: 600; color: var(--laiton); }
.tn-apercu__verrou svg { width: 16px; height: 16px; flex: none; }
.tn-inclus { display: grid; gap: 10px; margin-top: 18px; }
.tn-inclus li { position: relative; padding-left: 28px; font-size: 15px; color: var(--clair); }
.tn-inclus li::before { content: ""; position: absolute; left: 4px; top: .45em; width: 12px; height: 7px; border-left: 2px solid var(--laiton); border-bottom: 2px solid var(--laiton); transform: rotate(-45deg); }
.tn-ia { margin-top: 18px; font-size: 13px; line-height: 1.5; color: var(--doux); max-width: 60ch; }

.tn-paie { padding: 20px 18px 18px; border-radius: 22px; background: var(--carte); color: var(--encre); box-shadow: 0 30px 60px -36px rgba(0, 0, 0, .6); }
.tn-paie__titre { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-family: var(--sans); font-size: 16px; font-weight: 600; }
.tn-paie__titre b { font-family: var(--serif); font-weight: 400; font-size: 38px; line-height: 1; }
.tn-paie__sous { margin-top: 4px; font-size: 14px; color: var(--gris); padding-bottom: 14px; border-bottom: 1px solid rgba(31, 26, 26, .12); }
.tn-form { display: grid; gap: 12px; margin-top: 14px; }
.tn-f { display: grid; gap: 6px; }
.tn-f[hidden], .tn-deux[hidden] { display: none; }
.tn-f label { font-size: 14px; font-weight: 600; }
.tn-f input { width: 100%; height: 50px; padding: 0 14px; border-radius: 12px; border: 1.5px solid rgba(31, 26, 26, .18); background: #fff; color: var(--encre); font: inherit; font-size: 16px; }
.tn-f input:focus { outline: none; border-color: var(--laiton-fonce); box-shadow: 0 0 0 4px rgba(200, 161, 90, .25); }
.tn-f input[aria-invalid="true"] { border-color: #B3261E; }
.tn-aide { font-size: 13px; color: var(--gris); }
.tn-err { font-size: 13px; color: #B3261E; font-weight: 600; }
.tn-err[hidden] { display: none; }
.tn-deux { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.tn-carte { position: relative; }
.tn-marque { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: 11px; font-weight: 700; letter-spacing: .06em; color: var(--gris); }
.tn-secu { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 2px; font-size: 13px; font-weight: 600; color: var(--gris); }
.tn-secu svg { width: 16px; height: 16px; color: var(--vert-fonce); }
.tn-logos { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; }
.tn-logos img { height: 20px; width: auto; }
.tn-btn { width: 100%; margin-top: 4px; }
.tn-btn:disabled { opacity: .7; cursor: default; }
.tn-legal { margin-top: 4px; font-size: 12.5px; line-height: 1.55; color: var(--doux-sombre); }
.tn-legal a { color: inherit; }

@media (min-width: 960px) {
  .tn-top { padding-block: 26px; }
  .tn-logo { height: 46px; }
  .tn-grille { grid-template-columns: minmax(0, 1fr) minmax(0, 440px); gap: 56px; align-items: start; margin-top: 18px; }
  .tn-paie { padding: 26px 26px 22px; position: sticky; top: 20px; }
}

/* ---------- Merci ---------- */
.tn-merci { max-width: 640px; padding-block: 24px 64px; }
.tn-merci h1 { font-size: clamp(34px, 8vw, 52px); line-height: 1.05; margin: 0 0 16px; }
.tn-merci p { color: var(--doux); font-size: 17px; margin-top: 12px; }
.tn-merci .vy-btn { margin-top: 26px; }

/* ---------- Pages légales ---------- */
.tn-doc { max-width: 820px; padding-block: 16px 72px; }
.tn-doc h1 { font-size: clamp(32px, 7vw, 48px); line-height: 1.08; margin: 0 0 22px; }
.tn-doc h2 { font-size: clamp(22px, 4.6vw, 28px); margin: 34px 0 10px; }
.tn-doc p, .tn-doc li { color: var(--clair); font-size: 16px; line-height: 1.65; margin-top: 10px; }
.tn-doc ul { list-style: disc; padding-left: 20px; }
.tn-doc a { color: var(--laiton); }
.tn-doc .tn-maj { color: var(--doux); font-size: 14px; }
