/* DATA C0RE — Realtime Studies triad layout.
   Static hero mosaic + three project sections. */

.realtime-page .realtime-hero-grid{
  grid-template-columns:minmax(390px,.86fr) minmax(0,1.14fr)!important;
  gap:clamp(32px,4vw,68px)!important;
  align-items:center!important;
}
.realtime-page .realtime-hero-copy{justify-content:center!important}
.realtime-page .realtime-hero-copy h1{
  font-size:clamp(58px,7vw,112px)!important;
  margin-top:8px!important;
}
.realtime-page .realtime-hero-copy .project-intent{
  margin-top:clamp(20px,2.5vh,30px)!important;
  max-width:650px!important;
  font-size:clamp(15px,1.08vw,18px)!important;
}
.realtime-page .realtime-hero-axes{
  margin-top:clamp(24px,3vh,36px);
  border-top:1px solid var(--line);
}
.realtime-page .realtime-hero-axis{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  gap:12px;
  padding:11px 0 12px;
  border-bottom:1px solid var(--line);
}
.realtime-page .realtime-hero-axis>span{
  color:var(--acid);
  font-size:9px;
  font-weight:800;
  letter-spacing:.1em;
}
.realtime-page .realtime-hero-axis h3{
  margin:0;
  color:var(--paper);
  font-size:12px;
  line-height:1.15;
  letter-spacing:.01em;
}
.realtime-page .realtime-hero-axis p{
  margin:5px 0 0;
  max-width:580px;
  color:var(--grey);
  font-size:9px;
  line-height:1.4;
}
.realtime-page .realtime-hero-mosaic{
  height:min(66vh,700px);
  min-height:440px;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:minmax(0,1.12fr) minmax(0,.88fr);
  gap:8px;
}
.realtime-page .realtime-hero-tile{
  position:relative;
  min-width:0;
  min-height:0;
  margin:0;
  overflow:hidden;
  background:#020202;
}
.realtime-page .realtime-hero-tile--av{grid-column:1 / -1}
.realtime-page .realtime-hero-tile img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:saturate(.92) contrast(1.03);
}
.realtime-page .realtime-hero-tile figcaption{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  padding:28px 12px 10px;
  background:linear-gradient(180deg,transparent,rgba(7,7,7,.88));
  color:var(--paper);
  font-size:8px;
  line-height:1.2;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.realtime-page .realtime-study--av .realtime-study-layout{
  grid-template-columns:minmax(0,1.28fr) minmax(300px,.72fr)!important;
}
.realtime-page .realtime-study--av .realtime-study-media{order:1}
.realtime-page .realtime-study--av .realtime-study-copy{order:2}

@media(max-height:780px) and (min-width:821px) and (pointer:fine){
  .realtime-page .realtime-hero-mosaic{height:min(61vh,570px);min-height:360px}
  .realtime-page .realtime-hero-axis{padding:8px 0 9px}
  .realtime-page .realtime-hero-axis p{font-size:8.5px}
}

@media(max-width:900px){
  .realtime-page .realtime-hero-grid{grid-template-columns:1fr!important;gap:32px!important}
  .realtime-page .realtime-hero-mosaic{
    height:auto;
    min-height:0;
    grid-template-columns:1fr;
    grid-template-rows:none;
    gap:10px;
  }
  .realtime-page .realtime-hero-tile,
  .realtime-page .realtime-hero-tile--av{
    grid-column:auto;
    width:100%;
    aspect-ratio:16/9;
  }
  .realtime-page .realtime-study--av .realtime-study-layout{grid-template-columns:1fr!important}
  .realtime-page .realtime-study--av .realtime-study-copy,
  .realtime-page .realtime-study--av .realtime-study-media{order:initial}
}

@media(max-width:620px){
  .realtime-page .realtime-hero-axis{grid-template-columns:28px minmax(0,1fr);gap:9px}
  .realtime-page .realtime-hero-axis h3{font-size:11px}
  .realtime-page .realtime-hero-axis p{font-size:8.5px}
}