/* Shared desktop rails expand with the viewport; reading widths stay local. */
.topic-card,.media-item,.playlist-category,.format,.story>div,.press-grid>*,.booking-grid>*,.identity-grid>*{min-width:0}
.topic-card h3,.format h3,.venture-brand,.player-info h2{overflow-wrap:break-word}
.player-navigation{flex-shrink:0}

@media(min-width:1200px){
  :root{--desktop-gutter:clamp(38px,4vw,128px)}
  .wrap{width:100%;max-width:2880px;padding-inline:var(--desktop-gutter)}
  .section{padding-block:clamp(34px,3vw,80px)}
  .section-head{gap:clamp(50px,4vw,100px);margin-bottom:clamp(22px,2vw,48px)}
  .section-head h2{font-size:clamp(47px,3vw,58px)}
  .section-head>p{max-width:480px;font-size:clamp(12px,.72vw,14px)}
  .footer{padding-block:clamp(25px,2vw,48px)}

  /* A top anchor protects the face when cover crops a wide stage photograph. */
  .hero-photo{object-position:center top}
  .hero-content{max-width:620px}
  .hero-content p{max-width:56ch;font-size:clamp(12px,.72vw,15px)}
  .topic-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(25px,2.5vw,64px)}
  .topic-card h3{font-size:clamp(20px,1.25vw,27px)}
  .topic-card p{max-width:38ch;font-size:clamp(12px,.72vw,14px)}
  .signature-photo{max-width:2560px;left:auto;right:15%;object-position:center top}
  .signature-content{padding-block:clamp(48px,2.5vw,68px)}
  .signature-copy{max-width:620px}
  .signature-copy p{max-width:56ch;font-size:clamp(12px,.72vw,14px)}
  .signature-quote{width:clamp(165px,11vw,245px);font-size:clamp(24px,1.4vw,30px)}
  .media-strip{grid-template-columns:minmax(250px,.9fr) minmax(0,3.1fr);gap:clamp(36px,3vw,80px)}
  .media-strip>div:first-child{max-width:440px}
  .media-strip p{max-width:45ch;font-size:clamp(11px,.65vw,13px)}
  .media-previews{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,1.5vw,36px)}

  /* Speaking keeps its image, headline and right-hand narrative in proportion. */
  .speaking-banner-photo,.booking-banner-photo{width:min(100%,2560px);left:auto;right:0;object-position:center top}
  .speaking-banner-layout{grid-template-columns:minmax(0,1fr) 300px;gap:clamp(65px,7vw,180px);min-height:clamp(380px,18vw,480px);padding-block:clamp(58px,3.5vw,88px)}
  .speaking-banner .lead{max-width:62ch}
  .speaking-topics{padding-top:clamp(12px,1.5vw,36px)}
  .speaking-topics .topic-detail{grid-template-columns:minmax(260px,.85fr) minmax(0,2.15fr);gap:clamp(34px,2.5vw,64px) clamp(44px,3.5vw,96px);padding:clamp(40px,2.5vw,64px);margin-bottom:clamp(28px,2vw,48px)}
  .topic-info{gap:clamp(36px,3vw,80px)}
  .topic-info h2{font-size:clamp(36px,2.3vw,48px)}
  .topic-headline{max-width:620px}
  .topic-headline .topic-summary{max-width:48ch;font-size:clamp(14px,.8vw,16px)}
  .topic-narrative{padding-left:clamp(26px,2vw,48px)}
  .topic-narrative p{max-width:48ch;font-size:clamp(14px,.8vw,16px)}
  .topic-info .audience{max-width:50ch}
  .topic-takeaways{padding:clamp(26px,2vw,44px)}
  .takeaway-grid{gap:clamp(26px,2vw,48px)}
  .topic-takeaways .takeaway-copy{max-width:58ch;font-size:clamp(13px,.75vw,15px)}
  .formats-four{gap:clamp(28px,2.5vw,64px)}
  .format p{max-width:52ch;font-size:clamp(12px,.7vw,14px)}

  /* About images can grow without turning paragraphs into long horizontal runs. */
  .identity-grid{gap:clamp(55px,7vw,180px);align-items:center;padding-block:clamp(35px,3vw,80px)}
  .identity-content{max-width:680px}
  .identity-content h1{font-size:clamp(62px,3.6vw,76px)}
  .identity-content>p:not(.eyebrow){max-width:52ch;font-size:clamp(13px,.75vw,15px)}
  .identity-roles li{padding-bottom:clamp(24px,1.5vw,36px)}
  .identity-roles li:last-child{padding-bottom:0}
  .identity-roles h3{font-size:clamp(22px,1.4vw,28px)}
  .identity-roles p{font-size:clamp(12px,.7vw,14px)}
  .identity-portrait{width:100%;max-width:960px;height:clamp(590px,32vw,820px);min-height:590px;justify-self:end}
  .story{gap:clamp(65px,6vw,160px)}
  .story-title{max-width:640px}
  .story p{max-width:68ch;font-size:clamp(14px,.8vw,16px)}
  .timeline-item p{font-size:clamp(12px,.7vw,14px)}
  .timeline{max-width:900px}

  /* The media stage grows, with a practical ceiling for video and booking inputs. */
  .playlist-categories{gap:clamp(22px,2vw,48px)}
  .category-copy strong{font-size:clamp(20px,1.2vw,28px)}
  .playlist-panel{grid-template-columns:minmax(0,1fr) clamp(320px,22vw,480px);gap:clamp(26px,2vw,48px);max-width:2240px;margin-inline:auto}
  .queue-thumbnail{width:clamp(83px,5vw,132px)}
  .queue-copy strong{font-size:clamp(16px,.9vw,20px)}
  .press-grid{gap:clamp(65px,5vw,128px)}
  .bio-panel{padding:clamp(30px,2vw,52px)}
  .bio-panel p,.press-item p{max-width:65ch;font-size:clamp(13px,.75vw,15px)}
  .booking-banner{min-height:clamp(380px,17vw,480px)}
  .booking-banner .page-intro{max-width:760px;padding-block:clamp(66px,4vw,96px)}
  .booking-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(70px,4vw,120px);max-width:1920px;margin-inline:auto}
  .booking-side p{max-width:52ch}
  .booking-facts{max-width:600px}
}

@media(min-width:1600px){
  .hero{min-height:clamp(590px,25vw,760px)}
  .hero-content{padding-block:clamp(65px,3vw,96px)}
  .signature{min-height:clamp(345px,15vw,440px)}
}

/* Keep the photograph's scale reasonable on exceptionally wide displays. */
@media(min-width:3840px){.hero-photo{width:3840px;left:auto;right:calc((100% - 3840px)/2)}}
@media(min-width:3841px){.hero-photo{-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}}

/* At narrow tablet widths, two full brand groups need their own rows. */
@media(min-width:481px) and (max-width:650px){
  .about-ventures .venture-grid{grid-template-columns:1fr}
  .about-ventures .venture-brand{font-size:20px}
  .about-ventures .venture-card:first-child{border-right:0;border-bottom:1px solid transparent;border-radius:10px 10px 0 0}
  .about-ventures .venture-card:last-child{border-radius:0 0 10px 10px}
  .about-ventures .venture-card:last-child:before{content:none}
  .about-ventures .venture-grid:has(.venture-card:last-child:focus-visible) .venture-card:first-child:after{opacity:0}
}
@media(min-width:481px) and (max-width:650px) and (hover:hover) and (pointer:fine){.about-ventures .venture-grid:has(.venture-card:last-child:hover) .venture-card:first-child:after{opacity:0}}
