/* Page Liens, système de design version 2 (13 octobre 2026).
   La page ouverte depuis un profil de réseau social : une colonne étroite, pensée d'abord pour le téléphone.
   Le socle (variables, .lar, boutons, repère) vient de accueil.css, chargée avant. */
.lns{padding-bottom:72px}
.l-page{max-width:608px;padding-top:56px}
.l-tete{margin-bottom:64px}
.l-h1{font:800 clamp(34px,7vw,48px)/1.04 var(--titre);letter-spacing:-.045em;margin:16px 0 0;color:var(--encre);text-transform:none;text-wrap:balance}

/* l'objectif : un cadre à bandeau bleu, le seul élément fort de la page */
.lns a.l-skool,.lns a.l-skool:visited{position:relative;display:block;border:3px solid var(--bleu);background:#fff;color:var(--encre);text-decoration:none;box-shadow:none}
.l-keo{position:absolute;right:20px;top:-52px;width:84px;height:auto}
.l-bandeau{display:block;background:var(--bleu);color:#fff;font:600 13.5px/1 var(--texte);padding:14px 24px}
.l-corps{display:grid;gap:12px;padding:24px 24px 26px}
.l-titre{font:800 28px/1.1 var(--titre);letter-spacing:-.03em;text-wrap:balance}
.l-texte{font-size:17px;line-height:1.5;color:var(--gris-texte)}
.l-prix{font:400 14px/1 var(--mono);color:var(--gris-texte);border-top:1px solid var(--filet);padding-top:16px;margin-top:4px}
.l-prix b{font:800 34px/1 var(--titre);letter-spacing:-.04em;color:var(--encre);margin-right:6px}
.lns .l-bt{display:flex;min-height:58px;font-size:18.5px;background:var(--bleu);color:#fff;margin-top:4px}
.lns a.l-skool:hover .l-bt{background:var(--encre)}
.lns a.l-skool:focus-visible,.lns .l-liens a:focus-visible{outline:3px solid var(--bleu);outline-offset:3px}

/* les autres portes : trois lignes larges, faciles à toucher */
.lns .l-liens{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:12px}
.lns .l-liens li{margin:0}
.lns .l-liens a,.lns .l-liens a:visited{display:grid;gap:5px;min-height:64px;padding:14px 20px;border:2px solid var(--encre);background:#fff;color:var(--encre);text-decoration:none;align-content:center;box-shadow:none}
.l-liens b{font:700 18px/1.2 var(--titre);letter-spacing:-.02em}
.l-liens span{font:400 12.5px/1.4 var(--mono);color:var(--gris-texte)}
.lns .l-liens a:hover{background:var(--encre);color:#fff}
.lns .l-liens a:hover span{color:#fff}

@media (max-width:900px){
  .l-page{padding-top:36px}
  .l-tete{margin-bottom:56px}
  .l-keo{width:72px;top:-45px;right:14px}
  .l-corps{padding:20px 18px 22px}
  .l-bandeau{padding:13px 18px}
  .l-titre{font-size:25px}
}
