/* TECH MEDIA V5.12 — balanced cinematic detail overview.
   Larger display typography with the narrative visually higher on the first screen.
   This is scoped to detail sheets and preserves underlying homepage and mobile layouts. */
@media (min-width:1100px) and (min-height:741px) {
  .detail-page--overview {
    justify-content: flex-start;
    gap: clamp(18px, 2.25svh, 24px);
    padding-top: clamp(43px, 5.3svh, 58px);
    padding-bottom: clamp(24px, 3svh, 34px);
  }
  .detail-hero h2 {
    font-size: clamp(70px, min(6.3vw, 11.2svh), 102px) !important;
    line-height: .94 !important;
    letter-spacing: -.026em;
    margin-bottom: clamp(13px, 1.8svh, 18px) !important;
  }
  .detail-hero h2.detail-title--long {
    font-size: clamp(60px, min(5.2vw, 9.5svh), 84px) !important;
    line-height: .97 !important;
  }
  .detail-hero h2.detail-title--extra-long {
    font-size: clamp(55px, min(4.75vw, 8.8svh), 77px) !important;
    line-height: .99 !important;
  }
  .detail-hero { grid-template-columns:minmax(0,1.29fr) minmax(245px,.71fr);gap:clamp(26px,3.4vw,56px) }
  .detail-hero p { max-width: 730px; }
  .detail-image, .detail-image img { max-height:clamp(210px,30svh,304px)!important }
  .detail-opening { max-width: 1040px!important; padding-top:clamp(14px,2svh,21px) }
}
/* 768px laptop viewports: modest enlargement without pushing the next scroll scene. */
@media (min-width:1100px) and (min-height:741px) and (max-height:815px) {
  .detail-page--overview { padding-top: clamp(28px, 4.4svh, 40px);gap:clamp(12px,1.9svh,18px) }
  .detail-hero h2 { font-size:clamp(66px,min(5.9vw,10.3svh),88px)!important;line-height:.95!important }
  .detail-hero h2.detail-title--long { font-size:clamp(57px,min(4.9vw,8.8svh),73px)!important }
  .detail-hero h2.detail-title--extra-long { font-size:clamp(52px,min(4.5vw,8svh),66px)!important }
  .detail-image,.detail-image img {max-height:clamp(170px,25svh,225px)!important}
}
/* Keep heading and image in balance in intermediate widths. */
@media (min-width:701px) and (max-width:1099px) and (min-height:741px) {
  .detail-page--overview {justify-content:flex-start; padding-top:clamp(27px,4.2svh,42px)}
  .detail-hero h2 {font-size:clamp(53px,min(6.65vw,9.3svh),74px)!important;line-height:.97!important}
  .detail-hero h2.detail-title--long {font-size:clamp(47px,min(5.35vw,8svh),65px)!important}
  .detail-hero h2.detail-title--extra-long {font-size:clamp(43px,min(4.8vw,7.2svh),58px)!important}
}
/* Mobile retains vertically scrolling editorial content; no forced single-screen truncation. */
@media (max-width:700px) {
  .detail-hero h2.detail-title--long {font-size:clamp(36px,9.6vw,53px)!important}
  .detail-hero h2.detail-title--extra-long {font-size:clamp(33px,8.9vw,49px)!important}
}