body{padding-bottom:88px}.logo img{width:180px}.logo span{display:none}.about-layout{display:grid;grid-template-columns:1fr .9fr .55fr;align-items:center;gap:32px}.about-photo{align-self:stretch;display:grid;place-items:end center;background:radial-gradient(circle,rgba(255,48,65,.25),transparent 60%);border:1px solid var(--line);border-radius:16px;overflow:hidden}.about-photo img{max-height:480px;object-fit:contain}.stat-stack{display:grid;gap:28px}.stat-stack div{padding-left:52px;position:relative}.stat-stack div:before{content:'◎';position:absolute;left:0;top:0;width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--accent);border-radius:50%;color:var(--accent)}.stat-stack strong,.stat-stack span{display:block}.stat-stack strong{font-size:25px}.stat-stack span{color:var(--muted);font-size:13px}.project-grid,.library-grid,.shooting-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.project-grid article,.library-grid article,.embed-card,.cards article{border:1px solid var(--line);background:linear-gradient(145deg,rgba(10,10,10,.95),rgba(10,10,10,.95));border-radius:12px;overflow:hidden}.project-grid img,.library-grid img{width:100%;aspect-ratio:16/10;object-fit:cover}.project-grid h3,.project-grid p,.library-grid h3,.library-grid p{padding:0 16px}.project-grid p,.library-grid p{color:var(--muted)}.section-head{max-width:760px;margin-bottom:28px}.shooting-grid{grid-template-columns:repeat(4,1fr)}.shooting-grid img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:10px;border:1px solid var(--line)}.load-more{display:flex;margin:28px auto 0;border:0}.embed-card{padding:18px}.embed-card p{color:var(--muted);font-size:13px}.twitch-placeholder{min-height:320px;display:grid;place-content:center;text-align:center;gap:16px;background:radial-gradient(circle at 50% 30%,rgba(183,0,14,.35),transparent 45%),#0a0a0a}.twitch-placeholder strong{font-size:32px}.twitch-placeholder span{max-width:520px;color:var(--muted)}.cards.four{grid-template-columns:repeat(4,1fr)}.radio-brand img{width:42px;height:42px;border-radius:50%;object-fit:cover;margin-right:10px}.radio-brand{display:flex;align-items:center}.volume-control{display:flex;gap:8px;align-items:center}.volume-control input{width:86px}.radio-dock{z-index:2000}.radio-dock.playing .wave i{animation:bars .6s ease-in-out infinite alternate}.radio-dock.playing .wave i:nth-child(2n){animation-delay:.15s}.radio-dock.playing .wave i:nth-child(3n){animation-delay:.28s}@keyframes bars{from{transform:scaleY(.3)}to{transform:scaleY(1)}}
@media(max-width:1050px){.about-layout{grid-template-columns:1fr 1fr}.stat-stack{grid-column:1/-1;grid-template-columns:repeat(4,1fr)}.project-grid,.library-grid{grid-template-columns:repeat(2,1fr)}.shooting-grid{grid-template-columns:repeat(3,1fr)}.cards.four{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.about-layout{grid-template-columns:1fr}.stat-stack{grid-template-columns:repeat(2,1fr)}.project-grid,.library-grid,.shooting-grid,.cards.four{grid-template-columns:1fr}.radio-dock{grid-template-columns:minmax(0,1fr) auto auto}.radio-dock .prev,.radio-dock .wave,.radio-dock .live,.volume-control{display:none}.radio-brand small,.radio-brand b{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hero{min-height:760px}.hero-visual{min-height:390px}.topbar .contact-pill{display:none}}

/* Vraie bibliothèque d'interviews vidéo */
.library-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:22px!important;
  overflow:visible!important;
}
.interview-video-card{
  min-width:0;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(145deg,rgba(10,10,10,.96),rgba(10,10,10,.96));
  box-shadow:0 18px 45px rgba(0,0,0,.28);
  transition:transform .25s ease,border-color .25s ease;
}
.interview-video-card:hover{transform:translateY(-5px);border-color:rgba(255,48,65,.7)}
.interview-video-card video{
  display:block;
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  background:#040404;
}
.interview-video-copy{padding:17px 18px 20px}
.interview-video-copy span{color:var(--accent);font-size:11px;font-weight:900;letter-spacing:.12em}
.interview-video-copy h3{margin:8px 0 7px;font-size:18px;line-height:1.25}
.interview-video-copy p{margin:0;color:var(--muted);font-size:13px;line-height:1.55}
@media(max-width:1050px){.library-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:650px){.library-grid{grid-template-columns:1fr!important}.interview-video-copy{padding:14px 15px 17px}}
.project-text-card{min-height:230px;display:flex;flex-direction:column;justify-content:flex-end;padding:24px;background:linear-gradient(145deg,rgba(10,10,10,.96),rgba(10,10,10,.98)),radial-gradient(circle at 80% 10%,rgba(255,48,65,.25),transparent 12rem)}
.project-text-card>span{color:var(--accent);font-size:11px;font-weight:900;letter-spacing:.12em}
.project-text-card h3{margin:10px 0 6px}
.section-head>p:last-child{max-width:760px;color:var(--muted)}

/* Carrousel final des passages TV — tri chronologique décroissant */
.tv-section{display:grid;gap:28px}.tv-section .section-head{max-width:760px}.tv-carousel{display:grid;grid-template-columns:46px minmax(0,1fr) 46px;gap:14px;align-items:center}.tv-track{display:flex;gap:18px;overflow-x:auto;padding:8px 3px 20px;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--accent) rgba(255,255,255,.08)}.tv-card{flex:0 0 min(430px,82%);scroll-snap-align:start;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:linear-gradient(145deg,rgba(10,10,10,.96),rgba(10,10,10,.98));box-shadow:0 18px 45px rgba(0,0,0,.28);transition:transform .25s ease,border-color .25s ease}.tv-card:hover{transform:translateY(-5px);border-color:rgba(255,48,65,.7)}.tv-card video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#040404}.tv-card-copy{padding:16px 18px 20px}.tv-card-copy time{display:block;margin-bottom:7px;color:var(--accent);font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.tv-card-copy h3{margin:0;font-size:18px;line-height:1.35}.carousel-arrow{display:grid;width:44px;height:44px;place-items:center;border:1px solid var(--line);border-radius:50%;background:rgba(10,10,10,.96);color:#ffffff;font-size:30px;cursor:pointer;transition:transform .2s ease,border-color .2s ease}.carousel-arrow:hover{transform:scale(1.08);border-color:var(--accent)}@media(max-width:700px){.tv-carousel{grid-template-columns:1fr}.carousel-arrow{display:none}.tv-card{flex-basis:88%}.tv-track{padding-bottom:14px}}


/* Interviews : même carrousel et mêmes cartes que les passages TV */
.interview-section{display:grid;gap:28px}
.interview-carousel{display:grid;grid-template-columns:46px minmax(0,1fr) 46px;gap:14px;align-items:center}
.interview-track{
  display:flex!important;
  grid-template-columns:none!important;
  gap:18px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:8px 3px 20px!important;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  overscroll-behavior-inline:contain;
  scrollbar-width:thin;
  scrollbar-color:var(--accent) rgba(255,255,255,.08)
}
.interview-track .interview-video-card{
  flex:0 0 min(430px,82%)!important;
  min-width:min(430px,82%)!important;
  scroll-snap-align:start;
  display:block;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(145deg,rgba(10,10,10,.96),rgba(10,10,10,.98));
  box-shadow:0 18px 45px rgba(0,0,0,.28)
}
.interview-track .interview-video-card video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#040404}
.interview-track .interview-video-copy{padding:16px 18px 20px}
.interview-track .interview-video-copy time{display:block;margin-bottom:7px;color:var(--accent);font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.interview-track .interview-video-copy h3{margin:0;font-size:18px;line-height:1.35}
@media(max-width:700px){
  .interview-carousel{grid-template-columns:1fr}
  .interview-carousel>.carousel-arrow{display:none}
  .interview-track .interview-video-card{flex-basis:88%!important;min-width:88%!important}
  .interview-track{padding-bottom:14px!important}
}


/* Interviews optimisées : miniatures légères et lecture d'une seule vidéo dans une modale. */
.interview-light-card{position:relative}
.interview-thumbnail{position:relative;display:block;width:100%;aspect-ratio:16/9;padding:0;border:0;overflow:hidden;background:linear-gradient(135deg,#0a0a0a,#040404);cursor:pointer;color:#ffffff}
.interview-thumbnail img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease,filter .35s ease}
.interview-thumbnail::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(4,4,4,.82));transition:background .25s ease}
.interview-thumbnail:hover img{transform:scale(1.035);filter:brightness(.82)}
.interview-thumbnail.no-thumbnail::before{content:"INTERVIEW";position:absolute;inset:0;display:grid;place-items:center;font-size:clamp(24px,4vw,42px);font-weight:900;letter-spacing:.13em;color:rgba(255,255,255,.16)}
.interview-play{position:absolute;z-index:2;left:50%;top:50%;display:grid;width:64px;height:64px;place-items:center;border:1px solid rgba(255,255,255,.48);border-radius:50%;background:rgba(255,48,65,.88);box-shadow:0 14px 34px rgba(255,48,65,.4);font-size:25px;transform:translate(-50%,-50%);transition:transform .2s ease,background .2s ease}
.interview-thumbnail:hover .interview-play{transform:translate(-50%,-50%) scale(1.08);background:#ff3041}
.interview-watch{position:absolute;z-index:2;left:16px;bottom:14px;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.interview-modal[hidden]{display:none}
.interview-modal{position:fixed;z-index:10000;inset:0;display:grid;place-items:center;padding:22px;background:rgba(4,4,4,.9);backdrop-filter:blur(12px)}
.interview-modal-panel{position:relative;width:min(1000px,96vw);padding:24px;border:1px solid rgba(255,48,65,.35);border-radius:20px;background:#0a0a0a;box-shadow:0 35px 100px rgba(0,0,0,.62)}
.interview-modal-panel h2{margin:0 44px 18px 0;font-size:clamp(18px,2.4vw,27px)}
.interview-modal-panel video{display:block;width:100%;max-height:72vh;border-radius:14px;background:#000000}
.interview-modal-close{position:absolute;right:16px;top:13px;width:38px;height:38px;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:rgba(255,255,255,.07);color:#ffffff;font-size:28px;line-height:1;cursor:pointer}
.interview-modal-close:hover{background:rgba(255,255,255,.15)}
body.modal-open{overflow:hidden}
@media(max-width:650px){.interview-play{width:54px;height:54px;font-size:21px}.interview-modal{padding:10px}.interview-modal-panel{padding:16px;border-radius:15px}.interview-modal-panel h2{margin-bottom:13px;font-size:17px}.interview-modal-panel video{max-height:76vh}}

/* Player radio compact + métadonnées visibles */
body{padding-bottom:72px}
.radio-dock.compact-radio{
  left:50%;right:auto;bottom:10px;transform:translateX(-50%);
  width:min(680px,calc(100% - 24px));min-height:54px;
  grid-template-columns:minmax(0,1fr) 40px auto 105px;
  gap:10px;padding:6px 10px;border-radius:14px;
}
.compact-radio .radio-brand{min-width:0;gap:9px}
.compact-radio .radio-brand img{width:38px;height:38px;margin:0;flex:0 0 auto;border-radius:9px}
.compact-radio .radio-metadata{min-width:0;line-height:1.15}
.compact-radio .radio-metadata b,.compact-radio .radio-metadata small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.compact-radio .radio-metadata b{font-size:13px}
.compact-radio .radio-metadata small{margin-top:4px;font-size:10px;color:#e30613}
.compact-radio .play{width:38px;height:38px;font-size:14px}
.compact-radio .live-badge{padding:5px 7px;border-radius:5px;background:#ff3041;font-size:8px;font-weight:900;letter-spacing:.08em}
.compact-radio .volume-control{display:flex;min-width:0}
.compact-radio .volume-control input{width:100%;margin:0}
@media(max-width:700px){
  body{padding-bottom:68px}
  .radio-dock.compact-radio{width:calc(100% - 14px);bottom:7px;grid-template-columns:minmax(0,1fr) 38px 44px;padding:6px 8px}
  .compact-radio .radio-brand img{width:34px;height:34px}
  .compact-radio .radio-metadata b{font-size:11px}
  .compact-radio .radio-metadata small{display:block!important;max-width:none;font-size:9px}
  .compact-radio .live-badge{display:none}
  .compact-radio .volume-control{display:flex!important}
}
