/* VSK 16.85 — first-paint authority.
   These rules were previously injected after DOMContentLoaded. Loading them
   with the page prevents the old-layout flash without hiding the document. */

@media (min-width:1481px){
  body.v8.v13.v14 .site-header,
  body.v8.v13.v14 .site-header.is-solid,
  body.v8.v13.v14 .site-header.is-scrolled{
    grid-template-columns:minmax(330px,1fr) auto 196px!important;
    gap:28px!important;
    padding-inline:40px!important;
  }
  body.v8.v13.v14 .desktop-nav{gap:20px!important}
  body.v8.v13.v14 .desktop-nav a{font-size:12px!important;letter-spacing:.012em!important;font-weight:600!important}
}
@media (min-width:1221px) and (max-width:1480px){
  body.v8.v13.v14 .site-header,
  body.v8.v13.v14 .site-header.is-solid,
  body.v8.v13.v14 .site-header.is-scrolled{
    grid-template-columns:minmax(285px,1fr) auto 176px!important;
    gap:18px!important;
    padding-inline:30px!important;
  }
  body.v8.v13.v14 .desktop-nav{gap:11px!important}
  body.v8.v13.v14 .desktop-nav a{font-size:11.3px!important;letter-spacing:.008em!important;font-weight:600!important}
}

/* machines.html contains all three hero variants so the correct one is painted
   directly from the URL, before the runtime bundle is needed. */
html body.v8.v13.v14[data-page="machines"] .archive-hero [data-route-copy]{display:none!important}
html body.v8.v13.v14[data-page="machines"] .archive-hero [data-route-copy="experience"]{display:grid!important}
html[data-vsk-route="spm"] body.v8.v13.v14[data-page="machines"] .archive-hero [data-route-copy="experience"],
html[data-vsk-route="retrofit"] body.v8.v13.v14[data-page="machines"] .archive-hero [data-route-copy="experience"]{display:none!important}
html[data-vsk-route="spm"] body.v8.v13.v14[data-page="machines"] .archive-hero [data-route-copy="spm"],
html[data-vsk-route="retrofit"] body.v8.v13.v14[data-page="machines"] .archive-hero [data-route-copy="retrofit"]{display:grid!important}

[data-route-status]{display:none!important}
[data-route-status="experience"]{display:inline!important}
html[data-vsk-route="spm"] [data-route-status="experience"],
html[data-vsk-route="retrofit"] [data-route-status="experience"]{display:none!important}
html[data-vsk-route="spm"] [data-route-status="spm"],
html[data-vsk-route="retrofit"] [data-route-status="retrofit"]{display:inline!important}

html[data-vsk-route="experience"] body[data-page="machines"] .archive-types [data-route-filter="experience"],
html[data-vsk-route="spm"] body[data-page="machines"] .archive-types [data-route-filter="spm"],
html[data-vsk-route="retrofit"] body[data-page="machines"] .archive-types [data-route-filter="retrofit"]{
  background:#0D1824!important;color:#fff!important;
}
html[data-vsk-route="experience"] body[data-page="machines"] .archive-types [data-route-filter="experience"] b,
html[data-vsk-route="spm"] body[data-page="machines"] .archive-types [data-route-filter="spm"] b,
html[data-vsk-route="retrofit"] body[data-page="machines"] .archive-types [data-route-filter="retrofit"] b{color:#77bdec!important}

/* Route-aware current navigation without a DOM rewrite. */
html[data-vsk-route="spm"] body[data-page="machines"] .desktop-nav a[data-route-link="spm"],
html[data-vsk-route="retrofit"] body[data-page="machines"] .desktop-nav a[data-route-link="retrofit"],
html[data-vsk-route="experience"] body[data-page="machines"] .desktop-nav a[data-route-link="experience"]{
  color:#0D1824!important;
}
html[data-vsk-route="spm"] body[data-page="machines"] .desktop-nav a[data-route-link="spm"]::after,
html[data-vsk-route="retrofit"] body[data-page="machines"] .desktop-nav a[data-route-link="retrofit"]::after,
html[data-vsk-route="experience"] body[data-page="machines"] .desktop-nav a[data-route-link="experience"]::after{
  right:0!important;
}

/* Gallery category rail — previously injected after the page was already visible. */
html body.v8.v13.v14[data-page="gallery"] .gallery-controls{
  box-sizing:border-box!important;width:var(--audit-shell,calc(100% - 80px))!important;
  max-width:none!important;margin:22px auto 0!important;padding:0!important;
  display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:8px!important;align-items:stretch!important;background:transparent!important;
  border:0!important;min-height:0!important;height:auto!important;overflow:visible!important;
}
html body.v8.v13.v14[data-page="gallery"] .gallery-controls>.gallery-category-button{
  position:relative!important;box-sizing:border-box!important;width:100%!important;min-width:0!important;
  min-height:64px!important;height:64px!important;margin:0!important;padding:10px 12px!important;
  display:grid!important;grid-template-columns:minmax(0,1fr) 18px!important;grid-template-rows:auto 1fr!important;
  column-gap:8px!important;align-items:start!important;border:1px solid #cbd7df!important;
  background:#fbfcfc!important;color:#102333!important;text-align:left!important;box-shadow:none!important;
  overflow:hidden!important;cursor:pointer!important;transition:background .18s ease,border-color .18s ease,transform .18s ease!important;
}
html body.v8.v13.v14[data-page="gallery"] .gallery-category-button .gallery-cat-label{
  grid-column:1!important;min-width:0!important;display:flex!important;align-items:center!important;gap:7px!important;
  overflow:hidden!important;color:#31567f!important;font:500 9px/1.15 "IBM Plex Mono",monospace!important;
  letter-spacing:.07em!important;text-transform:uppercase!important;white-space:nowrap!important;text-overflow:ellipsis!important;
}
html body.v8.v13.v14[data-page="gallery"] .gallery-category-button .gallery-cat-index{flex:0 0 auto!important;color:#91a3b2!important}
html body.v8.v13.v14[data-page="gallery"] .gallery-category-button strong{
  grid-column:1!important;align-self:end!important;margin:5px 0 0!important;color:#102333!important;
  font:600 14px/1 "Space Grotesk",Inter,sans-serif!important;letter-spacing:-.02em!important;white-space:nowrap!important;
}
html body.v8.v13.v14[data-page="gallery"] .gallery-category-button i{
  grid-column:2!important;grid-row:1/3!important;align-self:end!important;justify-self:end!important;color:#8ca2b3!important;
  font-style:normal!important;font-size:14px!important;transition:transform .18s ease,color .18s ease!important;
}
html body.v8.v13.v14[data-page="gallery"] .gallery-category-button:hover{background:#f3f7f9!important;border-color:#aebfcb!important;transform:translateY(-1px)!important}
html body.v8.v13.v14[data-page="gallery"] .gallery-category-button:hover i{color:#167bc4!important;transform:translateX(3px)!important}
html body.v8.v13.v14[data-page="gallery"] .gallery-category-button.is-active{background:#edf4f9!important;border-color:#9fb8ce!important;box-shadow:inset 0 3px 0 #1e56aa!important}
html body.v8.v13.v14[data-page="gallery"] .gallery-status{margin-top:10px!important;min-height:24px!important;padding:0!important;border:0!important;font-size:11px!important}
html body.v8.v13.v14[data-page="gallery"] .gallery-status::before,
html body.v8.v13.v14[data-page="gallery"] .gallery-status::after{display:none!important;content:none!important}
@media(max-width:1220px){
  html body.v8.v13.v14[data-page="gallery"] .gallery-controls{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:760px){
  html body.v8.v13.v14[data-page="gallery"] .gallery-controls{width:calc(100% - 32px)!important;grid-template-columns:minmax(0,1fr)!important;gap:8px!important}
  html body.v8.v13.v14[data-page="gallery"] .gallery-controls>.gallery-category-button{height:auto!important;min-height:68px!important;padding:12px 14px!important;overflow:visible!important}
  html body.v8.v13.v14[data-page="gallery"] .gallery-category-button .gallery-cat-label{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere!important;font-size:10px!important;line-height:1.35!important}
  html body.v8.v13.v14[data-page="gallery"] .gallery-category-button strong{white-space:normal!important;font-size:15px!important;line-height:1.2!important}
}


/* Values previously calculated by app.js after first paint are now static. */
@media(min-width:721px){
  html body.v8.v13.v14[data-page="home"] .capability-media .vsk-related-projects-cta,
  html body.v8.v13.v14[data-page="home"] .capability-media .capability-project-link{
    width:min(100%,278px)!important;min-width:250px!important;height:54px!important;min-height:54px!important;
    margin-top:20px!important;padding:0 18px!important;gap:16px!important;font-size:12px!important;
  }
  html body.v8.v13.v14[data-page="home"] .capability-media .vsk-related-projects-cta i,
  html body.v8.v13.v14[data-page="home"] .capability-media .capability-project-link i{font-size:15px!important}
}

/* Preserve the final 11px mono utility state without a computed-style scan after paint. */
html body.v8.v13.v14 .hero-blue-copy .hero-kicker,
html body.v8.v13.v14 .hero-blue-copy .hero-chips span,
html body.v8.v13.v14 .hero-board-tag,
html body.v8.v13.v14 .hero-proof-chip strong,
html body.v8.v13.v14 .project-card small,
html body.v8.v13.v14 .metric-card small,
html body.v8.v13.v14 .process-line span,
html body.v8.v13.v14 .footer-brand button,
html body.v8.v13.v14[data-page="machines"] .archive-hero .kicker,
html body.v8.v13.v14[data-page="machines"] .filter-toggle,
html body.v8.v13.v14[data-page="gallery"] .gallery-category-button .gallery-cat-label,
html body.v8.v13.v14[data-page="gallery"] .gallery-project-group>header span,
html body.v8.v13.v14[data-page="gallery"] .gallery-project-group>header>strong,
html body.v8.v13.v14 .quote-success-actions>a,
html body.v8.v13.v14 .quote-success-actions>button,
html body.v8.v13.v14 .mobile-sticky-cta,
html body.v8.v13.v14 .dossier-id{
  font-size:11px!important;
}
@media(max-width:760px){
  html body.v8.v13.v14[data-page="gallery"] .gallery-category-button .gallery-cat-label{font-size:11px!important}
}


/* HOME CURTAIN HANDOFF — the branded curtain is the only first-load animation.
   The complete approved hero is already rendered underneath it, so when the
   curtain leaves there can never be a header-only white interval. */
html body.v8.v13.v14[data-page="home"] #hero .hero-blue-copy .hero-kicker,
html body.v8.v13.v14[data-page="home"] #hero .hero-blue-copy h1 span,
html body.v8.v13.v14[data-page="home"] #hero .hero-blue-copy h1 em,
html body.v8.v13.v14[data-page="home"] #hero .hero-blue-copy>p,
html body.v8.v13.v14[data-page="home"] #hero .hero-blue-copy .hero-actions,
html body.v8.v13.v14[data-page="home"] #hero .hero-blue-copy .hero-chips,
html body.v8.v13.v14[data-page="home"] #hero .hero-blue-copy .hero-chips span,
html body.v8.v13.v14[data-page="home"] #hero .hero-engineering-board,
html body.v8.v13.v14[data-page="home"] #hero .hero-board-tag,
html body.v8.v13.v14[data-page="home"] #hero .hero-tech-sheet,
html body.v8.v13.v14[data-page="home"] #hero .hero-proof-chip,
html body.v8.v13.v14[data-page="home"] #hero .hero-board-side-note,
html body.v8.v13.v14[data-page="home"] #hero .hero-crosshair{
  animation:none!important;
  opacity:1!important;
  transform:none!important;
  translate:none!important;
  visibility:visible!important;
}
html body.v8.v13.v14[data-page="home"] #hero .hero-board-main img{
  animation:none!important;
  clip-path:none!important;
  -webkit-mask:none!important;
  mask:none!important;
  opacity:1!important;
  visibility:visible!important;
}


/* HEADER TYPE SCALE — modest legibility increase without changing approved geometry. */
@media(min-width:1025px){
  html body.v8.v13.v14 .site-header .brand-copy strong{font-size:18px!important}
  html body.v8.v13.v14 .site-header .brand-copy small{font-size:10.5px!important}
  html body.v8.v13.v14 .site-header .header-cta{font-size:11px!important}
}
@media(min-width:1481px){
  html body.v8.v13.v14 .site-header .brand-copy strong{font-size:19px!important}
  html body.v8.v13.v14 .site-header .brand-copy small{font-size:11px!important}
  html body.v8.v13.v14 .site-header .header-cta{font-size:11.5px!important}
}


/* GALLERY CATEGORY FIRST-PAINT STATE — URL selection is resolved in
   v16-prepaint.js before CSS paints, so the wrong category never flashes. */
html[data-vsk-gallery-category]:not([data-vsk-gallery-category="all"])
body.v8.v13.v14[data-page="gallery"] .gallery-category-button[data-gallery-category="all"].is-active{
  background:#fbfcfc!important;
  border-color:#cbd7df!important;
  box-shadow:none!important;
}
html[data-vsk-gallery-category="all"] body.v8.v13.v14[data-page="gallery"] .gallery-category-button[data-gallery-category="all"],
html[data-vsk-gallery-category="spm-cnc-machines"] body.v8.v13.v14[data-page="gallery"] .gallery-category-button[data-gallery-category="spm-cnc-machines"],
html[data-vsk-gallery-category="spm-machines-plc-hmi-and-servo-controlled"] body.v8.v13.v14[data-page="gallery"] .gallery-category-button[data-gallery-category="spm-machines-plc-hmi-and-servo-controlled"],
html[data-vsk-gallery-category="hydraulic-systems-and-pressing-units"] body.v8.v13.v14[data-page="gallery"] .gallery-category-button[data-gallery-category="hydraulic-systems-and-pressing-units"],
html[data-vsk-gallery-category="retrofitting-and-service"] body.v8.v13.v14[data-page="gallery"] .gallery-category-button[data-gallery-category="retrofitting-and-service"]{
  background:#edf4f9!important;
  border-color:#9fb8ce!important;
  box-shadow:inset 0 3px 0 #1e56aa!important;
}