/* Site v2 : pages SEO (alternatives, comparatif, pro ou bénévole). Grammaire des pages module (css/v2-pages.css) ;
   ici seulement ce qui leur manque : tableaux à trois colonnes lisibles sur téléphone, liens de comparaison. */

/* Tableau critère / concurrent / Insuleo : sur téléphone, une ligne par critère, chaque valeur précédée de son acteur */
.seo-tab:not(.tf-tab) td:last-child { color: var(--s-txt); }
@media (max-width: 860px) {
    .seo-tab td[data-l]::before { content: attr(data-l); display: block; margin-bottom: 2px; font: 600 12px/1.3 var(--texte); letter-spacing: .02em; color: var(--s-doux); opacity: .8; }
    .seo-tab td[data-l]:last-child::before { color: #c4600c; opacity: 1; }
    [data-theme="nuit"] .seo-tab td[data-l]:last-child::before { color: #ffb877; }
}
.seo-lectures { margin-top: 8px; }
.pm-panneau .pm-maillage { margin-top: 14px; font-size: 14px; }

/* Grand tableau (six acteurs) : il défile dans son cadre, la colonne des critères reste en place, la nôtre est surlignée */
.seo-defile { margin-top: clamp(24px, 3vw, 36px); overflow-x: auto; border-radius: 18px; background: #fff; box-shadow: inset 0 0 0 1px rgba(19, 40, 75, .1), 0 8px 0 var(--lec-rebord, #c9d6e3); scrollbar-width: thin; }
[data-theme="nuit"] .seo-defile { --lec-rebord: #0b1a33; }
.seo-defile:focus-visible { outline: 2px solid #fc8822; outline-offset: 3px; }
.seo-grand { width: 100%; min-width: 860px; border-collapse: separate; border-spacing: 0; font-size: 14px; line-height: 1.45; color: #3d5a7a; }
.seo-grand th, .seo-grand td { padding: 13px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid #e1e8f0; }
.seo-grand thead th { background: #eef3f8; color: #6484a3; font: 600 12.5px/1.3 var(--texte); white-space: nowrap; }
.seo-grand tbody tr:last-child > * { border-bottom: 0; }
.seo-grand tbody th { color: #13284b; font-weight: 700; }
.seo-grand :is(th, td):first-child { position: sticky; left: 0; z-index: 1; width: 15em; background: #fff; box-shadow: 1px 0 0 #e1e8f0; }
.seo-grand thead th:first-child { background: #eef3f8; }
.seo-grand :is(th, td):last-child { background: #fff1e3; color: #13284b; font-weight: 600; }
.ico-yes { color: #437a56; font-weight: 800; }
@media (max-width: 640px) {
    .seo-defile { margin-inline: calc(-1 * var(--gout)); border-radius: 0; }
    .seo-grand { min-width: 760px; font-size: 12.5px; }
    .seo-grand th, .seo-grand td { padding: 9px 10px; }
    .seo-grand :is(th, td):first-child { width: 8.5em; }
}
.seo-tab--duo td { color: var(--s-txt); font-weight: 500; }
.seo-tab--duo td:nth-child(2) { color: var(--s-txt); }
.seo-tab .seo-tab-fin td { text-align: center; color: #c4600c; }
[data-theme="nuit"] .seo-tab .seo-tab-fin td { color: #ffb877; }
