/* NICO HUA · Ultrawide r1 (2026-11-02)
   Große Monitore (ab 1800 px): Hero-Display-Schrift und Lead-Text wachsen proportional mit der Breite, Hero-Ränder
   werden etwas großzügiger, damit die Komposition nicht links klebt. Über uns bekommt auf großen Monitoren insgesamt
   deutlich größere Schrift. Unter 1800 px ändert sich nichts (r2: auch die Über-uns-Textbox ändert sich erst ab
   1800 px). Die Startseiten-Leiste "01 / Linie / SCROLL" bleibt in Lage und Größe unverändert. Nur die 26 App-Seiten;
   Lumière, Solaris, Eiswelt, Tower bleiben unberührt. Breakpoints: 1800 / 2400 / 3200. */
@media (min-width:1800px){
  html .score-shell{--nh-uw-gutter:clamp(72px,3.4vw,140px)}

  /* START · nh-future hero (intro-nico) + Sound-Gate */
  html .score-shell[data-page="home"] .intro-nico .intro-copy{width:min(60vw,1500px)!important}
  html .score-shell[data-page="home"] .intro-nico .intro-title{font-size:clamp(268px,10.9vw,400px)!important}
  html .score-shell[data-page="home"] .intro-nico .intro-statement{font-size:clamp(11px,.42vw,15px)!important}
  html .score-shell[data-page="home"] .home-sound-gate-copy{max-width:min(1800px,84vw)!important}
  html .score-shell[data-page="home"] .home-sound-gate-copy>span{font-size:clamp(9px,.4vw,14px)!important}
  html .score-shell[data-page="home"] .home-sound-gate-copy h2{font-size:clamp(184px,7.6vw,270px)!important}

  /* LEISTUNGEN */
  html .score-shell[data-page="leistungen"] .services-award-hero{padding-inline:var(--nh-uw-gutter)!important}
  html .score-shell[data-page="leistungen"] .services-hero-meta,
  html .score-shell[data-page="leistungen"] .services-hero-nav{left:var(--nh-uw-gutter)!important;right:var(--nh-uw-gutter)!important}
  html .score-shell[data-page="leistungen"] .services-hero-meta{font-size:clamp(8px,.36vw,13px)!important}
  html .score-shell[data-page="leistungen"] .services-hero-copy h1{font-size:clamp(232px,9.4vw,340px)!important;width:min(92vw,2100px)!important}
  html .score-shell[data-page="leistungen"] .services-hero-copy p{font-size:clamp(17px,.7vw,26px)!important;width:min(720px,42vw)!important}

  /* WEB / MOTION / SOUND (reference-frame hero, Titel als Bildmarke) */
  html .score-shell:is([data-page="webdesign"],[data-page="motion-design"],[data-page="sound-design"]) .service-hero-copy{padding-inline:var(--nh-uw-gutter)!important}
  html .score-shell:is([data-page="webdesign"],[data-page="motion-design"],[data-page="sound-design"]) .service-hero-title{width:min(72vw,1600px)!important}
  html .score-shell:is([data-page="webdesign"],[data-page="motion-design"],[data-page="sound-design"]) .service-hero-index{font-size:clamp(10px,.42vw,15px)!important}
  html .score-shell:is([data-page="webdesign"],[data-page="motion-design"],[data-page="sound-design"]) .service-hero-copy>p{font-size:clamp(16px,.66vw,24px)!important}

  /* ARBEITEN */
  html .score-shell[data-page="arbeiten"] .work-hero-copy{width:min(88vw,2000px)!important}
  html .score-shell[data-page="arbeiten"] .work-hero h1{font-size:clamp(230px,9vw,330px)!important}
  html .score-shell[data-page="arbeiten"] .work-hero .work-signature-heading{width:min(100%,1700px)!important}
  html .score-shell[data-page="arbeiten"] .work-hero-copy>p{font-size:clamp(12px,.5vw,18px)!important;width:min(560px,28vw)!important}
  html .score-shell[data-page="arbeiten"] .work-hero-meta,
  html .score-shell[data-page="arbeiten"] .work-hero-cue{font-size:clamp(7px,.32vw,11px)!important}
  html .score-shell[data-page="arbeiten"] .work-hero-coordinate{left:var(--nh-uw-gutter)!important;right:var(--nh-uw-gutter)!important}

  /* MOTION · Abschnitt 2: Text auf zentrierter, begrenzter Bühne, Bildstreifen bleiben randlos */
  html .score-shell[data-page="motion-design"] .signature-motion .signature-copy{left:max(var(--nh-uw-gutter),calc((100% - 2900px)/2))!important;right:max(var(--nh-uw-gutter),calc((100% - 2900px)/2))!important;grid-template-columns:minmax(0,1fr) auto!important;gap:clamp(96px,4.4vw,160px)!important}
  html .score-shell[data-page="motion-design"] .signature-motion .signature-copy>span{font-size:clamp(9px,.38vw,13px)!important}
  html .score-shell[data-page="motion-design"] .signature-motion .signature-copy h2{font-size:clamp(145px,4.8vw,175px)!important}
  html .score-shell[data-page="motion-design"] .signature-motion .signature-copy p{font-size:clamp(16px,.66vw,24px)!important;max-width:32em!important}

  /* KONTAKT */
  html .score-shell[data-page="kontakt"] .premium-page-hero{padding-inline:var(--nh-uw-gutter)!important}
  html .score-shell[data-page="kontakt"] .premium-title,
  html .score-shell[data-page="kontakt"] .premium-kicker{left:var(--nh-uw-gutter)!important}
  html .score-shell[data-page="kontakt"] .premium-title,
  html .score-shell[data-page="kontakt"] .premium-index{right:var(--nh-uw-gutter)!important}
  html .score-shell[data-page="kontakt"] .premium-title h1{font-size:clamp(132px,5.6vw,200px)!important}
  html .score-shell[data-page="kontakt"] .premium-title p{font-size:clamp(17px,.7vw,26px)!important}

  /* ÜBER UNS · Hero (Familienbild rechts, Text links) */
  html .score-shell[data-page="ueber-uns"] .us-hero-family{padding-left:var(--nh-uw-gutter)!important;column-gap:clamp(48px,5vw,160px)!important}
  /* Textblock füllt die Spalte (vorher 47 %, Headline lief über die Box); Inhalt mittig in einer Bühne von ca. 6,6 Headline-Höhen */
  html .score-shell[data-page="ueber-uns"] .us-hero.us-hero-family .us-hero-copy{width:100%!important;max-width:none!important;min-width:0}
  html .score-shell[data-page="ueber-uns"] .us-hero.us-hero-family .us-hero-copy{padding-inline-start:max(0px,calc((100% - clamp(112px,5.1vw,190px)*6.6)/2))!important}
  html .score-shell[data-page="ueber-uns"] .us-hero .us-hero-copy>span{font-size:clamp(10px,.42vw,15px)!important}
  html .score-shell[data-page="ueber-uns"] .us-hero .us-hero-copy h1{font-size:clamp(112px,5.1vw,190px)!important}
  html .score-shell[data-page="ueber-uns"] .us-hero .us-hero-copy p{font-size:clamp(18px,.74vw,28px)!important;max-width:38ch!important;margin-top:clamp(28px,1.4vw,48px)!important}
  html .score-shell[data-page="ueber-uns"] .us-hero .us-hero-names,
  html .score-shell[data-page="ueber-uns"] .us-hero .us-hero-names b{font-size:clamp(10px,.4vw,14px)!important}
  html .score-shell[data-page="ueber-uns"] .us-hero .us-hero-names i{font-size:clamp(8px,.33vw,12px)!important}

  /* ÜBER UNS · ganze Seite: Schrift wächst mit dem Monitor */
  html .score-shell[data-page="ueber-uns"] .us-intro{padding-inline:var(--nh-uw-gutter)!important}
  html .score-shell[data-page="ueber-uns"] .us-index{font-size:clamp(8px,.36vw,13px)!important}
  html .score-shell[data-page="ueber-uns"] .us-intro h2{font-size:clamp(172px,6.6vw,250px)!important}
  html .score-shell[data-page="ueber-uns"] .us-intro-copy p{font-size:clamp(18px,.74vw,27px)!important}
  html .score-shell[data-page="ueber-uns"] .us-person{width:min(780px,31vw)!important}
  html .score-shell[data-page="ueber-uns"] .us-nico{left:var(--nh-uw-gutter)!important}
  html .score-shell[data-page="ueber-uns"] .us-mila{right:var(--nh-uw-gutter)!important}
  html .score-shell[data-page="ueber-uns"] .us-person>span{font-size:clamp(9px,.36vw,13px)!important}
  html .score-shell[data-page="ueber-uns"] .us-person h2{font-size:clamp(23px,12.4cqw,120px)!important}
  html .score-shell[data-page="ueber-uns"] .us-person p{font-size:clamp(13px,.55vw,20px)!important}
  html .score-shell[data-page="ueber-uns"] .us-hero-copy>span,
  html .score-shell[data-page="ueber-uns"] .us-world-copy>span,
  html .score-shell[data-page="ueber-uns"] .us-values header>span,
  html .score-shell[data-page="ueber-uns"] .us-human>span,
  html .score-shell[data-page="ueber-uns"] .us-cta>span{font-size:clamp(8px,.36vw,13px)!important}
  html .score-shell[data-page="ueber-uns"] .us-values h2{font-size:clamp(166px,6.4vw,240px)!important}
  html .score-shell[data-page="ueber-uns"] .us-value-grid b{font-size:clamp(8px,.36vw,13px)!important}
  html .score-shell[data-page="ueber-uns"] .us-value-grid h3{font-size:clamp(16px,11.2cqw,64px)!important}
  html .score-shell[data-page="ueber-uns"] .us-value-grid p{font-size:clamp(13px,.55vw,20px)!important}
  html .score-shell[data-page="ueber-uns"] .us-value-grid article{padding:clamp(34px,1.6vw,56px)!important}
  html .score-shell[data-page="ueber-uns"] .us-world{padding-inline:var(--nh-uw-gutter)!important}
  html .score-shell[data-page="ueber-uns"] .us-world-copy{width:min(1400px,74vw)!important}
  html .score-shell[data-page="ueber-uns"] .us-world h2{font-size:clamp(174px,6.6vw,250px)!important}
  html .score-shell[data-page="ueber-uns"] .us-world p{font-size:clamp(15px,.62vw,22px)!important}
  html .score-shell[data-page="ueber-uns"] .us-world a,
  html .score-shell[data-page="ueber-uns"] .us-cta a{font-size:clamp(8px,.36vw,13px)!important}
  html .score-shell[data-page="ueber-uns"] .us-human>h2{font-size:clamp(180px,6.8vw,260px)!important}
  html .score-shell[data-page="ueber-uns"] .us-human p{font-size:clamp(14px,.58vw,21px)!important}
  html .score-shell[data-page="ueber-uns"] .us-cta{padding-inline:var(--nh-uw-gutter)!important}
  html .score-shell[data-page="ueber-uns"] .us-cta h2{font-size:clamp(170px,6.5vw,245px)!important}
  html .score-shell[data-page="ueber-uns"] .us-cta p{font-size:clamp(15px,.62vw,23px)!important}
}
@media (min-width:2400px){
  html .score-shell{--nh-uw-gutter:clamp(96px,3.6vw,150px)}
  html .score-shell[data-page="ueber-uns"] .us-hero-family .us-hero-copy p{max-width:36ch!important}
  html .score-shell[data-page="leistungen"] .services-hero-copy p{width:min(820px,38vw)!important}
}
@media (min-width:3200px){
  html .score-shell{--nh-uw-gutter:clamp(120px,3.8vw,170px)}
  html .score-shell[data-page="home"] .intro-nico .intro-copy{width:min(56vw,1700px)!important}
  html .score-shell:is([data-page="webdesign"],[data-page="motion-design"],[data-page="sound-design"]) .service-hero-title{width:min(52vw,1800px)!important}
  html .score-shell[data-page="ueber-uns"] .us-hero-family{column-gap:clamp(96px,5.5vw,200px)!important}
}
/* r2 (2026-11-03) · Inhaltsabschnitte auf großen Monitoren: zentrierte, begrenzte Gruppen mit ausgewogenen Rändern,
   Linien auf ihren Text-/Bildachsen. Hero bleibt randlos; 1440 unverändert. */
@media (min-width:1800px){
  /* MOTION · Abschnitt 2: Zeitleiste auf der Textbühne statt über den ganzen Monitor */
  html .score-shell[data-page="motion-design"] .signature-motion .motion-timeline{left:max(var(--nh-uw-gutter),calc((100% - 2900px)/2))!important;right:max(var(--nh-uw-gutter),calc((100% - 2900px)/2))!important}
  /* MOTION · Abschnitt 3 (THE EDIT): TIME, Headline, Text und Frames als eine Gruppe; Text nicht mehr eingequetscht */
  html .score-shell[data-page="motion-design"] .motion-edit{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr)!important}
  html .score-shell[data-page="motion-design"] .motion-edit:before{left:max(0px,calc((100% - 1680px)/2 - .04em))!important;font-size:min(30vw,440px)!important}
  html .score-shell[data-page="motion-design"] .motion-edit-copy>span{font-size:clamp(7px,.3vw,11px)!important}
  html .score-shell[data-page="motion-design"] .motion-edit-copy p{margin-left:clamp(0px,2.4vw,96px)!important;max-width:34ch!important;font-size:clamp(15px,.6vw,21px)!important}
  /* WEB · Abschnitt 2 kompakter: Bild etwas schmaler (Raster und Bild bleiben), weniger Leerraum */
  html .score-shell[data-page="webdesign"] .signature-web{row-gap:clamp(24px,2vw,56px)!important;padding-block:clamp(76px,8svh,128px)!important}
  html .score-shell[data-page="webdesign"] .signature-web>figure{grid-column:7/-1!important}
  /* ARBEITEN · "Two Voices. One Studio.": max. 1680 px, mittig */
  html .score-shell[data-page="arbeiten"] .work-edition #worlds.we-intro>.we-inner{width:calc(100% - 2*var(--nh-uw-gutter))!important;max-width:1680px!important}
  html .score-shell[data-page="arbeiten"] .work-edition #worlds .we-intro-grid{gap:clamp(64px,4vw,140px)!important}
  html .score-shell[data-page="arbeiten"] .work-edition #worlds .we-intro-copy h2{font-size:clamp(150px,7.6vw,156px)!important}
  html .score-shell[data-page="arbeiten"] .work-edition #worlds .we-intro-copy p{font-size:clamp(18px,1.04vw,21px)!important}
  html .score-shell[data-page="arbeiten"] .work-edition #worlds .we-section-label{font-size:clamp(10px,.58vw,13px)!important}
}
@media (min-width:2400px){
  /* PROZESS: Tablet, Modell, Text und Phasen-Navigation als eine zentrierte Gruppe */
  html .score-shell[data-page="prozess"] .pe-journey-grid{max-width:2400px!important;grid-template-columns:minmax(0,1.5fr) minmax(600px,760px)!important}
  html .score-shell[data-page="prozess"] .pe-phase-nav{padding-inline:max(clamp(96px,6vw,240px),calc(50% - 1200px))!important}
}