/* A small desktop window remains the same full-screen presentation.
   Only a chapter's contents scroll when they no longer fit the viewport. */
@media (max-width:1280px) {
  body[data-desktop-ecosystem] .service-header nav { display:none; }
  body[data-desktop-ecosystem] .service-header .header-actions { margin-left:auto; }
}

/* Dialogs remain usable independently of the presentation's viewport size. */
body[data-desktop-ecosystem] .preview-dialog {
  box-sizing:border-box;max-height:calc(100svh - 32px);overflow-y:auto;
  overscroll-behavior:contain;scrollbar-width:thin;scrollbar-gutter:stable;
}
body[data-desktop-ecosystem] .preview-dialog .dialog-close {
  position:sticky;top:0;right:auto;float:right;z-index:4;
  width:36px;height:36px;margin:-18px -12px 0 0;
  display:grid;place-items:center;border-radius:50%;
  background:var(--noe-surface);line-height:1;
}

@media (max-width:1100px), (max-height:780px) {
  body[data-desktop-ecosystem] {
    --compact-rail:164px;--compact-outer:28px;--compact-header:76px;
  }
  body[data-desktop-ecosystem] .scene-deck {
    height:100vh;height:100svh;min-height:0;
  }
  body[data-desktop-ecosystem] .scene-deck > .scene-view > .scene-inner {
    display:block;box-sizing:border-box;height:100%;min-height:0;
    padding:calc(var(--compact-header) + 18px) 0 96px;
    overflow-y:auto;overflow-x:clip;overscroll-behavior-y:contain;
    scrollbar-width:thin;scrollbar-color:#8e755a55 transparent;
    scroll-padding-block:24px 48px;
  }
  body[data-desktop-ecosystem] .scene-view .scene-inner > .shell {
    width:calc(100% - var(--compact-rail) - var(--compact-outer));
    height:auto;min-height:0;max-height:none;
    margin-left:var(--compact-rail);margin-right:var(--compact-outer);
  }
  body[data-desktop-ecosystem] .service-header {
    top:0;left:0;width:100%;height:var(--compact-header);
    padding:0 24px;gap:18px;
    background:#080f14;isolation:isolate;
  }
  body[data-desktop-ecosystem] .service-header .header-brand { flex:none; }
  body[data-desktop-ecosystem] .service-header .header-brand img { width:120px;height:auto; }
  body[data-desktop-ecosystem] .service-header .header-actions { gap:12px; }
  body[data-desktop-ecosystem] .service-header .header-contact {
    font-size:12px;min-height:38px;gap:12px;padding:8px 12px;
  }
  body[data-desktop-ecosystem] .service-header .language-button { font-size:12px;min-height:36px; }
  body[data-desktop-ecosystem] .scene-chrome {
    left:18px;right:22px;bottom:22px;gap:16px;
  }
  body[data-desktop-ecosystem] .scene-index {
    display:flex;flex-direction:column;align-items:flex-start;
    width:132px;gap:4px;
  }
  body[data-desktop-ecosystem] .scene-index button {
    align-items:baseline;gap:8px;max-width:132px;min-height:25px;
    padding-block:3px;font-size:12px;line-height:1.45;letter-spacing:0;
    white-space:normal;
  }
  body[data-desktop-ecosystem] .scene-index button > span { white-space:normal; }
  body[data-desktop-ecosystem] .scene-index .chapter-number { flex:none;font-size:10px; }
  body[data-desktop-ecosystem] .scene-index button[aria-current] { padding-left:17px; }
  body[data-desktop-ecosystem] .scene-index button[aria-current]::before { width:10px; }
  body[data-desktop-ecosystem] .scene-direction button { width:34px;height:34px; }
  body[data-desktop-ecosystem] .scene-cue,
  body[data-desktop-ecosystem] .preview-label { display:none; }

  /* The original Life Core and vector wordmark retain their aspect ratios. */
  body[data-desktop-ecosystem] #intro > .scene-inner { padding:0;overflow:hidden; }
  body[data-desktop-ecosystem] #intro .brand-intro-sticky {
    position:relative;height:100%;min-height:0;
  }
  body[data-desktop-ecosystem] #intro .brand-intro-lockup {
    width:min(var(--intro-logo-width,80vw),880px);max-width:calc(100% - 56px);
  }
  body[data-desktop-ecosystem] #intro .brand-intro-lockup img { width:100%;height:auto; }
  body[data-desktop-ecosystem] #intro .brand-intro-tagline {
    max-width:80vw;font-size:13px;line-height:1.7;white-space:normal;text-align:center;
  }

  /* The proposition stays a composed scene, with a legible text column. */
  body[data-desktop-ecosystem] #top .hero-grid { top:0;height:auto;min-height:0; }
  body[data-desktop-ecosystem] #top .hero-copy { width:min(72%,620px);padding:0; }
  body[data-desktop-ecosystem] #top .hero-copy h1,
  html[lang=en] body[data-desktop-ecosystem] #top .hero-copy h1 {
    font-size:clamp(48px,6.7vw,84px);line-height:1.12;margin:8px 0 24px;
  }
  body[data-desktop-ecosystem] #top .hero-line { font-size:20px;line-height:1.55; }
  body[data-desktop-ecosystem] #top .hero-description { font-size:15px;line-height:1.8;max-width:510px; }
  body[data-desktop-ecosystem] #top .hero-actions { flex-wrap:wrap;gap:20px;margin-top:28px; }
  body[data-desktop-ecosystem] #top .hero-actions :is(.button,.text-button) { font-size:14px; }
  body[data-desktop-ecosystem] #top .hero-visual { inset:0;width:100%;height:100%;margin:0;min-height:0; }

  body[data-desktop-ecosystem] :is(#services,#approach) .heading-row,
  body[data-desktop-ecosystem] #cases .cases-heading {
    display:block;margin:0;max-width:100%;
  }
  body[data-desktop-ecosystem] :is(#services,#approach) .heading-row h2,
  body[data-desktop-ecosystem] #cases .cases-heading h2,
  html[lang=en] body[data-desktop-ecosystem] :is(#services,#approach) .heading-row h2,
  html[lang=en] body[data-desktop-ecosystem] #cases .cases-heading h2 {
    margin:0;font-size:clamp(32px,3.8vw,44px);line-height:1.28;
  }
  body[data-desktop-ecosystem] :is(#services,#approach) .heading-row > p,
  body[data-desktop-ecosystem] #cases .cases-heading > p {
    display:block;max-width:64ch;margin:16px 0 0;font-size:15px;line-height:1.75;
  }

  /* Six services use their natural height instead of a cropped document. */
  body[data-desktop-ecosystem] #services .ref-services-layout {
    grid-template-columns:minmax(132px,.34fr) minmax(0,1fr);
    grid-template-rows:auto;gap:22px;height:auto;max-height:none;min-height:0;
    margin-top:28px;padding:20px;overflow:visible;
  }
  body[data-desktop-ecosystem] #services .work-selectors { min-height:0;justify-content:flex-start;gap:8px; }
  body[data-desktop-ecosystem] #services .service-tab-indicator {
    transition:transform 270ms cubic-bezier(.2,.75,.25,1),opacity 180ms ease;
  }
  body[data-desktop-ecosystem] #services .work-row,
  body[data-desktop-ecosystem] #services .work-row:is(.is-active,:hover) {
    flex:0 0 auto;min-height:58px;flex-direction:row;align-items:center;
    justify-content:space-between;gap:8px;padding:12px 14px;
  }
  body[data-desktop-ecosystem] #services .work-row strong,
  html[lang=en] body[data-desktop-ecosystem] #services .work-row strong {
    font-size:21px;line-height:1.4;overflow-wrap:break-word;
  }
  body[data-desktop-ecosystem] #services .ref-document-stage {
    min-height:0;height:auto;max-height:none;overflow:visible;
  }
  body[data-desktop-ecosystem] #services .ref-document-stage::after { display:none; }
  body[data-desktop-ecosystem] #services .ref-document {
    height:auto;min-height:100%;max-height:none;width:100%;
  }
  body[data-desktop-ecosystem] #services .ref-document-body {
    height:auto;min-height:0;max-height:none;display:flex;flex-direction:column;
    justify-content:flex-start;padding:28px 24px;
  }
  body[data-desktop-ecosystem] #services .ref-document-body > * { flex-shrink:0; }
  body[data-desktop-ecosystem] #services .ref-document-body h3 {
    font-size:27px;line-height:1.35;margin:0 0 18px;
  }
  body[data-desktop-ecosystem] #services .ref-document-paragraph {
    min-height:0;font-size:16px;line-height:1.8;overflow-wrap:break-word;
  }
  body[data-desktop-ecosystem] #services .ref-document-paragraph mark { white-space:normal; }
  body[data-desktop-ecosystem] #services .ref-document-tasks { margin-top:24px;gap:12px; }
  body[data-desktop-ecosystem] #services .ref-document-tasks li {
    font-size:16px;line-height:1.65;white-space:normal;min-height:0;padding:6px 10px;
  }
  body[data-desktop-ecosystem] #services .ref-document-tasks { padding-right:0; }
  body[data-desktop-ecosystem] #services .ip-services-companion {
    position:relative;inset:auto;align-self:flex-end;margin-top:18px;width:64px;
  }

  /* Industry cards, descriptions and links stay in the same reading order. */
  body[data-desktop-ecosystem] #cases .industry-navigation-head {
    display:flex;align-items:flex-start;flex-wrap:wrap;gap:12px 24px;margin:24px 0 16px;
  }
  body[data-desktop-ecosystem] #cases .industry-tabs {
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:row;
    grid-auto-columns:auto;gap:12px;margin:0 0 28px;padding:0;
    overflow:visible;border:0;
  }
  body[data-desktop-ecosystem] #cases .industry-tabs button,
  html[lang=en] body[data-desktop-ecosystem] #cases .industry-tabs button {
    width:auto;min-width:0;min-height:150px;padding:14px;gap:8px;
  }
  body[data-desktop-ecosystem] #cases .industry-tabs button > span,
  html[lang=en] body[data-desktop-ecosystem] #cases .industry-tabs button > span {
    font-size:18px;line-height:1.4;white-space:normal;min-height:0;
  }
  body[data-desktop-ecosystem] #cases .industry-tabs .industry-tag,
  html[lang=en] body[data-desktop-ecosystem] #cases .industry-tabs .industry-tag {
    font-size:13px;line-height:1.6;
  }
  body[data-desktop-ecosystem] #cases .industry-panel {
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);
    grid-template-rows:auto;flex:none;height:auto;min-height:0;gap:28px;align-items:start;
  }
  body[data-desktop-ecosystem] #cases .industry-copy { width:auto;max-width:none; }
  body[data-desktop-ecosystem] #cases #industry-panel .industry-copy h3,
  html[lang=en] body[data-desktop-ecosystem] #cases #industry-panel .industry-copy h3 {
    font-size:32px;line-height:1.3;margin:14px 0;
  }
  body[data-desktop-ecosystem] #cases #industry-panel p[data-industry-description] {
    max-width:64ch;font-size:16px;line-height:1.8;
  }
  body[data-desktop-ecosystem] #cases #industry-panel .industry-copy > .industry-tasks {
    font-size:15px;line-height:1.8;margin:18px 0;gap:6px;
  }
  body[data-desktop-ecosystem] #cases #industry-panel .industry-copy .button {
    position:relative;inset:auto;min-width:0;max-width:100%;min-height:52px;
    margin:20px 0 0;padding:12px 16px;gap:18px;font-size:15px;white-space:normal;
  }
  body[data-desktop-ecosystem] #cases #industry-panel .ip-case-action {
    position:relative;inset:auto;display:table;margin-top:20px;max-width:calc(100% - 76px);
  }
  body[data-desktop-ecosystem] #cases #industry-panel .ip-case-action > .button { margin-top:0; }
  body[data-desktop-ecosystem] #cases #industry-panel .ip-case-companion {
    width:62px;left:calc(100% + 10px);top:-10px;
  }
  body[data-desktop-ecosystem] #cases #industry-panel .industry-copy .industry-scope {
    position:static;max-width:64ch;margin-top:14px;font-size:13px;line-height:1.7;
  }
  body[data-desktop-ecosystem] #cases .industry-art {
    position:relative;inset:auto;width:100%;height:auto;min-height:0;
    overflow:visible;opacity:1;pointer-events:auto;margin:0;
    display:flex;flex-direction:column;
  }
  body[data-desktop-ecosystem] #cases .homepage-model {
    position:relative;inset:auto;order:0;width:100%;height:340px!important;min-height:340px!important;
  }
  body[data-desktop-ecosystem] #cases .industry-art > .industry-tasks {
    position:static;order:1;display:grid;grid-template-columns:minmax(0,1fr);
    gap:9px;margin:14px 0 0;padding-top:16px;font-size:14px;line-height:1.7;
  }
  body[data-desktop-ecosystem] #cases .homepage-model .spatial-note { bottom:8px;font-size:11px; }
  body[data-desktop-ecosystem] #cases .sector-showcase,
  body[data-desktop-ecosystem] #cases .sector-result-card {
    height:auto;min-height:0;max-height:none;
  }
  body[data-desktop-ecosystem] #cases .sector-showcase { grid-template-rows:auto;align-content:start;gap:16px; }
  body[data-desktop-ecosystem] #cases .sector-showcase.has-two-projects { grid-template-columns:minmax(0,1fr); }
  body[data-desktop-ecosystem] #cases .sector-result-image { flex:none;min-height:0;aspect-ratio:1.55; }
  body[data-desktop-ecosystem] #cases .sector-result-copy h4 { font-size:23px;line-height:1.4; }
  body[data-desktop-ecosystem] #cases .sector-result-copy p { font-size:14px;line-height:1.7; }

  /* The process diagram keeps its proportions; a narrow frame can pan sideways. */
  body[data-desktop-ecosystem] #approach .ref-automation {
    margin-top:28px;padding:12px;max-width:100%;overflow-x:auto;overflow-y:hidden;
  }
  body[data-desktop-ecosystem] #approach .ref-automation-stage { width:100%;min-width:600px;max-width:none; }
  body[data-desktop-ecosystem] #approach .ref-automation-map { width:100%;height:auto; }
  body[data-desktop-ecosystem] #approach .ref-approach-steps {
    grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 30px;margin-top:28px;
  }
  body[data-desktop-ecosystem] #approach .ref-approach-steps h3,
  html[lang=en] body[data-desktop-ecosystem] #approach .ref-approach-steps h3 {
    font-size:22px;line-height:1.4;min-height:0;
  }
  body[data-desktop-ecosystem] #approach .ref-approach-steps p { font-size:15px;line-height:1.8; }

  /* A single chapter viewport owns vertical scrolling, including all credits. */
  body[data-desktop-ecosystem] #ecosystem .eco-layout {
    height:auto;max-height:none;overflow:visible;padding-right:0;
  }
  body[data-desktop-ecosystem] #ecosystem .eco-copy { display:block;margin-bottom:24px; }
  body[data-desktop-ecosystem] #ecosystem .eco-copy .eco-lead {
    display:block;max-width:64ch;margin-top:16px;font-size:14px;line-height:1.8;
  }
  body[data-desktop-ecosystem] #ecosystem .eco-filters { flex-wrap:wrap;gap:8px; }
  body[data-desktop-ecosystem] #ecosystem .eco-reference-panel { height:auto;min-height:0; }
  body[data-desktop-ecosystem] #ecosystem .eco-catalog,
  body[data-desktop-ecosystem] #ecosystem .eco-catalog:not([data-filter=all]) {
    height:auto;grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:46px;
    align-content:start;gap:8px;
  }
  body[data-desktop-ecosystem] #ecosystem .eco-infra-compact { display:block;margin-top:24px;padding:18px 0; }
  body[data-desktop-ecosystem] #ecosystem .eco-infra-label { margin-bottom:14px; }
  body[data-desktop-ecosystem] #ecosystem .eco-credits-inline { margin:24px 0 0; }
  body[data-desktop-ecosystem] #ecosystem .eco-credits-heading { display:block;margin-bottom:12px; }
  body[data-desktop-ecosystem] #ecosystem .eco-credits-heading > p { margin-top:8px;font-size:12px;line-height:1.8; }
  body[data-desktop-ecosystem] #ecosystem .eco-source-row { display:block;padding:16px 0;min-height:0; }
  body[data-desktop-ecosystem] #ecosystem .eco-source-label { display:flex;align-items:baseline;gap:16px;margin-bottom:10px; }
  body[data-desktop-ecosystem] #ecosystem .eco-source-label h4 { font-size:13px;max-width:none; }
  body[data-desktop-ecosystem] #ecosystem .eco-source-label p { margin:0;font-size:11px; }
  body[data-desktop-ecosystem] #ecosystem .eco-source-row .eco-source-logos {
    grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;
  }
  body[data-desktop-ecosystem] #ecosystem .eco-source-row:is([data-source-group=architecture],[data-source-group=consulting],[data-source-group=research]) .eco-source-logos {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  body[data-desktop-ecosystem] #ecosystem .eco-source-logo { min-height:42px; }
  body[data-desktop-ecosystem] #ecosystem .eco-source-mark { min-width:0;max-width:100%; }
  body[data-desktop-ecosystem] #ecosystem .eco-relationship { padding:0;margin:16px 0 0; }
  body[data-desktop-ecosystem] .preview-dialog { padding:30px 28px 24px; }
}

@media (max-width:900px) {
  body[data-desktop-ecosystem] { --compact-rail:152px;--compact-outer:24px; }
  body[data-desktop-ecosystem] #top .hero-copy { width:100%;max-width:590px; }
  body[data-desktop-ecosystem] #top .hero-visual { opacity:.45; }
  body[data-desktop-ecosystem] #top .hero-copy h1,
  html[lang=en] body[data-desktop-ecosystem] #top .hero-copy h1 { font-size:clamp(46px,7.8vw,66px); }
  body[data-desktop-ecosystem] #services .ref-services-layout { grid-template-columns:minmax(0,1fr);gap:22px;padding:18px; }
  body[data-desktop-ecosystem] #services .work-selectors { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px; }
  body[data-desktop-ecosystem] #services .work-row,
  body[data-desktop-ecosystem] #services .work-row:is(.is-active,:hover) { min-height:62px;padding:10px; }
  body[data-desktop-ecosystem] #services .work-row::after { display:none; }
  body[data-desktop-ecosystem] #services .work-row strong,
  html[lang=en] body[data-desktop-ecosystem] #services .work-row strong { font-size:20px; }
  body[data-desktop-ecosystem] #services .ref-document { min-height:0; }
  body[data-desktop-ecosystem] #cases .industry-panel { grid-template-columns:minmax(0,1fr);gap:28px; }
  body[data-desktop-ecosystem] #cases .industry-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body[data-desktop-ecosystem] #cases .homepage-model { height:380px!important;min-height:380px!important; }
  body[data-desktop-ecosystem] #cases .sector-showcase.has-two-projects { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body[data-desktop-ecosystem] #ecosystem .eco-catalog,
  body[data-desktop-ecosystem] #ecosystem .eco-catalog:not([data-filter=all]) { grid-template-columns:repeat(4,minmax(0,1fr)); }
}

@media (max-width:700px) {
  body[data-desktop-ecosystem] { --compact-rail:136px;--compact-outer:18px;--compact-header:70px; }
  body[data-desktop-ecosystem] .service-header { padding-inline:18px; }
  body[data-desktop-ecosystem] .service-header .header-brand img { width:106px; }
  body[data-desktop-ecosystem] .service-header .header-actions { gap:8px; }
  body[data-desktop-ecosystem] .service-header .header-contact { font-size:11px;padding:8px 10px;gap:8px; }
  body[data-desktop-ecosystem] .service-header .language-button { font-size:11px;padding-inline:10px; }
  body[data-desktop-ecosystem] .scene-chrome { left:12px;right:16px;bottom:18px; }
  body[data-desktop-ecosystem] .scene-index { width:112px; }
  body[data-desktop-ecosystem] .scene-index button { max-width:112px;gap:6px;font-size:11px; }
  body[data-desktop-ecosystem] .scene-index button[aria-current] { padding-left:13px; }
  body[data-desktop-ecosystem] .scene-index button[aria-current]::before { width:8px; }
  body[data-desktop-ecosystem] #top .hero-copy h1,
  html[lang=en] body[data-desktop-ecosystem] #top .hero-copy h1 { font-size:48px; }
  body[data-desktop-ecosystem] #top .hero-line { font-size:18px; }
  body[data-desktop-ecosystem] #top .hero-actions { align-items:flex-start;flex-direction:column; }
  body[data-desktop-ecosystem] #services .work-selectors { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body[data-desktop-ecosystem] #services .ref-services-layout { padding:14px; }
  body[data-desktop-ecosystem] #services .ref-document-body { padding:24px 18px; }
  body[data-desktop-ecosystem] #cases .sector-showcase.has-two-projects { grid-template-columns:minmax(0,1fr); }
  body[data-desktop-ecosystem] #approach .ref-approach-steps { grid-template-columns:minmax(0,1fr);gap:26px; }
  body[data-desktop-ecosystem] #ecosystem .eco-catalog,
  body[data-desktop-ecosystem] #ecosystem .eco-catalog:not([data-filter=all]) { grid-template-columns:repeat(3,minmax(0,1fr)); }
  body[data-desktop-ecosystem] #ecosystem .eco-source-row[data-source-group] .eco-source-logos { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body[data-desktop-ecosystem] #ecosystem .eco-infrastructure { grid-template-columns:minmax(0,1fr);gap:18px; }
  body[data-desktop-ecosystem] .preview-dialog .form-pair { grid-template-columns:minmax(0,1fr);gap:0; }
  body[data-desktop-ecosystem] .preview-dialog h2 { font-size:30px; }
}

@media (max-height:420px) {
  body[data-desktop-ecosystem] .scene-index { max-height:calc(100svh - 110px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin; }
}

/* The rail and content share the same geometry at every desktop width.
   A maximum-width breakpoint must never remove the navigation clearance. */
body[data-desktop-ecosystem] {
  --chapter-rail-left:24px;--chapter-rail-width:188px;--chapter-rail-gap:28px;
  --chapter-content-end:40px;--chapter-content-max:1460px;
  --chapter-content-start:calc(var(--chapter-rail-left) + var(--chapter-rail-width) + var(--chapter-rail-gap));
  --chapter-safe-bottom:96px;
}
body[data-desktop-ecosystem] .scene-chrome {
  left:var(--chapter-rail-left);right:var(--chapter-content-end);
}
body[data-desktop-ecosystem] .scene-index {
  width:var(--chapter-rail-width);min-width:0;flex-shrink:0;
}
body[data-desktop-ecosystem] .scene-index button {
  max-width:var(--chapter-rail-width);min-width:0;white-space:normal;
}
body[data-desktop-ecosystem] .scene-index button > span:last-child {
  min-width:0;white-space:normal;overflow-wrap:break-word;
}
body[data-desktop-ecosystem] .scene-view .scene-inner > .shell {
  width:min(var(--chapter-content-max),calc(100% - var(--chapter-content-start) - var(--chapter-content-end)));
  margin-left:max(var(--chapter-content-start),calc((100% - var(--chapter-content-max)) / 2));
  margin-right:0;
}
body[data-desktop-ecosystem] #ecosystem .scene-inner {
  padding-bottom:var(--chapter-safe-bottom);
}
@media (max-width:1100px), (max-height:780px) {
  body[data-desktop-ecosystem] {
    --chapter-rail-left:18px;--chapter-rail-width:132px;--chapter-rail-gap:24px;
    --chapter-content-end:28px;
  }
}
@media (max-width:900px) {
  body[data-desktop-ecosystem] { --chapter-content-end:24px; }
}
@media (max-width:700px) {
  body[data-desktop-ecosystem] {
    --chapter-rail-left:12px;--chapter-rail-width:112px;--chapter-content-end:18px;
  }
}
