/*
Theme Name: Vélo Libelo
Template: blocksy
Version: 1.0.0
Description: Thème enfant Blocksy du média Vélo Libelo : polices locales, disciplines, composants éditoriaux, taxonomies Coureur et Course.
Author: Vélo Libelo
Text Domain: velo-libelo
*/

/* ---------- jetons (récapitulatif Claude Design, octobre 2026) ---------- */
:root {
  --vl-accent: #E85D1C;
  --vl-accent-text: #B8430C;
  --vl-route: #2456A6; --vl-vtt: #9A3D1E; --vl-gravel: #8A6A12;
  --vl-cx: #3F6B2A; --vl-piste: #7A3BA0; --vl-bmx: #C0306B;
  --vl-radius-badge: 2px; --vl-radius: 4px; --vl-radius-card: 6px;
}
[data-color-mode="dark"] {
  --vl-accent: #FF7A3D; --vl-accent-text: #FF7A3D;
  --vl-route: #7FA8EC; --vl-vtt: #F08A64; --vl-gravel: #E0BE5A;
  --vl-cx: #93C27A; --vl-piste: #C59AE6; --vl-bmx: #F27BA8;
}

/* ---------- typographie (familles chargées par fonts.css) ---------- */
body, .ct-container, .entry-content { font-family: 'Source Serif 4', Georgia, serif; }
h1, h2, h3, h4, h5, h6, .entry-title, .site-title, .ct-header, .ct-footer .widget-title, .ct-breadcrumbs,
.entry-meta, .ct-button, .wp-block-button__link, .ct-pagination, .vl-badge, .vl-chip, .wp-block-post-date, .wp-block-post-terms, .wp-block-query-pagination {
  font-family: 'Barlow Condensed', 'Arial Narrow', sans-serif;
}
.entry-content > p:first-of-type.vl-chapo, .vl-chapo, .ct-hero .entry-excerpt { font-size: 1.16em; line-height: 1.45; color: var(--theme-heading-color); }
.entry-content a { text-decoration: underline; text-underline-offset: 2px; }
.entry-content h2 { margin-top: 1.6em; }
.entry-content h2::before { content: ""; display: block; width: 40px; height: 2px; background: var(--vl-accent); margin-bottom: 10px; }
.entry-content strong { color: var(--theme-heading-color); }
.entry-content blockquote { border-left: 3px solid var(--vl-accent); padding-left: 18px; font-size: 1.05em; }
.entry-content blockquote cite { display: block; margin-top: 6px; font-family: 'Barlow Condensed', sans-serif; font-style: normal; font-size: 0.9em; color: var(--theme-palette-color-10, #4E5A5F); }
.entry-content table { font-family: 'Barlow Condensed', sans-serif; font-size: 1.05em; }
.entry-content table th { background: var(--theme-palette-color-6); }

/* ---------- blocs éditoriaux produits par le pipeline ---------- */
.vl-essentiel { background: var(--theme-palette-color-6); border: 1px solid var(--theme-palette-color-5); border-radius: var(--vl-radius-card); padding: 18px 22px; margin: 24px 0; }
.vl-essentiel > p { margin: 0 0 8px; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 1.05em; letter-spacing: .06em; text-transform: uppercase; }
.vl-essentiel ul { margin: 0; padding-left: 20px; }
.vl-essentiel li { margin-bottom: 6px; }
.vl-sources { background: var(--theme-palette-color-6); border: 1px solid var(--theme-palette-color-5); border-radius: var(--vl-radius-card); padding: 18px 22px; margin: 32px 0 16px; }
.vl-sources h2 { font-size: 1.1em; margin: 0 0 10px; letter-spacing: .06em; text-transform: uppercase; }
.vl-sources h2::before { display: none; }
.vl-sources ul, .vl-sources ol { margin: 0; padding-left: 20px; font-size: 0.95em; }
.vl-credit, .vl-featured figcaption, .wp-block-image figcaption, .wp-block-embed figcaption { font-family: 'Barlow Condensed', sans-serif; font-size: 16px; line-height: 1.3; color: var(--theme-palette-color-10, #4E5A5F); text-align: left; margin-top: 8px; }
.vl-credit a { color: inherit; }
.vl-featured { margin: 0 0 24px; }
.vl-featured img { border-radius: var(--vl-radius); width: 100%; height: auto; }
.wp-block-embed { margin: 28px auto; max-width: 540px; }

/* ---------- badges discipline (liens de catégorie dans les métas et les cartes) ---------- */
.entry-meta a, .wp-block-post-terms a, .ct-meta-element-categories a, .vl-badge {
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; text-decoration: none;
}
.entry-meta a[href*="/route/"], .wp-block-post-terms a[href*="/route/"], .vl-badge--route { color: var(--vl-route); }
.entry-meta a[href*="/vtt/"], .wp-block-post-terms a[href*="/vtt/"], .vl-badge--vtt { color: var(--vl-vtt); }
.entry-meta a[href*="/gravel/"], .wp-block-post-terms a[href*="/gravel/"], .vl-badge--gravel { color: var(--vl-gravel); }
.entry-meta a[href*="/cyclo-cross/"], .wp-block-post-terms a[href*="/cyclo-cross/"], .vl-badge--cyclo-cross { color: var(--vl-cx); }
.entry-meta a[href*="/piste/"], .wp-block-post-terms a[href*="/piste/"], .vl-badge--piste { color: var(--vl-piste); }
.entry-meta a[href*="/bmx/"], .wp-block-post-terms a[href*="/bmx/"], .vl-badge--bmx { color: var(--vl-bmx); }
.entry-meta a[href*="/actualites/"]::before, .wp-block-post-terms a[href*="/actualites/"]::before, .vl-badge::before {
  content: ""; display: inline-block; width: 8px; height: 8px; border-radius: var(--vl-radius-badge); margin-right: 6px; background: currentColor; vertical-align: 1px;
}
@media (max-width: 768px) { .entry-meta a, .wp-block-post-terms a, .vl-badge { font-size: 16px; } }

/* ---------- version affirmée (retour de Julie : « trop blanc ») ---------- */
.ct-header [data-row="middle"] { --vl-on-dark: #FAFBFA; }
.ct-header [data-row="middle"] .ct-button[data-type="type-2"] { background: var(--vl-accent); border-color: var(--vl-accent); color: #15191C; }
.ct-header [data-row="middle"] .ct-button[data-type="type-2"]:hover { background: #FF7A3D; border-color: #FF7A3D; color: #15191C; }
.ct-header [data-row="bottom"] { background: var(--theme-palette-color-6); }
.ct-header [data-row="bottom"] .menu > li > a { padding-top: 0; padding-bottom: 0; }
.entry-content h2::before { width: 56px; height: 3px; }
.vl-section__title { border-top-width: 3px; }
.vl-section--derniers, .vl-section--coureurs { background: var(--theme-palette-color-6); padding: 32px clamp(16px, 5vw, 40px); border-radius: var(--vl-radius-card); }
.vl-section--une .wp-block-query { position: relative; }
.vl-card--une .wp-block-post-featured-image { margin: 0; }
.vl-card--une .wp-block-post-featured-image img { aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--vl-radius-card); filter: brightness(0.72); }
.vl-card--une .wp-block-post-featured-image::after { content: ""; position: absolute; inset: 0; border-radius: var(--vl-radius-card); background: linear-gradient(180deg, rgba(11,58,49,0) 35%, rgba(11,58,49,0.92) 100%); pointer-events: none; }
.vl-card--une .wp-block-post-featured-image { position: relative; }
.vl-card--une .wp-block-post-terms, .vl-card--une .wp-block-post-title, .vl-card--une .wp-block-post-excerpt, .vl-card--une .wp-block-post-date { position: relative; z-index: 1; }
@media (min-width: 900px) {
  /* grid: the image fills the whole card, the texts stack at the bottom over it (no overlap whatever the title length) */
  .vl-card--une li { display: grid; grid-template-columns: 1fr; grid-template-rows: minmax(140px, 1fr) auto auto auto auto; }
  .vl-card--une .wp-block-post-featured-image { grid-row: 1 / -1; grid-column: 1; margin: 0; }
  .vl-card--une .wp-block-post-featured-image img { height: 100%; min-height: 460px; }
  .vl-card--une .wp-block-post-featured-image a, .vl-card--une .wp-block-post-featured-image img { display: block; height: 100%; }
  .vl-card--une .wp-block-post-terms, .vl-card--une .wp-block-post-title, .vl-card--une .wp-block-post-excerpt, .vl-card--une .wp-block-post-date { grid-column: 1; position: relative; z-index: 1; padding: 0 40px; margin: 0; }
  .vl-card--une .wp-block-post-terms { grid-row: 2; padding-bottom: 10px; }
  .vl-card--une .wp-block-post-title { grid-row: 3; color: #FAFBFA; font-size: 44px; line-height: 1.05; padding-bottom: 10px; }
  .vl-card--une .wp-block-post-title a { color: #FAFBFA; }
  .vl-card--une .wp-block-post-excerpt { grid-row: 4; color: #E6EDEA; font-size: 1.05em; padding-bottom: 10px; }
  .vl-card--une .wp-block-post-excerpt p { margin: 0; }
  .vl-card--une .wp-block-post-date { grid-row: 5; color: #C9D2CF; padding-bottom: 22px; }
  .vl-card--une .wp-block-post-terms a { background: #FAFBFA; color: var(--theme-heading-color); padding: 4px 10px; border-radius: 2px; }
  .vl-card--une .wp-block-post-terms a::before { background: currentColor; }
}
.entry-meta a[href*="/actualites/"], .wp-block-post-terms a[href*="/actualites/"], .vl-badge { padding: 3px 9px; border-radius: 2px; background: color-mix(in srgb, currentColor 12%, transparent); }
.vl-card .wp-block-post-featured-image img { box-shadow: 0 4px 14px rgba(21,25,28,.08); }
.vl-boutique { background: var(--theme-palette-color-2); color: #E6EDEA; border: 0; }
.vl-boutique h2, .vl-boutique p { color: #FAFBFA; }
.vl-boutique .vl-kicker { color: #FF9A6B; }
.vl-chip { background: #fff; }

/* ---------- accueil (page en blocs natifs) ---------- */
.vl-section { margin: 0 0 64px; }
.vl-section__title { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; border-top: 2px solid var(--theme-heading-color); padding-top: 12px; margin: 0 0 24px; }
.vl-section__title h2 { margin: 0; font-size: 28px; }
.vl-section__title a { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: 15px; text-decoration: none; }
.vl-section--route .vl-section__title { border-top-color: var(--vl-route); }
.vl-section--vtt .vl-section__title { border-top-color: var(--vl-vtt); }
.vl-section--gravel .vl-section__title { border-top-color: var(--vl-gravel); }
.vl-section--cyclo-cross .vl-section__title { border-top-color: var(--vl-cx); }
.vl-section--piste .vl-section__title { border-top-color: var(--vl-piste); }
.vl-section--bmx .vl-section__title { border-top-color: var(--vl-bmx); }
.vl-card .wp-block-post-featured-image img { aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--vl-radius); }
.vl-card .wp-block-post-title { font-size: 22px; line-height: 1.15; margin: 10px 0 6px; }
.vl-card .wp-block-post-title a { text-decoration: none; }
.vl-card .wp-block-post-title a:hover, .vl-card .wp-block-post-title a:focus { text-decoration: underline; }
.vl-card .wp-block-post-excerpt { font-size: 0.95em; }
.vl-card .wp-block-post-date { font-size: 15px; color: var(--theme-palette-color-10, #4E5A5F); }
.vl-card--une .wp-block-post-title { font-size: 44px; line-height: 1.05; }
.vl-card--une .wp-block-post-excerpt { font-size: 1.1em; }
@media (max-width: 768px) { .vl-card--une .wp-block-post-title { font-size: 30px; } .vl-section { margin-bottom: 48px; } .vl-section__title h2 { font-size: 24px; } }
.vl-card--liste { display: grid; grid-template-columns: 120px 1fr; gap: 14px; align-items: start; }
.vl-card--liste .wp-block-post-title { font-size: 20px; margin: 0 0 4px; }
.vl-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.vl-chip { display: inline-block; padding: 10px 14px; border: 1px solid var(--theme-palette-color-5); border-radius: 999px; font-weight: 600; font-size: 16px; text-decoration: none; line-height: 1; }
.vl-chip:hover, .vl-chip:focus { border-color: var(--theme-palette-color-1); }
.vl-boutique { background: var(--theme-palette-color-2); color: #E6EDEA; border: 0; border-radius: var(--vl-radius-card); padding: 28px; }
.vl-boutique .vl-kicker { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: 14px; color: #FF9A6B; margin: 0 0 6px; }
.vl-boutique h2, .vl-boutique p { color: #FAFBFA; }
.vl-boutique h2 { margin: 0 0 6px; font-size: 26px; }
.vl-boutique h2::before { display: none; }
.vl-btn-accent .wp-block-button__link, .ct-button.vl-btn-accent { background: var(--vl-accent); color: #15191C; }
.vl-btn-accent .wp-block-button__link:hover { background: var(--vl-accent-text); color: #fff; }

/* ---------- fiches coureur et course (archives des taxonomies) ---------- */
.vl-fiche { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 32px; align-items: start; margin: 0 0 40px; }
.vl-fiche img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--vl-radius); }
.vl-fiche dl { margin: 0; display: grid; grid-template-columns: max-content 1fr; gap: 8px 16px; font-family: 'Barlow Condensed', sans-serif; font-size: 18px; }
.vl-fiche dt { font-weight: 700; text-transform: uppercase; letter-spacing: .04em; font-size: 14px; color: var(--theme-palette-color-10, #4E5A5F); align-self: baseline; }
.vl-fiche dd { margin: 0; }
.vl-fiche__texte { max-width: 720px; margin: 0 auto 40px; }
.vl-fiche-bottom { max-width: 720px; margin: 48px auto 0; padding-top: 32px; border-top: 1px solid var(--theme-palette-color-5); }
.vl-rubrique-liens { margin: 0 0 32px; }
.vl-rubrique-liens .vl-kicker { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: 14px; color: var(--theme-palette-color-10, #4E5A5F); margin: 16px 0 8px; }
.vl-dans-cet-article { margin: 32px 0 0; padding-top: 20px; border-top: 1px solid var(--theme-palette-color-5); }
.vl-dans-cet-article .vl-kicker { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: 14px; color: var(--theme-palette-color-10, #4E5A5F); margin: 0 0 8px; }
.vl-fiche-wrap--rubrique .vl-featured img { aspect-ratio: 21 / 9; }
.vl-fiche__articles { margin: 0 0 24px; }
.vl-fiche .vl-chapo { margin-top: 0; }
@media (max-width: 768px) { .vl-fiche { grid-template-columns: 1fr; gap: 20px; } }

/* ---------- boutique ---------- */
.vl-produit { border: 1px solid var(--theme-palette-color-5); border-radius: var(--vl-radius-card); padding: 16px; height: 100%; }
.vl-produit img { aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--vl-radius); width: 100%; }
.vl-produit h3 { font-size: 22px; margin: 12px 0 8px; }
.vl-produit ul { padding-left: 18px; margin: 0 0 14px; font-size: 0.95em; }
.vl-produit .vl-mention { font-family: 'Barlow Condensed', sans-serif; font-size: 14px; color: var(--theme-palette-color-10, #4E5A5F); margin-top: 8px; }
.vl-produits { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; margin: 20px 0 36px; }
.vl-produit { background: var(--theme-palette-color-7, #FAFBFA); display: flex; flex-direction: column; }
.vl-produit .vl-produit-visuel { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 150px; background: var(--theme-palette-color-6, #F3F6F4); border-radius: var(--vl-radius); color: var(--theme-palette-color-1, #12584A); text-decoration: none; }
.vl-produit .vl-produit-visuel:hover { color: var(--vl-accent-text); }
.vl-produit .vl-produit-visuel img { max-height: 200px; width: auto; object-fit: contain; aspect-ratio: auto; }
.vl-produit .vl-produit-marque { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 18px; letter-spacing: .06em; text-transform: uppercase; }
.vl-produit h3 { margin: 14px 0 6px; }
.vl-produit ul { flex: 1; }
.vl-produit .vl-produit-cta { margin: 0; }
.vl-produit .vl-produit-cta a { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; width: 100%; background: var(--vl-accent); color: #15191C; border-color: var(--vl-accent); font-size: 17px; }
.vl-produit .vl-produit-cta a:hover { background: var(--vl-accent-text); color: #fff; }
.vl-produit .vl-prix { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 20px; }

/* ---------- pied de page (fond vert foncé) et menu mobile : lisibilité ---------- */
.ct-footer, .ct-footer p, .ct-footer li { color: #C9D2CF; }
.ct-footer a { color: #FAFBFA; text-decoration: none; }
.ct-footer a:hover, .ct-footer a:focus { color: #8EDDC3; text-decoration: underline; }
.ct-footer .vl-footer-title, .ct-footer .widget-title, .ct-footer h1, .ct-footer h2, .ct-footer h3, .ct-footer h4 { color: #FFFFFF; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 15px; letter-spacing: .08em; text-transform: uppercase; margin: 0 0 12px; }
.ct-footer ul.wp-block-list { list-style: none; padding: 0; margin: 0; }
.ct-footer ul.wp-block-list li { margin: 0 0 8px; }
.ct-footer .wp-block-image { margin-bottom: 12px; }
#offcanvas .menu a, #offcanvas .mobile-menu a, .ct-drawer-canvas .menu a { color: #FAFBFA; }
#offcanvas .menu a:hover, #offcanvas .menu .current-menu-item > a, #offcanvas .menu a:focus, .ct-drawer-canvas .menu a:hover { color: #FF9A6B; }
#offcanvas .ct-button, .ct-drawer-canvas .ct-button { margin-top: 12px; }

/* ---------- index des fiches (pages Coureurs / Courses) ---------- */
.vl-index { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 20px; margin: 24px 0 48px; }
.vl-index__card { display: flex; flex-direction: column; background: var(--theme-palette-color-8); border: 1px solid var(--theme-palette-color-5); border-radius: var(--vl-radius-card); overflow: hidden; text-decoration: none; color: inherit; transition: transform .15s ease, box-shadow .15s ease; }
.vl-index__card:hover, .vl-index__card:focus-visible { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(21,25,28,.12); }
.vl-index__visual { display: block; aspect-ratio: 16 / 9; background: var(--theme-palette-color-1); overflow: hidden; }
.vl-index__visual img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vl-index__mono { display: flex; align-items: center; justify-content: center; height: 100%; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 44px; letter-spacing: .04em; color: #FAFBFA; transform: skewX(-8deg); }
.vl-index__name { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 21px; line-height: 1.1; padding: 12px 14px 4px; color: var(--theme-heading-color); }
.vl-index__sub { font-family: 'Barlow Condensed', sans-serif; font-size: 15px; color: var(--theme-palette-color-10, #4E5A5F); padding: 0 14px; display: flex; flex-direction: column; gap: 2px; }
.vl-index__line { display: block; }
.vl-flag { width: 20px; height: 15px; vertical-align: -2px; margin-right: 4px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(21,25,28,.12); display: inline-block; }
.entry-content .vl-index__card, .entry-content .vl-index__card span { text-decoration: none; }
.entry-content .vl-index__card:hover .vl-index__name { text-decoration: underline; }
.vl-index__count { font-family: 'Barlow Condensed', sans-serif; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--vl-accent-text); padding: 8px 14px 14px; margin-top: auto; }
.vl-index__card:hover .vl-index__name { text-decoration: underline; }
@media (max-width: 480px) { .vl-index { grid-template-columns: repeat(2, 1fr); gap: 12px; } .vl-index__name { font-size: 18px; } }

/* ---------- barre de raccourcis mobile ---------- */
.vl-barre { display: none; }
@media (max-width: 999px) {
  .vl-barre { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; background: var(--theme-palette-color-8); border-top: 1px solid var(--theme-palette-color-5); padding-bottom: env(safe-area-inset-bottom); box-shadow: 0 -6px 18px rgba(21,25,28,.08); }
  .vl-barre a, .vl-barre button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 56px; color: var(--theme-heading-color); text-decoration: none; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; background: none; border: 0; padding: 0; cursor: pointer; }
  .vl-barre a:hover, .vl-barre a:focus-visible, .vl-barre button:hover { color: var(--theme-palette-color-1); }
  body { padding-bottom: 60px; }
  .ct-back-to-top { display: none !important; }
}

/* ---------- garde-fous ---------- */
a:focus-visible, button:focus-visible { outline: 3px solid var(--theme-palette-color-1); outline-offset: 2px; }
.ct-button, .wp-block-button__link { min-height: 44px; border-radius: var(--vl-radius); text-transform: uppercase; letter-spacing: .06em; font-weight: 700; }