/* Modifica n. 21 — pagina Dirette streaming */
.streaming-page { background: #101010; color: #f4f3ef; }
.streaming-hero { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; min-height: 92vh; padding: 150px 6vw 80px; overflow: hidden; }
.streaming-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(255,88,60,.11), transparent 48%); pointer-events: none; }
.streaming-hero-copy { position: relative; z-index: 2; align-self: center; max-width: 760px; }
.streaming-hero h1 { margin: 20px 0 28px; font-family: 'Barlow Condensed', sans-serif; font-size: clamp(72px, 10vw, 156px); font-weight: 700; line-height: .78; letter-spacing: -.025em; }
.streaming-hero h1 .outline { color: transparent; -webkit-text-stroke: 1px #f4f3ef; }
.streaming-hero-copy > p:not(.eyebrow) { max-width: 660px; color: #c4c1bc; font-size: clamp(18px, 1.7vw, 25px); line-height: 1.55; }
.streaming-hero-copy .button { margin-top: 32px; }
.streaming-hero-visual { position: absolute; z-index: 0; top: 0; right: 0; bottom: 0; width: 52%; }
.streaming-hero-visual::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #101010 0%, rgba(16,16,16,.5) 35%, rgba(16,16,16,.18) 100%), linear-gradient(0deg, #101010 0%, transparent 35%); }
.streaming-hero-visual img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.65) contrast(1.08); }
.streaming-back { position: absolute; z-index: 3; right: 6vw; bottom: 34px; color: #f4f3ef; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
.live-section { padding-top: 120px; padding-bottom: 120px; }
.live-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; align-items: end; margin-bottom: 48px; }
.live-heading h2, .latest-heading h2, .streaming-cta h2 { margin: 12px 0 0; font-family: 'Barlow Condensed', sans-serif; font-size: clamp(64px, 8vw, 120px); line-height: .82; }
.live-heading h2 em, .latest-heading h2 em, .streaming-cta h2 em { color: #ff583c; font-style: normal; }
.live-intro { color: #aaa9a5; font-size: 18px; line-height: 1.7; }
.live-channel-link, .all-videos-link, .service-more { display: inline-block; margin-top: 18px; padding-bottom: 8px; border-bottom: 1px solid #777; color: #f4f3ef; }
.live-channel-link:hover, .all-videos-link:hover, .service-more:hover { color: #ff583c; border-color: #ff583c; }
.live-player { position: relative; aspect-ratio: 16 / 9; background: #050505; border: 1px solid #343434; box-shadow: 0 34px 80px rgba(0,0,0,.42); }
.live-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.live-player--empty { display: grid; place-items: center; background: #070707; }
.live-empty-state { padding: 32px; text-align: center; }
.live-empty-state p { margin: 18px 0 8px; color: #f4f3ef; font-size: clamp(22px, 2.5vw, 34px); }
.live-empty-state > span:last-child { color: #777; font-size: 15px; }
.live-status-dot { display: inline-block; width: 12px; height: 12px; border: 2px solid #6b6b6b; border-radius: 50%; }
.live-caption { display: grid; grid-template-columns: .5fr 1.5fr .7fr; gap: 28px; align-items: start; padding: 28px 0; border-bottom: 1px solid #333; }
.live-caption span, .video-meta { color: #ff583c; font-size: 12px; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; }
.live-caption h3 { margin: 0; font-size: clamp(22px, 2.5vw, 36px); }
.live-caption p { margin: 4px 0 0; color: #aaa9a5; text-align: right; }
.latest-videos { padding-top: 40px; padding-bottom: 140px; }
.latest-heading { margin-bottom: 54px; }
.video-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 54px 24px; }
.video-card { display: block; color: #f4f3ef; }
.video-thumb { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; margin-bottom: 22px; background: #1b1b1b; }
.video-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease, filter .45s ease; }
.video-play { position: absolute; left: 20px; bottom: 18px; display: grid; width: 52px; height: 52px; place-items: center; padding-left: 3px; border-radius: 50%; background: #ff583c; color: #111; font-size: 16px; }
.video-card:hover img { transform: scale(1.035); filter: brightness(.78); }
.video-card h3 { margin: 10px 0 0; font-size: clamp(20px, 2vw, 28px); line-height: 1.2; }
.all-videos-link { margin-top: 54px; }
.streaming-cta { padding: 120px 6vw; background: #f2f0eb; color: #111; }
.streaming-cta .button { margin-top: 36px; }
.service-more { font-size: 13px; }
@media (max-width: 900px) {
  .streaming-hero { grid-template-columns: 1fr; min-height: 820px; padding-top: 135px; }
  .streaming-hero-visual { width: 100%; opacity: .58; }
  .streaming-hero-visual::after { background: linear-gradient(90deg, rgba(16,16,16,.96), rgba(16,16,16,.35)), linear-gradient(0deg, #101010, transparent 55%); }
  .live-heading { grid-template-columns: 1fr; gap: 28px; }
  .video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .live-caption { grid-template-columns: 1fr; gap: 8px; }
  .live-caption p { text-align: left; }
}
@media (max-width: 560px) {
  .streaming-hero { min-height: 720px; padding: 125px 24px 72px; }
  .streaming-hero h1 { font-size: clamp(64px, 23vw, 104px); }
  .streaming-back { right: 24px; }
  .live-section { padding-top: 82px; padding-bottom: 80px; }
  .latest-videos { padding-bottom: 90px; }
  .video-grid { grid-template-columns: 1fr; gap: 42px; }
  .video-play { width: 46px; height: 46px; }
  .streaming-cta { padding: 88px 24px; }
}
