/* Reference-aligned composition with a cleaned poster layer and editable copy. */
@layer sleep-disruption-reference {
  html body #disrupted-sleep :is(p,h3,.sh-number) { font-family:"Sleep Roboto Condensed",sans-serif!important; letter-spacing:0!important; margin:0!important; }
  html body #disrupted-sleep #disruption-title {
    font-family:var(--site-font)!important;
    font-size:3.8cqw!important;
    font-weight:var(--arotec-display-weight)!important;
    line-height:1.02!important;
    letter-spacing:-.025em!important;
    text-transform:none!important;
    white-space:nowrap!important;
    text-wrap:nowrap!important;
    margin:0!important;
    color:#020d2b!important;
  }
  html body #disrupted-sleep .sh-intro > p { font-size:1.513671875cqw!important; line-height:1.096774!important; font-weight:400!important; color:#193b69!important; }
  html body #disrupted-sleep .sh-number { font-size:3.369140625cqw!important; line-height:1!important; font-weight:700!important; color:#3ed7ef!important; }
  html body #disrupted-sleep h3 { font-size:1.7578125cqw!important; line-height:1!important; font-weight:700!important; text-transform:uppercase!important; color:#f7f7fa!important; }
  html body #disrupted-sleep .sh-disruption-list p { font-size:1.46484375cqw!important; line-height:1.083333!important; font-weight:400!important; color:#b4d0e5!important; }
}
#disrupted-sleep { container-type:inline-size; }
#disrupted-sleep .sh-scene { display:block; min-height:0; height:auto; aspect-ratio:3154 / 1774; }
#disrupted-sleep .sh-disruption-picture { position:absolute; inset:0; display:block; }
#disrupted-sleep .sh-art { position:absolute; inset:0; width:100%; height:100%; object-fit:fill; }
#disrupted-sleep .sh-intro { position:absolute; inset:2.75% auto auto 12.4%; width:45%; max-width:none; margin:0; padding:0; background:none; }
#disrupted-sleep .sh-intro > p { position:absolute; top:8.15cqw; left:0; width:max-content; max-width:none; white-space:nowrap; transform:scaleX(.97); transform-origin:left top; }
#disrupted-sleep .sh-disruption-list { position:absolute; inset:0; display:block; margin:0; padding:0!important; }
#disrupted-sleep .sh-disruption-list > li { position:absolute; top:69.95%; width:22%; padding:0; margin:0; }
#disrupted-sleep .sh-disruption-architecture { left:3.91%; }
#disrupted-sleep .sh-disruption-stress { left:29.84%; }
#disrupted-sleep .sh-disruption-peripheral { left:52.35%; }
#disrupted-sleep .sh-disruption-strain { left:76.8%; }
#disrupted-sleep .sh-number { position:absolute; top:0; left:0; }
#disrupted-sleep h3 { position:absolute; top:3.6cqw; left:0; width:max-content; white-space:nowrap; transform:scaleX(.95); transform-origin:left top; }
#disrupted-sleep .sh-disruption-list p { position:absolute; top:7.6cqw; left:0; width:max-content; white-space:nowrap; transform:scaleX(.96); transform-origin:left top; }
#disrupted-sleep .sh-disruption-mobile-art { display:none; }

@media(max-width:1199px) {
  #disrupted-sleep .sh-scene { display:flex; flex-direction:column; aspect-ratio:auto; }
  #disrupted-sleep .sh-intro { position:static; order:-1; display:grid; gap:20px; width:auto; margin:0 24px; padding:32px 0 28px; }
  #disrupted-sleep .sh-intro > p { position:static; width:auto; white-space:normal; transform:none; }
  #disrupted-sleep .sh-disruption-picture { position:static; order:0; }
  #disrupted-sleep .sh-art { position:static; width:100%; height:auto; aspect-ratio:16/9; }
  #disrupted-sleep .sh-disruption-break { display:none; }
  #disrupted-sleep .sh-disruption-list { position:static; order:1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px 32px; margin:32px 24px; }
  #disrupted-sleep .sh-disruption-list > li { position:static; width:auto; }
  #disrupted-sleep .sh-number, #disrupted-sleep h3, #disrupted-sleep .sh-disruption-list p { position:static; width:auto; white-space:normal; transform:none; }
  #disrupted-sleep .sh-disruption-mobile-art { display:block; width:100%; max-width:420px; height:130px; object-fit:contain; object-position:left center; margin:0 0 22px; }
  #disrupted-sleep .sh-disruption-hpa { position:relative; }
  #disrupted-sleep .sh-disruption-hpa img { display:block; width:auto; height:100%; }
  #disrupted-sleep .sh-disruption-hpa span { position:absolute; left:135px; top:29%; font:16px/1.3 "Sleep Roboto Condensed",sans-serif; color:#e3eaf4; }
  #disrupted-sleep .sh-disruption-hpa span:last-child { top:68%; }
  @layer sleep-disruption-reference {
    html body #disrupted-sleep #disruption-title { font-size:clamp(30px,4.5vw,52px)!important; line-height:1.1!important; white-space:normal!important; text-wrap:wrap!important; color:#f6f8ff!important; }
    html body #disrupted-sleep .sh-intro > p { font-size:18px!important; line-height:1.5!important; color:#e3eaf4!important; }
    html body #disrupted-sleep .sh-number { font-size:38px!important; margin-bottom:12px!important; }
    html body #disrupted-sleep .sh-disruption-list h3 { font-size:23px!important; line-height:1.2!important; margin-bottom:12px!important; }
    html body #disrupted-sleep .sh-disruption-list p { font-size:18px!important; line-height:1.5!important; }
  }
}
@media(max-width:700px) { #disrupted-sleep .sh-disruption-list { grid-template-columns:1fr; } }
