/* Page Liens utiles — une liste éditoriale, pas un mur de logos.
   Même grammaire que les autres pages intérieures : bandeau noir en tête, corps
   ivoire, Archivo pour les noms, Chivo pour le texte. Le jaune n'est qu'un
   accent (le petit filet sous chaque titre de groupe) : sur ivoire il ne
   passerait pas en texte. Aucune icône, aucun logo, aucune carte à ombre. */
.ck-home .ck-links-page,
.ck-home .ck-links-page * { box-sizing: border-box; }

/* Utilitaire lecteur d'écran : cette feuille est chargée seule sur la page. */
.ck-home .ck-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* --- Bandeau ------------------------------------------------------------ */
.ck-home .ck-links-intro {
    padding-block: clamp(2.5rem, 8vw, 5rem) clamp(1.5rem, 4vw, 2.5rem);
    background: var(--ck-black);
    color: var(--ck-ivory);
}
.ck-home .ck-links-intro__eyebrow {
    margin: 0 0 .875rem;
    color: var(--ck-text-light-secondary);
    font: 600 .875rem/1.5 'Chivo', Arial, sans-serif;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.ck-home .ck-links-intro__title {
    margin: 0;
    color: var(--ck-ivory);
    font: 800 clamp(2.25rem, 9vw, 3.5rem)/1.08 'Archivo', Arial, sans-serif;
    letter-spacing: -.015em;
    overflow-wrap: break-word;
}
.ck-home .ck-links-intro__lead {
    max-width: 38rem;
    margin: 1rem 0 0;
    color: var(--ck-text-light-secondary);
    font: 400 1.0625rem/1.65 'Chivo', Arial, sans-serif;
}

/* --- Corps -------------------------------------------------------------- */
.ck-home .ck-links {
    padding-block: clamp(2.5rem, 7vw, 4.5rem) clamp(3rem, 8vw, 5.5rem);
    background: var(--ck-ivory);
    color: var(--ck-black);
}
.ck-home .ck-links__inner { min-width: 0; }

.ck-home .ck-links-group { min-width: 0; }
.ck-home .ck-links-group + .ck-links-group { margin-top: clamp(2.5rem, 7vw, 4rem); }

/* --- Titre de groupe : numéro de repère, titre, filet jaune ------------- */
.ck-home .ck-links-group__head { margin: 0 0 clamp(1rem, 3vw, 1.5rem); }
.ck-home .ck-links-group__num {
    display: block;
    margin: 0 0 .375rem;
    color: var(--ck-text-dark-secondary);
    font: 600 .875rem/1.4 'Chivo', Arial, sans-serif;
    letter-spacing: .08em;
    font-variant-numeric: tabular-nums;
}
.ck-home .ck-links-group__title {
    position: relative;
    margin: 0;
    padding-bottom: .875rem;
    color: var(--ck-black);
    font: 800 clamp(1.5rem, 6vw, 2rem)/1.15 'Archivo', Arial, sans-serif;
    letter-spacing: -.01em;
    overflow-wrap: break-word;
}
/* Le seul usage du jaune : un filet court, comme sur les cartes sans logo des
   partenaires. */
.ck-home .ck-links-group__title::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 1.75rem;
    height: 3px;
    background: var(--ck-yellow);
}

/* --- La liste : un filet noir en tête, des filets clairs entre les lignes - */
.ck-home .ck-links-group__list {
    margin: 0;
    padding: 0;
    list-style: none;
    border-top: 2px solid var(--ck-black);
}
.ck-home .ck-link-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .5rem 2rem;
    align-items: start;
    margin: 0;
    padding-block: 1.25rem;
    border-bottom: 1px solid var(--ck-ivory-muted);
}
.ck-home .ck-link-row__body { min-width: 0; }
.ck-home .ck-link-row__name {
    margin: 0 0 .375rem;
    color: var(--ck-black);
    font: 800 clamp(1.0625rem, 4.2vw, 1.3125rem)/1.25 'Archivo', Arial, sans-serif;
    letter-spacing: -.005em;
    overflow-wrap: anywhere;
}
.ck-home .ck-link-row__desc {
    max-width: 40rem;
    margin: 0;
    color: var(--ck-text-dark-secondary);
    font: 400 1rem/1.6 'Chivo', Arial, sans-serif;
    overflow-wrap: break-word;
}
/* L'adresse du site, en petites capitales espacées — comme la ligne
   d'informations de la revue de presse : on sait où l'on va avant de cliquer. */
.ck-home .ck-link-row__host {
    margin: .5rem 0 0;
    color: var(--ck-text-dark-secondary);
    font: 600 .8125rem/1.5 'Chivo', Arial, sans-serif;
    letter-spacing: .06em;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

/* Le lien : cible tactile d'au moins 44 px, souligné, rouge au survol et au
   focus. Le libellé visible ne suffit pas à lui seul — le nom de la ressource
   et « nouvel onglet » sont ajoutés en texte pour lecteur d'écran. */
.ck-home .ck-link-row__cta {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    justify-self: start;
    min-height: 2.75rem;
    color: var(--ck-black);
    font: 600 .9375rem/1.4 'Chivo', Arial, sans-serif;
    text-decoration: none;
    transition: color var(--ck-transition);
}
.ck-home .ck-link-row__cta-text {
    text-decoration: underline;
    text-underline-offset: .25em;
}
.ck-home .ck-link-row__arrow {
    display: inline-block;
    transition: transform var(--ck-transition);
}
.ck-home .ck-link-row__cta:hover { color: var(--ck-red); }
.ck-home .ck-link-row__cta:hover .ck-link-row__arrow { transform: translateX(.25rem); }
.ck-home .ck-link-row__cta:focus-visible {
    outline: 3px solid var(--ck-red);
    outline-offset: 3px;
}

/* --- Note de fin --------------------------------------------------------- */
.ck-home .ck-links__note {
    max-width: 44rem;
    margin: clamp(2rem, 6vw, 3rem) 0 0;
    padding-top: 1.25rem;
    border-top: 1px solid var(--ck-ivory-muted);
    color: var(--ck-text-dark-secondary);
    font: 400 .9375rem/1.6 'Chivo', Arial, sans-serif;
}

/* --- Paliers : ceux du site, aucun nouveau ------------------------------- */
@media (min-width: 768px) {
    /* Le texte à gauche, le lien à droite, sur la même ligne de base. */
    .ck-home .ck-link-row {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
    }
    .ck-home .ck-link-row__cta { justify-self: end; }
}

@media (min-width: 1150px) {
    /* Le titre de groupe à gauche, la liste à droite : même découpage que la
       section Actualités de l'accueil, pour que les pages se répondent. */
    .ck-home .ck-links-group {
        display: grid;
        grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
        gap: clamp(3rem, 5vw, 4.5rem);
        align-items: start;
    }
    .ck-home .ck-links-group__head {
        margin: 0;
        /* Le titre reste sous les yeux pendant qu'on parcourt la liste, sous
           l'en-tête fixe du site. Il s'arrête avec son groupe. */
        position: sticky;
        top: calc(var(--ck-header-height) + var(--ck-admin-offset) + 1.5rem);
    }
}

@media (prefers-reduced-motion: reduce) {
    .ck-home .ck-link-row__cta,
    .ck-home .ck-link-row__arrow { transition: none; }
    .ck-home .ck-link-row__cta:hover .ck-link-row__arrow { transform: none; }
}
