/* Thème Antenne — famille Nova (Clochu).
   Idée : le site est un plateau de télévision. L'accueil est l'écran du plateau, avec son bandeau du bas
   et son voyant « En direct » ; le reste reste calme et net, en bleu nuit, bleu ciel et jaune signal.
   Titres : Big Shoulders Display (lettres hautes et serrées des habillages télé). Texte : Instrument Sans. */

:root {
  --night: #020B24; --studio: #061F59; --sky: #00AAFF; --signal: #FBBF24; --paper: #FFFFFF; --mist: #F2F6FC;
  --ink: #081537; --muted: #52607F; --line: #DCE4F0; --radius: 6px; --on-accent: #061F59;
  --link: #0068B8;
}
html.is-dark { --paper: #050F2E; --mist: #0A1A45; --ink: #EAF0FA; --muted: #9DAACB; --line: rgba(255,255,255,.12); --link: #5CC8FF; }
body { font-size: 1.04rem; }

/* Typographie : une échelle nette, des titres hauts et serrés */
h1, h2, h3 { font-family: var(--font-head); font-weight: 800; letter-spacing: 0; line-height: .95; }
h2 { font-size: clamp(2.6rem, 1.6rem + 3.6vw, 4.6rem); }
h3 { font-size: 1.55rem; line-height: 1; }
p, li { line-height: 1.6; }
a { color: var(--link); text-underline-offset: 3px; }
.section-head, .blk-head { max-width: 760px; margin-bottom: clamp(26px, 4vw, 44px); }
.section-head h2::after, .blk h2::after { display: none !important; }
.section-head p, .blk-head p, .lede { color: var(--muted); font-size: 1.1rem; max-width: 60ch; }
::selection { background: var(--signal); color: var(--studio); }
:focus-visible { outline: 3px solid var(--signal); outline-offset: 3px; }

/* En-tête : bande bleu nuit, menu en texte simple, page courante soulignée en jaune */
.site-header { background: var(--studio); color: #fff; box-shadow: none; }
.site-header .brand, .site-header .brand-text strong, .site-header .main-nav a, .site-header .sub-toggle { color: #fff; }
.site-header .brand img { width: 44px; height: 44px; object-fit: contain; background: #fff; border-radius: 4px; padding: 3px; }
.site-header .brand-text strong { font-family: var(--font-head); font-size: 1.7rem; font-weight: 800; }
.site-header .lang { border-color: rgba(255,255,255,.3); }
.site-header .lang a { color: rgba(255,255,255,.8); }
.site-header .lang a[aria-current] { background: var(--signal); color: var(--studio); }
.hdr-overlay .site-header, .hdr-overlay.is-scrolled .site-header { margin-bottom: 0; background: var(--studio); color: #fff; }
.hdr-overlay.is-scrolled .site-header .brand, .hdr-overlay.is-scrolled .brand-text strong, .hdr-overlay.is-scrolled .main-nav a { color: #fff; }
.main-nav { border-color: rgba(255,255,255,.14); }
@media (min-width: 1000px) {
  .main-nav a, .main-nav .nav-menu > li > .menu-heading { font-weight: 600; font-size: .98rem; padding: 12px 14px; border-radius: 0; background: none !important; position: relative; }
  .main-nav a::after { display: none; }
  .main-nav a:hover { color: var(--signal) !important; }
  .main-nav a[aria-current="page"] { color: #fff !important; box-shadow: inset 0 -4px 0 var(--signal); }
}
@media (max-width: 999px) { .hdr-overlay .main-nav.open, .main-nav.open { background: var(--studio); } .main-nav.open a { color: #fff !important; } .menu-toggle { background: var(--signal); color: var(--studio); } }

/* Boutons : jaune signal plein, contour blanc */
.btn { border-radius: 4px; font-weight: 700; padding: 14px 24px; font-size: 1rem; letter-spacing: 0; }
.btn-accent { background: var(--signal); color: var(--studio) !important; border: 0; box-shadow: none; }
.btn-accent:hover { background: #fff; color: var(--studio) !important; }
.btn-ghost { border: 2px solid currentColor; background: transparent; }
.pl .btn-ghost, .blk-sombre .btn-ghost, .blk-couleur .btn-ghost { color: #fff; }
.pl .btn-ghost:hover, .blk-sombre .btn-ghost:hover, .blk-couleur .btn-ghost:hover { background: #fff; color: var(--studio) !important; border-color: #fff; }

/* =========================================================
   Le plateau (accueil)
   ========================================================= */
.pl { position: relative; isolation: isolate; overflow: hidden; background: var(--night); color: #fff; padding: clamp(40px, 6vw, 80px) 0 clamp(56px, 7vw, 96px); }
.pl::before { content: ""; position: absolute; inset: 0; z-index: -2; background: var(--pl-bg) center 30% / cover no-repeat; opacity: .16; filter: grayscale(1) contrast(1.1); }
.pl::after { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(60% 80% at 78% 40%, rgba(0,170,255,.28), transparent 70%), linear-gradient(180deg, rgba(2,11,36,.2), var(--night) 96%); }
.pl-inner { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.pl-copy { container-type: inline-size; min-width: 0; }
.pl-name { color: #fff; margin: 0 0 22px; font-size: min(clamp(4.4rem, 2rem + 9vw, 10.5rem), 28cqi); line-height: .8; font-weight: 900; text-transform: uppercase; letter-spacing: -.01em; }
.pl-name span { display: block; }
.pl-name-2 { color: transparent; -webkit-text-stroke: 2px var(--sky); }
.pl-claim { margin: 0 0 12px; font-family: var(--font-head); font-weight: 700; font-size: clamp(1.6rem, 1.2rem + 1.3vw, 2.3rem); line-height: 1.05; color: var(--signal); max-width: 18ch; }
.pl-lede { margin: 0 0 30px; max-width: 46ch; color: rgba(255,255,255,.78); font-size: 1.08rem; }
.pl-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.pl-set { position: relative; padding-bottom: 44px; }
.pl-monitor { position: relative; padding: 12px; border-radius: 14px; background: linear-gradient(160deg, #0E2A6E, #04123A); box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 50px 90px -40px rgba(0,0,0,.9), 0 0 120px -40px rgba(0,170,255,.6); }
.pl-screen { position: relative; display: block; width: 100%; aspect-ratio: 16/9; padding: 0; border: 0; border-radius: 6px; overflow: hidden; background: #000; cursor: pointer; }
.pl-screen img { width: 100%; height: 100%; object-fit: cover; }
.pl-screen::after { content: ""; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, rgba(255,255,255,.035) 0 1px, transparent 1px 3px); pointer-events: none; }
.pl-play { position: absolute; left: 50%; top: 50%; width: 82px; height: 82px; margin: -41px; display: grid; place-items: center; border-radius: 50%; background: var(--signal); color: var(--studio); transition: transform .2s; }
.pl-play .ic { width: 34px; height: 34px; fill: currentColor; margin-left: 4px; }
.pl-screen:hover .pl-play, .pl-screen:focus-visible .pl-play { transform: scale(1.08); }
.pl-lamp { position: absolute; z-index: 2; top: 26px; left: 26px; margin: 0; display: inline-flex; align-items: center; gap: 9px; padding: 7px 12px 7px 10px; border-radius: 4px; background: rgba(2,11,36,.82); font-size: .86rem; font-weight: 600; color: #fff; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.pl-lamp i { width: 11px; height: 11px; border-radius: 50%; background: #64708F; box-shadow: inset 0 0 0 2px rgba(255,255,255,.2); }
.pl-lamp.is-live { background: #E11D48; }
.pl-lamp.is-live i { background: #fff; box-shadow: 0 0 0 4px rgba(255,255,255,.3); animation: pl-blink 1.4s ease-in-out infinite; }
@keyframes pl-blink { 50% { opacity: .35; } }
.pl-third { position: absolute; left: -28px; right: 18%; bottom: 0; display: grid; grid-template-columns: 10px 1fr; column-gap: 16px; padding: 14px 20px 14px 0; background: #fff; color: var(--studio); border-radius: 2px; box-shadow: 0 20px 40px -20px rgba(0,0,0,.7); }
.pl-third::before { content: ""; grid-row: 1 / span 2; background: var(--signal); }
.pl-third strong { font-family: var(--font-head); font-size: clamp(1.2rem, 1rem + .8vw, 1.6rem); line-height: 1.05; font-weight: 800; }
.pl-third span { margin-top: 4px; font-size: .88rem; color: var(--muted); }
/* Le seul moment animé : l'écran s'allume, puis le bandeau entre */
@keyframes pl-on { 0% { opacity: 0; transform: scaleY(.02); filter: brightness(3); } 45% { opacity: 1; transform: scaleY(1); filter: brightness(2); } 100% { filter: none; } }
@keyframes pl-in { from { transform: translateX(-30px); opacity: 0; } to { transform: none; opacity: 1; } }
.pl-screen { animation: pl-on .7s .25s cubic-bezier(.2,.8,.2,1) both; }
.pl-third { animation: pl-in .6s 1s cubic-bezier(.2,.8,.2,1) both; }
@media (max-width: 899px) {
  .pl-inner { grid-template-columns: 1fr; }
  .pl-name { font-size: min(clamp(4rem, 1rem + 16vw, 7rem), 27cqi); }
  .pl-third { left: 10px; right: 10px; }
}
@media (prefers-reduced-motion: reduce) { .pl-screen, .pl-third, .pl-lamp i { animation: none !important; } }

/* Chiffres clés : une ligne sobre sous le plateau */
.stats-band { background: var(--studio); color: #fff; padding: 0; }
.stats-band .stats { background: transparent; box-shadow: none; border: 0; padding: 26px 0; margin: 0 auto; border-radius: 0; }
.stats strong { font-family: var(--font-head); font-weight: 900; font-size: clamp(2.6rem, 1.8rem + 2.4vw, 4rem); color: #fff; line-height: 1; }
.stats span { color: rgba(255,255,255,.72); font-size: .92rem; text-transform: none; letter-spacing: 0; opacity: 1; }
.stats > div { border-left: 4px solid var(--signal); padding-left: 16px; }
@media (max-width: 720px) { .stats-band .stats { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; padding: 22px 16px; width: 100%; } }

/* Fonds de section */
.blk-clair { background: var(--paper); }
.blk-teinte { background: var(--mist); }
.blk-sombre { background: var(--night); color: #fff; }
.blk-couleur { background: var(--studio); color: #fff; }
.blk-sombre .section-head p, .blk-couleur .section-head p, .blk-sombre .blk-head p, .blk-couleur .blk-head p { color: rgba(255,255,255,.72); }
.blk-sombre a:not(.btn):not(.sch-go), .blk-couleur a:not(.btn):not(.sch-go) { color: #7FD4FF; }

/* Bandeau défilant : le bandeau d'information du plateau */
.blk-marquee.blk-couleur { background: var(--signal); color: var(--studio); }
.blk-marquee .mq-label { background: var(--studio); color: #fff; text-transform: none; letter-spacing: 0; font-size: .95rem; clip-path: none; padding-right: 22px; }
.blk-marquee .mq-run { font-size: 1.05rem; font-weight: 600; }
.blk-marquee .mq-run a, .blk-marquee .mq-run span { color: var(--studio) !important; }
.blk-marquee .mq-run i { color: var(--studio); opacity: .5; }
.blk-marquee .mq-view { -webkit-mask-image: none; mask-image: none; }

/* Grille des programmes : comme un guide télé, une ligne par émission */
.sch-now { border-radius: 0; background: transparent; border: 0; border-left: 6px solid var(--sky); padding: 6px 0 6px 16px; }
.sch-now.is-live { border-left-color: #E11D48; background: transparent; }
.sch-now-k { text-transform: none; letter-spacing: 0; font-size: .95rem; color: inherit; opacity: .75; font-weight: 600; }
.sch-now strong { font-family: var(--font-head); font-size: 1.8rem; }
.sch-tabs { gap: 0; border-bottom: 2px solid var(--line); }
.sch-tab { border: 0; border-radius: 0; background: none; padding: 12px 6px; box-shadow: inset 0 -4px 0 transparent; }
.sch-tab[aria-selected="true"] { background: none; color: inherit; box-shadow: inset 0 -4px 0 var(--signal); }
.sch-tab[aria-selected="true"] small { color: var(--muted); }
.sch-tab b { font-size: 1rem; }
.blk-sombre .sch-tabs { border-color: rgba(255,255,255,.14); }
.blk-sombre .sch-tab { background: none !important; }
.sch-list { gap: 0; }
.sch-item, .sch-item:not(:has(.sch-img)) { grid-template-columns: 120px 1fr; border-radius: 0; border: 0; border-bottom: 1px solid var(--line); background: none !important; padding: 22px 0; }
.sch-item:has(.sch-img) { grid-template-columns: 120px 1fr 200px; }
.sch-item .sch-img { grid-column: 3; grid-row: 1; width: 200px; border-radius: 4px; }
.sch-item:hover { box-shadow: none; transform: none; border-color: var(--line); }
.sch-item.is-live { box-shadow: inset 6px 0 0 #E11D48; padding-left: 18px; border-color: var(--line); }
.sch-time strong { font-size: 2.4rem; font-weight: 800; color: inherit; }
.sch-body h3 { font-size: 2rem; margin: 8px 0 6px; }
.sch-flags span { border-radius: 3px; text-transform: none; letter-spacing: 0; font-size: .8rem; }
.sch-next { background: var(--sky); color: var(--studio); }
.sch-go, .sch-go.video-load { border-radius: 4px; background: var(--signal) !important; color: var(--studio) !important; }
.sch-go:hover { background: #fff !important; }
.blk-sombre .sch-item, .blk-sombre .sch-item:not(:has(.sch-img)) { border-color: rgba(255,255,255,.12); }
.sch-liste .sch-list { grid-template-columns: 1fr; gap: 0; }
.sch-liste .sch-item, .sch-liste .sch-item:not(:has(.sch-img)) { grid-template-columns: 120px 1fr; padding: 22px 0; overflow: visible; }
.sch-liste .sch-item:has(.sch-img) { grid-template-columns: 120px 1fr 220px; }
.sch-liste .sch-img { order: 0; grid-column: 3; aspect-ratio: 16/10; border-radius: 4px; }
.sch-liste .sch-time { display: block; padding: 0; }
.sch-liste .sch-body { padding: 0; }
@media (max-width: 760px) {
  .sch-item, .sch-item:not(:has(.sch-img)), .sch-item:has(.sch-img), .sch-liste .sch-item, .sch-liste .sch-item:has(.sch-img) { grid-template-columns: 78px 1fr; }
  .sch-item .sch-img, .sch-liste .sch-img { grid-column: 1 / -1; grid-row: auto; width: 100%; }
  .sch-time strong { font-size: 1.8rem; } .sch-body h3 { font-size: 1.5rem; }
}

/* Vidéos */
.video-load { border-radius: 4px; }
.video-load .play, .ep-embed .play { background: var(--signal) !important; color: var(--studio) !important; box-shadow: none !important; }

/* Texte et photo : photo nette, sans cadre décalé */
.btxtimg img, .blk-text_image img { border-radius: 4px; box-shadow: none; object-position: center 25%; }

/* Alvéoles (les entités) : rappel des hexagones du plateau */
.bhive-hex { background: var(--paper); }
.blk-teinte .bhive-hex { background: #fff; }
.bhive-face strong { font-size: 1.3rem; color: var(--studio); }
.bhive-hex:hover, .bhive-hex:focus-visible { background: var(--studio); }
.bhive-hex:hover .bhive-text, .bhive-hex:focus-visible .bhive-text { color: #fff; }

/* Podium et générique */
.blk-sombre .bpodium strong, .blk-couleur .bpodium strong { color: #fff; }
.bpodium-1 .bpodium-step { background: var(--signal); color: var(--studio); }
.bpodium-2 .bpodium-step, .bpodium-3 .bpodium-step { background: rgba(255,255,255,.12); color: #fff; }
.blk-clair .bpodium-2 .bpodium-step, .blk-clair .bpodium-3 .bpodium-step, .blk-teinte .bpodium-2 .bpodium-step, .blk-teinte .bpodium-3 .bpodium-step { background: var(--studio); }
.bcredits strong { font-size: 1.9rem; font-weight: 800; }
.blk-sombre .bcredits span, .blk-couleur .bcredits span { color: rgba(255,255,255,.65); }
.blk-cards:has(.bcredits) .blk-head, .blk-cards:has(.bhive) .blk-head { text-align: center; margin-left: auto; margin-right: auto; }
.blk-cards:has(.bcredits) .blk-head p, .blk-cards:has(.bhive) .blk-head p { margin-left: auto; margin-right: auto; }

/* Compte à rebours : chiffres de régie */
.bcount { text-align: left; }
.bcount h2 { max-width: 16ch; font-size: clamp(2.6rem, 1.6rem + 3.6vw, 4.6rem); line-height: .95; }
.bcount .countdown { justify-content: flex-start; gap: 10px; }
.bcount .countdown > div { background: transparent; border: 0; border-top: 4px solid var(--signal); border-radius: 0; padding: 12px 18px 0 0; min-width: 110px; }
.bcount .countdown b { font-family: var(--font-head); font-weight: 900; font-size: clamp(3rem, 2rem + 3vw, 5rem); color: #fff; }
.bcount .countdown span { text-transform: none; letter-spacing: 0; opacity: .7; }
.bcount .blk-actions { justify-content: flex-start; }

/* Citation, appel à l'action */
.blk-quote blockquote, .bquote blockquote { font-family: var(--font-head); font-weight: 800; font-size: clamp(2rem, 1.2rem + 3vw, 3.6rem); line-height: 1; }
.blk-cta h2, .cta-band h2 { max-width: 18ch; }

/* Formulaires */
.bform .form, .bcontact-form, .wf { border-radius: 6px; box-shadow: none; }
.wf input:focus, .wf textarea:focus, .wf select:focus { border-color: var(--sky); box-shadow: 0 0 0 3px rgba(0,170,255,.18); }

/* Réseaux */
.bsocial .soc { border-radius: 4px; font-weight: 700; }

/* Pied de page */
.site-footer { background: var(--night); color: rgba(255,255,255,.75); border-top: 6px solid var(--signal); }
.site-footer .footer-name { font-family: var(--font-head); font-weight: 900; font-size: 2.4rem; color: #fff; text-transform: uppercase; }
.site-footer a { color: rgba(255,255,255,.85); }
.site-footer a:hover { color: var(--signal); }
@media (max-width: 700px) { .site-header .brand-text strong { font-size: 1.35rem; } .btn { padding: 13px 18px; } }

.lum-playall, [data-playall], .vid-actions .btn { border-radius: 4px !important; }