/* Info du club — bande fine collée sous le header. Jamais une carte, jamais un
   modal, jamais de texte défilant. Absente du DOM s'il n'y a rien à annoncer :
   le sticky n'existe donc que lorsqu'une info est réellement publiée. */
.ck-home .ck-notice, .ck-home .ck-notice * { box-sizing: border-box; }
.ck-home .ck-notice {
    /* Reste visible sous le header pendant tout le défilement. Les deux
       variables sont celles déjà définies par le projet : aucune valeur
       dupliquée, et la barre d'administration est prise en compte. */
    position: sticky;
    top: calc(var(--ck-header-height) + var(--ck-admin-offset));
    z-index: 900;              /* header = 1000, contenu du site en dessous */
    background: var(--ck-yellow);
    color: var(--ck-black);
}
.ck-home .ck-notice__inner {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .25rem .875rem;
    padding-block: .4375rem;
}
.ck-home .ck-notice__tag {
    flex: 0 0 auto;
    margin: 0;
    color: var(--ck-black);
    font: 700 .6875rem/1.5 'Chivo', Arial, sans-serif;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.ck-home .ck-notice__body {
    flex: 1 1 12rem;
    min-width: 0;
    margin: 0;
    color: var(--ck-black);
    font: 400 .9375rem/1.45 'Chivo', Arial, sans-serif;
}
/* Titre : noir, gras, majuscules. Archivo et non Chivo, parce que la famille
   Chivo n'est chargée qu'en 400 et 600 — demander 800 produirait un faux gras
   synthétique. Archivo 800 est déjà chargé : aucune requête de police en plus. */
.ck-home .ck-notice__title {
    color: var(--ck-black);
    font-family: 'Archivo', Arial, sans-serif;
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: .04em;
    text-transform: uppercase;
}
/* Complément volontairement plus sobre, mais franchement lisible sur le jaune. */
.ck-home .ck-notice__text { color: var(--ck-anthracite); }
/* Garde-fou : aucun lien de la bande n'hérite d'une couleur claire du thème parent. */
.ck-home .ck-notice a { color: var(--ck-black); }
.ck-home .ck-notice__link {
    flex: 0 0 auto;
    display: inline-flex; align-items: center; gap: .35rem;
    min-height: 2.75rem;       /* cible tactile confortable sur mobile */
    color: var(--ck-black);
    font: 600 .875rem/1.4 'Chivo', Arial, sans-serif;
    text-decoration: underline; text-underline-offset: .3em;
}
.ck-home .ck-notice__link:hover { color: var(--ck-anthracite); }
.ck-home .ck-notice__link:focus-visible { outline: 3px solid var(--ck-black); outline-offset: 3px; }

@media (min-width: 768px) {
    .ck-home .ck-notice__inner { flex-wrap: nowrap; gap: 1.25rem; padding-block: .375rem; }
    .ck-home .ck-notice__body { flex: 1 1 auto; }
    /* Bande plus tendue au pointeur : la hauteur est dictée par ce lien.
       36 px restent très au-dessus du minimum AA de 24 px. */
    .ck-home .ck-notice__link { min-height: 2.25rem; }
}

@media (min-width: 1150px) {
    /* À partir de 1150 px, le pavé rouge du logo déborde sous la ligne du header
       et recouvre la gauche de la bande. Le contenu est décalé de la largeur
       réelle du pavé (hauteur x ratio du fichier) plus ~44 px d'air, en
       réutilisant les variables existantes plutôt qu'un nombre en dur.
       La valeur ne dépend pas de l'état « scrolled » : pas de saut au défilement. */
    .ck-home .ck-notice__inner {
        padding-left: calc(var(--ck-brand-height) * var(--ck-brand-ratio) + 2.75rem);
    }
}

@media (max-width: 479px) {
    /* Sous 480 px, le titre porte seul l'information : le texte détaillé est
       retiré pour que la bande sticky n'immobilise pas un quart de l'écran
       sous le header. Il réapparaît dès 480 px.
       Aucun max-height ni overflow masqué : le titre n'est jamais tronqué. */
    .ck-home .ck-notice__text { display: none; }
}