/* Large displays keep the same hierarchy and layout, with a larger stage.
   Deliberately inactive at <=1600px: the approved laptop/mobile layouts remain
   the baseline. Load after editorial.css and product-hologram.css. */
@media (min-width:1601px){
 :root{
  --wide-stage:min(96vw,3200px);
  --wide-gutter:clamp(64px,4vw,128px);
  --chapter-title-size:clamp(44px,2.5vw,96px);
  --chapter-title-line:clamp(56px,3.125vw,120px);
  --chapter-subtitle-size:clamp(20px,1.25vw,40px);
  --chapter-subtitle-line:clamp(32px,1.875vw,56px);
  --chapter-body-size:clamp(16px,1vw,28px);
  --chapter-body-line:clamp(28px,1.5vw,48px);
  --chapter-action-size:clamp(16px,1vw,24px);
  --chapter-action-line:clamp(24px,1.5vw,40px);
  --chapter-meta-size:clamp(12px,.75vw,16px);
  --chapter-meta-line:clamp(20px,1.25vw,28px);
 }

 /* A shared width connects product chapters, the group loop and contact.
    Artwork gets the extra width; reading columns retain a bounded measure. */
 :is(.editorial-ai,.editorial-origin,.editorial-cash) .editorial-scene{
  width:var(--wide-stage);
  max-width:3200px;
  min-height:max(720px,calc(100svh - 81px));
  padding:0 var(--wide-gutter);
  column-gap:clamp(32px,2.5vw,96px);
  grid-template-columns:minmax(0,40fr) minmax(0,60fr);
  grid-template-rows:minmax(40px,1fr) auto auto minmax(40px,1fr) 88px;
 }
 :is(.editorial-ai,.editorial-origin,.editorial-cash) :is(.editorial-copy,.editorial-ai-copy){
  max-width:clamp(448px,26vw,720px);
 }
 :is(.editorial-ai,.editorial-origin,.editorial-cash) .lede{
  max-width:clamp(432px,25vw,672px);
  margin-top:32px;
 }
 :is(.editorial-ai,.editorial-origin,.editorial-cash) .text-action{margin-top:32px}
 .editorial-cash .editorial-cash-action{margin-top:32px}
 .editorial-cash .editorial-cash-action .text-action{margin-top:0}
 :is(.editorial-ai,.editorial-origin,.editorial-cash) :is(.editorial-topline,.editorial-mark){
  height:clamp(48px,3.5vw,80px);
  margin-bottom:24px;
 }
 .wordmark-ai{width:clamp(176px,11vw,264px)}
 .wordmark-origin{width:clamp(248px,15.5vw,372px)}
 .wordmark-cash{width:clamp(200px,12.5vw,300px)}
 :is(.editorial-ai,.editorial-origin,.editorial-cash) .editorial-art{
  min-height:480px;
  max-height:min(1280px,calc(100svh - 184px));
  height:100%;
 }
 .editorial-ai .editorial-art{
  width:calc(100% + var(--wide-gutter));
  margin-right:calc(-1*var(--wide-gutter));
 }
 :is(.editorial-ai,.editorial-origin,.editorial-cash) .editorial-foot{min-height:88px}
 .editorial-foot-actions{gap:48px}

 /* Keep the panoramic hero composition; native copy scales with its canvas. */
 .editorial-group .editorial-copy{
  max-width:clamp(720px,52vw,1120px);
  top:clamp(88px,10svh,192px);
 }
 .hero-subtitle{max-width:clamp(640px,46vw,960px);margin-top:32px}
 .editorial-group .editorial-copy .text-action{margin-top:32px}
 .editorial-group .editorial-foot{left:var(--wide-gutter);right:var(--wide-gutter)}

 /* The loop SVG already responds to its actual viewport. Removing both old
    caps lets its paths and hands scale together without CSS zoom or cropping. */
 .business-loop-scene{
  width:var(--wide-stage);
  max-width:3200px;
  height:max(720px,calc(100svh - 81px));
  padding-top:clamp(32px,2vw,64px);
 }
 .business-loop-heading{max-width:62%}
 .business-loop-intro{width:54%;max-width:1120px;margin-top:24px}
 .business-loop-action{margin-top:16px}
 .business-loop-brands{bottom:32px;height:clamp(96px,6vw,144px)}
 .business-loop-brand{min-height:96px;gap:16px}
 .business-loop-mark{height:clamp(48px,3.5vw,80px)}
 .business-loop-brand-ai img{width:clamp(176px,11vw,264px)}
 .business-loop-brand-origin img{width:clamp(248px,15.5vw,372px)}
 .business-loop-brand-cash img{width:clamp(150px,9.375vw,224px)}
 .business-loop-toggle{right:4.3%;bottom:8px}

 .contact{padding:clamp(96px,6vw,160px) 0}
 .contact .section-inner{width:var(--wide-stage);max-width:3200px;padding:0 var(--wide-gutter)}
 .contact-layout{gap:clamp(64px,6vw,192px)}
 .contact-layout>div{max-width:720px}
 .email{font-size:var(--chapter-subtitle-size);line-height:var(--chapter-subtitle-line);min-height:80px}
 .header{padding-left:var(--wide-gutter);padding-right:var(--wide-gutter)}
 .desktop-nav{gap:clamp(32px,2vw,64px)}
 .header-contact{padding-left:clamp(32px,2vw,64px)}
 footer{padding-left:var(--wide-gutter);padding-right:var(--wide-gutter)}
}

/* Ultrawide windows can be wide without being tall. Favor the complete art
   and a compact reading block so the chapter still fits one screen. */
@media (min-width:1601px) and (max-height:900px){
 :root{
  --chapter-title-size:44px;--chapter-title-line:56px;
  --chapter-subtitle-size:20px;--chapter-subtitle-line:32px;
  --chapter-body-size:16px;--chapter-body-line:28px;
  --chapter-action-size:16px;--chapter-action-line:24px;
 }
 :is(.editorial-ai,.editorial-origin,.editorial-cash) .editorial-scene{
  min-height:calc(100svh - 81px);
  grid-template-rows:minmax(32px,1fr) auto auto minmax(32px,1fr) 72px;
 }
 :is(.editorial-ai,.editorial-origin,.editorial-cash) .editorial-art{
  min-height:360px;max-height:calc(100svh - 168px);
 }
 :is(.editorial-ai,.editorial-origin,.editorial-cash) :is(.editorial-topline,.editorial-mark){height:48px;margin-bottom:16px}
 .wordmark-ai{width:176px}.wordmark-origin{width:248px}.wordmark-cash{width:200px}
 .editorial-group .editorial-copy{top:72px}
 .business-loop-scene{height:max(640px,calc(100svh - 81px));padding-top:24px}
 .business-loop-brands{height:88px;bottom:24px}
 .business-loop-brand{min-height:80px;gap:8px}
 .business-loop-mark{height:40px}
 .business-loop-brand-ai img{width:176px}
 .business-loop-brand-origin img{width:248px}
 .business-loop-brand-cash img{width:150px}
}
