.stage-controls{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.stage-controls button b{font-weight:400}
.diagram-note{font-size:7px;line-height:1.5;letter-spacing:.03em;opacity:.6;margin:0 0 8px;width:100%;grid-column:1/-1;text-align:right;align-self:end}
.story-sticky>.diagram-note{grid-row:2}
.story-sticky>.tank-selector{grid-row:3}
body[data-concept=praezision] .story-sticky,body[data-concept=werkstatt] .story-sticky{grid-template-rows:minmax(0,1fr) auto auto}
body[data-concept=praezision] .hero-copy{padding-top:clamp(24px,4vh,48px)}
body[data-concept=praezision] .hero-actions{margin-top:28px}
body[data-concept=werkstatt] .hero-copy{padding-top:clamp(20px,3vh,40px)}
body[data-concept=werkstatt] .hero-intro{margin-bottom:27px}
body[data-concept=werkstatt] .circle-link{margin-top:0}
body[data-concept=industrie] .hero-copy{padding-top:clamp(34px,5vh,64px)}
body[data-concept=industrie] .hero-copy>p{margin-bottom:26px}
body[data-concept=industrie] h1{font-size:clamp(56px,5.4vw,89px);margin:24px 0}
body[data-concept=industrie] .hero-copy>.primary-button{padding:15px 21px}
body[data-concept=industrie] .diagram-note{margin-top:5px}
body[data-concept=industrie] .hero-visual [data-tank-viewer]{bottom:93px}
body[data-concept=industrie] .stage-info{bottom:54px}
body[data-concept=industrie] .stage-description{font-size:10px}
body[data-concept=industrie] .model-disclaimer{display:none}
.main-nav a,.site-header nav a{white-space:nowrap}

@media(max-height:800px) and (min-width:851px){
  .hero-copy .hero-intro{font-size:12px}
  body[data-concept=industrie] h1{font-size:clamp(52px,5vw,72px);margin:17px 0}
  body[data-concept=industrie] .hero-copy{padding-top:24px}
  body[data-concept=industrie] .hero-copy>p{margin-bottom:21px}
  .scroll-note{font-size:8px}
  .diagram-note{font-size:6px;margin-bottom:5px}
  body[data-concept=praezision] .hero-copy,body[data-concept=werkstatt] .hero-copy{padding-top:18px}
  body[data-concept=praezision] .hero-copy h1{font-size:clamp(42px,4vw,62px);margin:21px 0 18px}
  body[data-concept=werkstatt] .hero-copy h1{font-size:clamp(40px,4vw,62px);margin:20px 0 18px}
  body[data-concept=praezision] .current-step{padding-top:16px}
  body[data-concept=praezision] .step-small{display:none}
}

@media(max-width:850px){
  body[data-concept=industrie] h1{font-size:44px;line-height:.96;margin:15px 0 13px}
  body[data-concept=industrie] .hero-copy{padding-top:22px}
  body[data-concept=industrie] .hero-copy>p{max-width:100%;font-size:10px;margin-bottom:12px}
  body[data-concept=industrie] .hero-copy>p br{display:none}
  body[data-concept=industrie] .hero-copy>.primary-button{display:none}
  body[data-concept=industrie] .hero-visual{min-height:230px}
  body[data-concept=industrie] .hero-visual [data-tank-viewer]{inset:15px -10px 54px}
  body[data-concept=industrie] .scene-label{font-size:7px}
  body[data-concept=industrie] .stage-info{bottom:37px}
  body[data-concept=industrie] .stage-name{font-size:10px}
  body[data-concept=industrie] .stage-description{font-size:7px}
  body[data-concept=industrie] .tank-selector{height:104px}
  body[data-concept=industrie] .tank-option{height:85px}
  body[data-concept=industrie] .diagram-note{margin:0 0 4px;font-size:6px}
  .stage-controls button{min-height:27px}
  .stage-controls button b{font-size:8px}
  .stage-controls button span{font-size:6px}
  .diagram-note{font-size:6px}
  body[data-concept=industrie] .stage-controls button{gap:5px}
}

@media(max-width:760px){
  body[data-concept=praezision] .story-sticky,body[data-concept=werkstatt] .story-sticky{grid-template-rows:auto minmax(0,1fr) auto auto}
  body[data-concept=praezision] .story-sticky>.diagram-note,body[data-concept=werkstatt] .story-sticky>.diagram-note{grid-row:3}
  body[data-concept=praezision] .story-sticky>.tank-selector,body[data-concept=werkstatt] .story-sticky>.tank-selector{grid-row:4}
  body[data-concept=praezision] .hero-copy,body[data-concept=werkstatt] .hero-copy{padding-top:3px}
  body[data-concept=praezision] .hero-copy h1{font-size:34px;margin:12px 0}
  body[data-concept=praezision] .current-step{position:static;margin:9px 0 0;padding:0;max-width:100%}
  body[data-concept=praezision] .current-step .step-title{display:none}
  body[data-concept=praezision] [data-tank-viewer]{min-height:190px}
  body[data-concept=werkstatt] .hero-copy h1{font-size:30px;margin:14px 0 10px}
  body[data-concept=werkstatt] .hero-intro{max-width:100%;font-size:9px;margin-bottom:10px}
  body[data-concept=werkstatt] .circle-link{display:none}
  body[data-concept=werkstatt] [data-tank-viewer]{min-height:185px}
  body[data-concept=praezision] .viewer-area,body[data-concept=werkstatt] .viewer-area{padding-top:10px}
  .story-sticky{min-height:560px!important}
  body[data-concept=werkstatt] .stage-name{font-size:10px}
  body[data-concept=praezision] .progress-track,body[data-concept=werkstatt] .progress-track{margin-bottom:5px}
  .diagram-note{margin-bottom:5px}
}

@media(max-width:380px){
  body[data-concept=industrie] h1{font-size:38px}
  body[data-concept=praezision] .hero-copy h1{font-size:31px}
  body[data-concept=werkstatt] .hero-copy h1{font-size:27px}
}

@media(prefers-reduced-motion:reduce){
  .story-sticky{min-height:690px!important}
  body[data-concept=industrie] .story-sticky{min-height:710px!important}
  .diagram-note{padding-top:8px}
}

@media(max-width:760px) and (max-height:760px) and (prefers-reduced-motion:no-preference){
  .story-sticky{min-height:0!important}
  body[data-concept=industrie] .hero-copy{padding-top:14px}
  body[data-concept=industrie] h1{font-size:36px;margin:11px 0}
  body[data-concept=industrie] .hero-visual{min-height:190px}
  body[data-concept=werkstatt] .viewer-bottom{min-height:38px;padding:3px 0 8px}
  body[data-concept=praezision] .hero-copy h1{font-size:30px}
  body[data-concept=praezision] [data-tank-viewer]{min-height:155px}
  body[data-concept=werkstatt] [data-tank-viewer]{min-height:150px}
}
