@font-face {
  font-family: "Stormfaze";
  src: url("/stormfaze_font/Stormfaze.otf") format("opentype");
  font-display: swap;
  font-style: normal;
  font-weight: 200;
}

/* Contact page reference block copied from the public RESEDA contact layout. */
.contact-reference {
  padding-block: clamp(3.5rem, calc(7 * var(--vwx)), 6rem);
  background: #fff;
}

.contact-reference > .container {
  width: min(1730px, calc(100% - 40px));
  max-width: 1730px;
  margin-inline: auto;
}

.contact-reference__grid {
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 790px) minmax(0, 900px);
  gap: clamp(1.5rem, calc(3 * var(--vwx)), 2.5rem);
  align-items: start;
  justify-content: center;
}

.contact-reference__map {
  min-height: 528px;
  position: relative;
  overflow: hidden;
  background: #eef1ee;
}

.contact-reference__map iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 528px;
  border: 0;
}

.contact-reference__info {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 1.2rem;
  padding-top: 0;
  color: #000;
}

.contact-reference__info article {
  min-width: 0;
  min-height: 210px;
  display: grid;
  align-content: start;
  padding: clamp(1.35rem, calc(2.3 * var(--vwx)), 2rem);
  border: 1px solid #e3e3e3;
  background:
    linear-gradient(135deg, rgba(215, 25, 32, 0.045), transparent 44%),
    #fff;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.07);
}

.contact-reference__info h2 {
  min-height: 3.55rem;
  display: flex;
  align-items: flex-start;
  margin: 0 0 1.35rem;
  color: #000;
  font-size: 1.478rem;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: uppercase;
}

.contact-reference__info p {
  margin: 0;
  color: #000;
  font-size: 1.408rem;
  line-height: 1.45;
  white-space: nowrap;
}

.contact-reference__info p + p {
  margin-top: 0.7rem;
}

.contact-reference__info a {
  color: inherit;
  text-decoration: none;
}

.contact-reference__info a:hover {
  color: var(--red);
}

.contact-reference__socials {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
}

.contact-reference__socials a {
  width: 4.435rem;
  height: 4.435rem;
  display: grid;
  place-items: center;
  background: #f0f0f0;
  color: #8d9397;
  border: 1px solid #e4e4e4;
  font-family: Arial, sans-serif;
  font-size: 2.182rem;
  font-weight: 650;
  line-height: 1;
  text-decoration: none;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.contact-reference__socials svg {
  width: 54%;
  height: 54%;
  display: block;
  fill: currentColor;
}

.contact-reference__socials a:hover {
  background: #fee9e9;
  border-color: #ffd0d0;
  color: var(--red);
  transform: translateY(-2px);
}

.contact-team {
  padding-block: 0 clamp(4rem, calc(7 * var(--vwx)), 6rem);
  background: #fff;
  color: #000;
}

.contact-team__inner {
  width: min(1730px, calc(100% - 40px));
  max-width: 1730px;
  margin-inline: auto;
}

.contact-team__head {
  min-height: 136px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  padding-top: 20px;
  text-align: center;
}

.contact-team__head h2 {
  margin: 0 0 21px;
  color: #000;
  font-size: 40px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: 0;
}

.contact-team__head p {
  margin: 0;
  color: #000;
  font-size: 18px;
  line-height: 1.55;
}

.contact-team__grid {
  width: 100%;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.contact-team-card {
  min-height: 254px;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 25px 18px;
  overflow: hidden;
  text-align: center;
  border: 1px solid #e6e6e6;
  border-top: 4px solid var(--red);
  background:
    linear-gradient(rgba(0, 0, 0, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 0, 0, 0.045) 1px, transparent 1px),
    radial-gradient(circle at 85% 18%, rgba(0, 0, 0, 0.055), transparent 7.5rem),
    #fff;
  background-size: 34px 34px, 34px 34px, auto, auto;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.06);
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.contact-team-card::after {
  content: "";
  position: absolute;
  right: -44px;
  bottom: -44px;
  width: 132px;
  height: 132px;
  border: 18px solid rgba(0, 0, 0, 0.055);
  border-radius: 50%;
  pointer-events: none;
}

.contact-team-card:hover {
  transform: translateY(-4px);
  border-color: rgba(215, 25, 32, 0.28);
  box-shadow: 0 24px 58px rgba(0, 0, 0, 0.12);
}

.contact-team-card__icon {
  width: 50px;
  height: 50px;
  margin-bottom: 13px;
  fill: none;
  stroke: #000;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 3;
}

.contact-team-card h3 {
  position: relative;
  margin: 0 0 11px;
  color: #000;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: 0;
}

.contact-team-card h3::after {
  content: "";
  display: block;
  width: 46px;
  height: 3px;
  margin: 12px auto 0;
  background: var(--red);
}

.contact-team-card em {
  margin-bottom: 17px;
  color: #000;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.3;
  text-transform: uppercase;
}

.contact-team-card a {
  color: #000;
  font-size: 20px;
  line-height: 1.55;
  text-decoration: none;
  overflow-wrap: anywhere;
}

.contact-team-card a:hover {
  color: var(--red);
}

@media (min-width: 769px) {
  .contact-team-card {
    transition: none;
  }

  .contact-team-card:hover {
    transform: none;
    border-color: #e6e6e6;
    border-top-color: var(--red);
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.06);
  }

}

@media (max-width: 1020px) {
  .contact-reference__grid {
    grid-template-columns: 1fr;
  }

  .contact-reference__map,
  .contact-reference__map iframe {
    min-height: 430px;
  }

  .contact-team__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .contact-reference {
    padding-block: 3rem;
  }

  .contact-reference__grid {
    gap: 2.5rem;
  }

  .contact-reference__map,
  .contact-reference__map iframe {
    min-height: 340px;
  }

  .contact-reference__info {
    grid-template-columns: 1fr;
    row-gap: 2.25rem;
    padding-top: 0;
  }

  .contact-reference__info p {
    white-space: normal;
  }

  .contact-reference__info h2 {
    min-height: 0;
    margin-bottom: 1.1rem;
  }

  .contact-team {
    padding-bottom: 70px;
  }

  .contact-team__inner {
    width: 300px;
  }

  .contact-team__head {
    min-height: 198px;
    justify-content: flex-start;
    padding-top: 70px;
  }

  .contact-team__head h2 {
    margin-bottom: 25px;
    font-size: 24px;
  }

  .contact-team__head p {
    max-width: 280px;
    font-size: 17px;
    line-height: 1.55;
  }

  .contact-team__grid {
    width: 280px;
    grid-template-columns: 1fr;
  }

  .contact-team-card {
    min-height: 245px;
    padding: 22px 14px;
  }

  .contact-team-card__icon {
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
  }

  .contact-team-card h3 {
    margin-bottom: 13px;
    font-size: 24px;
  }

  .contact-team-card em,
  .contact-team-card a {
    font-size: 19px;
  }
}

:root {
  --white: #ffffff;
  --black: #050505;
  --ink: #111111;
  --soft: #f5f5f5;
  --line: rgba(5, 5, 5, 0.12);
  --muted: #666666;
  --red: #d71920;
  --red-dark: #9d1117;
  --tech-blue: #09233f;
  --tech-blue-deep: #031321;
  --tech-blue-soft: #123b61;
  --tech-cyan: #67c9ff;
  --panel: rgba(255, 255, 255, 0.86);
  --shadow: 0 26px 70px rgba(0, 0, 0, 0.14);
  --glow: 0 22px 60px rgba(215, 25, 32, 0.28);
  --radius: 18px;
  --max: 1220px;
  --menu-control-top: 84px;
  --menu-control-height: 50px;
  --menu-scroll-shift: 0px;
  --home-logo-height: clamp(90px, calc(7.569 * var(--vwx)), 136.8px);
  --home-logo-half-height: clamp(45px, calc(3.7845 * var(--vwx)), 68.4px);
  --home-menu-half-height: 25px;
  --header-control-spread: clamp(745px, calc(calc(33 * var(--vwx)) + 315px), 950px);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background:
    radial-gradient(circle at 12% 0%, rgba(215, 25, 32, 0.06), transparent 32rem),
    linear-gradient(180deg, #fff, #f7f7f7 55%, #fff);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

body.route-home {
  overflow-x: clip;
}

#main:focus {
  outline: none;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
}

button,
input,
select,
textarea {
  font: inherit;
}

.skip-link {
  left: 1rem;
  position: absolute;
  top: -4rem;
  z-index: 1000;
  background: var(--red);
  color: white;
  padding: 0.8rem 1rem;
  border-radius: 999px;
}

.skip-link:focus {
  top: 1rem;
}

.container {
  width: min(var(--max), calc(100% - 40px));
  margin-inline: auto;
}

.site-header .container {
  width: 100%;
}

body:not(.menu-open) .site-header .container {
  width: 100%;
}

.site-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background: transparent;
  backdrop-filter: none;
  border-bottom: 1px solid transparent;
  transition: background 0.32s ease, border-color 0.32s ease, backdrop-filter 0.32s ease;
}

.menu-open .site-header {
  background: transparent;
  backdrop-filter: none;
  border-bottom-color: transparent;
}

.menu-open .site-header::before {
  background: #ffffff;
  content: "";
  height: calc(var(--menu-live-top, var(--menu-control-top)) + var(--menu-live-height, var(--menu-control-height)) + 20px);
  left: 0;
  pointer-events: none;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 70;
}

.site-header.is-hidden {
  transform: none;
}

body:not(.menu-open) .site-header.is-hidden {
  pointer-events: none;
}

body:not(.menu-open) .site-header.is-hidden .menu-toggle {
  pointer-events: auto;
  z-index: 90;
}

.nav-wrap {
  background: transparent;
  transition: background 0.32s ease;
}

.menu-open .nav-wrap {
  background: transparent;
}

.menu-open .menu-toggle {
  background: transparent;
  border-color: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.nav {
  align-items: center;
  column-gap: 1rem;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  min-height: 104px;
  padding-inline: max(2rem, calc((calc(100 * var(--vwx)) - 1600px) / 2));
  position: relative;
  transition: min-height 0.24s ease;
}

body.menu-open .nav {
  min-height: 104px;
}

.brand {
  align-items: center;
  display: none;
  justify-self: center;
  opacity: 0;
  pointer-events: none;
  position: relative;
  transition: opacity 0.18s ease, transform 0.18s ease;
  width: 209px;
  z-index: 2;
}

body.menu-open .brand {
  opacity: 0;
  pointer-events: none;
  transform: translateY(-4px);
}

.brand img {
  width: 209px;
  height: auto;
}

.main-nav {
  align-items: center;
  display: none;
  flex-wrap: nowrap;
  gap: 0.42rem 1.75rem;
  justify-content: center;
  left: 58px;
  position: absolute;
  right: 230px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
}

body.menu-open .main-nav {
  align-items: center;
  display: flex;
  background: #ffffff;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  left: 0;
  min-height: var(--menu-live-height, var(--menu-control-height));
  padding-inline: 390px;
  position: fixed;
  right: 0;
  top: var(--menu-live-top, var(--menu-control-top));
  transform: none;
  z-index: 80;
}

.main-nav > a,
.nav-group > a {
  border-radius: 999px;
  align-items: center;
  color: #202020;
  display: inline-flex;
  font-size: 1.26rem;
  font-weight: 800;
  justify-content: center;
  line-height: 1.15;
  padding: 0.54rem 0.58rem;
  text-align: center;
  text-transform: none;
  white-space: nowrap;
}

.main-nav a:hover,
.main-nav a.active {
  color: var(--red);
  background: rgba(215, 25, 32, 0.08);
}

.nav-group {
  display: inline-flex;
  position: relative;
}

.nav-group::after {
  content: "";
  height: 0.55rem;
  left: 0;
  position: absolute;
  top: 100%;
  width: 100%;
}

.dropdown {
  background: white;
  border: 1px solid var(--line);
  border-radius: 12px;
  box-shadow: var(--shadow);
  display: grid;
  gap: 0.1rem;
  left: 0;
  min-width: 360px;
  opacity: 0;
  padding: 0.55rem;
  pointer-events: none;
  position: absolute;
  top: calc(100% + 0.55rem);
  transform: translateY(15px);
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 10;
}

.nav-group:hover .dropdown,
.nav-group:focus-within .dropdown {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.dropdown a {
  color: #202020;
  border-radius: 8px;
  font-size: 1.26rem;
  font-weight: 800;
  line-height: 1.2;
  padding: 0.94rem 1.07rem;
  text-transform: uppercase;
  white-space: normal;
}

.dropdown a:hover {
  background: var(--red);
  color: white;
}

body:not(.route-home):not(.menu-open) .menu-inquiry {
  display: none;
}

.menu-inquiry {
  align-items: center;
  background: var(--red);
  border-radius: 999px;
  color: #ffffff;
  display: inline-flex;
  font-size: 1.14rem;
  font-weight: 800;
  justify-content: center;
  left: calc(50% - 955px);
  letter-spacing: 0.04em;
  min-height: var(--menu-control-height);
  padding: 0.66rem 1.55rem;
  position: absolute;
  text-transform: uppercase;
  top: 43px;
  transition: background 0.18s ease, transform 0.18s ease;
  white-space: nowrap;
  z-index: 4;
}

.menu-inquiry:hover {
  background: var(--red-dark);
  transform: translateY(-1px);
}

.menu-language {
  display: none;
}

body.menu-open .menu-inquiry {
  align-items: center;
  background: var(--red);
  border-radius: 999px;
  color: #ffffff;
  display: inline-flex;
  font-size: 1.14rem;
  font-weight: 800;
  justify-content: center;
  left: calc(50% - 955px);
  letter-spacing: 0.04em;
  min-height: var(--menu-control-height);
  padding: 0.66rem 1.55rem;
  position: fixed;
  text-transform: uppercase;
  top: 43px;
  transition: background 0.18s ease, transform 0.18s ease;
  white-space: nowrap;
  z-index: 90;
}

body.menu-open .menu-language {
  align-items: center;
  color: #202020;
  display: inline-flex;
  font-size: 1.26rem;
  font-weight: 800;
  gap: 0.42rem;
  line-height: 1;
  min-height: var(--menu-live-height, var(--menu-control-height));
  padding: 0.54rem 0.58rem;
  position: fixed;
  right: calc(var(--menu-live-edge-distance, 45px) + var(--menu-live-height, var(--menu-control-height)) + 1.25rem);
  top: var(--menu-live-top, var(--menu-control-top));
  white-space: nowrap;
  z-index: 90;
}

body.menu-open .menu-language span:not(:last-child)::after {
  color: #9a9a9a;
  content: "|";
  margin-left: 0.42rem;
}

body.menu-open .menu-language span {
  cursor: pointer;
}

body.menu-open .menu-language span.active {
  color: var(--red);
}

body.menu-open .menu-inquiry:hover {
  background: var(--red-dark);
  transform: translateY(-1px);
}

body:is(.language-en, .language-de) .main-nav {
  gap: 0.42rem 1.75rem;
}

body:is(.language-en, .language-de) .main-nav > a,
body:is(.language-en, .language-de) .nav-group > a {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-size: 1.26rem;
  font-weight: 800;
  justify-content: center;
  line-height: 1.15;
  padding: 0.54rem 0.58rem;
  text-align: center;
  white-space: nowrap;
}

body:is(.language-en, .language-de) .dropdown {
  gap: 0.1rem;
  min-width: 360px;
  padding: 0.55rem;
}

body:is(.language-en, .language-de) .dropdown a {
  align-items: center;
  display: flex;
  font-size: 1.26rem;
  font-weight: 800;
  line-height: 1.2;
  min-height: 3.95rem;
  padding: 0.94rem 1.07rem;
  text-transform: uppercase;
}

body:is(.language-en, .language-de).menu-open .menu-inquiry {
  font-size: 1.14rem;
  font-weight: 800;
  min-height: var(--menu-control-height);
  padding: 0.66rem 1.55rem;
}

.menu-toggle {
  align-items: center;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 8px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  color: white;
  cursor: pointer;
  display: inline-flex;
  font-size: 1.14rem;
  font-weight: 700;
  gap: 0.98rem;
  grid-column: 3;
  justify-self: end;
  letter-spacing: 0.02em;
  padding: 0.66rem 0.82rem;
  position: fixed;
  right: max(1.25rem, calc(50% - var(--header-control-spread)));
  text-shadow:
    0 1px 1px #000000,
    0 1px 3px #000000,
    0 3px 10px rgba(0, 0, 0, 0.98);
  top: calc(var(--home-logo-half-height) - var(--home-menu-half-height));
  transition: color 0.16s ease, text-shadow 0.16s ease;
  transform: translateX(-5px) scale(1.105);
  transform-origin: right center;
  text-transform: uppercase;
  z-index: 4;
}

body.menu-open .menu-toggle {
  transform: translateX(-5px) scale(1.105);
  color: #202020;
  text-shadow: none;
  z-index: 90;
}

.menu-toggle__label {
  transition: opacity 0.16s ease, width 0.16s ease;
}

body.menu-open .menu-toggle__label {
  opacity: 0;
  overflow: hidden;
  width: 0;
}

.menu-toggle__icon {
  border-top: 2px solid currentColor;
  display: inline-block;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.95)) drop-shadow(0 2px 7px rgba(0, 0, 0, 0.9));
  height: 29px;
  position: relative;
  transition: border-color 0.14s ease, filter 0.16s ease;
  width: 40px;
}

.menu-toggle__icon::before,
.menu-toggle__icon::after {
  border-top: 2px solid currentColor;
  content: "";
  left: 0;
  position: absolute;
  transition: top 0.16s ease, transform 0.16s ease;
  width: 40px;
}

.menu-toggle__icon::before {
  top: 13px;
}

.menu-toggle__icon::after {
  top: 26px;
}

body.menu-open .menu-toggle__icon {
  border-top-color: transparent;
  filter: none;
}

body.menu-open .menu-toggle__icon::before {
  top: 13px;
  transform: rotate(45deg);
}

body.menu-open .menu-toggle__icon::after {
  top: 13px;
  transform: rotate(-45deg);
}

@media (max-width: 1400px) {
  body:not(.menu-open) .menu-language {
    display: none !important;
  }
}

.eyebrow {
  align-items: center;
  color: var(--red);
  display: inline-flex;
  font-size: 0.8rem;
  font-weight: 700;
  gap: 0.6rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.eyebrow::before {
  content: "";
  width: 36px;
  height: 2px;
  background: currentColor;
}

h1,
h2,
h3,
p {
  margin: 0;
}

h1 {
  font-size: clamp(2.75rem, calc(6.2 * var(--vwx)), 6.5rem);
  line-height: 0.9;
  letter-spacing: -0.055em;
  margin-top: 1.1rem;
  text-transform: uppercase;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.9rem;
  margin-top: 2rem;
}

.btn {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 12px;
  cursor: pointer;
  display: inline-flex;
  font-weight: 900;
  justify-content: center;
  min-height: 48px;
  padding: 0.9rem 1.25rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.btn:hover {
  transform: translateY(-2px);
}

.btn--primary {
  background: linear-gradient(135deg, var(--red), #ff3038);
  color: white;
  box-shadow: var(--glow);
}

.btn--dark {
  background: var(--black);
  color: white;
}

.section {
  padding-block: 6.4rem;
}

.home-video-stage > .section {
  padding-block: 28.9941rem;
}

.home-cert-section {
  padding-top: 28.9941rem;
  padding-bottom: 28.9941rem;
}

.home-cert-section + .section--dark {
  padding-top: 28.9941rem;
}

.home-video-stage {
  --home-grid-size: 64px;
  --home-grid-line: rgba(215, 25, 32, 0.13);
  --home-grid-start: calc(275svh - 810px + clamp(2rem, calc(5 * var(--vwx)), 5rem));
  position: relative;
  background: #050505;
}

.home-video-stage::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  z-index: 3;
  height: 15rem;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.65) 35%, rgba(0, 0, 0, 0.35) 60%, rgba(0, 0, 0, 0.12) 80%, rgba(0, 0, 0, 0) 100%);
}

.home-video-stage::after {
  content: none;
}

.home-pinned-logo {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 46;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: var(--home-logo-height);
  width: auto;
  padding: 0;
  border-radius: 18px;
  background: transparent;
  border: 0;
  opacity: 0.96;
  overflow: visible;
}

.home-pinned-logo img {
  position: relative;
  width: auto;
  height: 100%;
}

.home-video-stage__bg {
  position: sticky;
  top: 0;
  z-index: 0;
  height: calc(100 * var(--vhx));
  margin-bottom: calc(-25 * var(--vhx));
  overflow: hidden;
  background: #050505;
}

.home-video-stage__bg::after {
  content: none;
}

.home-video-stage__headline {
  position: absolute;
  top: calc(100 * var(--vhx));
  top: calc(100 * var(--svhx));
  left: 0;
  right: 0;
  z-index: 8;
  display: grid;
  justify-items: center;
  width: 100%;
  color: white;
  font-family: "Stormfaze", "Segoe UI Light", "Montserrat", "Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: clamp(3.23568rem, calc(6.33654 * var(--vwx)), 6.87582rem);
  font-stretch: normal;
  font-weight: 400;
  font-feature-settings: "kern" 1;
  letter-spacing: 0.155em;
  line-height: 1.08;
  cursor: text;
  pointer-events: auto;
  text-align: center;
  text-rendering: geometricPrecision;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.38);
  text-transform: uppercase;
  transform: translateY(calc(-100% - 47px));
  user-select: text;
  -webkit-text-stroke: 0;
  -webkit-user-select: text;
}

.home-video-stage__headline span {
  display: block;
  font-variant-numeric: lining-nums;
  white-space: nowrap;
  user-select: text;
  -webkit-user-select: text;
}

.home-video-stage__headline > span {
  transform: translateY(100px) scale(1);
}

.home-capability-pill {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(1.275rem, calc(2.89 * var(--vwx)), 3.06rem);
  width: max-content;
  min-width: min(calc(59.5 * var(--vwx)), 808px);
  margin-top: calc(clamp(1.5rem, calc(2.6 * var(--vwx)), 2.4rem) + 70px);
  padding: 1.0625rem clamp(1.7rem, calc(3.57 * var(--vwx)), 3.6125rem);
  overflow-x: auto;
  border-radius: 999px;
  background: linear-gradient(135deg, #f00035, var(--red));
  box-shadow: 0 18px 48px rgba(215, 25, 32, 0.35);
  color: white;
  cursor: pointer;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  font-size: clamp(1.05rem, calc(1.19 * var(--vwx)), 1.3rem);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  scrollbar-width: none;
  text-shadow: none;
  transform: translateY(15px);
  transition: box-shadow 0.2s ease;
  white-space: nowrap;
}

.home-capability-pill::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  border-radius: inherit;
  background: rgba(0, 0, 0, 0.14);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

.home-capability-pill:hover,
.home-capability-pill:focus-within {
  box-shadow: 0 22px 54px rgba(215, 25, 32, 0.5);
}

.home-capability-pill:hover::after,
.home-capability-pill:focus-within::after {
  opacity: 1;
}

.home-capability-pill::-webkit-scrollbar {
  display: none;
}

.home-capability-pill span,
.home-capability-pill a {
  position: relative;
  z-index: 1;
  color: inherit;
  opacity: 0.92;
  pointer-events: none;
  text-decoration: none;
}

.home-video-stage__spacer {
  position: relative;
  z-index: 1;
  height: 0;
  pointer-events: none;
}

/* Skrito na namizju - prikazano samo v mobilnem MQ (glej spodaj), da rob
   ne vpliva na racunalnisko razlicico. */
.home-video-stage__mobile-edge {
  display: none;
}

.home-future-content {
  position: relative;
  z-index: 4;
  overflow: clip;
  min-height: calc(200 * var(--vhx));
  min-height: calc(200 * var(--svhx));
  background: #050505;
  clip-path: inset(255px 0 700px 0);
  isolation: isolate;
}

.home-future-edge {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 6;
  height: clamp(280px, calc(36 * var(--vwx)), 560px);
  pointer-events: none;
  transform: translateY(-50%);
  background: linear-gradient(180deg, rgba(5, 5, 5, 0), rgba(5, 5, 5, 0.92) 34%, #050505 44%, #050505 56%, rgba(5, 5, 5, 0.92) 66%, rgba(5, 5, 5, 0));
  mask-image: linear-gradient(180deg, transparent 0%, #000 25%, #000 75%, transparent 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 25%, #000 75%, transparent 100%);
}

.home-future-bottom-bar {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 7;
  height: 200px;
  pointer-events: none;
  background: #050505;
}

.home-future-bottom-bar::before,
.home-future-bottom-bar::after {
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  height: clamp(280px, calc(36 * var(--vwx)), 560px);
  pointer-events: none;
  background: linear-gradient(180deg, rgba(5, 5, 5, 0), rgba(5, 5, 5, 0.92) 34%, #050505 44%, #050505 56%, rgba(5, 5, 5, 0.92) 66%, rgba(5, 5, 5, 0));
  mask-image: linear-gradient(180deg, transparent 0%, #000 25%, #000 75%, transparent 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 25%, #000 75%, transparent 100%);
}

.home-future-bottom-bar::before {
  top: 0;
  transform: translateY(-50%);
}

.home-future-bottom-bar::after {
  bottom: 0;
  transform: translateY(50%);
}

.home-future-content__inner {
  position: fixed;
  inset: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: min(1920px, calc(100% - 24px));
  margin-inline: auto;
  height: calc(100 * var(--vhx));
  height: calc(100 * var(--svhx));
  min-height: calc(100 * var(--vhx));
  min-height: calc(100 * var(--svhx));
  padding-block: clamp(5rem, calc(12 * var(--vwx)), 11rem);
  clip-path: inset(var(--future-mask-top, calc(100 * var(--vhx))) 0 var(--future-mask-bottom, 0px) 0);
  pointer-events: none;
  visibility: var(--future-mask-visibility, hidden);
  will-change: clip-path;
}

.home-future-content__inner p {
  width: 100%;
  max-width: none;
  margin: 0;
  color: #858585;
  cursor: text;
  font-family: "Segoe UI Light", "Helvetica Neue", Arial, sans-serif;
  font-size: clamp(1.9586rem, calc(3.4819 * var(--vwx)), 3.9716rem);
  font-weight: 300;
  letter-spacing: -0.04em;
  line-height: 1.22;
  pointer-events: auto;
  text-align: center;
  user-select: text;
  -webkit-user-select: text;
}

.home-future-content__inner p strong {
  color: #ffffff;
  font-weight: inherit;
}

.home-future-stats {
  position: relative;
  z-index: 8;
  transform: translateY(-810px);
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  width: min(1680px, calc(100% - 80px));
  margin-top: clamp(2rem, calc(5 * var(--vwx)), 5rem);
  margin-bottom: clamp(8rem, calc(18 * var(--vwx)), 18rem);
  padding-block: clamp(1rem, calc(2 * var(--vwx)), 1.8rem);
  background: rgba(5, 5, 5, 0.35);
  backdrop-filter: blur(2px);
}

.home-future-stats div {
  min-height: clamp(130px, calc(11 * var(--vwx)), 180px);
  padding: clamp(1rem, calc(2 * var(--vwx)), 1.8rem) clamp(1.1rem, calc(2.7 * var(--vwx)), 2.8rem);
  border-left: 1px solid var(--red);
}

.home-future-stats strong {
  display: block;
  color: #ffffff;
  font-size: clamp(3.2rem, calc(5.2 * var(--vwx)), 6.2rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 0.9;
}

.home-future-stats span {
  display: block;
  margin-top: 0.85rem;
  color: rgba(255, 255, 255, 0.7);
  font-size: clamp(0.82rem, calc(1 * var(--vwx)), 1.15rem);
  font-weight: 900;
  line-height: 1.25;
  text-transform: uppercase;
}

.home-video-stage > .section {
  position: relative;
  z-index: 1;
}

.home-video-stage .intro-band,
.home-video-stage .section--dark,
.home-video-stage .video-section {
  background: transparent;
  color: white;
}

.home-video-stage > .intro-band {
  --capabilities-grid-bottom: -410px;
  position: relative;
  margin-top: -1050px;
}

.home-video-stage > .intro-band > .home-capabilities-layer {
  position: relative;
  width: 100%;
  isolation: isolate;
}

.home-video-stage > .intro-band > .home-capabilities-layer::before {
  content: "";
  position: absolute;
  inset: 0 0 var(--capabilities-mask-bottom, calc(100 * var(--vhx)));
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 12% 8%, rgba(215, 25, 32, 0.14), transparent 30rem),
    radial-gradient(circle at 88% 48%, rgba(157, 17, 23, 0.1), transparent 34rem),
    linear-gradient(var(--home-grid-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--home-grid-line) 1px, transparent 1px),
    #101010;
  background-size:
    auto,
    auto,
    var(--home-grid-size) var(--home-grid-size),
    var(--home-grid-size) var(--home-grid-size),
    auto;
}

.home-video-stage > .intro-band {
  height: var(--capabilities-placeholder-height);
  overflow-anchor: none;
}

.home-video-stage > .intro-band > .home-capabilities-bottom-edge {
  position: fixed;
  top: calc(100 * var(--vhx));
  right: 0;
  left: 0;
  z-index: 3;
  height: clamp(280px, calc(36 * var(--vwx)), 560px);
  pointer-events: none;
  transform: translateY(-50%);
  background: linear-gradient(180deg, rgba(28, 8, 10, 0), rgba(28, 8, 10, 0.92) 34%, #1c080a 44%, #1c080a 56%, rgba(28, 8, 10, 0.92) 66%, rgba(28, 8, 10, 0));
  mask-image: linear-gradient(180deg, transparent 0%, #000 25%, #000 75%, transparent 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 25%, #000 75%, transparent 100%);
  will-change: top;
}

.home-video-stage > .intro-band > .home-capabilities-layer {
  position: fixed;
  inset: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  width: 100%;
  height: calc(100 * var(--vhx));
  height: calc(100 * var(--svhx));
  clip-path: inset(
    var(--capabilities-mask-top, calc(100 * var(--vhx)))
    0
    var(--capabilities-mask-bottom, 0px)
    0
  );
  visibility: var(--capabilities-visibility, hidden);
  will-change: clip-path;
}

.home-video-stage .section-head h2 {
  color: white;
}

.home-video-stage .section-head p,
.home-video-stage .lead {
  color: rgba(255, 255, 255, 0.72);
}

.home-video-stage .intro-band > .home-capabilities-layer > .container {
  flex: 0 0 auto;
  padding: clamp(1.5rem, calc(3 * var(--vwx)), 3rem);
}

.home-video-stage .intro-band .section-head {
  position: relative;
  width: min(1680px, calc(100% - 40px));
  max-width: none;
  margin: 0 auto 0.35rem;
  padding: 0 0 1.35rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  text-align: left;
}

.home-video-stage .intro-band .section-head::before {
  content: none;
}

.home-video-stage .intro-band .section-head::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: clamp(180px, calc(24 * var(--vwx)), 420px);
  height: 2px;
  background: linear-gradient(90deg, var(--red), rgba(215, 25, 32, 0));
}

.home-video-stage .intro-band .section-head h2 {
  font-size: clamp(2.6rem, calc(4.35 * var(--vwx)), 4.8rem);
  font-weight: 750;
  letter-spacing: -0.045em;
  line-height: 0.94;
  text-align: center;
  white-space: nowrap;
}

.home-video-stage .video-section > .container,
.home-video-stage .home-cert-section > .container {
  padding: clamp(1.5rem, calc(3 * var(--vwx)), 3rem);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 18px;
  background: rgba(0, 0, 0, 0.78);
  box-shadow: 0 34px 100px rgba(0, 0, 0, 0.36);
}

.home-video-stage .home-cert-section > .container {
  width: calc(76.5% - 16px);
  max-width: none;
  padding-inline: 8px;
  border: 0;
  background: transparent;
  box-shadow: none;
  transform: translateY(-520px);
}

.home-cert-section__intro {
  width: min(var(--max), calc(100% - 40px));
  max-width: min(var(--max), calc(100% - 40px));
  margin-left: auto;
  margin-right: auto;
  margin-bottom: clamp(2rem, calc(3 * var(--vwx)), 3rem);
  padding: clamp(0.75rem, calc(1.3 * var(--vwx)), 1.15rem) clamp(1rem, calc(2 * var(--vwx)), 2rem);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 20px;
  background: #000;
  box-shadow: 0 20px 55px rgba(0, 0, 0, 0.5);
  text-align: center;
}

.home-cert-section__intro .video-section__title,
.home-cert-section__intro p {
  text-shadow:
    0 1px 2px #000000,
    0 2px 5px #000000,
    0 4px 12px rgba(0, 0, 0, 1),
    0 8px 24px rgba(0, 0, 0, 0.95);
}

.home-cert-section__intro .video-section__title {
  font-size: clamp(2.145rem, calc(3.315 * var(--vwx)), 3.77rem);
}

.home-cert-section__intro p {
  max-width: 100%;
  margin: 1rem auto 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: clamp(0.98rem, calc(1.15 * var(--vwx)), 1.12rem);
  font-weight: 500;
  line-height: 1.65;
  text-wrap: balance;
}

.home-video-stage .video-section > .container {
  width: min(1530px, calc(90% - 36px));
  padding: clamp(0.75rem, calc(1.5 * var(--vwx)), 1.5rem);
  background: #000;
  transform: translateY(-630px);
}

.home-video-stage .video-section {
  padding-bottom: 0;
  margin-bottom: -180px;
  overflow: visible;
}

.production-photo-stage {
  --production-block-gap: clamp(13.8rem, calc(24 * var(--vwx)), 22.5rem);
  --production-intro-top-gap: clamp(1.25rem, calc(2 * var(--vwx)), 1.8rem);
  position: relative;
  isolation: isolate;
  background: #050505;
  color: white;
}

.production-photo-stage__bg {
  position: sticky;
  top: 0;
  z-index: 0;
  height: calc(100 * var(--vhx));
  margin-bottom: calc(-100 * var(--vhx));
  overflow: hidden;
  background: #050505;
}

.production-photo-stage__bg::before,
.production-photo-stage__bg::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.production-photo-stage__bg::before {
  background: url("/assets/about-local-robot.jpg") center 32% / cover no-repeat;
  transform: scale(1.02);
}

.production-photo-stage__bg::after {
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(5, 5, 5, 0.08), rgba(5, 5, 5, 0.7) 62%, rgba(5, 5, 5, 0.96)),
    radial-gradient(circle at 18% 18%, rgba(215, 25, 32, 0.18), transparent 22rem);
}

.production-photo-stage > :not(.production-photo-stage__bg) {
  position: relative;
  z-index: 1;
}

.production-photo-stage .page-hero,
.production-photo-stage .production-visuals,
.production-photo-stage #strojni-park,
.production-photo-stage .finishing-panel,
.production-photo-stage .assembly-panel {
  background: transparent;
}

.production-photo-stage .section--dark {
  background: #050505;
}

.production-intro-card {
  margin-top: var(--production-intro-top-gap);
  overflow: visible;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 0 0 12px 12px;
  background:
    radial-gradient(circle at 82% 0%, rgba(215, 25, 32, 0.13), transparent 28rem),
    #050505;
  box-shadow: 0 38px 110px rgba(0, 0, 0, 0.48);
  position: relative;
}

.production-intro-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  bottom: 100%;
  height: var(--production-intro-top-gap);
  border-radius: 0;
  background: #050505;
}

.production-intro-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.055) 1px, transparent 1px);
  background-size: 58px 58px;
  mask-image: linear-gradient(180deg, black 0%, rgba(0, 0, 0, 0.4) 56%, transparent 100%);
}

.production-intro-card > * {
  position: relative;
  z-index: 1;
}

.production-intro-card .page-hero {
  min-height: 0;
  background: transparent;
}

.production-intro-card .page-hero::before {
  display: none;
}

.production-intro-card .page-hero .container,
.production-intro-card .production-visuals > .container {
  width: 100%;
}

.production-intro-card .production-summary .container {
  width: min(var(--max), calc(100% - 40px));
}

.production-intro-card .page-hero .container {
  padding: clamp(4.2rem, calc(5.5 * var(--vwx)), 4.75rem) clamp(1.5rem, calc(3 * var(--vwx)), 3rem) 1.8rem;
}

.production-intro-card .production-summary .container {
  padding-inline: clamp(1.5rem, calc(3 * var(--vwx)), 3rem);
}

.production-intro-card .production-summary {
  width: 100%;
  margin-inline: 0;
}

.production-intro-card .production-summary p {
  max-width: 1180px;
  font-size: clamp(1.02rem, calc(1.25 * var(--vwx)), 1.22rem);
  line-height: 1.62;
}

.production-photo-stage .production-intro-card .production-visuals {
  padding: clamp(1.5rem, calc(3 * var(--vwx)), 3rem);
}

.production-photo-stage .page-hero {
  display: grid;
  align-items: center;
  min-height: clamp(220px, calc(20 * var(--vwx)), 260px);
}

.production-photo-stage .page-hero .container {
  padding-block: 3rem 2rem;
}

.production-photo-stage .page-hero::before {
  background: none;
}

.production-photo-stage .production-summary {
  background: var(--red);
  box-shadow: 0 18px 50px rgba(215, 25, 32, 0.22);
  backdrop-filter: none;
}

.production-photo-stage .production-visuals {
  padding-block: clamp(2rem, calc(4 * var(--vwx)), 3.5rem) 0;
}

.production-photo-stage #strojni-park {
  padding-block: var(--production-block-gap) 0;
}

.production-photo-stage .finishing-panel {
  padding-block: var(--production-block-gap) 0;
}

.production-photo-stage .assembly-panel {
  padding-block: var(--production-block-gap) clamp(7rem, calc(14 * var(--vwx)), 12rem);
}

.production-photo-stage .section--dark {
  padding-top: 0;
  padding-bottom: clamp(4rem, calc(8 * var(--vwx)), 7rem);
}

.production-photo-stage #strojni-park > .container,
.production-photo-stage .production-visuals > .container,
.production-photo-stage .section--dark > .container {
  padding: clamp(1.5rem, calc(3 * var(--vwx)), 3rem);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 12px;
  background:
    linear-gradient(90deg, rgba(215, 25, 32, 0.12), transparent 46%),
    #050505;
  box-shadow: 0 34px 100px rgba(0, 0, 0, 0.36);
}

.production-photo-stage .production-intro-card .production-visuals > .container {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.production-photo-stage #strojni-park > .container {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 0%, rgba(215, 25, 32, 0.14), transparent 24rem),
    #050505;
}

.production-photo-stage #strojni-park > .container::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(90deg, black, transparent 82%);
}

.production-photo-stage #strojni-park > .container::after {
  content: "";
  position: absolute;
  left: clamp(1.5rem, calc(3 * var(--vwx)), 3rem);
  right: clamp(1.5rem, calc(3 * var(--vwx)), 3rem);
  top: 0;
  height: 3px;
  background: var(--red);
}

.production-photo-stage #strojni-park > .container > * {
  position: relative;
  z-index: 1;
}

.production-photo-stage .section-head h2 {
  color: white;
}

.production-photo-stage #strojni-park .section-head {
  border-left: 4px solid var(--red);
  margin-bottom: clamp(2rem, calc(4 * var(--vwx)), 3.2rem);
  padding-left: clamp(1rem, calc(2 * var(--vwx)), 1.6rem);
}

.production-photo-stage #strojni-park .section-head h2 {
  font-size: clamp(2.3rem, calc(5 * var(--vwx)), 5rem);
}

.production-photo-stage .section-head p,
.production-photo-stage .lead {
  color: rgba(255, 255, 255, 0.74);
}

.production-photo-stage .section--dark .section-head {
  margin-bottom: 1.2rem;
}

.production-photo-stage .section--dark .section-head h2 {
  max-width: 680px;
}

.home-video-hero__media {
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  width: calc(100 * var(--vwx));
  max-width: none;
  height: auto;
  transform: translateY(-50%);
  filter: none;
  opacity: 0;
  transition: opacity 0.45s ease;
}

.home-video-stage__bg .home-video-hero__media {
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: none;
}

.home-video-hero__media.is-visible {
  opacity: 1;
}

.home-video-hero__media--intro {
  z-index: 1;
}

.home-video-hero__media--loop {
  z-index: 2;
}

#strojni-park {
  scroll-margin-top: 110px;
}

#dodelave,
#meritve,
#meritve-in-preizkusi,
#kontrola-kakovosti,
#montaza,
#montaza-sklopov,
#certifikati-in-dokumenti {
  scroll-margin-top: 110px;
}

.section--soft {
  background: var(--soft);
}

.about-story.section--soft {
  background: #e8e8e8;
}

.section--dark {
  background:
    radial-gradient(circle at 85% 20%, rgba(215, 25, 32, 0.22), transparent 24rem),
    linear-gradient(135deg, #050505, #141414 52%, #050505);
  color: white;
  position: relative;
  overflow: hidden;
}

.intro-band {
  background:
    linear-gradient(180deg, #fff, #f5f5f5),
    radial-gradient(circle at 10% 10%, rgba(215, 25, 32, 0.1), transparent 20rem);
}

.section-head {
  display: grid;
  gap: 1rem;
  margin-bottom: 2.5rem;
  max-width: 760px;
}

.section-head.center {
  text-align: center;
  margin-inline: auto;
}

.careers-cta .section-head {
  margin-top: 85px;
}

.section-head h2 {
  font-size: clamp(2rem, calc(4 * var(--vwx)), 4.2rem);
  line-height: 0.98;
  letter-spacing: -0.035em;
  text-transform: uppercase;
}

.section-head p,
.lead {
  color: var(--muted);
  font-size: 1.05rem;
  line-height: 1.75;
}

.section--dark .section-head p,
.section--dark .lead {
  color: rgba(255, 255, 255, 0.68);
}

.section--dark .btn--dark {
  background: white;
  color: #050505;
}

.section--dark .btn--dark:hover {
  background: var(--red);
  color: white;
}

.grid {
  display: grid;
  gap: 1.25rem;
}

.grid-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.grid-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.card {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.88));
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04);
  padding: 1.5rem;
  position: relative;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.card::before,
.capability-tile::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(215, 25, 32, 0.16), transparent 28%),
    linear-gradient(90deg, rgba(0, 0, 0, 0.04) 1px, transparent 1px);
  background-size: auto, 38px 38px;
  opacity: 0;
  transition: opacity 0.25s ease;
}

.card > *,
.capability-tile > * {
  position: relative;
  z-index: 1;
}

.card:hover::before,
.capability-tile:hover::before {
  opacity: 1;
}

.card:hover {
  border-color: rgba(215, 25, 32, 0.4);
  box-shadow: var(--shadow);
  transform: translateY(-5px);
}

.section--dark .card {
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(255, 255, 255, 0.12);
  color: white;
}

.card h3 {
  font-size: 1.35rem;
  margin-bottom: 0.8rem;
}

.card p,
.card li {
  color: var(--muted);
  line-height: 1.7;
}

.section--dark .card p,
.section--dark .card li {
  color: rgba(255, 255, 255, 0.68);
}

.icon-mark {
  align-items: center;
  background: var(--black);
  border-radius: 14px;
  color: white;
  display: inline-flex;
  font-weight: 700;
  height: 48px;
  justify-content: center;
  margin-bottom: 1rem;
  width: 48px;
}

.card:hover .icon-mark {
  background: var(--red);
}

.split {
  align-items: center;
  display: grid;
  gap: 3rem;
  grid-template-columns: 0.95fr 1.05fr;
}

.about-industries {
  background:
    radial-gradient(circle at 82% 4%, rgba(215, 25, 32, 0.2), transparent 24rem),
    #050505;
}

.about-industry-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.35rem;
  margin-top: 2.35rem;
  max-width: 1180px;
  transform: translateX(-140px);
}

.about-industry-list span {
  display: grid;
  place-items: center;
  min-height: 130px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 8px;
  color: white;
  font-size: clamp(1.92rem, calc(2.86 * var(--vwx)), 2.37rem);
  font-weight: 950;
  line-height: 1.12;
  padding: 1.5rem;
  text-align: center;
  text-transform: uppercase;
  background:
    linear-gradient(rgba(255, 255, 255, 0.28) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.28) 1px, transparent 1px),
    linear-gradient(135deg, #a91117, #65080d);
  background-size: 64px 64px, 64px 64px, auto;
  background-position: -2px -20px, -2px -20px, 0 0;
  box-shadow: 0 18px 45px rgba(215, 25, 32, 0.28);
}

.about-industry-list span:nth-child(3) {
  text-indent: -9px;
}

body.language-en .about-industry-list span:nth-child(2) {
  white-space: pre-line;
}

.about-industry-list__semiconductor {
  text-indent: -10px;
}

.about-intro {
  background: white;
}

.about-intro__grid,
.about-industries__grid,
.about-story__grid {
  display: grid;
  gap: clamp(2rem, calc(5 * var(--vwx)), 4rem);
  grid-template-columns: minmax(0, 1fr) minmax(380px, 1fr);
  align-items: center;
}

/* This fixed-width "editorial" layout only fits viewports wide enough to hold
   both fixed-width columns (720px + 1260px + gap ≈ 2000px); below that it
   caused horizontal page overflow, so it's now scoped to very wide screens.
   Narrower viewports keep the responsive grid-template-columns set above. */
@media (min-width: 2100px) {
  .about-intro__grid {
    --about-intro-copy-width: 720px;
    --about-intro-photo-width: 1260px;
    --about-intro-gap: 1.5rem;
    --about-intro-photo-offset: 50px;
    width: calc(var(--about-intro-copy-width) + var(--about-intro-gap) + var(--about-intro-photo-width));
    grid-template-columns: minmax(var(--about-intro-copy-width), 1.1fr) minmax(var(--about-intro-photo-width), 0.9fr);
    gap: var(--about-intro-gap);
    transform: translateX(calc(var(--about-intro-photo-offset) / -2));
  }

  .about-intro .about-photo--wide {
    transform: translateX(var(--about-intro-photo-offset, 50px));
  }

  .about-intro .about-photo--clickable:hover {
    transform: translateX(var(--about-intro-photo-offset, 50px)) translateY(-4px);
  }
}

.about-industries__grid {
  display: block;
  min-height: 560px;
  position: relative;
  transform: translateX(-230px);
}

.about-copy h2 {
  font-size: clamp(2rem, calc(4 * var(--vwx)), 4.2rem);
  line-height: 0.95;
  margin: 0.9rem 0 1.4rem;
  text-transform: uppercase;
}

.about-copy p {
  color: var(--muted);
  font-size: clamp(1.18rem, calc(1.3 * var(--vwx)), 1.36rem);
  line-height: 1.82;
  margin: 0 0 1.25rem;
  max-width: 1120px;
}

.about-photo {
  display: block;
  min-height: 430px;
  overflow: hidden;
  border-radius: 8px;
  border: 1px solid rgba(5, 5, 5, 0.1);
  background: #101010;
  box-shadow: var(--shadow);
}

.section--dark .about-photo {
  border-color: rgba(255, 255, 255, 0.14);
  box-shadow: 0 34px 95px rgba(0, 0, 0, 0.45);
}

.about-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.about-photo--wide {
  aspect-ratio: 3 / 2;
  min-height: 0;
}

.about-photo--clickable {
  cursor: zoom-in;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.about-photo--clickable:hover {
  transform: translateY(-4px);
  box-shadow: 0 34px 95px rgba(0, 0, 0, 0.22);
}

.about-tour .section-head {
  max-width: 860px;
}

.about-tour__frame {
  overflow: hidden;
  border-radius: 8px;
  background: #101010;
  box-shadow: var(--shadow);
}

.about-tour__frame iframe {
  display: block;
  width: 100%;
  height: min(calc(64 * var(--vwx)), 530px);
  min-height: 360px;
  border: 0;
}

.about-tour__link {
  display: inline-flex;
  margin-top: 1rem;
  align-items: center;
  min-height: 46px;
  padding: 0.8rem 1rem;
  border-radius: 8px;
  background: var(--red);
  color: white;
  font-weight: 900;
  text-transform: uppercase;
  box-shadow: var(--glow);
}

.about-tour__link:hover {
  background: var(--red-dark);
}

.about-industries__copy .section-head {
  margin-bottom: 0;
  max-width: none;
}

.about-industries__copy {
  position: relative;
  z-index: 2;
  width: min(1180px, 100%);
  transform: translateX(-130px);
}

.about-industries__copy .section-head h2 {
  max-width: 900px;
}

.about-industries__copy .section-head p {
  max-width: 900px;
}

.about-industries .about-photo {
  position: absolute;
  right: -630px;
  top: 50%;
  width: 814px;
  transform: translateY(-50%);
}

.about-story__content {
  max-width: 900px;
}

.about-story__content .section-head {
  margin-bottom: 1.3rem;
}

.about-story__content .lead {
  font-size: clamp(1.28rem, calc(1.55 * var(--vwx)), 1.55rem);
  line-height: 1.78;
}

.about-story__grid {
  --about-story-media-height: 700px;
  --about-story-media-width: 700px;
  width: min(1600px, calc(100% - 40px));
}

.about-story__grid--wide {
  --about-story-media-width: 1050px;
}

.about-story__grid--media-left {
  grid-template-columns: minmax(0, var(--about-story-media-width)) minmax(360px, 1fr);
}

.about-story__grid--media-right,
.about-story__grid--reverse {
  grid-template-columns: minmax(360px, 1fr) minmax(0, var(--about-story-media-width));
}

.about-story__media {
  height: var(--about-story-media-height);
  min-height: var(--about-story-media-height);
  width: var(--about-story-media-width);
  max-width: 100%;
}

.about-story__media img {
  height: 100%;
  object-fit: contain;
  width: 100%;
}

.about-story--final .section-head h2,
.about-story--final .about-story__content {
  color: white;
}

.tech-hero-panel {
  display: none;
  background:
    radial-gradient(circle at 82% 6%, rgba(103, 201, 255, 0.2), transparent 26rem),
    radial-gradient(circle at 12% 72%, rgba(215, 25, 32, 0.13), transparent 20rem),
    linear-gradient(135deg, var(--tech-blue-deep), var(--tech-blue) 58%, #05070b);
  color: white;
  overflow: hidden;
}

.tech-hero-panel__grid,
.tech-materials {
  display: grid;
  gap: clamp(2rem, calc(5 * var(--vwx)), 4rem);
  grid-template-columns: minmax(0, 1fr) minmax(360px, 0.9fr);
  align-items: center;
}

.tech-hero-panel h2 {
  font-size: clamp(2.7rem, calc(6 * var(--vwx)), 6.1rem);
  line-height: 0.92;
  letter-spacing: 0;
  margin: 1rem 0;
  max-width: 920px;
  text-transform: uppercase;
}

.tech-source-link {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  align-items: center;
  margin-top: 1.8rem;
}

.tech-source-link a,
.tech-source-link span {
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  padding: 0.72rem 0.95rem;
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.tech-source-link a {
  background: var(--red);
  color: white;
}

.tech-source-link span {
  color: rgba(255, 255, 255, 0.72);
}

.tech-visual-stack {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.82fr);
  grid-template-rows: 1fr auto;
  gap: 1rem;
  align-items: stretch;
}

.tech-visual-card {
  position: relative;
  margin: 0;
  min-height: 235px;
  overflow: hidden;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: #101010;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.36);
}

.tech-visual-card--large {
  grid-row: span 2;
  min-height: 500px;
}

.tech-visual-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, transparent 42%, rgba(3, 13, 24, 0.9)),
    radial-gradient(circle at 12% 12%, rgba(103, 201, 255, 0.2), transparent 18rem);
  pointer-events: none;
}

.tech-visual-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.45s ease, filter 0.45s ease;
}

.tech-visual-card:hover img {
  transform: scale(1.05);
  filter: saturate(1.08) contrast(1.04);
}

.tech-visual-card figcaption {
  position: absolute;
  z-index: 1;
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
}

.tech-visual-card figcaption span,
.tech-visual-note strong {
  color: var(--tech-cyan);
  display: block;
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.tech-visual-card figcaption strong {
  display: block;
  margin-top: 0.35rem;
  font-size: clamp(1.2rem, calc(2 * var(--vwx)), 1.8rem);
  line-height: 1;
  text-transform: uppercase;
}

.tech-visual-note {
  min-height: 210px;
  padding: 1.2rem;
  border-radius: 24px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background:
    linear-gradient(135deg, rgba(103, 201, 255, 0.18), rgba(255, 255, 255, 0.07)),
    rgba(9, 35, 63, 0.58);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.tech-visual-note strong {
  font-size: clamp(1.35rem, calc(2.3 * var(--vwx)), 2.35rem);
  line-height: 1;
}

.tech-visual-note span {
  color: rgba(255, 255, 255, 0.72);
  font-weight: 800;
  line-height: 1.55;
  margin-top: 0.85rem;
}

.tech-materials {
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.85fr);
}

.tech-material-section {
  background:
    radial-gradient(circle at 86% 8%, rgba(18, 59, 97, 0.14), transparent 24rem),
    linear-gradient(180deg, #ffffff, #f1f6fa);
}

.tech-materials--simple {
  align-items: center;
  grid-template-columns: minmax(540px, 1fr) minmax(420px, 1fr);
}

.tech-materials__copy {
  max-width: 760px;
}

.tech-materials__copy .section-head {
  max-width: none;
}

.tech-materials__copy .section-head h2 {
  max-width: 780px;
}

.tech-materials__title-lines span {
  display: block;
  white-space: nowrap;
}

.tech-digital-flow__title-lines span {
  display: block;
  white-space: nowrap;
}

.tech-materials__copy .lead {
  color: var(--muted);
  font-size: clamp(1.24rem, calc(1.5 * var(--vwx)), 1.55rem);
  line-height: 1.78;
  margin: 1.3rem 0 0;
}

.tech-materials__image {
  min-height: 610px;
}

.tech-material-chart {
  grid-column: 1 / -1;
  margin-top: clamp(2rem, calc(4 * var(--vwx)), 3.4rem);
}

.tech-material-chart h3 {
  width: 90%;
  font-size: clamp(1.575rem, calc(2.88 * var(--vwx)), 2.88rem);
  line-height: 1.02;
  margin: 0 auto 1.8rem;
  text-align: center;
  text-transform: uppercase;
}

.tech-material-chart__rows {
  display: grid;
  gap: 1.8rem;
  width: 90%;
  margin-inline: auto;
}

.tech-material-chart__row {
  display: grid;
  gap: 0.675rem;
}

.tech-material-chart__row div {
  align-items: baseline;
  display: flex;
  justify-content: space-between;
  gap: 1.35rem;
}

.tech-material-chart__row strong,
.tech-material-chart__row em {
  color: var(--ink);
  font-size: clamp(0.9rem, calc(1.215 * var(--vwx)), 1.152rem);
  font-style: normal;
  font-weight: 850;
  text-transform: uppercase;
}

.tech-material-chart__row em {
  white-space: nowrap;
}

.tech-material-chart__row span {
  display: block;
  height: 6.3px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8e8e8;
}

.tech-material-chart__row span::before {
  content: "";
  display: block;
  width: var(--value);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--tech-blue-soft), var(--tech-cyan));
}

body:is(.language-en, .language-de) .tech-material-chart__row:nth-child(1) span::before { width: 30%; }
body:is(.language-en, .language-de) .tech-material-chart__row:nth-child(2) span::before { width: 28%; }
body:is(.language-en, .language-de) .tech-material-chart__row:nth-child(3) span::before { width: 25%; }
body:is(.language-en, .language-de) .tech-material-chart__row:nth-child(4) span::before,
body:is(.language-en, .language-de) .tech-material-chart__row:nth-child(5) span::before { width: 5%; }
body:is(.language-en, .language-de) .tech-material-chart__row:nth-child(6) span::before { width: 7%; }

.tech-trigger-list em,
.tech-trigger-list span {
  border: 1px solid rgba(18, 59, 97, 0.18);
  border-radius: 999px;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(232, 243, 250, 0.9));
  color: var(--tech-blue);
  display: inline-flex;
  font-style: normal;
  font-weight: 900;
  padding: 0.78rem 1rem;
}

.tech-image-card {
  margin: 0;
  min-height: 470px;
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid rgba(9, 35, 63, 0.16);
  background: var(--tech-blue-deep);
  box-shadow: 0 34px 95px rgba(9, 35, 63, 0.28);
}

.section--dark .tech-image-card {
  border-color: rgba(255, 255, 255, 0.14);
}

.tech-image-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tech-services-section {
  background:
    linear-gradient(90deg, rgba(3, 13, 24, 0.96), rgba(9, 35, 63, 0.74) 46%, rgba(3, 13, 24, 0.24)),
    url("/assets/tech-reseda-0001.jpg") center calc(50% + (360px - 100 * var(--vhx)) / 2 + 150px) / cover fixed no-repeat;
}

.tech-services-section::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(103, 201, 255, 0.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 201, 255, 0.12) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: linear-gradient(90deg, black, transparent 76%);
}

.tech-services-section > .container {
  position: relative;
  z-index: 1;
}

.tech-service-layout {
  display: grid;
  grid-template-columns: minmax(0, 1540px);
  gap: 1.25rem;
  align-items: stretch;
  justify-content: center;
  margin: 1.8rem 0 0 50%;
  transform: translateX(-50%);
  width: min(1540px, calc(calc(100 * var(--vwx)) - 72px));
}

.tech-service-layout > .tech-image-card {
  min-height: 470px;
}

.tech-service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.15rem;
}

.tech-service-grid article {
  position: relative;
  min-height: 178px;
  overflow: hidden;
  padding: 1.15rem 1.45rem 1.2rem;
  border: 1px solid rgba(103, 201, 255, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(240, 247, 252, 0.94));
  box-shadow: 0 24px 70px rgba(1, 12, 22, 0.32);
}

.tech-service-grid article::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, var(--tech-cyan), var(--tech-blue-soft), var(--red));
}

.tech-service-grid article::after {
  content: none;
}

.tech-service-grid span {
  color: var(--tech-blue-soft);
  font-weight: 950;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.tech-service-grid span {
  position: absolute;
  left: 0;
  top: 1.35rem;
  display: grid;
  place-items: center;
  width: 2.55rem;
  height: 2.55rem;
  border: 1px solid rgba(18, 59, 97, 0.72);
  border-radius: 50%;
  background: rgba(18, 59, 97, 0.12);
  font-size: 0.86rem;
}

.tech-service-grid h3 {
  position: relative;
  z-index: 1;
  color: var(--ink);
  font-size: clamp(1.58rem, calc(1.9 * var(--vwx)), 2.28rem);
  line-height: 1.08;
  letter-spacing: 0;
  margin: 0;
  text-transform: uppercase;
  white-space: nowrap;
}

.tech-service-grid p {
  position: relative;
  z-index: 1;
  color: var(--muted);
  font-size: clamp(1.155rem, calc(1.232 * var(--vwx)), 1.298rem);
  font-weight: 750;
  line-height: 1.6;
  margin: 0.95rem 0 0;
}

@media (max-width: 1780px) {
  .tech-service-layout {
    grid-template-columns: minmax(0, 1540px);
    justify-content: center;
    margin-inline: 50% 0;
    transform: translateX(-50%);
    width: min(1540px, calc(calc(100 * var(--vwx)) - 72px));
  }

  .tech-service-grid h3 {
    white-space: normal;
  }
}

.tech-digital-flow {
  background:
    radial-gradient(circle at 14% 4%, rgba(103, 201, 255, 0.14), transparent 26rem),
    radial-gradient(circle at 86% 42%, rgba(215, 25, 32, 0.12), transparent 24rem),
    linear-gradient(180deg, #f8fbfd, #eaf2f8 54%, #ffffff);
}

.tech-digital-flow .section-head {
  max-width: 900px;
}

.tech-digital-flow__items {
  display: grid;
  gap: clamp(3rem, calc(5 * var(--vwx)), 5.2rem);
}

.tech-digital-flow__item {
  display: grid;
  grid-template-columns: minmax(320px, 0.82fr) minmax(0, 1.18fr);
  gap: clamp(1.25rem, calc(3 * var(--vwx)), 2.6rem);
  align-items: stretch;
}

.tech-digital-flow__item:nth-child(even) {
  grid-template-columns: minmax(0, 1.18fr) minmax(320px, 0.82fr);
}

.tech-digital-flow__item:nth-child(even) .tech-image-card {
  order: 2;
}

.tech-digital-flow__item .tech-image-card {
  min-height: 390px;
  border-radius: 8px;
  box-shadow: 0 24px 70px rgba(9, 35, 63, 0.16);
}

.tech-digital-flow__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(0.5rem, calc(2 * var(--vwx)), 1rem) 0;
}

.tech-digital-flow__copy > span {
  color: var(--red);
  font-size: 0.82rem;
  font-weight: 950;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.tech-digital-flow__copy h3 {
  color: var(--tech-blue-deep);
  font-size: clamp(1.85rem, calc(3 * var(--vwx)), 3.2rem);
  line-height: 1;
  margin-top: 0.65rem;
  text-transform: uppercase;
}

.tech-digital-flow__copy strong {
  color: var(--tech-blue-soft);
  display: block;
  font-size: clamp(1.02rem, calc(1.3 * var(--vwx)), 1.22rem);
  line-height: 1.35;
  margin-top: 0.8rem;
}

.tech-digital-flow__copy p {
  color: var(--muted);
  font-size: clamp(1.155rem, calc(1.232 * var(--vwx)), 1.298rem);
  font-weight: 650;
  line-height: 1.6;
  margin-top: 1rem;
}

.tech-digital-flow__copy p span {
  display: block;
  position: relative;
  padding-left: 1rem;
}

.tech-digital-flow__copy p span + span {
  margin-top: 0.72rem;
}

.tech-digital-flow__copy p span::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.14em;
  width: 4px;
  height: 1.1em;
  border-radius: 999px;
  background: #20acd0;
}

.tech-digital-flow__copy p strong {
  color: var(--tech-blue-deep);
  display: block;
  font-size: clamp(1.155rem, calc(1.232 * var(--vwx)), 1.298rem);
  font-weight: 950;
  letter-spacing: 0.01em;
  line-height: 1.35;
  text-transform: uppercase;
}

.tech-digital-flow__copy p small {
  color: var(--muted);
  display: block;
  font-size: clamp(1.155rem, calc(1.232 * var(--vwx)), 1.298rem);
  font-weight: 650;
  line-height: 1.55;
  margin-top: 0.16rem;
}

.tech-digital-flow .tech-trigger-list em {
  background: rgba(9, 35, 63, 0.06);
}

.tech-digital-flow__cta {
  align-items: center;
  display: flex;
  gap: 1.5rem;
  justify-content: space-between;
  margin-top: 1.35rem;
  padding: clamp(1.2rem, calc(2.2 * var(--vwx)), 1.8rem);
  border-radius: 8px;
  background:
    radial-gradient(circle at 90% 10%, rgba(103, 201, 255, 0.18), transparent 18rem),
    linear-gradient(135deg, var(--tech-blue-deep), var(--tech-blue));
  color: white;
}

.tech-digital-flow__cta p {
  color: rgba(255, 255, 255, 0.78);
  font-size: 1.05rem;
  font-weight: 750;
  line-height: 1.65;
  max-width: 720px;
}

.tech-trigger-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  margin-top: 1.5rem;
}

.careers-first {
  background: #fff;
}

.careers-first__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.88fr);
  gap: clamp(2rem, calc(5 * var(--vwx)), 4.5rem);
  align-items: center;
}

.careers-first__copy {
  max-width: 720px;
}

.careers-first__copy p {
  margin: 0;
  color: var(--ink);
  font-size: clamp(1.08rem, calc(1.5 * var(--vwx)), 1.35rem);
  font-weight: 500;
  line-height: 1.7;
}

.careers-first__copy h2 {
  margin: 1.8rem 0 0;
  max-width: 760px;
  color: #000;
  font-size: clamp(1.1rem, calc(2.1 * var(--vwx)), 1.9rem);
  font-weight: 950;
  line-height: 1.05;
  letter-spacing: -0.03em;
}

.careers-first__image {
  margin: 0;
  min-height: 420px;
  overflow: hidden;
  background: #111;
  box-shadow: var(--shadow);
}

.careers-first__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.careers-openings {
  background: #fff;
  padding-top: 0;
}

.careers-openings h2 {
  margin: 0 0 clamp(1.8rem, calc(4 * var(--vwx)), 3rem);
  color: #000;
  font-size: clamp(1.9rem, calc(4.8 * var(--vwx)), 4.5rem);
  font-weight: 500;
  line-height: 0.9;
  letter-spacing: -0.065em;
}

.careers-opening-card {
  overflow: hidden;
  border: 0;
  background: #fff;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.08);
}

.careers-opening-card summary {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 54px;
  gap: 1.25rem;
  align-items: center;
  min-height: 84px;
  padding: 1.25rem 1.5rem;
  color: #fff;
  background: #000;
  cursor: pointer;
  list-style: none;
  transition: background 0.18s ease;
}

.careers-opening-card summary:hover {
  background: var(--red);
}

.careers-opening-card summary::-webkit-details-marker {
  display: none;
}

.careers-opening-card summary span {
  min-width: 0;
  font-size: clamp(1.6rem, calc(2.5 * var(--vwx)), 2.2rem);
  font-weight: 950;
  line-height: 1.12;
  letter-spacing: -0.03em;
}

.careers-opening-card summary i {
  position: relative;
  width: 54px;
  height: 54px;
  background: #fff;
}

.careers-opening-card summary i::before,
.careers-opening-card summary i::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 20px;
  height: 3px;
  background: #000;
  transform: translate(-50%, -50%);
  transition: transform 0.18s ease;
}

.careers-opening-card summary i::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.careers-opening-card[open] summary i::after {
  transform: translate(-50%, -50%) rotate(0);
}

.careers-opening-card__body {
  padding: clamp(1.4rem, calc(3 * var(--vwx)), 2.7rem);
  background: #f2f3f5;
  color: #000;
}

.careers-opening-card__body h3 {
  margin: 0 0 0.8rem;
  max-width: 980px;
  color: #000;
  font-size: clamp(1.6rem, calc(2.5 * var(--vwx)), 2.2rem);
  font-weight: 950;
  line-height: 1.12;
  letter-spacing: -0.03em;
  text-transform: uppercase;
}

.careers-opening-card__body p {
  max-width: 980px;
  margin: 0 0 1.4rem;
  color: #000;
  font-size: clamp(1.08rem, calc(1.5 * var(--vwx)), 1.35rem);
  font-weight: 500;
  line-height: 1.7;
}

.careers-opening-card__location {
  font-weight: 850;
}

.careers-opening-card__columns {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin-top: 1.6rem;
  background: #fff;
}

.careers-opening-card__columns > div {
  min-width: 0;
  padding: clamp(1.1rem, calc(2 * var(--vwx)), 1.6rem);
  background: #fff;
}

.careers-opening-card__body h4 {
  margin: 0 0 1rem;
  color: #000;
  font-size: clamp(1.6rem, calc(2.5 * var(--vwx)), 2.2rem);
  font-weight: 950;
  line-height: 1.12;
  letter-spacing: -0.03em;
}

.careers-opening-card .feature-list {
  display: grid;
  gap: 0.55rem;
  margin: 0;
}

.careers-opening-card .feature-list li {
  color: #565969;
  font-size: clamp(1.08rem, calc(1.5 * var(--vwx)), 1.35rem);
  font-weight: 500;
  line-height: 1.7;
  white-space: nowrap;
}

.careers-opening-card__apply {
  margin-top: 1px;
  padding: clamp(1.2rem, calc(2.5 * var(--vwx)), 2rem);
  background: #000;
  color: #fff;
}

.careers-opening-card__apply h4,
.careers-opening-card__apply p,
.careers-opening-card__apply a {
  color: #fff;
}

.careers-opening-card__apply p:last-child {
  margin-bottom: 0;
}

.careers-opening-card__apply a {
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.careers-application {
  background: #fff;
  padding-top: 0;
}

.careers-application__box {
  border: 1px solid #000;
  background: #fff;
  width: min(100%, 1390px);
  padding: clamp(3.8rem, calc(8.5 * var(--vwx)), 6.8rem) clamp(2.85rem, calc(6.4 * var(--vwx)), 5.15rem);
}

.careers-application__box h2 {
  margin: 0 0 clamp(2.2rem, calc(4.6 * var(--vwx)), 3.4rem);
  color: #ee3e3c;
  font-size: clamp(2.2rem, calc(4.4 * var(--vwx)), 3.3rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.035em;
}

.careers-application .reference-application-form {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(3rem, calc(6 * var(--vwx)), 5.4rem);
  color: #111;
  font-size: 23px;
  min-height: 0;
  height: auto;
  max-height: none;
  font-weight: 400;
  line-height: 1.45;
}

.careers-application .reference-application-form__column {
  gap: 0.55rem;
  min-width: 0;
}

.careers-application .reference-application-form fieldset {
  margin-bottom: 0.95rem;
}

.careers-application .reference-application-form legend {
  margin-bottom: 0.7rem;
}

.careers-application .reference-application-form input:not([type="checkbox"]):not([type="file"]) {
  box-sizing: border-box;
  color: #001a3d;
  font-size: 20px;
  font-weight: 600;
  height: 58px;
  min-height: 58px;
  margin-bottom: 0.9rem;
  padding: 1rem 0.85rem 0.75rem;
}

.careers-application .reference-application-form__checks label,
.careers-application .reference-application-form__jobs label,
.careers-application .reference-application-form__terms,
.careers-application .reference-application-form__file {
  color: #111;
  font-size: 23px;
  font-weight: 400;
  line-height: 1.45;
}

.careers-application .reference-application-form__checks {
  gap: 2.1rem;
  margin-top: 0.8rem;
}

.careers-application .reference-application-form__jobs {
  display: grid;
  gap: 0.35rem;
  margin-top: 0.8rem;
}

.careers-application .reference-application-form input[type="checkbox"] {
  width: 16px;
  min-height: 16px;
  margin-right: 0.55rem;
}

.careers-application .reference-application-form input[type="file"] {
  margin-top: 0.45rem;
  font-size: 18px;
}

.careers-application .reference-application-form__file {
  margin-top: 1.05rem;
}

.careers-application .reference-application-form__terms {
  margin: 2.2rem 0 2rem;
}

.careers-application .reference-application-form button {
  width: 145px;
  height: 58px;
  font-size: 22px;
  font-weight: 700;
}

.careers-application .reference-application-form legend {
  color: #111;
  font-size: 23px;
  font-weight: 700;
}

.capability-matrix {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.capability-tile {
  min-height: 430px;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 24px;
  background:
    radial-gradient(circle at 92% 0%, rgba(215, 25, 32, 0.28), transparent 14rem),
    #050505;
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  padding: 0;
  box-shadow: 0 20px 70px rgba(0, 0, 0, 0.2);
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.capability-tile:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow);
  border-color: rgba(215, 25, 32, 0.38);
}

.capability-tile__media {
  position: relative;
  overflow: hidden;
  height: 220px;
  margin: 0;
  background: #070707;
}

.capability-tile__media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(180deg, transparent 42%, rgba(0, 0, 0, 0.52)),
    linear-gradient(135deg, rgba(215, 25, 32, 0.32), transparent 38%);
  opacity: 0.82;
  pointer-events: none;
}

.capability-tile__media img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.45s ease, filter 0.45s ease;
}

.capability-tile__media--contain::before {
  content: "";
  position: absolute;
  inset: -28px;
  background:
    linear-gradient(rgba(5, 5, 5, 0.3), rgba(5, 5, 5, 0.3)),
    var(--capability-image) center / cover no-repeat;
  filter: blur(20px) saturate(0.8);
  transform: scale(1.08);
}

.capability-tile__media--contain img {
  object-fit: contain;
  object-position: center;
  filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.42));
}

.capability-tile:hover .capability-tile__media img {
  transform: scale(1.055);
  filter: saturate(1.1) contrast(1.05);
}

.capability-tile:hover .capability-tile__media--contain img {
  transform: scale(1.025);
  filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.42)) saturate(1.08) contrast(1.03);
}

.capability-tile__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 1.25rem;
  background:
    radial-gradient(circle at 92% 0%, rgba(215, 25, 32, 0.36), transparent 13rem),
    linear-gradient(180deg, rgba(18, 18, 19, 0.98), rgba(5, 5, 5, 0.98));
}

.capability-tile span {
  color: var(--red);
  font-weight: 950;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.capability-tile h3 {
  font-size: clamp(1.5rem, calc(2.8 * var(--vwx)), 2.7rem);
  line-height: 0.96;
  margin: 0.7rem 0;
  letter-spacing: -0.04em;
  text-transform: uppercase;
}

.capability-tile p {
  color: rgba(255, 255, 255, 0.72);
  line-height: 1.65;
}

.tile-large {
  border-color: rgba(215, 25, 32, 0.28);
}

.tile-large .capability-tile__media {
  height: 250px;
}

.capability-tile__media {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.video-embed {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 22px;
  aspect-ratio: 16 / 9;
  background: #050505;
  box-shadow: 0 34px 120px rgba(0, 0, 0, 0.5);
}

.video-section__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.25rem, calc(2 * var(--vwx)), 2rem);
}

.video-section__heading {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  margin-inline: auto;
  padding: 1.15rem clamp(2rem, calc(5 * var(--vwx)), 5rem) 0.9rem;
  text-align: center;
}

.video-section__heading::before,
.video-section__heading::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.video-section__heading::before {
  display: none;
}

.video-section__heading::after {
  bottom: 0;
  width: calc(100% - clamp(4rem, calc(10 * var(--vwx)), 10rem));
  height: 3px;
  border-radius: 999px;
  background: var(--red);
}

.video-section__title {
  color: #fff;
  font-size: clamp(1.65rem, calc(2.55 * var(--vwx)), 2.9rem);
  font-weight: 850;
  line-height: 1;
  letter-spacing: 0.14em;
  text-align: center;
  text-transform: uppercase;
}

.video-section__title span {
  color: #fff;
}

.video-section .video-embed {
  transform: none;
}

.video-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.production-summary {
  background: var(--red);
  color: white;
  padding-block: clamp(1.45rem, calc(2.4 * var(--vwx)), 2.2rem);
}

.production-summary p {
  font-size: 1.02rem;
  font-weight: 750;
  line-height: 1.75;
}

.production-summary strong {
  font-weight: 950;
}

.production-visuals {
  background:
    linear-gradient(180deg, #111, #050505);
  color: white;
  padding-block: 3rem;
}

.production-visuals__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
  align-items: stretch;
}

.production-visual {
  margin: 0;
  min-height: 360px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 18px;
  overflow: hidden;
  position: relative;
  background: #111;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.42);
}

.production-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, transparent 36%, rgba(0, 0, 0, 0.82)),
    radial-gradient(circle at 20% 20%, rgba(215, 25, 32, 0.22), transparent 22rem);
  pointer-events: none;
}

.production-visual--image-only {
  min-height: 440px;
}

.production-visual--image-only::after {
  display: none;
}

.production-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.production-visuals__grid .production-visual:nth-child(1) img {
  object-position: center 58%;
}

.production-visuals__grid .production-visual:nth-child(4) img {
  object-position: center 28%;
}

.production-visual:hover img {
  transform: scale(1.05);
}

.production-visual figcaption {
  position: absolute;
  z-index: 2;
  left: 1.2rem;
  right: 1.2rem;
  bottom: 1.2rem;
  display: grid;
  gap: 0.35rem;
}

.production-visual figcaption span {
  color: var(--red);
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.production-visual figcaption strong {
  font-size: 1.25rem;
  line-height: 1.1;
  text-transform: uppercase;
}

.machine-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
  align-items: stretch;
}

.machine-card {
  appearance: none;
  border: 1px solid #fff;
  border-radius: 14px;
  background: #fff;
  color: #000;
  cursor: pointer;
  min-height: 210px;
  padding: 1.35rem 1.25rem 1.25rem 1.45rem;
  position: relative;
  overflow: hidden;
  text-align: left;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0 20px 54px rgba(0, 0, 0, 0.28);
  transition: grid-column 0.25s ease, min-height 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}

.machine-card::before {
  content: "";
  position: absolute;
  inset: 1rem auto 1rem 0.85rem;
  width: 4px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--red), var(--red-dark));
  opacity: 0.88;
}

.machine-card::after {
  content: "";
  position: absolute;
  top: -56px;
  right: -48px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: rgba(215, 25, 32, 0.12);
  pointer-events: none;
}

.machine-card:hover,
.machine-card:focus-visible {
  transform: translateY(-4px);
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.3);
  border-color: var(--red);
  outline: none;
}

.machine-card h3,
.machine-card em,
.machine-card__details {
  position: relative;
  z-index: 2;
}

.machine-card h3 {
  font-size: clamp(1.25rem, calc(2.1 * var(--vwx)), 2.1rem);
  line-height: 0.98;
  letter-spacing: -0.035em;
  margin: auto 0 0;
  text-transform: uppercase;
}

.machine-card em {
  color: #000;
  font-size: 0.78rem;
  font-style: normal;
  font-weight: 900;
  letter-spacing: 0.08em;
  margin-top: 1rem;
  text-transform: uppercase;
}

.machine-card__details {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows 0.28s ease, opacity 0.2s ease, margin 0.25s ease;
}

.machine-card__details > .feature-list {
  overflow: hidden;
}

.machine-card.is-open {
  grid-column: span 2;
  min-height: 310px;
  background: #fff;
  border-color: var(--red);
  color: #000;
}

.machine-card.is-open h3 {
  margin-top: 1.25rem;
}

.machine-card.is-open em {
  color: var(--red);
}

.machine-card.is-open .machine-card__details {
  grid-template-rows: 1fr;
  opacity: 1;
  margin-top: 1.25rem;
}

.machine-card.is-open .feature-list li {
  color: #000;
}

.finishing-panel {
  padding-bottom: 7.5rem;
  background:
    radial-gradient(circle at 80% 8%, rgba(215, 25, 32, 0.2), transparent 26rem),
    linear-gradient(180deg, #050505, #0b0b0d);
}

.finishing-system {
  display: grid;
  gap: 1.25rem;
}

.finishing-panel .finishing-system {
  gap: var(--production-block-gap);
}

.finishing-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.72fr);
  gap: 1.25rem;
  align-items: stretch;
  min-height: 560px;
  padding: 1.25rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 14px;
  background: rgba(0, 0, 0, 0.78);
  box-shadow: 0 34px 100px rgba(0, 0, 0, 0.36);
  color: white;
  overflow: hidden;
}

.finishing-card--dark {
  grid-template-columns: minmax(300px, 0.72fr) minmax(0, 1fr);
  background: #fff;
  color: #000;
  border-color: #000;
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.26);
}

.finishing-panel .finishing-card:first-child {
  background: #fff;
  color: #000;
  border-color: #000;
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.26);
}

.finishing-card figure {
  margin: 0;
  overflow: hidden;
  border-radius: 10px;
  background: #111;
  min-height: 420px;
}

.finishing-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.finishing-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(1rem, calc(4 * var(--vwx)), 3rem);
}

.finishing-copy h2 {
  font-size: clamp(2.6rem, calc(5.2 * var(--vwx)), 5.4rem);
  line-height: 0.94;
  letter-spacing: -0.06em;
  margin: 1rem 0;
  text-transform: uppercase;
}

#meritve-in-preizkusi .finishing-copy h2,
#kontrola-kakovosti .finishing-copy h2 {
  letter-spacing: 0;
}

.finishing-copy p {
  color: rgba(255, 255, 255, 0.68);
  font-size: 1.1475rem;
  line-height: 1.58;
  max-width: 650px;
}

.finishing-card--dark .finishing-copy p {
  color: #000;
}

.finishing-panel .finishing-card:first-child .finishing-copy p {
  color: #000;
}

.assembly-panel {
  background: #ffffff;
  padding-bottom: 12.8rem;
  padding-top: 7.5rem;
}

.finishing-card--light {
  background: #fff;
  border-color: #000;
  box-shadow: 0 32px 90px rgba(0, 0, 0, 0.26);
  color: #000;
}

.finishing-card--light .finishing-copy p {
  color: #000;
}

.service-rows {
  display: grid;
  gap: 0.5rem;
  margin-top: 1.6rem;
}

.service-rows div {
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  min-height: 62px;
  padding: 0.78rem 1rem;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.08);
}

.finishing-card--dark .service-rows div {
  background: #fff;
  border: 1px solid #000;
}

.finishing-card--light .service-rows div {
  background: #fff;
  border: 1px solid #000;
}

.finishing-panel .finishing-card:first-child .service-rows div {
  background: #fff;
  border: 1px solid #000;
}

.service-rows strong {
  min-width: 0;
  font-size: 1.3275rem;
  line-height: 1.16;
  text-transform: uppercase;
  overflow-wrap: break-word;
  hyphens: auto;
}

.page-hero {
  background: var(--black);
  color: white;
  min-height: 360px;
  position: relative;
  overflow: hidden;
}

.page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.35)), var(--hero-image);
  background-size: cover;
  background-position: center;
  opacity: 0.95;
}

.page-hero--robot::before {
  background-size: cover;
  background-position: center 32%;
  background-repeat: no-repeat;
}

.page-hero--tech {
  background:
    radial-gradient(circle at 82% 12%, rgba(103, 201, 255, 0.16), transparent 26rem),
    linear-gradient(135deg, var(--tech-blue-deep), var(--tech-blue) 58%, #05070b);
  min-height: 260px;
}

.page-hero--tech::before {
  background:
    linear-gradient(90deg, rgba(3, 13, 24, 0.96), rgba(9, 35, 63, 0.74) 46%, rgba(3, 13, 24, 0.24)),
    radial-gradient(circle at 78% 20%, rgba(103, 201, 255, 0.22), transparent 22rem);
  background-attachment: scroll, scroll;
  background-size: auto, auto;
  background-position: center, center;
  opacity: 1;
}

.page-hero--tech::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(103, 201, 255, 0.28) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 201, 255, 0.28) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: linear-gradient(90deg, black, transparent 92%);
}

.page-hero--tech h1 {
  color: #f7fbff;
}

.page-hero--tech .eyebrow {
  color: var(--red);
}

.page-hero--tech .eyebrow::before {
  background: var(--red);
}

.page-hero--tech p {
  color: rgba(232, 244, 255, 0.78);
}

.page-hero--certificates-grid {
  background: #101010;
  min-height: 0;
}

.page-hero--about-grid {
  min-height: 280px;
}

.page-hero--certificates-grid .breadcrumbs,
.page-hero--ethics-grid .breadcrumbs,
.page-hero--policy .breadcrumbs,
.page-hero--logo-grid .breadcrumbs {
  font-size: 1rem;
}

.page-hero--certificates-grid h1,
.page-hero--ethics-grid h1,
.page-hero--logo-grid h1 {
  font-size: clamp(2.8rem, calc(5 * var(--vwx)), 5.5rem);
}

.page-hero .container {
  position: relative;
  padding-block: 6rem;
}

.page-hero--tech .container {
  padding-block: 2.5rem;
}

.page-hero--certificates-grid .container {
  padding-block: 1.5rem 2rem;
  z-index: 1;
}

.page-hero--gallery-grid {
  background: var(--tech-blue-deep);
  min-height: 0;
}

.page-hero--gallery-grid::before {
  background:
    radial-gradient(circle at 82% 12%, rgba(103, 201, 255, 0.16), transparent 26rem),
    radial-gradient(circle at 78% 20%, rgba(103, 201, 255, 0.22), transparent 22rem),
    linear-gradient(135deg, var(--tech-blue-deep), var(--tech-blue) 58%, #05070b);
  opacity: 1;
}

.page-hero--gallery-grid::after {
  background-image:
    linear-gradient(rgba(103, 201, 255, 0.28) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 201, 255, 0.28) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: linear-gradient(90deg, black, transparent 92%);
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.page-hero--gallery-grid .container {
  padding-block: clamp(1.1rem, calc(1.6 * var(--vwx)), 1.5rem) clamp(1.8rem, calc(2.3 * var(--vwx)), 2.25rem);
  z-index: 1;
}

.page-hero--ethics-grid {
  background: #101010;
  min-height: clamp(230px, calc(18 * var(--vwx)), 290px);
}

.page-hero--sponsorship-grid {
  min-height: clamp(180px, calc(14 * var(--vwx)), 230px);
}

.page-hero--certificates-grid::before,
.page-hero--ethics-grid::before,
.page-hero--about-grid::before {
  background:
    radial-gradient(circle at 12% 8%, rgba(215, 25, 32, 0.24), transparent 30rem),
    radial-gradient(circle at 88% 48%, rgba(215, 25, 32, 0.18), transparent 34rem),
    #101010;
  opacity: 1;
}

.page-hero--certificates-grid::after,
.page-hero--ethics-grid::after,
.page-hero--about-grid::after {
  background-image:
    radial-gradient(circle at 12% 8%, rgba(215, 25, 32, 0.24), transparent 30rem),
    radial-gradient(circle at 88% 48%, rgba(215, 25, 32, 0.16), transparent 34rem),
    linear-gradient(rgba(255, 45, 52, 0.38) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 45, 52, 0.38) 1px, transparent 1px);
  background-size: auto, auto, 64px 64px, 64px 64px;
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.page-hero--ethics-grid .container {
  padding-block: 1.75rem;
  z-index: 1;
}

.page-hero--sponsorship-grid .container {
  padding-block: clamp(1.4rem, calc(2.1 * var(--vwx)), 2rem);
}

.page-hero--procurement-grid {
  min-height: 0;
}

.page-hero--procurement-grid .container {
  padding-block: clamp(1.15rem, calc(1.8 * var(--vwx)), 1.75rem);
  width: min(1560px, calc(100% - 64px));
}

.page-hero.page-hero--procurement-grid h1 {
  max-width: none;
}

.page-hero--general-terms-grid {
  min-height: 0;
}

.page-hero--general-terms-grid .container {
  padding-block: clamp(1.2rem, calc(1.7 * var(--vwx)), 1.75rem);
  width: min(1560px, calc(100% - 64px));
}

.page-hero.page-hero--general-terms-grid h1 {
  max-width: none;
}

@media (max-width: 720px) {
  .page-hero--ethics-grid {
    min-height: 270px;
  }

  .page-hero--sponsorship-grid {
    min-height: 210px;
  }

  .page-hero--procurement-grid {
    min-height: 0;
  }

  .page-hero--procurement-grid .container {
    padding-block: 1.25rem;
    width: min(100% - 28px, 1560px);
  }

  .page-hero--general-terms-grid {
    min-height: 0;
  }

  .page-hero--general-terms-grid .container {
    padding-block: 1.5rem;
    width: min(100% - 28px, 1560px);
  }
}

.page-hero--about-grid .container {
  padding-block: 2.5rem;
  z-index: 1;
}

.page-hero--careers-grid .container {
  padding-block: 1.75rem;
}

.page-hero--logo-grid {
  min-height: 220px;
}

.page-hero--logo-grid .container {
  padding-block: 2rem;
}

.breadcrumbs {
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.9rem;
  margin-bottom: 1.2rem;
}

.page-hero h1 {
  letter-spacing: 0;
  max-width: 900px;
}

.page-hero p {
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.75;
  margin-top: 1rem;
  max-width: 720px;
}

.feature-list {
  display: grid;
  gap: 0.75rem;
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
}

.feature-list li {
  align-items: start;
  display: flex;
  gap: 0.7rem;
}

.feature-list li::before {
  background: var(--red);
  border-radius: 999px;
  content: "";
  flex: 0 0 auto;
  height: 8px;
  margin-top: 0.65rem;
  width: 8px;
}

.gallery-container {
  width: min(1560px, calc(100% - 40px));
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}

.gallery-item {
  border: 0;
  background: var(--black);
  border-radius: 18px;
  cursor: pointer;
  overflow: hidden;
  padding: 0;
  position: relative;
  text-align: left;
}

.gallery-item img {
  aspect-ratio: 1;
  object-fit: cover;
  width: 100%;
  transition: transform 0.35s ease, opacity 0.35s ease;
}

.gallery-item:hover img {
  opacity: 0.72;
  transform: scale(1.06);
}

.lightbox {
  align-items: center;
  background: rgba(0, 0, 0, 0.88);
  display: flex;
  flex-direction: column;
  inset: 0;
  justify-content: center;
  padding: 2rem;
  position: fixed;
  z-index: 100;
}

.lightbox[hidden] {
  display: none;
}

.lightbox img {
  max-height: calc(78 * var(--vhx));
  border-radius: 18px;
  box-shadow: var(--shadow);
}

.lightbox p {
  color: white;
  margin-top: 1rem;
}

.lightbox__close {
  position: absolute;
  right: 2rem;
  top: 2rem;
  height: 48px;
  width: 48px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: white;
  color: black;
  font-size: 1.7rem;
  cursor: pointer;
}

label {
  color: var(--ink);
  display: grid;
  gap: 0.4rem;
  font-size: 0.9rem;
  font-weight: 850;
}

input,
select,
textarea {
  border: 1px solid var(--line);
  border-radius: 12px;
  min-height: 48px;
  padding: 0.8rem 0.9rem;
  width: 100%;
}

textarea {
  min-height: 130px;
  resize: vertical;
}

.success {
  background: rgba(46, 160, 67, 0.1);
  border: 1px solid rgba(46, 160, 67, 0.25);
  border-radius: 12px;
  color: #116329;
  padding: 1rem;
  font-weight: 800;
}

.error {
  color: var(--red);
  font-size: 0.84rem;
}

.cert-card {
  display: grid;
  grid-template-rows: 340px auto;
  padding: 0;
}

.cert-card img {
  height: 100%;
  object-fit: contain;
  padding: 1rem;
  width: 100%;
  background: #f7f7f7;
}

.home-cert-section .grid-5 {
  gap: clamp(0.35rem, calc(0.6 * var(--vwx)), 0.75rem);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  justify-content: center;
  margin-inline: auto;
  width: min(100%, 1640px);
}

.home-cert-section > .container > .actions {
  align-items: center;
  display: flex;
  justify-content: center;
  margin-inline: auto;
  width: 100%;
}

.home-cert-section .cert-card {
  grid-template-rows: auto auto;
}

.home-cert-section .cert-card__media {
  position: relative;
  height: auto;
  margin: 0;
  overflow: hidden;
  background: transparent;
}

.home-cert-section .cert-card__media::before {
  content: none;
}

.home-cert-section .cert-card__media img {
  display: block;
  height: auto;
  max-height: none;
  object-fit: initial;
  object-position: initial;
  padding: 0;
  background: transparent;
  filter: none;
  image-rendering: auto;
}

#certifikati-in-dokumenti .cert-card {
  grid-template-rows: auto auto;
}

#certifikati-in-dokumenti > .container {
  width: min(1640px, calc(100% - 40px));
  max-width: none;
}

#certifikati-in-dokumenti .grid-3 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  justify-content: center;
}

#certifikati-in-dokumenti .cert-card > img {
  display: block;
  height: auto;
  object-fit: initial;
  padding: 0;
  background: transparent;
  filter: none;
  image-rendering: auto;
}

@media (max-width: 1100px) {
  #certifikati-in-dokumenti .grid-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  #certifikati-in-dokumenti .grid-3 {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1100px) {
  .home-cert-section .grid-5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }
}

@media (max-width: 720px) {
  .home-cert-section .grid-5 {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .home-cert-section .cert-card,
  .home-cert-section .cert-card:last-child {
    grid-column: auto;
    width: auto;
  }

  .home-cert-section .cert-card {
    grid-template-rows: auto auto;
  }
}

.cert-card__body {
  padding: 1.2rem;
}

.document-layout {
  display: grid;
  gap: 2rem;
  grid-template-columns: 280px 1fr;
}

.toc {
  position: sticky;
  top: 116px;
}

.toc a {
  border-radius: 10px;
  color: var(--muted);
  display: block;
  font-weight: 750;
  padding: 0.55rem 0.75rem;
}

.toc a:hover {
  background: rgba(215, 25, 32, 0.08);
  color: var(--red);
}

.doc-section {
  margin-bottom: 1rem;
}

.doc-section p + p {
  margin-top: 1rem;
}

.doc-list {
  display: grid;
  gap: 0.45rem;
  margin: 1rem 0;
  padding-left: 1.35rem;
}

.doc-list li::marker {
  color: var(--red);
}

.doc-closing {
  color: var(--muted);
  font-weight: 750;
  margin-top: 2rem;
  text-align: right;
}

.procurement-terms {
  background: #fff;
}

.procurement-terms__content {
  width: min(1560px, calc(100% - 64px));
}

.procurement-terms__section {
  margin: 0;
  padding: clamp(1.8rem, calc(3 * var(--vwx)), 3rem) 0;
}

.procurement-terms__section:first-child {
  padding-top: 0;
}

.procurement-terms__section h2 {
  font-size: clamp(1.65rem, calc(2.15 * var(--vwx)), 2.5rem);
  margin-bottom: 1rem;
}

.procurement-terms__section p,
.procurement-terms__section li {
  font-size: clamp(1.12rem, calc(1.25 * var(--vwx)), 1.35rem);
  line-height: 1.75;
}

.procurement-terms__section p {
  max-width: none;
}

.procurement-terms .doc-list {
  gap: 0.65rem;
  margin-block: 1.25rem;
}

.procurement-terms .doc-closing {
  font-size: clamp(1.05rem, calc(1.2 * var(--vwx)), 1.25rem);
  margin-top: 3rem;
}

.general-terms {
  background: #fff;
}

.general-terms__content {
  width: min(1560px, calc(100% - 64px));
}

.general-terms__eyebrow {
  color: var(--red);
  display: block;
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.12em;
  margin-bottom: 0.8rem;
  text-transform: uppercase;
}

.general-terms__intro {
  display: grid;
  gap: clamp(2rem, calc(5 * var(--vwx)), 7rem);
  grid-template-columns: minmax(240px, 0.42fr) minmax(0, 1fr);
  padding-bottom: clamp(3rem, calc(6 * var(--vwx)), 6rem);
}

.general-terms__intro h2,
.general-terms__authorship h2,
.general-terms__privacy-heading h2 {
  font-size: clamp(2.5rem, calc(4.2 * var(--vwx)), 5.2rem);
  letter-spacing: -0.055em;
  line-height: 0.95;
  text-transform: uppercase;
}

.general-terms__intro-copy {
  border-left: 3px solid var(--red);
  padding-left: clamp(1.4rem, calc(3 * var(--vwx)), 3rem);
}

.general-terms__intro-copy p,
.general-terms__authorship p,
.general-terms__authorship li,
.general-terms__privacy-heading p,
.general-terms__privacy-meta p,
.general-terms__detail p,
.general-terms__detail .general-terms__list li {
  font-size: clamp(1.05rem, calc(1.2 * var(--vwx)), 1.3rem);
  line-height: 1.75;
}

.general-terms__intro-copy p + p,
.general-terms__authorship p + p,
.general-terms__detail p + p {
  margin-top: 1.25rem;
}

.general-terms__authorship {
  background: #f4f4f4;
  border-top: 5px solid var(--red);
  padding: clamp(2rem, calc(4 * var(--vwx)), 4.5rem);
}

.general-terms__authorship h2 {
  font-size: clamp(2.25rem, calc(3.5 * var(--vwx)), 4.2rem);
  margin-bottom: clamp(1.5rem, calc(3 * var(--vwx)), 3rem);
}

.general-terms__authorship p {
  max-width: 1120px;
}

.general-terms__list {
  display: grid;
  gap: 0;
  list-style: none;
  margin-top: clamp(1.5rem, calc(3 * var(--vwx)), 2.5rem);
  padding: 0;
}

.general-terms__list li {
  border-top: 1px solid rgba(17, 17, 17, 0.15);
  padding: 1.1rem 0 1.1rem clamp(2rem, calc(4 * var(--vwx)), 4.5rem);
  position: relative;
}

.general-terms__list li::before {
  color: var(--red);
  content: "—";
  font-weight: 950;
  left: 0;
  position: absolute;
}

.general-terms__privacy-heading {
  background:
    radial-gradient(circle at 12% 8%, rgba(215, 25, 32, 0.32), transparent 30rem),
    radial-gradient(circle at 88% 48%, rgba(215, 25, 32, 0.2), transparent 34rem),
    linear-gradient(rgba(255, 45, 52, 0.16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 45, 52, 0.16) 1px, transparent 1px),
    #101010;
  background-size: auto, auto, 64px 64px, 64px 64px, auto;
  color: #fff;
  margin-top: clamp(4rem, calc(8 * var(--vwx)), 8rem);
  padding: clamp(2.5rem, calc(5 * var(--vwx)), 6rem);
}

.general-terms__privacy-heading span {
  color: var(--red);
  display: block;
  font-size: 0.8rem;
  font-weight: 950;
  letter-spacing: 0.14em;
  margin-bottom: 1rem;
  text-transform: uppercase;
}

.general-terms__privacy-heading p {
  color: rgba(255, 255, 255, 0.78);
  margin-top: clamp(1.5rem, calc(3 * var(--vwx)), 3rem);
  max-width: 1120px;
}

.general-terms__privacy-meta {
  display: grid;
  gap: 1px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  background: rgba(17, 17, 17, 0.16);
}

.general-terms__privacy-meta section {
  background: #f4f4f4;
  padding: clamp(1.5rem, calc(3 * var(--vwx)), 3rem);
}

.general-terms__privacy-meta h2 {
  font-size: clamp(1.4rem, calc(2 * var(--vwx)), 2.2rem);
  letter-spacing: -0.04em;
  line-height: 1;
  margin-bottom: 1rem;
  text-transform: uppercase;
}

.general-terms__privacy-meta a,
.general-terms__detail a {
  color: var(--red);
  font-weight: 850;
}

.general-terms__details {
  margin-top: clamp(3rem, calc(7 * var(--vwx)), 7rem);
}

.general-terms__detail {
  border-top: 1px solid rgba(17, 17, 17, 0.22);
  display: grid;
  gap: clamp(1.5rem, calc(5 * var(--vwx)), 7rem);
  grid-template-columns: minmax(240px, 0.42fr) minmax(0, 1fr);
  padding: clamp(2.4rem, calc(4.5 * var(--vwx)), 5rem) 0;
}

.general-terms__detail:last-child {
  border-bottom: 1px solid rgba(17, 17, 17, 0.22);
}

.cookie-policy-table-wrap {
  width: 100%;
  margin: 1.5rem 0;
  overflow-x: auto;
  border: 1px solid rgba(17, 17, 17, 0.2);
}

.cookie-policy-table {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
  font-size: clamp(1.05rem, calc(1.2 * var(--vwx)), 1.3rem);
  line-height: 1.55;
}

.cookie-policy-table th,
.cookie-policy-table td {
  padding: 1rem;
  border-right: 1px solid rgba(17, 17, 17, 0.14);
  border-bottom: 1px solid rgba(17, 17, 17, 0.14);
  text-align: left;
  vertical-align: top;
}

.cookie-policy-table th:last-child,
.cookie-policy-table td:last-child {
  border-right: 0;
}

.cookie-policy-table tbody tr:last-child td {
  border-bottom: 0;
}

.cookie-policy-table th {
  background: #071725;
  color: #fff;
  font-weight: 900;
}

.cookie-policy-table tbody tr:nth-child(even) {
  background: rgba(7, 23, 37, 0.045);
}

.cookie-policy-details {
  margin: 0;
  overflow: clip;
  border-top: 1px solid rgba(17, 17, 17, 0.22);
  background: transparent;
}

p + .cookie-policy-details {
  margin-top: clamp(1.944rem, calc(2.88 * var(--vwx)), 2.88rem);
}

.cookie-policy-details + .cookie-policy-details {
  margin-bottom: clamp(1.944rem, calc(2.88 * var(--vwx)), 2.88rem);
  border-bottom: 1px solid rgba(17, 17, 17, 0.22);
}

.cookie-policy-details summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.85rem;
  min-height: 52px;
  padding: 1rem 0;
  color: #071725;
  font-size: clamp(1.05rem, calc(1.2 * var(--vwx)), 1.3rem);
  font-weight: 900;
  line-height: 1.35;
  cursor: pointer;
  list-style: none;
  transition: color 0.2s ease;
}

.cookie-policy-details summary::-webkit-details-marker {
  display: none;
}

.cookie-policy-details summary::before {
  content: "\2014";
  color: var(--red);
  font-weight: 950;
}

.cookie-policy-details summary::after {
  content: "+";
  flex: 0 0 auto;
  color: var(--red);
  font-size: 1.25em;
  font-weight: 900;
  line-height: 1;
  transition: transform 0.2s ease;
}

.cookie-policy-details summary:hover,
.cookie-policy-details summary:focus-visible {
  color: var(--red);
}

.cookie-policy-details summary:focus-visible {
  outline: 2px solid var(--red);
  outline-offset: 4px;
}

.cookie-policy-details[open] summary {
  color: var(--red);
}

.cookie-policy-details[open] summary::after {
  transform: rotate(45deg);
}

.cookie-policy-details__content {
  padding: 0.25rem 0 1.5rem 2rem;
}

.cookie-policy-details__content > :first-child {
  margin-top: 0;
}

.cookie-policy-details__content > :last-child {
  margin-bottom: 0;
}

.general-terms__detail--centered {
  align-items: center;
}

.general-terms__detail h2 {
  font-size: clamp(1.8rem, calc(2.6 * var(--vwx)), 3rem);
  letter-spacing: -0.045em;
  line-height: 1;
  text-transform: uppercase;
}

.general-terms__detail h3 {
  color: var(--red);
  font-size: 0.82rem;
  font-weight: 950;
  letter-spacing: 0.12em;
  margin-bottom: 1rem;
  text-transform: uppercase;
}

.page-hero--policy .container,
.policy-intro .container,
.policy-feature-strip .container,
.policy-details .container {
  width: min(1560px, calc(100% - 64px));
}

.page-hero--policy {
  background: #101010;
  min-height: 0;
}

.page-hero--policy::before {
  background:
    radial-gradient(circle at 12% 8%, rgba(215, 25, 32, 0.24), transparent 30rem),
    radial-gradient(circle at 88% 48%, rgba(215, 25, 32, 0.18), transparent 34rem),
    #101010;
  opacity: 1;
}

.page-hero--policy::after {
  background-image:
    radial-gradient(circle at 12% 8%, rgba(215, 25, 32, 0.24), transparent 30rem),
    radial-gradient(circle at 88% 48%, rgba(215, 25, 32, 0.16), transparent 34rem),
    linear-gradient(rgba(255, 45, 52, 0.38) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 45, 52, 0.38) 1px, transparent 1px);
  background-size: auto, auto, 64px 64px, 64px 64px;
  content: "";
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.page-hero--policy .container {
  padding-block: clamp(1.2rem, calc(1.9 * var(--vwx)), 1.75rem);
  z-index: 1;
}

.page-hero--policy h1 {
  font-size: clamp(2.8rem, calc(5 * var(--vwx)), 5.5rem);
  letter-spacing: -0.055em;
  line-height: 0.9;
  max-width: 1500px;
}

.page-hero--policy p {
  font-size: inherit;
  line-height: 1.75;
  margin-top: 1rem;
  max-width: 720px;
}

.policy-copy {
  max-width: 1380px;
}

.policy-copy p + p {
  margin-top: 1.6rem;
}

.policy-copy p,
.policy-detail p,
.policy-feature p {
  font-size: clamp(1.08rem, calc(1.25 * var(--vwx)), 1.3rem);
  line-height: 1.65;
}

.policy-copy p {
  color: var(--text);
  font-size: clamp(1.25rem, calc(1.6 * var(--vwx)), 1.6rem);
  font-weight: 400;
}

.policy-copy .lead,
.policy-detail .lead {
  font-size: clamp(1.25rem, calc(1.6 * var(--vwx)), 1.6rem);
}

.policy-feature-strip {
  background: #f5f5f5;
  padding-block: clamp(3.5rem, calc(6 * var(--vwx)), 5.5rem);
}

.policy-features {
  display: grid;
  gap: clamp(2.5rem, calc(4 * var(--vwx)), 5rem);
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.policy-feature {
  align-items: start;
  display: grid;
  gap: 1.6rem;
  grid-template-columns: 116px minmax(0, 1fr);
}

.policy-feature__icon {
  color: #050505;
  width: 104px;
}

.policy-feature__icon svg {
  display: block;
  fill: currentColor;
  overflow: visible;
  width: 100%;
}

.policy-feature__icon .policy-icon-cut {
  fill: #fff;
}

.policy-feature__icon .policy-icon-line {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 7;
}

.policy-feature span {
  display: block;
  font-size: clamp(0.82rem, calc(0.9 * var(--vwx)), 1rem);
  font-weight: 800;
  letter-spacing: 0.12em;
  margin-bottom: 0.8rem;
  text-transform: uppercase;
}

.policy-feature h2,
.policy-detail h2 {
  text-transform: uppercase;
}

.policy-feature h2 {
  font-size: clamp(1.7rem, calc(2.3 * var(--vwx)), 2.45rem);
  margin-bottom: 0.9rem;
}

.policy-feature p {
  margin: 0;
}

.policy-details {
  background: #fff;
}

.policy-detail-grid {
  display: grid;
  gap: 1.75rem;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-bottom: clamp(3rem, calc(6 * var(--vwx)), 5rem);
}

.policy-detail {
  border-top: 4px solid var(--red);
  padding: 2rem 0.25rem 0;
}

.policy-detail-grid .policy-detail {
  background: #f5f5f5;
  border-radius: 0 0 14px 14px;
  padding: clamp(1.7rem, calc(2.5 * var(--vwx)), 2.5rem);
}

.policy-detail--featured {
  margin-bottom: 2.75rem;
  max-width: 1380px;
}

.policy-detail--featured:not(:first-child) {
  margin-top: clamp(3.5rem, calc(7 * var(--vwx)), 6rem);
}

.policy-detail h2 {
  font-size: clamp(1.65rem, calc(2.25 * var(--vwx)), 2.4rem);
  margin-bottom: 1rem;
}

.policy-closing {
  border-left: 4px solid var(--red);
  font-size: clamp(1.3rem, calc(1.8 * var(--vwx)), 1.65rem);
  font-weight: 700;
  margin: 0;
  max-width: 1380px;
  padding-left: 1.5rem;
}

.page-hero--eu-grid {
  min-height: 0;
}

.page-hero--eu-grid .container,
.eu-project__text {
  width: min(1560px, calc(100% - 64px));
}

.page-hero--eu-grid .container {
  padding-block: clamp(1.2rem, calc(1.6 * var(--vwx)), 1.75rem);
}

.page-hero--eu-grid h1 {
  font-size: clamp(2.8rem, calc(5 * var(--vwx)), 5.5rem);
  line-height: 0.9;
}


.eu-project {
  background: #fff;
}

.eu-project__text p {
  font-size: clamp(1.05rem, calc(1.2 * var(--vwx)), 1.25rem);
  line-height: 1.75;
}

.eu-project__text p + p {
  margin-top: 1.35rem;
}

.eu-project__text a {
  color: var(--red);
  text-decoration: underline;
}

.ethics-employee {
  padding: 0;
}

.ethics-document {
  max-width: none;
  width: min(1680px, calc(100% - 64px));
}

.ethics-document p {
  font-size: clamp(1.08rem, calc(1.2 * var(--vwx)), 1.3rem);
  line-height: 1.75;
}

.ethics-document h2 {
  font-size: clamp(2rem, calc(3 * var(--vwx)), 3.2rem);
}

.ethics-document h3 {
  font-size: clamp(1.3rem, calc(1.65 * var(--vwx)), 1.75rem);
}

.ethics-document .card {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  margin-bottom: clamp(4rem, calc(8 * var(--vwx)), 7rem);
  overflow: visible;
  padding-inline: 0;
  transition: none;
}

.ethics-document .card::before {
  display: none;
}

.ethics-document .card:hover {
  border-color: transparent;
  box-shadow: none;
  transform: none;
}

.ethics-employee > h2 {
  margin-bottom: 2rem;
}

.ethics-employee__layout {
  display: flow-root;
}

.ethics-employee__content h3 {
  margin-top: 2.2rem;
  text-transform: uppercase;
}

.ethics-employee__content h3:first-child {
  margin-top: 0;
}

.ethics-employee__content p + p {
  margin-top: 1rem;
}

.ethics-employee__media {
  border-radius: 18px;
  float: right;
  margin: 0 0 clamp(1.5rem, calc(3 * var(--vwx)), 3rem) clamp(2rem, calc(4 * var(--vwx)), 4rem);
  overflow: hidden;
  position: static;
  width: min(62.4%, 988px);
}

.ethics-employee__media img {
  display: block;
  height: auto;
  width: 100%;
}

.ethics-quote {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  margin: clamp(3rem, calc(7 * var(--vwx)), 6rem) 0;
  position: relative;
}

.ethics-quote::before {
  background: repeating-linear-gradient(135deg, rgba(0, 0, 0, 0.045) 0 1px, transparent 1px 8px);
  content: "";
  inset: -3rem -2rem -3rem 42%;
  position: absolute;
}

.ethics-quote__media,
.ethics-quote__content {
  position: relative;
  z-index: 1;
}

.ethics-quote__media {
  margin: 0;
  overflow: hidden;
}

.ethics-quote__media img {
  display: block;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
  width: 100%;
}

.ethics-quote__content {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(2rem, calc(5 * var(--vwx)), 5rem);
  text-align: center;
}

.ethics-quote__content p {
  color: var(--black);
  font-size: clamp(1.7rem, calc(3 * var(--vwx)), 2.6rem);
  line-height: 1.15;
  margin: 0;
}

.ethics-quote__content strong {
  color: var(--red);
  font-size: clamp(1.15rem, calc(1.61 * var(--vwx)), 1.495rem);
  margin-top: 1.6rem;
}

.ethics-detail {
  padding-block: 0;
}

.ethics-detail h2 {
  margin-bottom: 1.5rem;
  text-transform: uppercase;
}

.ethics-detail p + p {
  margin-top: 1rem;
}

.ethics-detail a {
  color: var(--red);
  font-weight: 750;
}

.footer {
  background: var(--black);
  color: rgba(255, 255, 255, 0.75);
}

body.route-home .home-video-stage + .section--dark,
body.route-home .footer,
body.route-production .footer {
  position: relative;
  z-index: 2;
  background: #050505;
}

body.route-home .home-video-stage + .section--dark {
  padding-block: 3rem;
}

@media (min-width: 769px) {
  body.route-home .home-video-stage + .section--dark {
    padding-top: 62.5px;
  }

  body.route-home .home-video-stage + .section--dark .careers-cta .section-head {
    margin-top: 0;
  }
}

body.route-production {
  background: #050505;
  overflow-x: clip;
}

body.route-production #main {
  background: #050505;
}

.footer__grid {
  display: grid;
  gap: 2rem;
  grid-template-columns: 1.2fr 0.7fr 0.8fr;
  padding-block: 4rem;
}

.footer__logo {
  background: white;
  border-radius: 12px;
  margin-bottom: 1.2rem;
  padding: 0.65rem;
  width: 155px;
}

.footer h3 {
  color: white;
  margin: 0 0 1rem;
}

.footer a {
  display: block;
  margin-top: 0.55rem;
}

.footer a:hover {
  color: white;
}

.footer__bottom {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  padding: 1rem;
  text-align: center;
}

.sponsorship-sport {
  background: #fff;
  padding-bottom: calc(6.4rem + 70px);
}

.sponsorship-sport__panel {
  isolation: isolate;
  position: relative;
}

.sponsorship-sport__panel::before {
  background: #f3f3f3;
  content: "";
  inset: -40px auto -40px 50%;
  pointer-events: none;
  position: absolute;
  transform: translateX(-50%);
  width: min(calc(var(--max) + 560px), calc(calc(100 * var(--vwx)) - 20px));
  z-index: -1;
}

.sponsorship-sport__intro {
  margin-bottom: clamp(2.5rem, calc(5 * var(--vwx)), 4rem);
  transform: translateX(-200px);
}

.sponsorship-sport__intro .section-head {
  margin-bottom: 0;
  max-width: 980px;
}

.sponsorship-sport__intro .section-head h2 {
  font-size: clamp(2.99rem, calc(4.485 * var(--vwx)), 4.784rem);
  line-height: 0.95;
}

.sponsorship-sport__intro .section-head p {
  font-size: clamp(1.05rem, calc(1.25 * var(--vwx)), 1.22rem);
  line-height: 1.78;
}

.sponsorship-feature {
  align-items: center;
  display: grid;
  gap: clamp(1.5rem, calc(3 * var(--vwx)), 3rem);
  grid-template-columns: minmax(260px, 0.75fr) minmax(560px, 1.25fr);
  transform: translateX(225px);
}

.sponsorship-feature + .sponsorship-feature {
  margin-top: clamp(4rem, calc(8 * var(--vwx)), 7rem);
}

.sponsorship-feature--footgolf {
  grid-template-columns: minmax(360px, 0.95fr) minmax(520px, 1.05fr);
  transform: translateX(225px);
}

.sponsorship-feature__copy {
  max-width: 900px;
  transform: translateX(-425px);
}

.sponsorship-feature__copy--footgolf {
  max-width: 900px;
  grid-column: 2;
  grid-row: 1;
  transform: none;
}

.sponsorship-feature__copy h3,
.sponsorship-culture h3 {
  font-size: clamp(2rem, calc(3 * var(--vwx)), 3.2rem);
  line-height: 0.95;
  margin: 0 0 1.5rem;
}

.sponsorship-feature__copy p {
  color: var(--muted);
  font-size: clamp(1.05rem, calc(1.25 * var(--vwx)), 1.22rem);
  line-height: 1.78;
  margin: 0;
}

.sponsorship-feature__copy p + p {
  margin-top: 1.3rem;
}

.sponsorship-feature__media {
  background: #101010;
  box-shadow: var(--shadow);
  margin: 0;
  min-height: clamp(360px, calc(42 * var(--vwx)), 640px);
  overflow: hidden;
}

.sponsorship-feature__media--video {
  align-self: start;
  aspect-ratio: 16 / 9;
  height: auto;
  justify-self: end;
  width: 150%;
  min-height: 0;
}

.sponsorship-feature__media--footgolf {
  align-self: center;
  background: transparent;
  box-shadow: none;
  grid-column: 1;
  grid-row: 1;
  min-height: 0;
  overflow: visible;
  transform: translateX(-425px);
}

.sponsorship-feature__media img,
.sponsorship-feature__media iframe {
  border: 0;
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.sponsorship-feature__media--footgolf img {
  height: auto;
  max-width: none;
  object-fit: contain;
  width: 170%;
}

.sponsorship-note {
  color: var(--muted);
  font-size: clamp(1.05rem, calc(1.25 * var(--vwx)), 1.22rem);
  line-height: 1.78;
  margin-top: clamp(2rem, calc(4 * var(--vwx)), 3.5rem);
  max-width: none;
  transform: translateX(-200px);
  white-space: nowrap;
}

.sponsorship-culture {
  isolation: isolate;
  margin-top: clamp(5.2rem, calc(10.4 * var(--vwx)), 9.1rem);
  position: relative;
  transform: translateX(-200px);
}

.sponsorship-culture::before {
  background: #f3f3f3;
  content: "";
  inset: -55px auto -120px calc(50% + 200px);
  pointer-events: none;
  position: absolute;
  transform: translateX(-50%);
  width: min(calc(var(--max) + 560px), calc(calc(100 * var(--vwx)) - 20px));
  z-index: -1;
}

.sponsorship-culture h2 {
  font-size: clamp(2.4rem, calc(4 * var(--vwx)), 4.6rem);
  line-height: 0.95;
  margin: 0 0 1.5rem;
}

.sponsorship-culture__items {
  display: grid;
  gap: clamp(2rem, calc(4 * var(--vwx)), 4rem);
  grid-template-columns: repeat(2, minmax(0, 686px));
  margin-top: 10px;
}

.sponsorship-culture__item {
  max-width: 686px;
}

.sponsorship-culture__item:nth-child(2) {
  transform: translateX(225px);
}

.sponsorship-culture__media {
  margin: 23px 0 clamp(7rem, calc(9 * var(--vwx)), 9rem);
  overflow: visible;
  max-width: 686px;
}

.sponsorship-culture__media img {
  display: block;
  height: auto;
  transform: scale(1.34);
  transform-origin: left top;
  width: 100%;
}

.sponsorship-culture p {
  color: var(--muted);
  font-size: clamp(1.05rem, calc(1.25 * var(--vwx)), 1.22rem);
  line-height: 1.78;
  margin: 0;
  max-width: none;
}

.sponsorship-culture__item:first-child > p {
  margin-top: 0;
  width: 136%;
}

.sponsorship-culture__item:nth-child(2) > p {
  margin-top: 0;
  width: 112%;
}

.sponsorship-culture__note {
  font-size: clamp(1.05rem, calc(1.25 * var(--vwx)), 1.22rem);
  line-height: 1.78;
  margin-top: 2rem;
  transform: translateY(60px);
  width: 136%;
}

.sponsorship-culture__nowrap {
  white-space: nowrap;
}

.sponsorship-culture__line {
  display: block;
  white-space: nowrap;
}

.sponsorship-culture__intro {
  margin-bottom: 0;
  max-width: none;
  padding-bottom: clamp(1.85rem, calc(3.7 * var(--vwx)), 3.19rem);
}

.sponsorship-culture__intro span:first-child {
  white-space: nowrap;
}

.sponsorship-culture__intro span:last-child {
  display: block;
}

.sponsorship-culture p + p {
  margin-top: 1.1rem;
}

@media (max-width: 920px) {
  .sponsorship-feature {
    grid-template-columns: 1fr;
    transform: none;
  }

  .sponsorship-feature--footgolf {
    transform: none;
  }

  .sponsorship-feature__media {
    min-height: min(calc(92 * var(--vwx)), 560px);
  }

  .sponsorship-feature__media--video {
    aspect-ratio: 16 / 9;
    height: auto;
    min-height: 0;
    width: 100%;
  }

  .sponsorship-feature__media--footgolf {
    grid-column: auto;
    grid-row: auto;
    transform: none;
  }

  .sponsorship-feature__copy {
    transform: none;
  }

  .sponsorship-feature__copy--footgolf {
    grid-column: auto;
    grid-row: auto;
  }

  .sponsorship-sport__intro {
    transform: none;
  }

  .sponsorship-note {
    transform: none;
  }

  .sponsorship-culture {
    transform: none;
  }

  .sponsorship-culture::before {
    left: 50%;
    width: min(calc(100 * var(--vwx)) - 28px, calc(var(--max) + 560px));
  }

  .sponsorship-culture__items {
    grid-template-columns: 1fr;
  }

  .sponsorship-culture__item:nth-child(2) {
    transform: none;
  }

  .sponsorship-culture__item:first-child > p {
    max-width: 100%;
    width: auto;
  }

  .sponsorship-culture__item:nth-child(2) > p {
    max-width: 100%;
    width: auto;
  }

  .sponsorship-culture__nowrap {
    white-space: normal;
  }

  .sponsorship-culture__line {
    display: inline;
    white-space: normal;
  }

  .sponsorship-sport__intro .section-head h2 {
    font-size: clamp(2.99rem, calc(4.485 * var(--vwx)), 4.784rem);
  }
}

.logo-origin {
  background: #fff;
}

.logo-origin__grid {
  align-items: center;
  display: grid;
  gap: clamp(2rem, calc(6 * var(--vwx)), 6rem);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.logo-origin__image {
  height: clamp(420px, calc(48 * var(--vwx)), 680px);
  overflow: hidden;
}

.logo-origin__image img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.logo-origin__copy p {
  font-size: clamp(1.2rem, calc(1.8 * var(--vwx)), 1.75rem);
  line-height: 1.65;
  margin: 0;
  max-width: 720px;
}

.logo-origin__copy h2,
.logo-meaning__copy h2,
.logo-download__copy h2 {
  font-size: clamp(2rem, calc(3 * var(--vwx)), 3.2rem);
  margin-bottom: 2rem;
}

.logo-meaning {
  background: #fff;
  padding-top: 0;
}

.logo-meaning__grid {
  align-items: center;
  display: grid;
  gap: clamp(2rem, calc(6 * var(--vwx)), 6rem);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.logo-meaning__copy {
  max-width: 760px;
}

.logo-meaning__copy p {
  font-size: clamp(1.1rem, calc(1.45 * var(--vwx)), 1.4rem);
  line-height: 1.75;
  margin: 0;
}

.logo-meaning__copy p + p {
  margin-top: 1.5rem;
}

.logo-meaning__visuals {
  display: grid;
  gap: 1.125rem;
}

.logo-meaning__visuals img {
  display: block;
  height: auto;
  width: 100%;
}

.logo-download {
  background: #fff;
  padding-top: 0;
}

.logo-download__grid {
  align-items: center;
  background: #f3f3f3;
  display: grid;
  gap: clamp(2rem, calc(6 * var(--vwx)), 6rem);
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  padding: clamp(2rem, calc(5 * var(--vwx)), 5rem);
}

.logo-download__image img {
  display: block;
  height: auto;
  margin-left: -30%;
  max-width: none;
  width: 160%;
}

.logo-download__copy {
  transform: translateX(30px);
}

.logo-download__copy p {
  font-size: clamp(1.1rem, calc(1.45 * var(--vwx)), 1.4rem);
  line-height: 1.75;
  margin: 0;
  max-width: 720px;
}

.logo-download__copy .actions {
  margin-top: 2rem;
}

@media (max-width: 760px) {
  .logo-origin__grid,
  .logo-meaning__grid,
  .logo-download__grid {
    gap: 2rem;
    grid-template-columns: 1fr;
  }

  .logo-download__copy {
    transform: none;
  }

  .logo-origin__image {
    height: min(calc(115 * var(--vwx)), 560px);
  }
}

@media (min-width: 769px) {
  .about-industry-list span {
    font-size: clamp(1.728rem, calc(2.574 * var(--vwx)), 2.133rem);
  }

  .about-tour__frame {
    width: min(125%, calc(calc(100 * var(--vwx)) - 30px));
    margin-left: 50%;
    transform: translateX(-50%);
  }

  .about-tour__frame iframe {
    height: min(calc(80 * var(--vwx)), 662.5px);
    min-height: 450px;
  }
}

@media (min-width: 1061px) {
  .about-intro__grid {
    width: min(calc(calc(100 * var(--vwx)) - 30px), 1850px);
    max-width: none;
    grid-template-columns: minmax(0, 0.45fr) minmax(0, 0.55fr);
    grid-template-rows: auto auto;
    gap: 30px;
    transform: translateX(-5.625px);
  }

  .about-intro .about-copy {
    display: contents;
  }

  .about-intro .about-copy__heading {
    grid-column: 1;
    grid-row: 1;
  }

  .about-intro .about-copy__body {
    grid-column: 1;
    grid-row: 2;
  }

  .about-intro .about-photo--wide {
    grid-column: 2;
    grid-row: 2;
    align-self: stretch;
    justify-self: center;
    position: relative;
    width: 100%;
    max-width: 100%;
    height: 100%;
    aspect-ratio: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    transition: none;
    transform: translateX(30px);
  }

  .about-intro .about-photo--wide img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: right center;
  }

  .about-intro .about-photo--clickable:hover {
    transform: translateX(30px);
    box-shadow: none;
  }
}

@media (max-width: 1060px) {
  :root {
    --menu-control-height: 58px;
  }

  .site-header .container {
    width: 100%;
  }

  .nav {
    grid-template-columns: minmax(0, 1fr) auto auto;
    min-height: 101px;
  }

  body.menu-open .nav {
    min-height: 101px;
  }

  .brand {
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 180px;
  }

  body.menu-open .brand {
    opacity: 0;
    transform: translate(-50%, -4px);
  }

  .brand img {
    width: 180px;
  }

  .menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .main-nav {
    background: white;
    border-top: 1px solid var(--line);
    display: none;
    inset: 101px 0 auto 0;
    left: 0;
    max-height: calc(100 * var(--vhx) - 101px);
    overflow: auto;
    padding: 1rem 20px 2rem;
    position: fixed;
    transform: none;
    width: 100%;
  }

  body.menu-open .main-nav {
    display: grid;
    gap: 0.25rem;
    inset: var(--menu-live-top, var(--menu-control-top)) 0 auto 0;
    max-height: calc(100 * var(--vhx) - var(--menu-live-top, var(--menu-control-top)));
    min-height: var(--menu-live-height, var(--menu-control-height));
    padding-top: var(--menu-live-height, var(--menu-control-height));
  }

  .main-nav > a,
  .nav-group > a {
    font-size: 1.26rem;
    justify-content: flex-start;
    padding: 0.96rem 1.09rem;
    text-align: left;
  }

  .nav-group {
    display: grid;
    position: static;
  }

  .nav-group::after {
    display: none;
  }

  .dropdown {
    border-color: transparent;
    box-shadow: none;
    max-height: 0;
    min-width: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    position: static;
    transform: none;
    transition: max-height 0.2s ease, opacity 0.2s ease;
    margin: 0 0 0 1rem;
    padding-block: 0;
  }

  .nav-group:hover .dropdown,
  .nav-group:focus-within .dropdown {
    border-color: var(--line);
    max-height: 360px;
    opacity: 1;
    padding-block: 0.55rem;
    pointer-events: auto;
  }

  .grid-5,
  .grid-4,
  .grid-3,
  .footer__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .tech-hero-panel__grid,
  .tech-materials,
  .tech-digital-flow__item,
  .tech-service-layout,
  .video-section__grid,
  .split,
  .document-layout {
    grid-template-columns: 1fr;
    width: 100%;
  }

  .policy-features,
  .policy-detail-grid {
    grid-template-columns: 1fr;
  }

  .video-section .video-embed {
    transform: none;
  }

  .tech-service-layout {
    margin: 1.8rem auto 0;
    transform: none;
  }

  .capability-matrix {
    grid-template-columns: 1fr 1fr;
  }

  .tech-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tech-image-card,
  .tech-digital-flow__item .tech-image-card {
    min-height: 420px;
  }

  .tile-large {
    grid-row: auto;
    grid-column: span 2;
    min-height: 360px;
  }

  .machine-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .production-visuals__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .finishing-card,
  .finishing-card--dark {
    grid-template-columns: 1fr;
  }

  .finishing-card--dark figure {
    order: 2;
  }

  .machine-card.is-open {
    grid-column: span 3;
  }

  .toc {
    position: static;
  }

  .ethics-employee__layout {
    grid-template-columns: 1fr;
  }

  .ethics-employee__media {
    float: none;
    margin: 0 0 2rem;
    position: static;
    width: 100%;
  }

  .ethics-quote {
    grid-template-columns: 1fr;
  }

  .ethics-quote::before {
    inset: 35% -1rem -2rem;
  }

  .ethics-quote__media img {
    min-height: 0;
  }
}

/* SL/EN keep a fixed two-column grid for #meritve-in-preizkusi/#kontrola-kakovosti
   until 980px (see the language-scoped rules near .production-photo-stage), so the
   generic order:2 above (meant for the single-column stack) would otherwise swap
   the image into the text column between 981-1060px. DE already collapses to one
   column at 1060px, so it keeps the generic rule untouched. */
@media (min-width: 981px) and (max-width: 1060px) {
  body.language-en .production-photo-stage #meritve-in-preizkusi figure,
  body.language-en .production-photo-stage #kontrola-kakovosti figure,
  body:not(.language-en):not(.language-de) .production-photo-stage #meritve-in-preizkusi figure,
  body:not(.language-en):not(.language-de) .production-photo-stage #kontrola-kakovosti figure {
    order: 0;
  }
}

@media (max-width: 720px) {
  :root {
    --menu-control-top: 46px;
    --menu-control-height: 52px;
    --home-logo-height: clamp(49.41px, calc(13.68 * var(--vwx)), 65.34px);
    --home-logo-half-height: clamp(24.705px, calc(6.84 * var(--vwx)), 32.67px);
    --home-menu-half-height: 26px;
    --header-control-spread: clamp(485px, calc(calc(38 * var(--vwx)) + 315px), 575px);
  }

  .ethics-document {
    width: calc(100% - 28px);
  }

  .page-hero--policy .container,
  .policy-intro .container,
  .policy-feature-strip .container,
  .policy-details .container,
  .page-hero--eu-grid .container,
  .eu-project__text {
    width: min(100% - 28px, 1560px);
  }

  .procurement-terms__content {
    width: min(100% - 28px, 1560px);
  }

  .general-terms__content {
    width: min(100% - 28px, 1560px);
  }

  .general-terms__intro,
  .general-terms__detail {
    gap: 1.4rem;
    grid-template-columns: 1fr;
  }

  .general-terms__intro-copy {
    padding-left: 1.25rem;
  }

  .general-terms__privacy-meta {
    grid-template-columns: 1fr;
  }

  .general-terms__authorship,
  .general-terms__privacy-heading {
    margin-inline: -14px;
    padding-inline: 14px;
  }

  .policy-feature {
    gap: 1rem;
    grid-template-columns: 82px minmax(0, 1fr);
  }

  .policy-feature__icon {
    width: 72px;
  }

  .production-photo-stage {
    --production-block-gap: clamp(6rem, calc(22 * var(--vwx)), 9rem);
    --production-intro-top-gap: 1rem;
  }

  .container {
    width: min(100% - 28px, var(--max));
  }

  .about-intro__grid {
    width: min(100% - 28px, var(--max));
  }

  .brand,
  .brand img {
    width: 168px;
  }

  .nav {
    min-height: 86px;
  }

  body.menu-open .nav {
    min-height: 86px;
  }

  .menu-toggle {
    gap: 0.65rem;
    right: max(14px, calc(50% - var(--header-control-spread)));
    top: 14px;
  }

  .menu-inquiry {
    left: calc(50% - 580px);
    top: 7px;
  }

  .menu-toggle__icon,
  .menu-toggle__icon::before,
  .menu-toggle__icon::after {
    width: 34px;
  }

  .main-nav {
    inset: 86px 0 auto 0;
    max-height: calc(100vh - 86px);
  }

  body.menu-open .main-nav {
    inset: var(--menu-live-top, var(--menu-control-top)) 0 auto 0;
    max-height: calc(100vh - var(--menu-live-top, var(--menu-control-top)));
    min-height: var(--menu-live-height, var(--menu-control-height));
  }

  .page-hero .container {
    padding-block: 0;
  }

  h1 {
    font-size: clamp(2.35rem, calc(13 * var(--vwx)), 3.8rem);
    line-height: 0.95;
  }

  .page-hero--policy .container {
    padding-block: 1.7rem;
  }

  .page-hero--policy h1 {
    font-size: clamp(2.35rem, calc(13 * var(--vwx)), 3.8rem);
    line-height: 0.95;
    max-width: none;
  }

  .actions {
    align-items: stretch;
    flex-direction: column;
  }

  .btn {
    width: 100%;
  }

  .home-video-stage__headline {
    top: 100vh;
    top: 100svh;
    width: min(100% - 28px, var(--max));
    font-size: clamp(2.15712rem, calc(10.7856 * var(--vwx)), 3.77496rem);
    line-height: 1.02;
    transform: translateY(calc(-100% - 47px));
  }

  .home-capability-pill {
    justify-content: flex-start;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    gap: 1.4rem;
    margin-top: calc(1.35rem + 70px);
    padding: 0.89rem 0.98rem;
    font-size: 1.05rem;
  }

  .home-pinned-logo {
    left: 50%;
    transform: translateX(-50%);
  }

  .section {
    padding-block: 4.6rem;
  }

  .home-video-stage > .section {
    padding-block: 20.8395rem;
  }

  .home-cert-section {
    padding-top: 20.8395rem;
    padding-bottom: 20.8395rem;
  }

  .home-cert-section + .section--dark {
    padding-top: 20.8395rem;
  }

  .section-head h2 {
    font-size: clamp(2rem, calc(11 * var(--vwx)), 3rem);
  }

  .grid-5,
  .grid-4,
  .grid-3,
  .footer__grid,
  .gallery-grid {
    grid-template-columns: 1fr;
  }

  .capability-matrix,
  .tech-service-grid,
  .machine-grid {
    grid-template-columns: 1fr;
  }

  .tech-image-card {
    min-height: 310px;
  }

  .tech-service-grid h3 {
    white-space: normal;
  }

  .careers-first__grid {
    grid-template-columns: 1fr;
  }

  .careers-first__image {
    min-height: 310px;
  }

  .careers-first__copy h2 {
    font-size: clamp(1rem, calc(5.6 * var(--vwx)), 1.65rem);
  }

  .careers-openings h2 {
    font-size: clamp(1.85rem, calc(10.4 * var(--vwx)), 3.2rem);
  }

  .careers-opening-card summary {
    grid-template-columns: minmax(0, 1fr) 42px;
    min-height: 78px;
    padding: 1rem;
  }

  .careers-opening-card summary span {
    font-size: clamp(1.6rem, calc(2.5 * var(--vwx)), 2.2rem);
  }

  .careers-opening-card summary i {
    width: 42px;
    height: 42px;
  }

  .careers-opening-card__columns {
    grid-template-columns: 1fr;
  }

  .careers-opening-card__body h3,
  .careers-opening-card__body h4 {
    font-size: clamp(1.6rem, calc(2.5 * var(--vwx)), 2.2rem);
  }

  .careers-opening-card .feature-list li {
    white-space: normal;
  }

  .careers-application__box {
    padding: 1.5rem 1rem;
  }

  .careers-application__box h2 {
    font-size: clamp(1.8rem, calc(11 * var(--vwx)), 2.7rem);
    white-space: normal;
  }

  .careers-application .reference-application-form {
    grid-template-columns: 1fr;
    gap: 0.8rem;
    height: auto;
    min-height: 0;
    max-height: none;
  }

  .tech-visual-stack {
    grid-template-columns: 1fr;
  }

  .tech-visual-card--large {
    grid-row: auto;
    min-height: 360px;
  }

  .tech-visual-card,
  .tech-visual-note {
    min-height: 240px;
  }

  .tech-hero-panel h2 {
    font-size: clamp(2.25rem, calc(12 * var(--vwx)), 3.6rem);
  }

  .tech-service-grid article {
    min-height: auto;
  }

  .tech-source-link {
    align-items: stretch;
    flex-direction: column;
  }

  .tech-digital-flow__item:nth-child(even) .tech-image-card {
    order: 0;
  }

  .tech-digital-flow__cta {
    align-items: stretch;
    flex-direction: column;
  }

  .tech-source-link a,
  .tech-source-link span {
    text-align: center;
  }

  .tile-large {
    grid-column: auto;
    min-height: 320px;
  }

  .capability-tile {
    min-height: 230px;
  }

  .video-embed {
    border-radius: 18px;
  }

  .machine-card,
  .machine-card.is-open {
    grid-column: auto;
    min-height: 160px;
  }

  .production-visuals {
    padding-block: 1.5rem;
  }

  .production-photo-stage .production-visuals {
    padding-block: 1.5rem 0;
  }

  .production-photo-stage #strojni-park {
    padding-block: var(--production-block-gap) 0;
  }

  .production-photo-stage .finishing-panel {
    padding-block: var(--production-block-gap) 0;
  }

  .production-photo-stage .assembly-panel {
    padding-block: var(--production-block-gap) 4.6rem;
  }

  .production-visuals__grid {
    grid-template-columns: 1fr;
  }

  .production-visual {
    min-height: 300px;
  }

  .finishing-card {
    min-height: 0;
    padding: 0.85rem;
    border-radius: 14px;
  }

  .finishing-card figure {
    min-height: 300px;
  }

  .finishing-copy {
    padding: 1rem;
  }

  .finishing-copy h2 {
    font-size: clamp(2.25rem, calc(12 * var(--vwx)), 3.4rem);
  }

  .finishing-copy p {
    font-size: 1.035rem;
    line-height: 1.5;
  }

  .service-rows strong {
    font-size: 1.1925rem;
    line-height: 1.18;
  }

  .machine-card h3 {
    font-size: 1.45rem;
  }

  .production-summary {
    padding-block: 1.25rem;
  }

  .production-summary p {
    font-size: 1rem;
    line-height: 1.6;
  }

  .cert-card {
    grid-template-rows: 260px auto;
  }
}

@media (max-width: 1060px) {
  .home-future-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-intro__grid,
  .about-industries__grid,
  .about-story__grid,
  .about-story__grid--reverse {
    grid-template-columns: 1fr;
  }

  .about-intro__grid {
    width: min(var(--max), calc(100% - 40px));
    transform: none;
  }

  .about-story__grid--reverse .about-story__content {
    order: 1;
  }

  .about-story__grid--reverse .about-story__media {
    order: 2;
  }

  .about-industries__grid {
    display: grid;
    min-height: 0;
    transform: none;
  }

  .about-industries__copy {
    width: 100%;
    transform: none;
  }

  .about-industries .about-photo {
    position: static;
    width: 100%;
    transform: none;
  }

  .about-intro .about-photo--wide,
  .about-intro .about-photo--clickable:hover {
    transform: none;
  }
}

@media (max-width: 720px) {
  .home-future-content__inner {
    width: min(100% - 32px, 1680px);
  }

  .home-future-stats {
    grid-template-columns: 1fr;
  }

  .home-future-stats div {
    min-height: 0;
  }

  .about-story__grid {
    --about-story-media-height: 420px;
    --about-story-media-width: 420px;
  }

  .about-story__grid--wide {
    --about-story-media-width: 630px;
  }

  .about-copy h2 {
    font-size: clamp(2.2rem, calc(12 * var(--vwx)), 3.7rem);
  }

  .about-photo,
  .about-story__media {
    min-height: 420px;
  }

  .about-story__content .lead {
    font-size: 1.12rem;
  }

  .about-photo--wide {
    aspect-ratio: 4 / 3;
  }

  .about-copy p {
    font-size: 1.08rem;
  }

  .about-industry-list {
    grid-template-columns: 1fr;
    transform: none;
  }

  .about-tour__frame iframe {
    min-height: 300px;
  }
}

/* Production page redesign */
body.route-production {
  background: #050505;
}

/* Cookie consent and application form service. Existing page layout remains unchanged. */
.cookie-consent [hidden] {
  display: none !important;
}

.cookie-consent__banner {
  position: fixed;
  z-index: 10000;
  right: 20px;
  bottom: 20px;
  left: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  max-width: 1120px;
  margin-inline: auto;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 4px;
  background: #071b3a;
  box-shadow: 0 14px 45px rgba(0, 0, 0, 0.3);
  color: #fff;
}

.cookie-consent__copy {
  max-width: 700px;
}

.cookie-consent__copy h2,
.cookie-consent__settings h2 {
  margin: 0 0 8px;
  color: inherit;
  font-size: 24px;
  line-height: 1.15;
}

.cookie-consent__copy p,
.cookie-consent__option p {
  margin: 0 0 8px;
  font-size: 15px;
  line-height: 1.45;
}

.cookie-consent a {
  color: inherit;
  font-size: 14px;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.cookie-consent__actions,
.cookie-consent__settings-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.cookie-consent button,
.footer__bottom [data-cookie-settings-link] {
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid #fff;
  border-radius: 2px;
  background: #ee3e3c;
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

.cookie-consent button:hover,
.cookie-consent button:focus-visible {
  filter: brightness(1.08);
}

.cookie-consent .cookie-consent__secondary {
  background: transparent;
}

.cookie-consent__backdrop {
  position: fixed;
  z-index: 10001;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(0, 0, 0, 0.66);
}

.cookie-consent__settings {
  position: relative;
  width: min(620px, 100%);
  max-height: 90%;
  overflow: auto;
  padding: 30px;
  border-radius: 4px;
  background: #071b3a;
  color: #fff;
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.4);
}

.cookie-consent__close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 40px;
  min-height: 40px !important;
  padding: 0 !important;
  border-color: transparent !important;
  background: transparent !important;
  font-size: 28px !important;
}

.cookie-consent__option {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 20px;
  align-items: start;
  margin-block: 20px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.cookie-consent__option strong {
  display: block;
  margin-bottom: 5px;
}

.cookie-consent__option input {
  width: 22px;
  height: 22px;
  accent-color: #ee3e3c;
}

.cookie-consent__settings-actions {
  margin-top: 22px;
}

.footer__bottom [data-cookie-settings-link] {
  display: inline;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.application-form__website {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}

.reference-application-form button:disabled {
  cursor: wait;
  opacity: 0.65;
}

.reference-application-form .form-msg p {
  margin: 0;
}

.reference-application-form .form-msg .success {
  color: #18733c;
}

.reference-application-form .form-msg .error {
  color: #a51f1f;
}

.reference-application-form .form-msg__settings {
  width: auto;
  height: auto;
  min-height: 40px;
  margin-top: 8px;
  padding: 8px 12px;
  font-size: 14px;
}

.consent-embed-placeholder {
  display: grid;
  place-content: center;
  justify-items: center;
  width: 100%;
  height: 100%;
  min-height: 280px;
  padding: 28px;
  background: #071b3a;
  color: #fff;
  text-align: center;
}

.consent-embed-placeholder p {
  max-width: 520px;
  margin: 0 0 16px;
  color: inherit;
  font-size: 16px;
  line-height: 1.5;
}

.consent-embed-placeholder button {
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid #fff;
  border-radius: 2px;
  background: #ee3e3c;
  color: #fff;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

/* RESEDA visual language for cookie consent */
.cookie-consent {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

.cookie-consent__banner,
.cookie-consent__settings {
  isolation: isolate;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: var(--radius);
  background: linear-gradient(135deg, #050b12 0%, #071725 55%, #06111d 100%);
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.46), 0 16px 48px rgba(6, 23, 37, 0.22);
}

.cookie-consent__banner {
  overflow: hidden;
}

.cookie-consent__settings {
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.cookie-consent__banner::before,
.cookie-consent__settings::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
  background-size: 58px 58px;
  mask-image: linear-gradient(135deg, rgba(0, 0, 0, 0.92), transparent 88%);
  pointer-events: none;
}

.cookie-consent__banner {
  padding: 28px 30px;
}

.cookie-consent__copy h2,
.cookie-consent__settings h2 {
  margin-bottom: 10px;
  color: #fff;
  font-size: clamp(28px, calc(2.15 * var(--vwx)), 36px);
  font-weight: 900;
  letter-spacing: -0.035em;
  line-height: 1;
  text-transform: uppercase;
}

.cookie-consent__copy p,
.cookie-consent__option p {
  color: rgba(255, 255, 255, 0.76);
}

.cookie-consent a {
  color: #fff;
  font-weight: 700;
  text-decoration-color: var(--red);
  text-decoration-thickness: 2px;
  text-underline-offset: 4px;
}

.cookie-consent a[data-link] {
  font-size: 14.98px;
}

.cookie-consent__actions {
  min-width: 308px;
  justify-content: flex-end;
}

.cookie-consent button {
  min-height: 48px;
  padding: 0.9rem 1.25rem;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 900;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.cookie-consent button:hover,
.cookie-consent button:focus-visible {
  filter: none;
  transform: translateY(-2px);
}

.cookie-consent button[data-consent-action="accept"],
.cookie-consent button[data-consent-action="reject"],
.cookie-consent button[data-consent-action="save"] {
  border-color: transparent;
  background: linear-gradient(135deg, var(--red), #ff3038);
  box-shadow: var(--glow);
}

.cookie-consent .cookie-consent__secondary {
  border-color: rgba(255, 255, 255, 0.22);
  background: rgba(255, 255, 255, 0.06);
}

.cookie-consent__backdrop {
  background: rgba(5, 5, 5, 0.78);
  backdrop-filter: blur(8px);
}

.cookie-consent__settings {
  width: min(760px, 100%);
  padding: 34px;
}

.cookie-consent__close {
  top: 18px;
  right: 18px;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: #fff;
}

.cookie-consent__option {
  position: relative;
  margin-block: 10px;
  padding: 16px 18px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.055);
}

.cookie-consent__option > div {
  min-width: 0;
}

.cookie-consent__option::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  background: var(--red);
}

.cookie-consent__option strong {
  color: #fff;
  font-size: 16px;
  font-weight: 900;
}

.cookie-consent__option input {
  width: 24px;
  height: 24px;
  accent-color: var(--red);
}

.cookie-consent__settings-actions {
  justify-content: flex-end;
}

.cookie-consent__settings-actions button {
  font-size: 16.09px;
}

body.route-production #main {
  background: #050505;
}

.production-photo-stage {
  --production-block-gap: clamp(6.5rem, calc(10 * var(--vwx)), 10rem);
  --production-intro-top-gap: clamp(1rem, calc(1.8 * var(--vwx)), 1.6rem);
  --production-tech-bg: #06111d;
  --production-tech-panel: #071725;
  --production-tech-line: rgba(103, 201, 255, 0.14);
  --production-tech-soft: rgba(103, 201, 255, 0.08);
}

.production-photo-stage__bg::before {
  background-position: center 28%;
  filter: none;
}

.production-photo-stage__bg::after {
  background: none;
}

.production-intro-card {
  width: min(var(--max), calc(100% - 40px));
  margin-top: var(--production-intro-top-gap);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 0 0 10px 10px;
  background:
    linear-gradient(var(--production-tech-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--production-tech-line) 1px, transparent 1px),
    radial-gradient(circle at 82% 0%, rgba(215, 25, 32, 0.2), transparent 28rem),
    radial-gradient(circle at 16% 18%, rgba(103, 201, 255, 0.11), transparent 24rem),
    linear-gradient(135deg, var(--production-tech-bg), #050505 58%, #090c10);
  background-size: 58px 58px, 58px 58px, auto, auto, auto;
  box-shadow: 0 42px 120px rgba(0, 0, 0, 0.52);
}

.production-intro-card::before {
  left: 0;
  right: 0;
  height: var(--production-intro-top-gap);
  background: var(--production-tech-bg);
}

.production-intro-card::after {
  display: none;
}

.production-intro-card .page-hero .container {
  padding: clamp(4.4rem, calc(6 * var(--vwx)), 5.6rem) clamp(1.4rem, calc(3 * var(--vwx)), 3rem) clamp(1.7rem, calc(2.7 * var(--vwx)), 2.4rem);
}

.production-intro-card .breadcrumbs {
  margin-bottom: 1.35rem;
}

.production-intro-card .page-hero h1 {
  max-width: 1080px;
  font-size: clamp(4.2rem, calc(10 * var(--vwx)), 8rem);
  letter-spacing: 0;
  line-height: 0.9;
}

.production-intro-card .production-summary {
  background: var(--red);
  box-shadow: 0 20px 54px rgba(215, 25, 32, 0.24);
}

.production-intro-card .production-summary .container {
  width: min(var(--max), calc(100% - 40px));
  padding-inline: clamp(1.4rem, calc(3 * var(--vwx)), 3rem);
}

.production-intro-card .production-summary p {
  max-width: 1180px;
  font-size: clamp(1.04rem, calc(1.18 * var(--vwx)), 1.18rem);
  font-weight: 850;
  line-height: 1.58;
}

.production-photo-stage .production-intro-card .production-visuals {
  padding: clamp(2rem, calc(4 * var(--vwx)), 3.6rem);
}

.production-photo-stage .production-intro-card .production-visuals > .container {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(0.85rem, calc(1.3 * var(--vwx)), 1.2rem);
}

.production-photo-stage .production-visual {
  min-height: clamp(320px, calc(35 * var(--vwx)), 460px);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 12px;
  box-shadow: 0 26px 72px rgba(0, 0, 0, 0.46);
}

.production-photo-stage .production-visual img {
  filter: saturate(1.08) contrast(1.04);
}

.production-photo-stage #strojni-park,
.production-photo-stage .finishing-panel,
.production-photo-stage .assembly-panel {
  padding-block: var(--production-block-gap) 0;
}

.production-photo-stage .assembly-panel {
  padding-bottom: clamp(6rem, calc(10 * var(--vwx)), 9rem);
}

.production-photo-stage #strojni-park > .container {
  position: relative;
  overflow: hidden;
  padding: clamp(2rem, calc(4 * var(--vwx)), 3.4rem);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(var(--production-tech-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--production-tech-line) 1px, transparent 1px),
    radial-gradient(circle at 90% 0%, rgba(215, 25, 32, 0.2), transparent 25rem),
    radial-gradient(circle at 12% 24%, rgba(103, 201, 255, 0.11), transparent 22rem),
    linear-gradient(135deg, var(--production-tech-panel), #050505 62%, #080b10);
  background-size: 54px 54px, 54px 54px, auto, auto, auto;
  box-shadow: 0 38px 110px rgba(0, 0, 0, 0.46);
}

.production-photo-stage #strojni-park > .container::before {
  display: none;
}

.production-photo-stage #strojni-park > .container::after {
  left: clamp(2rem, calc(4 * var(--vwx)), 3.4rem);
  right: auto;
  top: 0;
  width: min(360px, calc(100% - 4rem));
  height: 4px;
  background: var(--red);
}

.production-photo-stage #strojni-park .section-head {
  max-width: 980px;
  border-left: 0;
  margin-bottom: clamp(2.2rem, calc(4 * var(--vwx)), 3.4rem);
  padding-left: 0;
}

.production-photo-stage #strojni-park .section-head h2 {
  font-size: clamp(2.8rem, calc(5.8 * var(--vwx)), 5.8rem);
  line-height: 0.9;
}

.production-photo-stage #strojni-park .section-head p {
  max-width: 760px;
  font-size: clamp(1rem, calc(1.25 * var(--vwx)), 1.18rem);
}

.production-photo-stage .machine-grid {
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: clamp(0.8rem, calc(1.3 * var(--vwx)), 1.2rem);
}

.production-photo-stage .machine-card {
  min-height: 220px;
  border: 1px solid rgba(103, 201, 255, 0.32);
  border-radius: 10px;
  background:
    linear-gradient(rgba(3, 19, 33, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(3, 19, 33, 0.055) 1px, transparent 1px),
    linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(232, 244, 255, 0.96));
  background-size: 34px 34px, 34px 34px, auto;
  color: #031321;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.34);
}

.production-photo-stage .machine-card:hover,
.production-photo-stage .machine-card:focus-visible,
.production-photo-stage .machine-card.is-open {
  border-color: var(--red);
  transform: translateY(-5px);
  box-shadow: 0 30px 82px rgba(0, 0, 0, 0.44);
}

.production-photo-stage .machine-card h3 {
  font-size: clamp(1.35rem, calc(2.4 * var(--vwx)), 2.35rem);
  color: #031321;
}

.production-photo-stage .machine-card em {
  color: #09233f;
}

.production-photo-stage .machine-card.is-open {
  grid-column: span 2;
  background:
    linear-gradient(rgba(3, 19, 33, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(3, 19, 33, 0.055) 1px, transparent 1px),
    linear-gradient(145deg, #fff, #e8f4ff);
  background-size: 34px 34px, 34px 34px, auto;
}

.production-photo-stage .machine-card.is-open em {
  color: var(--red);
}

.production-photo-stage .machine-card.is-open .feature-list li {
  color: #000;
}

.production-photo-stage .finishing-panel,
.production-photo-stage .assembly-panel {
  background: transparent;
}

.production-photo-stage .finishing-system {
  gap: var(--production-block-gap);
}

.production-photo-stage .finishing-card {
  min-height: clamp(520px, calc(46 * var(--vwx)), 640px);
  column-gap: clamp(1.25rem, calc(2.4 * var(--vwx)), 2.25rem);
  border: 1px solid #000;
  border-radius: 12px;
  background:
    linear-gradient(rgba(3, 19, 33, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(3, 19, 33, 0.055) 1px, transparent 1px),
    linear-gradient(145deg, #fff, #edf7ff);
  background-size: 42px 42px, 42px 42px, auto;
  color: #031321;
  box-shadow: 0 34px 96px rgba(0, 0, 0, 0.28);
}

.production-photo-stage .finishing-panel .finishing-card:first-child {
  background:
    linear-gradient(rgba(3, 19, 33, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(3, 19, 33, 0.055) 1px, transparent 1px),
    linear-gradient(145deg, #fff, #edf7ff);
  background-size: 42px 42px, 42px 42px, auto;
}

.production-photo-stage .finishing-card figure {
  border-radius: 8px;
}

.production-photo-stage .finishing-copy h2 {
  font-size: clamp(2.9rem, calc(5.8 * var(--vwx)), 6.2rem);
  line-height: 0.88;
  color: #031321;
}

.language-en .production-photo-stage #kontrola-kakovosti .finishing-copy h2,
.language-en .production-photo-stage #meritve-in-preizkusi .finishing-copy h2 {
  max-width: none;
}

.language-de .production-photo-stage .finishing-panel > .container {
  width: min(calc(calc(100 * var(--vwx)) - 16px), calc(var(--max) + 560px));
}

.language-de .production-photo-stage .finishing-panel .finishing-card:first-child {
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, 0.82fr);
  justify-self: center;
  width: 100%;
}

.language-de .production-photo-stage .finishing-panel .finishing-card:first-child .finishing-copy {
  padding-inline: clamp(1rem, calc(2.6 * var(--vwx)), 2.4rem);
}

.language-de .production-photo-stage .finishing-panel .finishing-card:first-child .finishing-copy h2 {
  font-size: clamp(2.61rem, calc(5.22 * var(--vwx)), 5.58rem);
  max-width: none;
  white-space: nowrap;
}

.language-de .production-photo-stage .assembly-panel > .container {
  width: min(calc(calc(100 * var(--vwx)) - 16px), calc(var(--max) + 560px));
}

.language-de .production-photo-stage #montaza-sklopov {
  grid-template-columns: minmax(0, 1.2fr) minmax(340px, 0.8fr);
  justify-self: center;
  width: 100%;
}

.language-de .production-photo-stage #montaza-sklopov .finishing-copy {
  padding-inline: clamp(1rem, calc(2.7 * var(--vwx)), 2.25rem);
}

.language-de .production-photo-stage #montaza-sklopov .finishing-copy h2 {
  font-size: clamp(3.08rem, calc(4.565 * var(--vwx)), 5.445rem);
  max-width: none;
  white-space: nowrap;
}

body.language-en .production-photo-stage .finishing-panel > .container,
body.language-en .production-photo-stage .assembly-panel > .container,
body:not(.language-en):not(.language-de) .production-photo-stage .finishing-panel > .container,
body:not(.language-en):not(.language-de) .production-photo-stage .assembly-panel > .container {
  width: min(calc(100% - 40px), calc(var(--max) + 220px));
}

body.language-en .production-photo-stage .finishing-panel .finishing-card:first-child,
body:not(.language-en):not(.language-de) .production-photo-stage .finishing-panel .finishing-card:first-child {
  grid-template-columns: minmax(0, 0.86fr) minmax(520px, 0.94fr);
  justify-self: center;
  width: 100%;
}

body.language-en .production-photo-stage .finishing-panel .finishing-card:first-child,
body.language-en .production-photo-stage #meritve-in-preizkusi,
body.language-en .production-photo-stage #kontrola-kakovosti,
body.language-en .production-photo-stage #montaza-sklopov {
  margin-inline: auto;
}

body.language-en .production-photo-stage #meritve-in-preizkusi,
body.language-en .production-photo-stage #kontrola-kakovosti,
body:not(.language-en):not(.language-de) .production-photo-stage #meritve-in-preizkusi {
  grid-template-columns: minmax(520px, 0.94fr) minmax(0, 0.86fr);
  justify-self: center;
  width: 100%;
}

body.language-en .production-photo-stage #meritve-in-preizkusi,
body.language-en .production-photo-stage #kontrola-kakovosti {
  --measurement-card-width: min(calc(calc(100 * var(--vwx)) - 16px), calc(var(--max) + 220px));
  grid-template-columns: 650px minmax(0, 1fr);
  justify-self: center;
  margin-inline: calc((100% - var(--measurement-card-width)) / 2);
  padding: 1.25rem;
  width: var(--measurement-card-width);
}

body.language-en .production-photo-stage #meritve-in-preizkusi .finishing-copy,
body.language-en .production-photo-stage #kontrola-kakovosti .finishing-copy {
  padding-inline: 0.5rem;
}

body.language-en .production-photo-stage #meritve-in-preizkusi .finishing-copy h2 span,
body.language-en .production-photo-stage #kontrola-kakovosti .finishing-copy h2 span {
  display: block;
}

body:not(.language-en):not(.language-de) .production-photo-stage #meritve-in-preizkusi .finishing-copy h2 span {
  display: block;
}

body:not(.language-en):not(.language-de) .production-photo-stage #meritve-in-preizkusi .finishing-copy h2 span:first-child {
  white-space: nowrap;
}

body.language-en .production-photo-stage #montaza-sklopov,
body:not(.language-en):not(.language-de) .production-photo-stage #montaza-sklopov {
  grid-template-columns: minmax(0, 0.86fr) minmax(520px, 0.94fr);
  justify-self: center;
  width: 100%;
}

body.language-en .production-photo-stage .finishing-panel .finishing-card:first-child,
body.language-en .production-photo-stage #montaza-sklopov,
body:not(.language-en):not(.language-de) .production-photo-stage .finishing-panel .finishing-card:first-child,
body:not(.language-en):not(.language-de) .production-photo-stage #montaza-sklopov {
  padding-right: 1.25rem;
}

body.language-en .production-photo-stage .finishing-card figure,
body:not(.language-en):not(.language-de) .production-photo-stage .finishing-card figure {
  aspect-ratio: 1;
  min-height: 0;
  justify-self: stretch;
  width: 100%;
}

.production-photo-stage .finishing-copy p {
  color: #031321;
  font-weight: 560;
}

.production-photo-stage .service-rows div {
  min-height: 64px;
  border: 1px solid rgba(3, 19, 33, 0.34);
  border-radius: 8px;
  background: #fff;
  color: #031321;
}

.production-photo-stage .section--dark {
  padding-block: clamp(2rem, calc(4 * var(--vwx)), 3.5rem);
  background: #050505;
}

.production-photo-stage .section--dark > .container {
  padding: clamp(1.5rem, calc(2.5 * var(--vwx)), 2.25rem) clamp(2rem, calc(4 * var(--vwx)), 3.4rem);
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 12px;
  background:
    linear-gradient(90deg, rgba(215, 25, 32, 0.18), transparent 45%),
    radial-gradient(circle at 86% 0%, rgba(103, 201, 255, 0.1), transparent 22rem),
    linear-gradient(135deg, var(--production-tech-bg), #050505 62%);
  box-shadow: 0 34px 100px rgba(0, 0, 0, 0.44);
}

.production-photo-stage .section--dark .section-head {
  margin-bottom: 1.1rem;
}

.production-photo-stage .section--dark .section-head h2 {
  max-width: 760px;
  font-size: clamp(2.8rem, calc(5.8 * var(--vwx)), 5.8rem);
}

@media (max-width: 980px) {
  .production-photo-stage .production-intro-card .production-visuals > .container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .production-photo-stage .machine-card.is-open {
    grid-column: span 2;
  }

  .production-photo-stage .finishing-card,
  .production-photo-stage .finishing-card--dark {
    grid-template-columns: 1fr;
  }

  .language-en .production-photo-stage .finishing-panel .finishing-card:first-child,
  .language-en .production-photo-stage #montaza-sklopov {
    width: 100%;
  }

  .language-de .production-photo-stage .finishing-panel .finishing-card:first-child {
    grid-template-columns: 1fr;
  }

  body.language-en .production-photo-stage .finishing-panel .finishing-card:first-child,
  body.language-en .production-photo-stage #meritve-in-preizkusi,
  body.language-en .production-photo-stage #kontrola-kakovosti,
  body.language-en .production-photo-stage #montaza-sklopov,
  body:not(.language-en):not(.language-de) .production-photo-stage .finishing-panel .finishing-card:first-child,
  body:not(.language-en):not(.language-de) .production-photo-stage #meritve-in-preizkusi,
  body:not(.language-en):not(.language-de) .production-photo-stage #montaza-sklopov {
    grid-template-columns: 1fr;
  }

  .production-photo-stage .finishing-card--dark figure {
    order: 2;
  }
}

@media (max-width: 720px) {
  .production-photo-stage {
    --production-block-gap: clamp(5rem, calc(18 * var(--vwx)), 7.5rem);
    --production-intro-top-gap: 1rem;
  }

  .production-intro-card,
  .production-photo-stage #strojni-park > .container,
  .production-photo-stage .section--dark > .container {
    width: min(100% - 28px, var(--max));
  }

  .production-intro-card .page-hero .container {
    padding: 3.4rem 1rem 1.45rem;
  }

  .production-intro-card .page-hero h1 {
    font-size: clamp(3.1rem, calc(17 * var(--vwx)), 4.8rem);
  }

  .production-intro-card .production-summary .container {
    width: min(100% - 28px, var(--max));
    padding-inline: 1rem;
  }

  .production-intro-card .production-summary p {
    font-size: 1rem;
    line-height: 1.55;
  }

  .production-photo-stage .production-intro-card .production-visuals {
    padding: 1rem;
  }

  .production-photo-stage .production-intro-card .production-visuals > .container,
  .production-photo-stage .machine-grid {
    grid-template-columns: 1fr;
  }

  .production-photo-stage .production-visual {
    min-height: 300px;
  }

  .production-photo-stage .machine-card,
  .production-photo-stage .machine-card.is-open {
    grid-column: auto;
  }

  .production-photo-stage .finishing-card {
    min-height: 0;
    padding: 0.85rem;
  }

  .production-photo-stage .finishing-card figure {
    min-height: 280px;
  }

  .production-photo-stage .finishing-copy {
    padding: 1rem;
  }

  .production-photo-stage .finishing-copy h2,
  .production-photo-stage .section--dark .section-head h2,
  .production-photo-stage #strojni-park .section-head h2 {
    font-size: clamp(2.35rem, calc(12 * var(--vwx)), 3.6rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

/* Home capability carousel */
.capability-carousel {
  position: relative;
  width: calc(100 * var(--vwx));
  margin-left: calc(50% - calc(50 * var(--vwx)));
  margin-top: 2rem;
}

.capability-carousel__controls {
  display: flex;
  justify-content: flex-end;
  gap: 0.65rem;
  padding-inline: 20px;
  margin-bottom: 1rem;
}

.capability-carousel__button {
  width: 52px;
  height: 52px;
  border: 1px solid rgba(5, 5, 5, 0.16);
  border-radius: 999px;
  background: #050505;
  color: white;
  cursor: pointer;
  display: grid;
  place-items: center;
  font-size: 1.45rem;
  line-height: 1;
  transition: background 0.2s ease, border-color 0.2s ease, opacity 0.2s ease, transform 0.2s ease;
}

.capability-carousel__button:hover:not(:disabled) {
  background: var(--red);
  border-color: var(--red);
  transform: translateY(-2px);
}

.capability-carousel__button:focus-visible {
  outline: 3px solid rgba(215, 25, 32, 0.28);
  outline-offset: 3px;
}

.capability-carousel__button:disabled {
  cursor: default;
  opacity: 0.28;
}

.capability-carousel .capability-matrix {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: clamp(586px, calc(52.91 * var(--vwx)), 672px);
  grid-template-columns: none;
  gap: 1.25rem;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  padding: 0.35rem 20px 1.15rem;
  scroll-padding-inline: 20px;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

.capability-carousel .capability-matrix.is-scrollbar-dragging {
  scroll-behavior: auto;
}

.capability-carousel .capability-matrix::-webkit-scrollbar {
  display: none;
}

.capability-carousel__scrollbar-hitbox {
  display: flex;
  align-items: center;
  height: 74px;
  margin: -20px 20px;
  touch-action: none;
}

.capability-carousel__scrollbar {
  width: 100%;
  height: 14px;
  overflow: hidden;
  background: rgba(5, 5, 5, 0.1);
  border-radius: 999px;
}

.capability-carousel__scrollbar span {
  display: block;
  height: 100%;
  background: rgba(215, 25, 32, 0.72);
  border-radius: 999px;
  transition: transform 0.08s linear;
}

.capability-carousel__scrollbar-hitbox.is-dragging span {
  transition: none;
}

.capability-carousel .capability-tile,
.capability-carousel .tile-large {
  grid-column: auto;
  min-height: 680px;
  max-height: 680px;
}

.capability-carousel .capability-tile__media,
.capability-carousel .tile-large .capability-tile__media {
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
}

.capability-carousel .capability-tile__body {
  flex: 0 0 auto;
  display: grid;
  grid-template-rows: auto 0fr;
  transition: grid-template-rows 0.35s ease;
}

.capability-carousel .capability-tile__body p {
  min-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: opacity 0.25s ease;
}

@media (min-width: 721px) {
  .capability-carousel .capability-tile:hover .capability-tile__body,
  .capability-carousel .capability-tile:focus-within .capability-tile__body {
    grid-template-rows: auto 1fr;
  }

  .capability-carousel .capability-tile:hover .capability-tile__body p,
  .capability-carousel .capability-tile:focus-within .capability-tile__body p {
    opacity: 1;
    transition: opacity 0.3s ease 0.05s;
  }
}

.capability-carousel .capability-tile__media--contain img {
  object-fit: cover;
  object-position: center;
  filter: none;
}

.capability-carousel .capability-tile:nth-child(1) .capability-tile__media img {
  object-position: center 42%;
}

.capability-carousel .capability-tile:nth-child(2) .capability-tile__media img {
  object-position: center 28%;
}

.capability-carousel .capability-tile:nth-child(3) .capability-tile__media img {
  object-position: center 46%;
}

.capability-carousel .capability-tile:nth-child(4) .capability-tile__media img {
  object-position: center 40%;
}

.capability-carousel .capability-tile:nth-child(5) .capability-tile__media img {
  object-position: center 48%;
}

.capability-carousel .capability-tile:nth-child(5) .capability-tile__body h3 {
  max-width: 15em;
  text-wrap: balance;
}

.capability-carousel .capability-tile:nth-child(5) .capability-title-line {
  display: inline;
  color: inherit;
  font: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  white-space: nowrap;
  text-transform: inherit;
}

.capability-carousel .capability-tile:nth-child(6) .capability-tile__media img {
  object-position: center 24%;
}

.capability-carousel .capability-tile:hover .capability-tile__media--contain img {
  transform: scale(1.055);
  filter: saturate(1.1) contrast(1.05);
}

@media (max-width: 720px) {
  .capability-carousel {
    margin-top: 1.5rem;
  }

  .home-video-stage .intro-band .section-head h2 {
    font-size: clamp(1.8rem, calc(9 * var(--vwx)), 2.6rem);
  }

  .capability-carousel__controls {
    padding-inline: 14px;
    margin-bottom: 0.7rem;
  }

  .capability-carousel__button {
    width: 46px;
    height: 46px;
  }

  .capability-carousel .capability-matrix {
    grid-auto-columns: min(calc(101.2 * var(--vwx)), 558px);
    gap: 0.85rem;
    padding-inline: 14px;
    scroll-padding-inline: 14px;
  }

  .capability-carousel__scrollbar-hitbox {
    margin-inline: 14px;
  }

  .capability-carousel .capability-tile,
  .capability-carousel .tile-large {
    min-height: 615px;
    max-height: 615px;
  }

  .capability-carousel .capability-tile__media,
  .capability-carousel .tile-large .capability-tile__media {
    height: auto;
  }
}

/* Careers page */

/* Reseda reference careers page */

.reference-application-form {
  display: grid;
  grid-template-columns: 459px 459px;
  gap: 40px;
  min-height: 477px;
  color: #565969;
  font-size: 16px;
  font-weight: 300;
  line-height: 26px;
}

.reference-application-form__column {
  display: flex;
  flex-direction: column;
}

.reference-application-form fieldset {
  margin: 0 0 4px;
  padding: 0;
  border: 0;
}

.reference-application-form legend {
  margin-bottom: 2px;
}

.reference-application-form__checks {
  display: flex;
  gap: 24px;
  margin-top: 19px;
}

.reference-application-form__checks label,
.reference-application-form__jobs label,
.reference-application-form__terms {
  display: block;
  color: #565969;
  font-size: 16px;
  font-weight: 300;
  line-height: 26px;
}

.reference-application-form__jobs {
  margin-top: 19px;
  padding-left: 22px;
}

.reference-application-form input:not([type="checkbox"]):not([type="file"]) {
  width: 100%;
  height: 45px;
  min-height: 45px;
  margin: 0 0 10px;
  padding: 15px 10px 10px;
  border: 0;
  border-bottom: 1px solid #000;
  border-radius: 0;
  background: #f6f6f6;
  color: #071b3a;
  font-size: 13px;
  letter-spacing: 0.12em;
}

.reference-application-form input::placeholder {
  color: #071b3a;
  opacity: 1;
}

.reference-application-form input[type="checkbox"] {
  width: 13px;
  min-height: 13px;
  margin: 0 4px 0 0;
}

.reference-application-form__file {
  display: block;
  margin-top: 8px;
  color: #565969;
  font-size: 16px;
  font-weight: 300;
}

.reference-application-form input[type="file"] {
  display: block;
  width: 100%;
  min-height: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
}

.reference-application-form__terms {
  margin: 39px 0 30px;
  padding-left: 22px;
}

.reference-application-form__terms a {
  color: #000;
  font-weight: 500;
}

.reference-application-form button {
  width: 116px;
  height: 48px;
  border: 0;
  background: #ee3e3c;
  color: #fff;
  font-size: 16px;
  cursor: pointer;
}

.reference-application-form .form-msg {
  margin-top: 10px;
}

@media (max-width: 720px) {

  .reference-application-form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    height: 851px;
    min-height: 851px;
    max-height: 851px;
    font-size: 14px;
    line-height: 26px;
  }

  .reference-application-form__checks label,
  .reference-application-form__jobs label,
  .reference-application-form__terms {
    font-size: 14px;
  }

  .reference-application-form__jobs,
  .reference-application-form__terms {
    padding-left: 18px;
  }

  .reference-application-form__file {
    font-size: 14px;
  }

  .reference-application-form__terms {
    margin: 38px 0 28px;
  }
}

/* ============================================================
   NAMIZNO MERILO (desktop scale)
   ------------------------------------------------------------
   Cilj: stran pri 100 % zoomu brskalnika izgleda natanko tako,
   kot je prej izgledala pri 80 % zoomu. Mobilna različica
   (<=768px) ostane nespremenjena.

   Deluje iz treh delov — VSI TRIJE MORAJO OSTATI USKLAJENI:

   1) `zoom` spodaj pomanjša celotno namizno postavitev.
   2) `--vwx` / `--vhx` / `--svhx`: `zoom` ne poveča enot `vw`/`vh`,
      zato so v styles/desktop-*.css vse take vrednosti zapisane kot
      `calc(N * var(--vwx))` oz. `calc(N * var(--vhx))` in se tu
      pomnožijo z 1/0.8 = 1.25. (Na mobilnem so 1vw/1vh/1svh, torej
      brez učinka.) NOVIH `vw`/`vh` v desktop-*.css ne piši
      neposredno — vedno prek teh spremenljivk.
   3) app/ui-scale.js: JS meritve (getBoundingClientRect,
      innerHeight) so v ZASLONSKIH px, CSS pa v postavitvenih —
      pri zoomu se razlikujeta za faktor 0.8. Zato gre vsak
      JS izračun, ki se zapiše nazaj v CSS (maske hero videa,
      pozicija menija), skozi `RESEDA_UI.toCss()`.

   SPREMEMBA MERILA: popravi številke spodaj (--ui-scale in
   --vwx/--vhx/--svhx = 1/--ui-scale) in nič drugega.
     0.8  = kot ročni zoom 80 %   (1.25vw / 1.25vh)
     0.9  = 90 %                  (1.1111vw / 1.1111vh)
     1    = izklop merila         (1vw / 1vh)

   ODSTRANITEV: pobriši to datoteko + <link> v index.html.
   `calc(N * var(--vhx))` zapisi in ui-scale.js so nevtralni,
   ko merilo ni definirano (--vhx pade na privzeti 1vh spodaj).
   ============================================================ */

:root {
  /* privzeto (mobilno + fallback): brez merila */
  --ui-scale: 1;
  --vwx: 1vw;
  --vhx: 1vh;
  --svhx: 1svh;
}

@media (min-width: 769px) {
  :root {
    --ui-scale: 0.8;
    --vwx: 1.25vw;
    --vhx: 1.25vh;
    --svhx: 1.25svh;
  }

  html {
    zoom: var(--ui-scale);
  }
}

/* =========================================================================
   MOBILNA ODZIVNOST (<= 768px) — dodano na konec datoteke.
   Namizni videz (> 768px) ostane popolnoma nespremenjen: vsa pravila
   veljajo izkljucno znotraj media poizvedb spodaj.
   ========================================================================= */

/* ---------- SKLOP 1: NAVIGACIJA ---------- */
@media (max-width: 768px) {
  body {
    padding-top: 0;
  }

  /* Glava je vedno temna (ne le v dark modu telefona) - logotip je zato
     vedno bela/prosojna razlicica (Prozornilogo_beli.png, glej .brand img spodaj). */
  .site-header {
    position: relative;
    top: auto;
    background: #0c0f12;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    transition: none;
  }

  .site-header.is-hidden {
    transform: none;
  }

  /* Ob odprtem meniju glava ostane polna (temna) - da skozi prosojno glavo ne
     prosevaja rozkasto telesno ozadje. Dvignemo jo tudi nad menijski panel,
     da Povprasevanje-gumb ostane nad belim dnom. */
  body.menu-open .site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    transform: none;
    background: #0c0f12;
    z-index: 100;
  }

  .menu-open .site-header::before {
    content: none;
  }

  .nav {
    min-height: 64px;
    padding-inline: 12px;
  }

  body.menu-open .nav {
    min-height: 64px;
  }

  /* Logotip: vedno viden, na sredini vrstice (tudi na domu in ob odprtem meniju) */
  .brand,
  body.route-home .brand {
    display: flex;
    opacity: 1;
    pointer-events: auto;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 132px;
    z-index: 2;
  }

  body.menu-open .brand {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, -50%);
  }

  .brand img {
    width: 132px;
    height: auto;
    /* Glava je vedno temna, zato je logotip vedno bela/prosojna razlicica. */
    content: url("/assets/Prozornilogo_beli.png");
  }

  /* Fiksni logotip domace strani se umakne (logo je zdaj v vrstici) */
  .home-pinned-logo {
    display: none;
  }

  /* Hamburger ostane pripet na zaslon, medtem ko se crni pas glave odpelje
     z dokumentom. Ikona je brez napisa, s tarco >= 48px. */
  .menu-toggle {
    position: fixed;
    top: 8px;
    right: 8px;
    left: auto;
    transform: none;
    color: #ffffff;
    text-shadow: none;
    padding: 0.7rem 0.7rem;
    gap: 0;
    min-width: 48px;
    min-height: 48px;
    justify-content: center;
    z-index: 5;
  }

  body.menu-open .menu-toggle {
    transform: none;
    color: #ffffff;
  }

  .menu-toggle__label {
    display: none;
  }

  .menu-toggle__icon {
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.95)) drop-shadow(0 2px 7px rgba(0, 0, 0, 0.9));
  }

  /* Povprasevanje: skrito v vrstici, ob odprtem meniju fiksen CTA na dnu */
  .menu-inquiry,
  body.route-home .menu-inquiry {
    display: none;
  }

  body.menu-open .menu-inquiry {
    display: inline-flex;
    position: fixed;
    /* Skupaj 19 % manjsi CTA (se dodatnih 10 %), brez spremembe pisave. */
    left: calc(9.5% + 11.34px);
    right: calc(9.5% + 11.34px);
    top: auto;
    bottom: calc(14px + env(safe-area-inset-bottom, 0px));
    min-height: 42.12px;
    z-index: 96;
  }

  /* EN/DE imata bolj specificno namizno pravilo za CTA; na telefonu morata
     zato izrecno prevzeti enako visino kot slovenska razlicica. */
  body:is(.language-en, .language-de).menu-open .menu-inquiry {
    min-height: 42.12px;
  }

  /* Odprt meni: celozaslonski bel panel pod vrstico */
  .main-nav {
    inset: 64px 0 auto 0;
    max-height: none;
  }

  body.menu-open .main-nav {
    display: grid;
    align-items: start;
    align-content: start;
    gap: 2px;
    position: fixed;
    inset: 64px 0 0 0;
    max-height: none;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 10px 14px calc(135px + env(safe-area-inset-bottom, 0px));
    background: #ffffff;
  }

  .main-nav > a,
  .nav-group > a,
  body:is(.language-en, .language-de) .main-nav > a,
  body:is(.language-en, .language-de) .nav-group > a {
    min-height: 48px;
    justify-content: flex-start;
    text-align: left;
    padding: 0.66rem 0.8rem;
  }

  .nav-group {
    display: grid;
    position: relative;
  }

  .nav-group::after {
    display: none;
  }

  /* Gumb za preklop podmenija "O podjetju" (na namizju skrit - glej spodaj) */
  .nav-group__toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    right: 0;
    width: 56px;
    height: 48px;
    padding: 0;
    background: transparent;
    border: 0;
    cursor: pointer;
    z-index: 4;
  }

  .nav-group__toggle::before {
    content: "";
    width: 11px;
    height: 11px;
    border-right: 2px solid #202020;
    border-bottom: 2px solid #202020;
    transform: rotate(45deg) translateY(-3px);
    transition: transform 0.25s ease;
  }

  .nav-group.is-expanded .nav-group__toggle::before {
    transform: rotate(-135deg) translateY(-3px);
  }

  /* Podmeni: privzeto zaprt, odpre se z gumbom (dotik nima hovra) */
  .dropdown,
  .nav-group:hover .dropdown,
  .nav-group:focus-within .dropdown,
  body:is(.language-en, .language-de) .dropdown {
    position: static;
    max-height: 0;
    min-width: 0;
    opacity: 1;
    overflow: hidden;
    pointer-events: auto;
    transform: none;
    transition: max-height 0.28s ease;
    border-color: transparent;
    box-shadow: none;
    margin: 0 0 0 0.9rem;
    padding: 0;
    border-left: 2px solid transparent;
    border-radius: 0;
  }

  .nav-group.is-expanded .dropdown {
    max-height: 460px;
    margin-bottom: 0.3rem;
    padding-bottom: 0.3rem;
    border-left-color: rgba(215, 25, 32, 0.25);
  }

  .dropdown a,
  body:is(.language-en, .language-de) .dropdown a {
    font-size: 1.02rem;
    min-height: 44px;
    display: flex;
    align-items: center;
    padding: 0.55rem 0.8rem;
  }

  /* Na dotik ni pravega hovra - brez tega ostane rdece/roznato ozadje
     "zalepljeno" na nazadnje tapnjeni povezavi (desktop-1.css .dropdown a:hover). */
  .dropdown a:hover {
    background: transparent;
    color: #202020;
  }

  /* Jezik: velike tarce v vrstici nad CTA gumbom */
  body.menu-open .menu-language {
    position: fixed;
    left: 14px;
    right: 14px;
    top: auto;
    bottom: calc(68.12px + env(safe-area-inset-bottom, 0px));
    justify-content: center;
    gap: 0.4455rem;
    min-height: 0;
    padding: 0;
    z-index: 96;
  }

  body.menu-open .menu-language span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48.6px;
    min-height: 35.64px;
    padding: 0.405rem 0.81rem;
    /* Enaka velikost pisave kot navigacijske povezave (npr. "O podjetju") */
    font-size: 1.26rem;
    font-weight: 800;
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: 999px;
  }

  body.menu-open .menu-language span:not(:last-child)::after {
    content: none;
  }

  body.menu-open .menu-language span.active {
    border-color: var(--red);
    background: rgba(215, 25, 32, 0.08);
  }
}

/* ---------- SKLOP 2: POSTAVITEV STRANI ---------- */
/* Privzeto (brez media queryja - velja tudi za namizno) skrij mobilno
   razlicico opisa Proizvodnje. router.js pri EN/DE staticnih straneh
   odstrani vse inline style="" atribute, zato skrivanje z inline stilom
   ne deluje - mora biti razred v CSS. Namizna razlicica (.production-summary__desktop)
   ostane privzeto vidna (navadna vsebina, brez potrebe po pravilu). */
.production-summary__mobile {
  display: none;
}

/* Enako kot zgoraj: mobilna dvo-vrsticna scroll razlicica strojnega parka
   je privzeto (namizno) skrita, namizna mreza (.machine-grid--desktop)
   ostane privzeto vidna. */
.machine-carousel-rows--mobile {
  display: none;
}

@media (max-width: 768px) {
  /* --- DOMACA STRAN: staticen tok namesto scroll-kompozicije --- */
  .home-video-stage::before {
    content: none;
  }

  /* Enotna visina hero-obmocja: 25% visja od prvotne osnove (64svh/400px),
     video (object-fit: cover) se zato sorazmerno bolj obreze v sirino - brez
     transform:scale, ki je samo umetno povecal ze cover-fitani izrez. */
  .home-video-stage {
    --m-hero-h: max(80svh, 500px);
  }

  .home-video-stage__bg {
    position: relative;
    /* Nad fiksnim opisom (z5): ce JS-maska opisa za frame zaostane, neprosojen
       video pas prekrije besedilo, ki bi sicer za hip pokukalo cez zgornji rob. */
    z-index: 6;
    height: var(--m-hero-h);
    min-height: 0;
    margin-bottom: 0;
  }

  /* Naslov in rdeci trak prekrivata video (kot na namizju), poravnano na dno */
  .home-video-stage__headline {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    /* Preglasi starejse "width: min(100% - 28px, var(--max))" pravilo (velja
       za 721-1060px pas), da element resnicno sega od roba do roba (0-768px). */
    width: 100%;
    height: var(--m-hero-h);
    z-index: 8;
    display: grid;
    align-content: end;
    justify-items: center;
    padding: 0 12px 1.2rem;
    /* Naslov in trak zmogljivosti se premakneta kot en sklop. */
    transform: translateY(-5px);
    /* +25% od prejsnje velikosti (1.68/8.6/2.75 * 1.25) */
    font-size: clamp(2.1rem, 10.75vw, 3.44rem);
    letter-spacing: 0.09em;
  }

  .home-video-stage__headline > span {
    transform: none;
  }

  .home-video-stage__headline span {
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.55);
  }

  /* Naslovne vrstice (JS jih razdeli na 3 vrstice - glej applyMobileHeadlineSplit
     v app.js): rahlo dvignjene od rdecega traku, da naslov ni prilepljen nanj.
     Izvirna 2 span-a (za prevode) na mobilnem skrijemo, saj ju nadomesti ta blok. */
  .m-headline-lines {
    text-align: center;
    margin-bottom: clamp(0.9rem, 4vw, 1.5rem);
    /* Zadnji premik je bil +1.08em dol (iz -0.17em na 0.91em). Zdaj gor za
       polovico tega premika (0.54em): 0.91 - 0.54 = 0.37em. */
    transform: translateY(0.37em);
  }

  body.language-en .m-headline-lines {
    justify-self: center;
    width: max-content;
    max-width: 100%;
    font-size: 95%;
    letter-spacing: 0.052em;
    word-spacing: -0.14em;
  }

  .home-video-stage__headline > span.m-headline-original {
    display: none;
  }

  /* Rdeci trak: viden samo del, drsi levo-desno (kot na namizju) */
  /* Rdeci trak: raztegnjen cez celotno sirino zaslona (izniceno odmik starsa
     .home-video-stage__headline, ki ima padding: 0 12px). Prvotno dvignjen za
     pol lastne visine (-50%), nato dvakrat dol za cetrtino (-25%, nato 0%). */
  .home-capability-pill {
    width: calc(100% + 24px);
    min-width: 0;
    max-width: none;
    margin-top: 0.95rem;
    margin-inline: -12px;
    flex-wrap: nowrap;
    justify-content: flex-start;
    gap: clamp(1rem, 4vw, 1.9rem);
    padding: 0.7rem 20px;
    border-radius: 0;
    white-space: nowrap;
    transform: translateY(0%);
    font-size: 0.92rem;
    line-height: 1;
    overflow-x: auto;
  }

  .home-video-stage__spacer {
    display: none;
  }

  /* Crn rob direktno pod videom - v normalnem toku takoj za
     .home-video-stage__bg, zato se premika skupaj z videom med drsenjem
     (ni fiksiran/lepljiv kot opis spodaj). */
  .home-video-stage__mobile-edge {
    position: relative;
    z-index: 6;
    display: block;
    /* Crni rob neposredno pod zgornjim uvodnim videoposnetkom. */
    height: 50px;
    background: #050505;
  }

  /* Mobilna razlicica opisa: enako obnasanje kot na namizju - besedilo je
     fiksno in centrirano na sredini zaslona, med drsenjem se odkrije pod
     videom in nato (ko se dvigne statistika) zakrije. Stoji samo na crnem
     ozadju. Odkrivanje/zakrivanje vodi JS (syncHomeFutureContentMask,
     mobilna veja) prek spremenljivk --future-mask-*. */
  .home-future-content {
    position: relative;
    min-height: 145svh;
    clip-path: none;
    overflow: visible;
    background: #050505;
    padding: 0;
  }

  .home-future-content__inner {
    position: fixed;
    inset: 0;
    z-index: 5;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100svh;
    min-height: 100svh;
    /* Opis razporejen po celotni sirini strani (privzeto polna sirina, le rahel
       zracni rob 14px na vsako stran). --future-black-width je se vedno na voljo,
       ce bi opis kdaj zeleli ozji (npr. nastavi na 504px). */
    width: min(100% - 28px, var(--future-black-width, 100%));
    margin-inline: auto;
    padding-block: 0;
    padding-inline: 0;
    clip-path: inset(var(--future-mask-top, 100svh) 0 var(--future-mask-bottom, 0px) 0);
    visibility: var(--future-mask-visibility, hidden);
    pointer-events: none;
    will-change: clip-path;
  }

  .home-future-content__inner p {
    font-size: 1.35rem;
    line-height: 1.5;
    letter-spacing: -0.02em;
    /* Prej text-align:justify - na vrsticah z malo besedami je to razteg-
       nilo presledke med njimi cez mero. text-wrap:balance obdrzi normalne
       presledke (brez raztezanja) in samo izbere lepse, bolj enakomerne
       prelome vrstic - sirino izkoristi kolikor gre naravno, brez trganja
       besedila. Velja enako za vse tri jezike (SL/EN/DE), isti element. */
    text-align: center;
    text-wrap: balance;
    pointer-events: auto;
  }

  .home-future-edge,
  .home-future-bottom-bar {
    display: none;
  }

  /* Statistika: popolnoma enaka grafika kot na namizju (levo poravnano besedilo,
     rdeca crta ob levem robu polne sirine stolpca, prosojno ozadje z zamegljitvijo
     - vse podedovano iz osnovnega/namiznega pravila zgoraj v datoteki). Edino, kar
     mobilno prilagodimo, je stevilo stolpcev (2 namesto 5, ker je zaslon ozek). */
  /* Stolpci se prilagodijo vsebini (ne raztegnejo cez celo sirino), celoten
     sklop pa je centriran kot ena enota - brez mrtvega prostora na desni. */
  .home-future-stats {
    transform: none;
    /* Lasten (stabilen) kompozitorski sloj: brez tega lahko fiksni opis pod
       njo (position:fixed + will-change:clip-path) med hitrim drsenjem za
       trenutek zaslika CEZ statistiko, kljub nizjemu z-index-u (znan pojav
       pri fiksnih/animiranih elementih na mobilnih brskalnikih) - viden kot
       rob na zgornjem robu crnega ozadja statistike. */
    isolation: isolate;
    grid-template-columns: repeat(2, max-content);
    column-gap: clamp(3.5rem, 16vw, 6.5rem);
    justify-content: center;
    /* En sam poln crn pravokotnik cez celo sirino: brez margin (prosojnih rez,
       skozi katere je kukala pripeta plast pod statistiko) - razmiki so padding,
       ki ga crno ozadje pokrije. Vsebina (besedilo + rdece crte) ostane
       centrirana prek justify-content. */
    width: 100%;
    max-width: none;
    margin: 0;
    /* Enaka zgornji in spodnji rob ohranita statistiko navpicno na sredini;
       po zadnjih popravkih je celoten blok skupno nizji za 160px. */
    padding: 2.1rem 14px;
    /* Namizna prosojna+zamegljena razlicica (glej opombo zgoraj) je na mobilnem
       povzrocala vidno "zamikanje" robov, ker je backdrop-filter v realnem casu
       vzorcil karirasto/crno ozadje, ki drsi pod njo. Zato je tu polna, neprosojna
       crna ploskev - en sam miren pravokotnik, na katerem stoji besedilo in crte. */
    background: #050505;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  /* Mobilna domaca stran: samo 4 kljucni podatki (brez "certifikatov"),
     cista mreza 2x2 - stevilo certifikatov ostaja prikazano na desktopu. */
  .home-future-stats div:nth-child(3) {
    display: none;
  }

  .home-future-stats strong {
    font-size: clamp(2.3rem, 10vw, 3rem);
  }

  .home-future-stats span {
    font-size: 0.82rem;
  }

  /* "Podrocja v podjetju" na mobilnem: pripenjanje brez JS-maske. Prejsnja
     izvedba (position:fixed + clip-path, ki ga je na scroll popravljal JS) je
     zaostajala za drsenjem - brskalnik premakne vsebino, JS pa rob maske
     popravi sele naslednji frame, zato se je ob statistiki pojavljal in izginjal
     dodaten rob. Zdaj: position:sticky (rob vodi brskalnikov kompozitor,
     pixel-perfektno). Negativni odmik sledi pripne pod statistiko, da jo ta
     med drsenjem postopoma odkrije; sekcija Certifikati jo z enakim zamikom
     nato prekrije.
     - --capabilities-track-height: dolzina sledi (dlje = daljse mirovanje)
     - --capabilities-bg-inset: ozanje karirastega ozadja od robov
     - --capabilities-dim: zatemnitev karirastega ozadja (0-1) */
  .home-video-stage > .intro-band {
    margin-top: -100svh;
    height: var(--capabilities-track-height, 337.5svh);
    overflow-anchor: none;
  }

  .home-video-stage > .intro-band > .home-capabilities-layer {
    position: sticky;
    top: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    width: 100%;
    height: 100svh;
    clip-path: none;
    visibility: visible;
    will-change: auto;
  }

  /* Karirasto ozadje sega 20svh cez spodnji rob plasti: 100svh je na telefonu
     (skrita URL vrstica) oz. v predogledu lahko nizji od dejanskega vidnega
     polja, bleed pokrije to razliko, da med pripetostjo na dnu ni crnega traku.
     Prelitje je vedno skrito za neprosojnimi sekcijami (statistika/certifikati). */
  .home-video-stage > .intro-band > .home-capabilities-layer::before {
    inset: 0 var(--capabilities-bg-inset, 0px) -20svh;
  }

  .home-video-stage > .intro-band > .home-capabilities-layer::after {
    content: "";
    position: absolute;
    inset: 0 var(--capabilities-bg-inset, 0px) -20svh;
    z-index: -1;
    pointer-events: none;
    background: rgba(0, 0, 0, var(--capabilities-dim, 0));
  }

  .home-video-stage > .intro-band > .home-capabilities-bottom-edge {
    display: none;
  }

  .home-video-stage > .section {
    padding-block: 2.8rem;
  }

  /* Prekrije pripeto plast "Podrocja v podjetju" na mestu: negativni zamik
     cez zadnjih 100svh drsne sledi (glej .home-cert-section spodaj), neprosojno
     crno ozadje in visji z-index od pripete plasti (z1). Trenutek, ko plast
     neha biti pripeta, sovpada s trenutkom, ko certifikati popolnoma prekrijejo
     zaslon - brez preskoka. Selektor z visjo specificnostjo, da preglasi
     osnovno pravilo ".home-video-stage > .section { z-index: 1 }". */
  .home-video-stage > .section.home-cert-section {
    z-index: 2;
  }

  .home-cert-section {
    position: relative;
    margin-top: -100svh;
    background: #050505;
    padding-top: 2.8rem;
    padding-bottom: 2.8rem;
    /* Vidna razdalja do naslednje sekcije (Spoznaj podjetje) - padding sam
       ne ustvari razmika med sosednjima sekcijama, potreben je margin.
       Skupna razdalja je bila izenacena z razdaljo med "Spoznaj podjetje"
       in "Postanite del ekipe" (16.38rem), nato zmanjsana za 12%:
       16.38rem * 0.88 = 14.4144rem skupaj. Potreben margin = 14.4144rem -
       2.8rem - 2.8rem = 8.8144rem. */
    margin-bottom: 8.8144rem;
  }

  .home-cert-section + .section--dark {
    padding-top: 2.8rem;
  }

  /* Domov: karierni poziv po video sklopu ima 50 px zgornjega roba. */
  body.route-home .home-video-stage + .section--dark {
    padding-top: 50px;
  }

  .careers-cta .section-head {
    margin-top: 0;
  }

  .home-video-stage .intro-band .section-head h2 {
    white-space: normal;
    font-size: clamp(1.9rem, 8vw, 2.7rem);
    letter-spacing: 0;
  }

  body.language-de .home-video-stage .intro-band .section-head {
    left: calc(50% + 7.5px);
    width: 100vw;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    transform: translateX(-50%);
    text-align: center;
  }

  body.language-de .home-video-stage .intro-band .section-head h2 {
    position: static;
    justify-self: center;
    width: 100%;
    max-width: 100%;
    padding-inline: 0.25rem;
    transform: none;
    text-align: center;
    white-space: nowrap;
  }

  body.language-de .home-video-stage .intro-band .section-head h2 {
    font-size: clamp(1.85rem, 8vw, 2.7rem);
  }

  /* Kartice zmogljivosti: horizontalni carousel (glej SKLOP 2c) */
  .capability-tile,
  .tile-large {
    min-height: 360px;
  }

  /* Puscice skrijemo, drsni trak (scrollbar) pustimo za oprijem */
  .capability-carousel__controls {
    display: none;
  }

  /* --- O PODJETJU --- */
  .about-intro__grid,
  .about-story__grid,
  .about-story__grid--reverse,
  .about-story__grid--media-left,
  .about-story__grid--media-right,
  .about-story__grid--square,
  .about-story__grid--wide {
    grid-template-columns: 1fr;
    width: min(100% - 28px, 640px);
  }

  .about-story__grid {
    --about-story-media-height: auto;
    --about-story-media-width: 100%;
  }

  .about-industries__grid {
    transform: none;
    min-height: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.6rem;
  }

  /* --- PROIZVODNJA --- */
  /* Namizno besedilo/slike se na mobilnem skrijejo, nadomesti jih
     mobilna razlicica (glej spodaj) - namizna verzija ostane nespremenjena. */
  .production-summary__desktop,
  .production-visual--mobile-hide {
    display: none;
  }

  .production-summary__mobile {
    display: block;
  }

  /* Vsi opisi na Proizvodnji merijo sirino glede na celotno stran, ne glede
     na razlicne notranje robove posameznih kartic. */
  .production-photo-stage {
    container-type: inline-size;
  }

  /* Opis je v sredini rdecega bloka, besedilo pa ostane levo poravnano. */
  .production-intro-card .production-summary .production-summary__mobile {
    width: calc(90cqi - 0.9rem);
    max-width: none;
    margin-inline: auto;
    text-align: left;
  }

  /* Rdec opisni pas sega cez vso sirino zaslona. */
  .production-intro-card .production-summary .container {
    width: 100%;
    padding-inline: 0.5rem;
  }

  .production-visuals__grid,
  /* preglasi desktop-5.css .production-photo-stage .production-intro-card
     .production-visuals > .container (isti element, 1fr pri <=720px) */
  .production-photo-stage .production-intro-card .production-visuals > .container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
  }

  /* --- SPONZORSTVO --- */
  .sponsorship-feature,
  .sponsorship-feature--footgolf {
    grid-template-columns: 1fr;
  }

  .sponsorship-culture__items {
    grid-template-columns: 1fr;
  }

  .sponsorship-culture__nowrap,
  .sponsorship-culture__line {
    display: inline;
    white-space: normal;
  }

  .sponsorship-culture__intro span {
    display: inline;
  }

  /* --- LOGOTIP --- */
  .logo-origin__grid,
  .logo-meaning__grid,
  .logo-download__grid {
    grid-template-columns: 1fr;
  }

  .logo-meaning__visuals img,
  .logo-origin__image img,
  .logo-download__image img {
    max-width: min(100%, 320px);
    height: auto;
    margin-inline: auto;
  }

  .logo-download__image img {
    position: relative;
    top: 7px;
  }
}

@media (min-width: 600px) and (max-width: 768px) {
  .home-future-stats {
    grid-template-columns: repeat(4, max-content);
    column-gap: clamp(0.875rem, 4vw, 1.625rem);
  }
}

/* ---------- SKLOP 2b: preostali prelivi (o-podjetju, sponzorstvo) ---------- */
@media (max-width: 768px) {
  /* Fotografije: aspect-ratio + min-height sili sirino cez rob */
  .about-photo,
  .about-story__media {
    min-height: 0;
    width: 100%;
  }

  .about-photo--wide {
    aspect-ratio: 3 / 2;
  }

  /* Sponzorstvo: desktop premiki, raztegi in nowrap izklopljeni */
  .sponsorship-note {
    transform: none;
    white-space: normal;
  }

  .sponsorship-culture {
    transform: none;
  }

  .sponsorship-culture::before {
    inset: -30px auto -50px 50%;
    width: 100vw;
  }

  .sponsorship-culture__item:nth-child(2) {
    transform: none;
  }

  .sponsorship-culture__media {
    margin: 1rem 0 1.5rem;
    max-width: 100%;
  }

  .sponsorship-culture__media img {
    transform: none;
  }

  .sponsorship-culture__item:first-child > p,
  .sponsorship-culture__item:nth-child(2) > p {
    width: 100%;
  }

  .sponsorship-culture__note {
    transform: none;
    width: 100%;
  }

  .sponsorship-culture__intro span:first-child {
    white-space: normal;
  }

  .sponsorship-feature__media {
    min-height: 0;
  }

  .sponsorship-feature__media--video {
    width: 100%;
    justify-self: stretch;
  }

  .sponsorship-feature__media--footgolf img {
    width: 100%;
  }
}

/* ---------- SKLOP 2c: karusel zmogljivosti -> horizontalni slide (kot namizje) ---------- */
@media (max-width: 768px) {
  /* Brez scroll-snap: prosto drsenje/vlecenje na katerokoli vmesno lego,
     ne samo med kartico do kartice. */
  .capability-carousel .capability-matrix {
    grid-auto-flow: column;
    /* Okvir slike je 10 % sirsi; spodnji tekstovni del podeduje isto sirino. */
    grid-auto-columns: 90.2vw;
    grid-template-columns: none;
    gap: 0.8rem;
    overflow-x: auto;
    padding: 0.3rem 14px 0.9rem;
    scroll-padding-inline: 14px;
  }

  .capability-carousel .capability-tile,
  .capability-carousel .tile-large {
    min-height: 360px;
    max-height: none;
  }

  .capability-carousel .capability-tile__body {
    flex: 0 0 76.5px;
    height: 76.5px;
    padding-block: 0;
    align-content: center;
  }

  .capability-carousel .capability-tile:nth-child(5) .capability-tile__media {
    flex: 0 0 calc(100% - 76.5px);
    height: calc(100% - 76.5px);
  }

  .capability-carousel .capability-tile:nth-child(5) .capability-tile__body {
    flex: 0 0 76.5px;
    height: 76.5px;
    padding-block: 0;
    align-content: center;
  }

  .capability-carousel .capability-tile:nth-child(5) .capability-tile__body h3 {
    margin-block: 0;
  }

  @media (max-width: 360px) {
    .capability-carousel .capability-tile:nth-child(5) .capability-title-line {
      display: block;
    }
  }
}

/* ---------- SKLOP 3: TIPOGRAFIJA ---------- */
@media (max-width: 768px) {
  /* Nic pod 16px za berljivo besedilo */
  .breadcrumbs,
  .breadcrumbs a {
    font-size: 1rem;
  }

  .machine-card em {
    font-size: 0.765rem;
  }

  /* Naslov kartice +15% (izvirni desktop-5.css .production-photo-stage
     .machine-card h3: clamp(1.35rem, 2.4vw, 2.35rem) - visja specificnost
     preglasi desktop-3.css .machine-card h3) */
  .machine-card h3,
  .production-photo-stage .machine-card h3 {
    font-size: clamp(1.5525rem, 2.76vw, 2.7025rem);
  }

  /* Strojni park: namizna mreza skrita, nadomesti jo dvo-vrsticni vodoravni
     scroll (glej .machine-carousel-rows--mobile spodaj) - vec prostora na
     kartico, zato so lahko vecje kot v prejsnji 2-stolpcni mrezi. */
  .machine-grid--desktop {
    display: none;
  }

  /* Razdalja med razdelki (Proizvodnja/Strojni park/Dodelave/Meritve/Montaza):
     2x osnovna vrednost (clamp(5rem, 18vw, 7.5rem)), nato se dodatnih +25%
     (skupaj 2.5x osnove). */
  .production-photo-stage {
    --production-block-gap: clamp(12.5rem, 45vw, 18.75rem);
  }

  /* Panel #strojni-park > .container ima overflow:hidden (zaokrozeni robovi) -
     ga sprostimo, da lahko crn trak spodaj sega cez celotno sirino strani. */
  .production-photo-stage #strojni-park > .container {
    overflow: visible;
  }

  /* Namesto "kartice" z robom/oblino/senco naj ostane samo ozadje (pikcasti
     vzorec + rdec zareznjen trak), raztegnjeno cez celotno sirino zaslona. */
  .production-photo-stage #strojni-park > .container {
    width: 100%;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .machine-carousel-rows--mobile {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    /* crn trak cez celotno sirino strani (izven odmika panela) */
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-top: -20px;
    background: #000;
    padding: 1rem 0;
  }

  /* .capability-carousel prinese "full-bleed" sirino (100vw + negativen
     margin) za domaco stran - tu jo izniceno, ostane znotraj panela
     #strojni-park. Specificnost 2 razredov, ker mobile-4.css .capability-carousel
     (width: calc(100% + 76px)) nalozi za mobile-3.css. */
  .machine-carousel-rows--mobile .machine-carousel {
    position: static;
    width: auto;
    max-width: none;
    margin: 0;
  }

  .machine-carousel__track {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    padding: 0.2rem 0.9rem 0.4rem;
  }

  .machine-carousel__track::-webkit-scrollbar {
    display: none;
  }

  /* Med vlecenjem scrollbara (JS doda .is-scrollbar-dragging) izklopi
     scroll-behavior:smooth, sicer trak "zamuja" za prstom namesto 1:1 sledenja */
  .machine-carousel__track.is-scrollbar-dragging {
    scroll-behavior: auto;
  }

  /* Manjsi notranji odmik #strojni-park kartice - vec prostora za scroll vrstice
     (preglasi desktop-5.css .production-photo-stage #strojni-park > .container,
     padding: clamp(2rem, 4vw, 3.4rem)) */
  .production-photo-stage #strojni-park > .container {
    padding: 1.4rem 0;
  }

  /* Par (zgoraj/spodaj) je element scroll vrstice - dve kartici druga nad drugo */
  .machine-carousel__pair {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
    flex: 0 0 auto;
    width: 210px;
  }

  .machine-carousel .machine-card,
  .production-photo-stage .machine-carousel .machine-card {
    width: 100%;
    height: 127.5px;
    min-height: 127.5px;
    padding: 1.1rem 1rem 1rem 1.2rem;
    /* namesto space-between (ki razmik med naslovom in "ODPRI OPIS"
       raztegne cez celotno visino) - majhen fiksen razmik */
    justify-content: flex-start;
  }

  .machine-carousel .machine-card.is-open,
  .production-photo-stage .machine-carousel .machine-card.is-open {
    height: auto;
    min-height: 270px;
  }

  /* Odprt kvadrat je 25% sirsi - razsiri celoten par (stolpec), da se
     obe kartici v paru ujemata po sirini. */
  .machine-carousel__pair:has(.machine-card.is-open) {
    width: 262.5px;
  }

  /* Kvadrat naj ob odpiranju/zapiranju ostane vizualno enak zacetnemu
     stanju - brez spremembe barve obrobe, ozadja, sence ali dviga
     (preglasi desktop-5.css .production-photo-stage .machine-card:hover/
     :focus-visible/.is-open in .machine-card.is-open em). */
  .machine-carousel .machine-card,
  .machine-carousel .machine-card:hover,
  .machine-carousel .machine-card:focus-visible,
  .machine-carousel .machine-card.is-open {
    border-color: rgba(103, 201, 255, 0.32);
    transform: none;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.34);
    background:
      linear-gradient(rgba(3, 19, 33, 0.055) 1px, transparent 1px),
      linear-gradient(90deg, rgba(3, 19, 33, 0.055) 1px, transparent 1px),
      linear-gradient(145deg, rgba(255, 255, 255, 0.98), rgba(232, 244, 255, 0.96));
    background-size: 34px 34px, 34px 34px, auto;
  }

  .machine-carousel .machine-card em,
  .machine-carousel .machine-card.is-open em {
    color: #09233f;
  }

  .machine-card h3 {
    /* desktop-3.css: margin: auto 0 0 - auto-top potisne naslov navzdol
       ne glede na justify-content, zato ga tu izklopimo */
    margin-top: 0;
  }

  .machine-card em {
    margin-top: 0.5rem;
  }

  /* Zaprt opis (grid-template-rows:0fr) pusti ~16px preostale visine, kar
     je pri space-between neopazno, pri flex-start pa poveca razmik med
     naslovom in "ODPRI OPIS" - zato ga na mobilnem popolnoma skrijemo */
  .machine-card:not(.is-open) .machine-card__details {
    display: none;
  }

  /* Rdeca crta tanjsa in blizje napisu (kot na verziji za racunalnik),
     ne na robu kartice - desktop-3.css: inset: 1rem auto 1rem 0.85rem; width: 4px */
  .machine-card::before {
    left: 0.85rem;
    width: 2px;
  }

  /* Umirjeni naslovi sekcij na telefonu */
  .section-head h2 {
    font-size: clamp(1.8rem, 7.4vw, 2.5rem);
  }

  /* Strojni park: naslov centriran, opis ostane na sredini bloka a besedilo
     znotraj levo poravnano. */
  #strojni-park .section-head {
    text-align: center;
    margin-inline: auto;
  }

  /* "width: fit-content" se ob dolgem besedilu (ki se lomi v vec vrstic)
     izracuna enako kot polna razpolozljiva sirina (fit-content = min(max-content,
     available), max-content je tu vedno vecji od available), zato "margin: auto"
     ni imel dejanskega prostora za sredinjenje - namesto tega ozji max-width. */
  .production-photo-stage #strojni-park .section-head p {
    width: calc(90cqi - 0.9rem);
    max-width: none;
    margin-inline: auto;
    text-align: left;
  }

  .finishing-card h2 {
    font-size: clamp(1.8rem, 7.8vw, 2.6rem);
  }

  /* Nemski "Nachbehandlungen" na mobilnem: preglasi desktop-5.css
     .language-de ... .finishing-copy h2 { white-space: nowrap }, ki na ozkem
     zaslonu povzroci prelivanje cez rob kartice (naslov + opis + kvadrati). */
  .language-de .production-photo-stage .finishing-panel .finishing-card:first-child .finishing-copy h2 {
    white-space: normal;
  }

  /* Dodelave: cinkanje+niklanje, kemicno niklanje+eloksiranje, kaljenje+zarjenje
     v parih po dva kvadrata v vrstici (pisava ostane enake velikosti, sme segati
     cez rob kvadrata); preostala dva (karbonitriranje, druge obdelave) ostaneta
     vsak v svoji vrstici. */
  #dodelave .finishing-card:first-child .service-rows {
    grid-template-columns: 1fr 1fr;
  }

  #dodelave .finishing-card:first-child .service-rows > div:nth-child(7),
  #dodelave .finishing-card:first-child .service-rows > div:nth-child(8) {
    grid-column: 1 / -1;
  }

  /* Angleska verzija: vrstni red prevodov je drugacen (zinc plating, nickel
     plating, chemical nickel plating, anodizing, carbonitriding, tempering,
     annealing, other surface and thermal treatments), zato druga razporeditev
     parov SAMO za EN: (1,2) par, (3) sam, (4,5) par, (6,7) par, (8) sam. */
  body.language-en #dodelave .finishing-card:first-child .service-rows {
    grid-template-columns: repeat(10, 1fr);
  }

  body.language-en #dodelave .finishing-card:first-child .service-rows > div:nth-child(1),
  body.language-en #dodelave .finishing-card:first-child .service-rows > div:nth-child(2) {
    grid-column: span 5;
  }

  body.language-en #dodelave .finishing-card:first-child .service-rows > div:nth-child(3) {
    grid-column: 1 / -1;
  }

  /* Anodizing ozji, carbonitriding sirsi kvadrat, da napis ostane znotraj. */
  body.language-en #dodelave .finishing-card:first-child .service-rows > div:nth-child(4) {
    grid-column: span 4;
  }

  body.language-en #dodelave .finishing-card:first-child .service-rows > div:nth-child(5) {
    grid-column: span 6;
  }

  body.language-en #dodelave .finishing-card:first-child .service-rows > div:nth-child(6),
  body.language-en #dodelave .finishing-card:first-child .service-rows > div:nth-child(7) {
    grid-column: span 5;
  }

  /* "zinc plating" naj bo v dveh vrsticah (zinc / plating), sredinjeno v kvadratu. */
  body.language-en #dodelave .finishing-card:first-child .service-rows > div:nth-child(1) strong {
    display: inline-block;
    max-inline-size: 5em;
    justify-self: center;
  }

  /* Nemska verzija: enaka razporeditev kot EN - Verzinken+Vernickeln par,
     chemisches Vernickeln sam, Eloxieren+Karbonitrieren par (Karbonitrieren
     sirsi, da napis ne sega cez rob), Härten+Glühen par, andere... ostane sam. */
  body.language-de #dodelave .finishing-card:first-child .service-rows {
    grid-template-columns: repeat(10, 1fr);
  }

  body.language-de #dodelave .finishing-card:first-child .service-rows > div:nth-child(1),
  body.language-de #dodelave .finishing-card:first-child .service-rows > div:nth-child(2) {
    grid-column: span 5;
  }

  body.language-de #dodelave .finishing-card:first-child .service-rows > div:nth-child(3) {
    grid-column: 1 / -1;
  }

  /* Eloxieren in Karbonitrieren sta uravnotezena, da obe oznaki ostaneta
     znotraj svojih kvadratov. */
  body.language-de #dodelave .finishing-card:first-child .service-rows > div:nth-child(4) {
    grid-column: span 4;
  }

  body.language-de #dodelave .finishing-card:first-child .service-rows > div:nth-child(5) {
    grid-column: span 6;
  }

  /* Mikro-uravnotezenje praznega prostora ob napisih v tem paru: reža med
     kvadratoma in skupna širina vrstice ostaneta nespremenjeni. */
  body.language-de #dodelave .finishing-card:first-child .service-rows > div:nth-child(4) {
    width: calc(100% + 5px);
    justify-self: start;
  }

  body.language-de #dodelave .finishing-card:first-child .service-rows > div:nth-child(5) {
    width: calc(100% - 5px);
    justify-self: end;
  }

  /* Härten in Glühen sta enako siroka. */
  body.language-de #dodelave .finishing-card:first-child .service-rows > div:nth-child(6) {
    grid-column: span 5;
  }

  body.language-de #dodelave .finishing-card:first-child .service-rows > div:nth-child(7) {
    grid-column: span 5;
  }

  /* Manjsi notranji odmik na VSEH kvadratih (namesto samo na dveh), da so
     enakomerno sirsi in "kemično niklanje" ostane na dveh vrsticah brez
     rezanja besed (brez word-break: break-all). Pisava (font-size) se NE
     spreminja - samo odmiki. */
  #dodelave .finishing-card:first-child .service-rows > div {
    padding-left: 0.2rem;
    padding-right: 0.2rem;
  }

  #dodelave .finishing-card:first-child .service-rows strong {
    text-align: center;
    /* Besede se ne smejo rezati/deliti (brez avtomatskega vezaja) - cela
       beseda gre v naslednjo vrstico, tudi ce zato sega cez rob kvadrata. */
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
  }

  /* Kvadrati naj zavzamejo celo sirino zaslona: container brez roba, kartica
     in besedilni ovoj skoraj brez notranjega odmika (samo za dodelave/meritve/
     montaza kartice na mobilnem). */
  #dodelave.finishing-panel > .container {
    width: 100%;
  }

  /* Veliki enovrsticni naslovi se sredinijo s svojo dejansko sirino. Ce se
     naslov zaradi ozjega telefona prelomi, se njegov skupni levi rob ohrani
     poravnan brez sredinjenja posameznih vrstic. */
  .production-photo-stage .page-hero h1,
  #strojni-park .section-head h2,
  #dodelave .finishing-card:first-child .finishing-copy h2,
  #dodelave .finishing-card--dark .finishing-copy h2,
  #montaza-sklopov .finishing-copy h2 {
    width: fit-content;
    max-width: 100%;
    margin-inline: auto;
    text-align: left;
  }

  /* Meritve in preizkusi je vedno dvovrsticen naslov, zato se poravna z
     odzivno sirino svojega opisa. */
  #dodelave .finishing-card--dark .finishing-copy h2 {
    width: min(clamp(15rem, 70cqi, 16.25rem), calc(100% - 2rem));
    max-width: none;
  }

  /* Montaza sklopov se le na ozkih telefonih prelomi; takrat se poravna z
     svojo dejansko vsebino in ne s sirokim nevidnim blokom. Kadar ostane v
     eni vrstici, zgornje fit-content pravilo naslov se vedno sredini. */
  @container (max-width: 23rem) {
    #montaza-sklopov .finishing-copy h2 {
      width: min-content;
      max-width: 100%;
    }
  }

  #dodelave .finishing-card:first-child .finishing-copy p,
  #dodelave .finishing-card--dark .finishing-copy p,
  #montaza-sklopov .finishing-copy p {
    width: calc(90cqi - 0.9rem);
    max-width: none;
    margin-inline: auto;
    text-align: left;
  }

  #dodelave .finishing-card--dark .finishing-copy p {
    /* Ožji, odzivno centriran blok ohrani dejanski odtis levih vrstic
       v sredini kartice tudi pri različnih širinah telefona. */
    width: min(clamp(15rem, 70cqi, 16.25rem), calc(100% - 2rem));
    text-wrap: balance;
  }

  /* Proizvodnja: vseh pet velikih naslovov in njihovih opisov je na
     telefonu sredinsko postavljenih in sredinsko poravnanih. Sirina se meri
     glede na celotno stran, zato ostane enaka pri vseh velikostih telefona. */
  .production-photo-stage .page-hero h1,
  .production-photo-stage #strojni-park .section-head h2,
  .production-photo-stage #dodelave .finishing-card:first-child .finishing-copy h2,
  .production-photo-stage #dodelave .finishing-card--dark .finishing-copy h2,
  .production-photo-stage #montaza-sklopov .finishing-copy h2 {
    width: calc(90cqi - 0.9rem);
    max-width: none;
    margin-inline: auto;
    text-align: center;
    text-wrap: balance;
  }

  .production-photo-stage .production-intro-card .production-summary .production-summary__mobile,
  .production-photo-stage #strojni-park .section-head p,
  .production-photo-stage #dodelave .finishing-card:first-child .finishing-copy p,
  .production-photo-stage #dodelave .finishing-card--dark .finishing-copy p,
  .production-photo-stage #montaza-sklopov .finishing-copy p {
    width: calc(90cqi - 0.9rem);
    max-width: none;
    margin-inline: auto;
    text-align: center;
    text-wrap: balance;
  }

  /* Uvodni opis Proizvodnje ostane levo poravnan. */
  .production-photo-stage .production-intro-card .production-summary .production-summary__mobile {
    text-align: left;
  }

  /* Dodelave in Meritve: besede se naravno razporedijo po razpolozljivi
     sirini, brez uravnotezenega krajsanja vrstic. */
  .production-photo-stage #dodelave .finishing-card:first-child .finishing-copy p,
  .production-photo-stage #dodelave .finishing-card--dark .finishing-copy p,
  .production-photo-stage #montaza-sklopov .finishing-copy p {
    width: 90cqi;
    max-width: none;
    text-wrap: wrap;
  }

  /* Povprasevanje: opis se poravna z levim robom svojega naslova. */
  .production-photo-stage .section--dark .lead {
    max-width: none;
    margin-inline: 0;
    text-align: left;
  }

  /* Namesto "kartice" z robom/oblino/senco naj ostane samo njeno ozadje
     (karirasti vzorec), raztegnjeno cez celotno sirino zaslona. */
  #dodelave .finishing-card:first-child,
  #dodelave .finishing-card--dark {
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  #dodelave .finishing-card:first-child {
    padding-inline: 0.2rem;
  }

  #dodelave .finishing-card:first-child .finishing-copy {
    padding-inline: 0.15rem;
  }

  /* Meritve in preizkusi (razlicen id po jeziku, zato .finishing-card--dark
     kot skupen selektor): besedilo v vseh kvadratih na eni vrstici, kvadrati
     cez celo sirino zaslona, za VSE jezike. */
  #dodelave .finishing-card--dark {
    padding-inline: 0.2rem;
  }

  /* EN Measuring and testing: ozadje sega od roba do roba zaslona. */
  body.language-en .production-photo-stage #dodelave .finishing-card--dark {
    width: 100vw;
    max-width: none;
    margin-inline: calc(50% - 50vw);
  }

  body.language-en .production-photo-stage #dodelave .finishing-card--dark .finishing-copy h2,
  body.language-en .production-photo-stage #dodelave .finishing-card--dark .finishing-copy p {
    margin-inline: auto;
    text-align: center;
  }

  /* EN Measuring and testing: naslov, opis in kvadrati so ena sredinska
     vsebinska skupina znotraj polnoširinskega ozadja. */
  body.language-en .production-photo-stage #dodelave .finishing-card--dark .finishing-copy {
    width: 90cqi;
    max-width: none;
    margin-inline: auto;
    align-items: center;
    text-align: center;
  }

  body.language-en .production-photo-stage #dodelave .finishing-card--dark .finishing-copy h2,
  body.language-en .production-photo-stage #dodelave .finishing-card--dark .finishing-copy p,
  body.language-en .production-photo-stage #dodelave .finishing-card--dark .service-rows {
    width: 100%;
    max-width: none;
    margin-inline: auto;
    text-align: center;
  }

  #dodelave .finishing-card--dark .finishing-copy {
    padding-inline: 0.15rem;
  }

  #dodelave .finishing-card--dark .service-rows > div {
    padding-left: 0.15rem;
    padding-right: 0.15rem;
  }

  #dodelave .finishing-card--dark .service-rows strong {
    white-space: nowrap;
    text-align: center;
  }

  /* Nemska verzija: desktop-5.css .language-de ... #montaza-sklopov
     { grid-template-columns: minmax(0,1.2fr) minmax(340px,0.8fr) } ni omejeno
     na racunalnik (brez @media) in na mobilnem stisne besedilo na ~32px
     (slika zahteva min. 340px). Preglasi nazaj na eno-stolpicno na mobilnem. */
  .language-de .production-photo-stage #montaza-sklopov {
    grid-template-columns: 1fr;
  }

  /* Isti vzrok kot pri Nachbehandlungen: desktop-5.css
     #montaza-sklopov .finishing-copy h2 { white-space: nowrap } ni omejen
     na racunalnik in na mobilnem obreze "Baugruppenmontage". */
  .language-de .production-photo-stage #montaza-sklopov .finishing-copy h2 {
    white-space: normal;
  }

  /* Montaza sklopov: besedilo v vseh kvadratih na eni vrstici, kvadrati cez
     celo sirino zaslona, za VSE jezike (id "montaza-sklopov" je enak v SL/EN/DE). */
  /* desktop-5.css .language-de/.language-en/.. .production-photo-stage
     .assembly-panel > .container ima 4 razrede specificnosti in ni omejen
     na racunalnik - navaden ".assembly-panel > .container" ne zadostuje za
     preglasitev, zato isti (ali vecji) selektorji tu. */
  .language-de .production-photo-stage .assembly-panel > .container,
  body.language-en .production-photo-stage .assembly-panel > .container,
  body:not(.language-en):not(.language-de) .production-photo-stage .assembly-panel > .container {
    width: 100%;
  }

  /* Namesto "kartice" z robom/oblino/senco naj ostane samo njeno ozadje,
     raztegnjeno cez celotno sirino zaslona. */
  #montaza-sklopov {
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  #montaza-sklopov {
    padding-inline: 0.2rem;
  }

  /* desktop-5.css doda "padding-right: 1.25rem" samo za EN/SL selektorje
     (isti specificnosti kot spodaj, zato jih je treba eksplicitno preglasiti -
     obicajni #montaza-sklopov { padding-inline } zgoraj ne zadostuje). */
  body.language-en .production-photo-stage #montaza-sklopov,
  body.language-de .production-photo-stage #montaza-sklopov,
  body:not(.language-en):not(.language-de) .production-photo-stage #montaza-sklopov {
    padding-right: 0.2rem;
  }

  #montaza-sklopov .finishing-copy {
    padding-inline: 0.15rem;
  }

  #montaza-sklopov .service-rows > div {
    padding-left: 0.15rem;
    padding-right: 0.15rem;
  }

  /* Prva dva sklopa sta v isti vrstici in ostaneta enako siroka. V drugi
     vrstici je EN electrical assemblies ožji, preparation for installation
     pa sirsi; zadnji kvadrat ostane cez celotno sirino. */
  #montaza-sklopov .service-rows {
    grid-template-columns: repeat(20, minmax(0, 1fr));
  }

  #montaza-sklopov .service-rows > div:nth-child(1) {
    grid-column: 1 / 11;
  }

  #montaza-sklopov .service-rows > div:nth-child(2) {
    grid-column: 11 / 21;
  }

  #montaza-sklopov .service-rows > div:nth-child(3) {
    grid-column: 1 / 10;
  }

  #montaza-sklopov .service-rows > div:nth-child(4) {
    grid-column: 10 / 21;
  }

  #montaza-sklopov .service-rows > div:nth-child(n + 5) {
    grid-column: 1 / -1;
  }

  #montaza-sklopov .service-rows strong {
    white-space: nowrap;
    text-align: center;
  }

  /* Kvadrati ostanejo enake velikosti; besedilo v Meritvah in Montazi pa
     meri nekoliko ozjo notranjo sirino, zato se daljse oznake prelomijo v
     vec vrstic, preden bi segle proti robu. */
  #dodelave .finishing-card:first-child .service-rows strong,
  #dodelave .finishing-card--dark .service-rows strong,
  #montaza-sklopov .service-rows strong {
    inline-size: min(100%, 24ch);
    justify-self: center;
    white-space: normal;
  }

  /* Montaza: vsi kvadrati uporabljajo enako, nekoliko ozjo navidezno
     notranjo sirino besedila; zunanji kvadrati ostanejo nespremenjeni. */
  #montaza-sklopov .service-rows strong {
    inline-size: min(100%, 12ch);
  }

  /* Koncna kontrola ostane pri prejsnji sirini notranjega okvira. */
  #montaza-sklopov .service-rows > div:nth-child(5) strong {
    inline-size: min(100%, 24ch);
  }

  /* EN Assembly: tretji kvadrat uporablja ožji, cetrti pa sirsi navidezni
     notranji okvir; zunanja kvadrata ostaneta nespremenjena. */
  body.language-en #montaza-sklopov .service-rows > div:nth-child(3) strong {
    inline-size: min(100%, 12ch);
  }

  body.language-en #montaza-sklopov .service-rows > div:nth-child(4) strong {
    inline-size: min(100%, 20ch);
  }

  /* DE Baugruppenmontage: nemske sestavljenke potrebujejo sirsi navidezni
     notranji okvir, da se lomijo po besedah, ne po zlogih. */
  body.language-de #montaza-sklopov .service-rows > div:nth-child(-n + 3) strong {
    inline-size: min(100%, 14ch);
  }

  body.language-de #montaza-sklopov .service-rows > div:nth-child(4) strong {
    inline-size: min(100%, 18ch);
  }

  /* EN: nickel / plating v dveh vrsticah v istem kvadratu. */
  body.language-en #dodelave .finishing-card:first-child .service-rows > div:nth-child(2) strong {
    inline-size: min(100%, 7ch);
  }

  /* EN traceability: sirsi navidezni okvir za poznejsi prelom besedila. */
  body.language-en #dodelave .finishing-card--dark .service-rows > div:nth-child(5) strong {
    inline-size: min(100%, 30ch);
  }

}

/* ---------- SKLOP 4: SLIKE IN MEDIJI ---------- */
@media (max-width: 768px) {
  /* Galerija: 2 stolpca za hitrejse brskanje */
  .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
  }

  .gallery-item {
    border-radius: 12px;
  }

  /* Certifikati: nizji medijski pas, logotipi omejeni */
  .cert-card {
    grid-template-rows: 170px auto;
  }

  .cert-card img {
    padding: 0.8rem;
  }

  .home-cert-section .grid-5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
  }

  /* YouTube video cez celotno sirino */
  .video-section__grid {
    grid-template-columns: 1fr;
  }

  .video-embed {
    width: 100%;
  }

  /* Vgrajeni okvirji: primerna visina na telefonu */
  .about-tour__frame iframe {
    min-height: 320px;
  }

  .contact-reference__map,
  .contact-reference__map iframe {
    min-height: 300px;
  }
}

/* ---------- SKLOP 4b: certifikati domov (ena vrsta, drsenje) + video sirina ---------- */
@media (max-width: 768px) {
  /* Intro "Certifikati odlicnosti": brez okvircka, naslov in opis kar na ozadju,
     opis raztegnjen od levega do desnega roba */
  .home-cert-section__intro {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-bottom: 1.4rem;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .home-cert-section__intro p {
    max-width: 100%;
  }

  /* Opis "Certifikati odlicnosti" na mobilnem: samo za EN in DE (slovenska
     razlicica ostane centrirana, kot je bila prej - brez tega pravila).
     text-wrap:balance namesto justify: normalni presledki (brez raztezanja
     na vrsticah z malo besedami), sirino izkoristi kolikor gre naravno prek
     lepsih prelomov vrstic. Rahel stranski odmik, da besedilo ne sega do
     samega roba zaslona (.home-cert-section__intro je edge-to-edge, 100vw). */
  body.language-en .home-cert-section__intro p,
  body.language-de .home-cert-section__intro p {
    padding-inline: 14px;
    text-align: center;
    text-wrap: balance;
  }

  /* Certifikati: ena vrsta, drsi levo-desno; slika gor, naslov dol, brez opisa.
     Starsevski .container ima 12px centriranja + 12px lastnega paddinga = 24px
     na vsako stran (glej SKLOP 4b/4c) - izniceno, da karusel sega od roba do roba. */
  .home-cert-section .grid-5 {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 60vw;
    grid-template-columns: none;
    gap: 0.7rem;
    overflow-x: auto;
    padding: 0.3rem 14px 0.7rem;
    width: calc(100% + 48px);
    margin-inline: -24px;
    /* Podedovan justify-content:center (namizno pravilo) bi pri preplavljeni
       (overflow) vsebini prvo kartico potisnil izven dosega drsenja - izniceno. */
    justify-content: start;
  }

  .home-cert-section .cert-card {
    grid-template-rows: auto auto;
    grid-template-columns: none;
    align-items: stretch;
  }

  .home-cert-section .cert-card__body {
    padding: 0.75rem 0.9rem;
  }

  /* .cert-card__media / img namenoma brez mobilnih overridov: podeduje isto
     "width:100%; height:auto; object-fit:initial" obnasanje kot na namizju,
     zato so slike certifikatov raztegnjene cez celotno sirino kartice - enako
     kot na verziji za racunalnik. */

  .home-cert-section .cert-card__body h3 {
    margin: 0;
    text-align: center;
  }

  .home-cert-section .cert-card__body p {
    display: none;
  }

  /* Obrobljena vsebnika na domu: manj odmika, vec prostora za video */
  .home-video-stage .video-section > .container,
  .home-video-stage .home-cert-section > .container {
    padding: 1rem 12px;
  }
}

/* ---------- SKLOP 4c: domaci vsebniki (video/certifikati) brez desktop premikov ---------- */
@media (max-width: 768px) {
  .home-video-stage .home-cert-section > .container {
    width: calc(100% - 24px);
    transform: none;
  }

  /* Spoznaj podjetje: odstranimo okvir (border/ozadje/senca podedovani iz
     namiznega pravila), video se razteza cez vecji del sirine zaslona -
     video-embed ima svoj lasten rob/senco, zato ne potrebuje se enega okvirja. */
  .home-video-stage .video-section > .container {
    width: calc(100% - 8px);
    max-width: none;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    transform: none;
  }

  .home-video-stage .video-section {
    /* Vidna razdalja do naslednje sekcije (Postani del ekipe) - SKUPNA
       razdalja (ta padding-bottom + 3rem zgornji padding sekcije "Postanite
       del ekipe") povecana za 30%: prej 9.6rem + 3rem = 12.6rem skupaj,
       zdaj 13.38rem + 3rem = 16.38rem skupaj (12.6rem * 1.3). */
    margin-bottom: 0;
    padding-bottom: 13.38rem;
    background: #050505;
  }
}

/* ---------- SKLOP 5: OBRAZCI IN DOTIKALNE TARCE ---------- */
@media (max-width: 768px) {
  /* Obrazec za prosnje: naravna visina, 16px pisava, polna sirina */
  .reference-application-form {
    height: auto;
    min-height: 0;
    max-height: none;
    font-size: 16px;
    line-height: 1.6;
    row-gap: 0.35rem;
  }

  .reference-application-form__checks label,
  .reference-application-form__jobs label,
  .reference-application-form__terms,
  .reference-application-form__file {
    font-size: 16px;
  }

  .reference-application-form__checks label,
  .reference-application-form__jobs label {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 44px;
    padding-right: 0.6rem;
  }

  .reference-application-form input[type="checkbox"] {
    width: 22px;
    height: 22px;
    accent-color: var(--red);
    flex: none;
  }

  .reference-application-form__terms {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    min-height: 44px;
  }

  .reference-application-form button {
    width: 100%;
    min-height: 52px;
  }

  /* Kontaktne osebe: povezave kot polne dotikalne tarce */
  .contact-team-card a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0.2rem 0.4rem;
  }

  /* Noga: povezave z zadostno tarco in razmikom */
  .footer__grid a {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
  }

  /* Virtualni ogled: povezava kot gumb-tarca */
  .about-tour__link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
}

/* ---------- SKLOP 5b: obrazec (careers-application specificnost) ---------- */
@media (max-width: 768px) {
  .careers-application .reference-application-form {
    grid-template-columns: 1fr;
    gap: 1rem;
    font-size: 17px;
    line-height: 1.55;
  }

  .careers-application .reference-application-form__checks label,
  .careers-application .reference-application-form__jobs label,
  .careers-application .reference-application-form__terms,
  .careers-application .reference-application-form__file {
    font-size: 17px;
  }

  .careers-application .reference-application-form legend {
    font-size: 18px;
  }

  .careers-application .reference-application-form__checks {
    gap: 1.1rem;
  }

  .careers-application .reference-application-form input[type="checkbox"] {
    width: 22px;
    height: 22px;
    min-height: 22px;
  }

  .careers-application .reference-application-form button {
    width: 100%;
  }
}

/* ---------- FINI POPRAVKI ZA OZKE TELEFONE ---------- */
@media (max-width: 768px) {
  /* Domaci naslov: tesnejsi razmik crk, da se prilega 320px */
  .home-video-stage__headline {
    font-size: clamp(2.1rem, 10.75vw, 3.44rem);
    letter-spacing: 0.09em;
  }

  /* Naslovi sekcij domov: brez fit-content/max-content sirin */
  .video-section__heading {
    width: 100%;
    max-width: 100%;
    padding-inline: 0.75rem;
  }

  /* "Spoznaj podjetje" - enaka velikost kot "Certifikati odlicnosti"
     (glej .home-cert-section__intro .video-section__title spodaj) */
  .video-section__title {
    font-size: clamp(1.35rem, 6.4vw, 2.1rem);
    letter-spacing: 0.08em;
  }

  .home-cert-section__intro {
    width: calc(100% + 48px);
    max-width: calc(100% + 48px);
    margin-inline: -24px;
  }

  .home-cert-section__intro .video-section__title {
    font-size: clamp(1.35rem, 6.4vw, 2.1rem);
  }

  body:not(.language-en):not(.language-de) .home-cert-section__intro .video-section__title {
    max-width: 12ch;
    margin-inline: auto;
  }

  /* O podjetju: elementi brez fiksnih sirin */
  .about-photo,
  .about-story__media,
  .about-industries__copy,
  .about-industry-list {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .about-industry-list span {
    white-space: normal;
  }

  /* Tehnologija: digitalni tok na eno kolono, brez fiksnih sirin */
  .tech-digital-flow__items,
  .tech-digital-flow__item {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .tech-digital-flow__item {
    grid-template-columns: 1fr;
  }
}

/* ---------- FINI POPRAVKI 2 ---------- */
@media (max-width: 768px) {
  .home-video-hero__media.is-mobile-poster-offset {
    object-position: calc(50% + 70px) center;
  }

  /* Domov: minimalistična barvna sklopa. Certifikati in Spoznaj podjetje
     uporabljata isti temno moder odtenek, zato je njun stik povsem zvezen. */
  .home-video-stage .home-cert-section,
  .home-video-stage .video-section {
    isolation: auto;
    background: #06121a;
  }

  .home-video-stage .home-cert-section {
    margin-bottom: 0;
    /* Video ostane 70 px visje brez negativnega prekrivanja dveh sekcij. */
    padding-bottom: calc(11.6144rem - 70px);
  }

  .home-video-stage > .intro-band > .home-capabilities-layer::before {
    /* Nezna velika kvadratna mreza na temno rdeci podlagi. Pripeta je na
       zaslon, zato se ob robovih sticky sklopa ne premika. */
    background-color: #26080b;
    background-image:
      linear-gradient(rgba(235, 62, 68, 0.11) 1px, transparent 1px),
      linear-gradient(90deg, rgba(235, 62, 68, 0.11) 1px, transparent 1px);
    background-position: center top;
    background-size: 72px 72px;
    background-attachment: fixed;
  }

  .contact-reference__info {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 105%;
    margin-inline: -2.5%;
  }

  .contact-reference__info article[data-contact-disclosure] {
    position: relative;
    align-content: center;
    cursor: pointer;
    min-height: 157.5px;
    padding-inline: 6%;
  }

  .contact-reference__info article[data-contact-graphic]::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.28;
    pointer-events: none;
    background:
      radial-gradient(circle at 18% 76%, rgba(215, 25, 32, 0.8) 0 2px, transparent 2.5px),
      radial-gradient(circle at 76% 24%, rgba(215, 25, 32, 0.72) 0 2px, transparent 2.5px),
      linear-gradient(135deg, transparent 39%, rgba(215, 25, 32, 0.42) 39% calc(39% + 1px), transparent calc(39% + 1px)),
      linear-gradient(135deg, transparent 66%, rgba(215, 25, 32, 0.3) 66% calc(66% + 1px), transparent calc(66% + 1px)),
      radial-gradient(rgba(25, 25, 25, 0.32) 0.7px, transparent 0.9px);
    background-size: auto, auto, 100% 100%, 100% 100%, 9px 9px;
  }

  .contact-reference__info article[data-contact-disclosure] > :not(h2) {
    display: none;
  }

  .contact-reference__info article[data-contact-disclosure].is-open {
    align-content: start;
  }

  .contact-reference__info article[data-contact-disclosure].is-open > p {
    display: block;
    font-size: 1.1264rem;
  }

  .contact-reference__info article[data-contact-disclosure].is-open > .contact-reference__socials {
    display: flex;
  }

  .contact-reference__info article[data-contact-disclosure].is-open > .contact-reference__map {
    display: block;
    width: 100%;
    margin-top: 1.25rem;
  }

  .contact-reference__info article[data-contact-disclosure] h2 {
    display: block;
    margin-bottom: 0;
    width: 100%;
    margin-inline: 0;
    font-size: clamp(1.41075rem, 5.48625vw, 1.645875rem);
  }

  .contact-reference__info article[data-contact-disclosure].is-open h2 {
    margin-bottom: 1.1rem;
  }

  .contact-reference__toggle {
    width: 100%;
    display: block;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-align: left;
    text-transform: inherit;
    cursor: pointer;
  }

  .contact-reference__toggle::after {
    content: none;
  }

  .contact-reference__info article[data-contact-disclosure] h2::after {
    content: "ODPRI OPIS";
    display: block;
    margin-top: calc(0.65rem - 6px);
    color: var(--red);
    font-size: 0.462em;
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1;
  }

  body.language-en .contact-reference__info article[data-contact-disclosure] h2::after {
    content: "OPEN DESCRIPTION";
  }

  body.language-de .contact-reference__info article[data-contact-disclosure] h2::after {
    content: "BESCHREIBUNG ÖFFNEN";
  }

  body.language-de .contact-reference__info article:nth-child(2) .contact-reference__toggle {
    hyphens: manual;
    overflow-wrap: normal;
  }

  .contact-reference__info article[data-contact-disclosure].is-open h2::after {
    content: none;
    display: none !important;
  }

  .contact-reference__toggle:focus-visible {
    outline: 2px solid var(--red);
    outline-offset: 5px;
  }

  /* Poziv za odpiranje je smiseln le pri zaprtih karticah; ob ponovnem
     zaprtju odstranitev razreda .is-open poziv samodejno znova prikaže. */
  .machine-carousel .machine-card.is-open > em {
    display: none;
  }

  .machine-carousel .machine-card.is-open,
  .production-photo-stage .machine-carousel .machine-card.is-open {
    min-height: 0;
  }

  /* Kartice zaposlenih so na telefonu zaprte kompaktno; klik razkrije
     obstoječe kontaktne podatke brez vpliva na namizni prikaz. */
  .contact-team-card[data-team-disclosure] {
    min-height: 126px;
    padding: 12px 14px;
    cursor: pointer;
  }

  .contact-team-card[data-team-disclosure]:hover {
    transform: none;
    border-color: #e6e6e6;
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.06);
  }

  .contact-team-card[data-team-disclosure]:not(.is-open),
  .contact-team-card[data-team-disclosure]:not(.is-open):hover {
    transform: none !important;
    filter: none;
    opacity: 1;
    border-color: #e6e6e6;
    border-top-color: var(--red);
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.06) !important;
    transition: none;
  }

  .contact-team__grid {
    display: block;
    width: 100vw;
    margin-left: calc(50% - 50vw);
  }

  .contact-team__grid .contact-team-carousel {
    width: 100%;
    max-width: none;
    margin: 0;
  }

  .contact-team-carousel__track {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    overflow-x: auto;
    padding: 0.2rem 1.4rem 0.45rem;
    scroll-behavior: smooth;
    scrollbar-width: none;
  }

  .contact-team-carousel__track::-webkit-scrollbar {
    display: none;
  }

  .contact-team-carousel__track.is-scrollbar-dragging {
    scroll-behavior: auto;
  }

  .contact-team-carousel__column {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 0.7rem;
    width: 330px;
  }

  .contact-team-carousel__column .contact-team-card {
    width: 100%;
  }

  .contact-team-carousel__column .contact-team-card em {
    white-space: nowrap;
  }

  .contact-team-carousel .capability-carousel__scrollbar-hitbox {
    margin-inline: 1.4rem;
  }

  .contact-team-carousel .capability-carousel__scrollbar {
    width: 100%;
    margin-inline: auto;
    background: transparent;
  }

  .contact-team-carousel .capability-carousel__scrollbar span {
    background: var(--red);
  }

  .contact-team-card[data-team-disclosure] > :not(h3, em, .contact-team-card__toggle) {
    display: none;
  }

  .contact-team-card[data-team-disclosure] h3 {
    margin-bottom: 9px;
  }

  .contact-team-card[data-team-disclosure] em {
    margin-bottom: 0;
  }

  .contact-team-card[data-team-disclosure] em::after {
    content: "ODPRI OPIS";
    display: block;
    margin-top: 0.45rem;
    color: var(--red);
    font-size: 0.55em;
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0.12em;
    line-height: 1;
  }

  body.language-en .contact-team-card[data-team-disclosure] em::after {
    content: "OPEN DETAILS";
  }

  body.language-de .contact-team-card[data-team-disclosure] em::after {
    content: "DETAILS ÖFFNEN";
  }

  .contact-team-card__toggle {
    position: absolute;
    inset: 0;
    z-index: 1;
    border: 0;
    background: transparent;
    cursor: pointer;
  }

  .contact-team-card__toggle:focus-visible {
    outline: 2px solid var(--red);
    outline-offset: -5px;
  }

  .contact-team-card[data-team-disclosure].is-open {
    grid-column: 1 / -1;
    min-height: 245px;
    padding: 22px 14px;
    border-top-color: var(--red) !important;
  }

  .contact-team-card[data-team-disclosure].is-open:hover {
    border-top-color: var(--red) !important;
  }

  .contact-team-card[data-team-disclosure].is-open > :not(.contact-team-card__toggle) {
    display: block;
  }

  .contact-team-card[data-team-disclosure].is-open em {
    margin-bottom: 17px;
  }

  .contact-team-card[data-team-disclosure].is-open em::after {
    content: none;
    display: none !important;
  }

  .contact-team-card[data-team-disclosure].is-open .contact-team-card__toggle {
    display: none;
  }

  /* Fiksni uvodni opis se lahko vizualno prekriva s pripetimi karticami,
     vendar ne sme prestrezati njihovih klikov. */
  .home-future-content__inner p {
    pointer-events: none;
  }

  /* Prijavni obrazec: vsa navedena besedila so enako velika kot legenda »SPOL«. */
  .careers-application .reference-application-form :is(legend, label, input, button, .form-msg) {
    font-size: 18px !important;
  }

  .careers-application .reference-application-form input[type="file"]::file-selector-button {
    font-size: 18px;
  }

  .reference-application-form__terms-copy {
    display: block;
    flex: 1 1 0;
    min-width: 0;
  }

  .reference-application-form__terms-copy a {
    white-space: normal;
  }

  body.language-de .reference-application-form__terms-copy a {
    hyphens: manual;
  }

  .careers-first__copy > p {
    position: relative;
    top: -20px;
  }

  body.language-de .careers-application__box h2 {
    hyphens: manual;
    overflow-wrap: normal;
  }

  body.language-de .page-hero--general-terms-grid h1 {
    max-width: 12ch;
    white-space: normal;
    hyphens: manual;
  }

  body.language-de .general-terms__intro h2 {
    max-width: 12ch;
    white-space: normal;
    hyphens: manual;
  }

  body.language-de .general-terms__privacy-heading h2 {
    max-width: 100%;
    overflow-wrap: normal;
    hyphens: manual;
  }

  .tech-digital-flow__copy {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .about-industries__grid .about-photo {
    margin-inline: 0;
  }
}

/* ---------- PIŠKOTKI IN ODDAJA ZAPOSLITVENEGA OBRAZCA ---------- */
@media (max-width: 768px) {
  .cookie-consent__banner {
    right: 10px;
    bottom: 10px;
    left: 10px;
    display: block;
    max-height: calc(100% - 20px);
    overflow: auto;
    padding: 20px;
  }

  .cookie-consent__copy h2,
  .cookie-consent__settings h2 {
    font-size: 22px;
  }

  .cookie-consent__actions {
    margin-top: 16px;
  }

  .cookie-consent__actions button,
  .cookie-consent__settings-actions button {
    flex: 1 1 100%;
    width: 100%;
  }

  .cookie-consent__backdrop {
    align-items: end;
    min-height: 100vh;
    min-height: 100dvh;
    overflow: hidden;
    padding:
      max(8px, env(safe-area-inset-top, 0px))
      max(8px, env(safe-area-inset-right, 0px))
      max(8px, env(safe-area-inset-bottom, 0px))
      max(8px, env(safe-area-inset-left, 0px));
  }

  .cookie-consent__settings {
    width: 100%;
    max-height: calc(100vh - 16px);
    max-height: calc(100dvh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 24px 18px 0;
    scroll-padding-bottom: calc(124px + env(safe-area-inset-bottom, 0px));
    -webkit-overflow-scrolling: touch;
  }

  .cookie-consent__option {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    margin-block: 14px;
    padding: 14px;
  }

  .reference-application-form .form-msg__settings {
    width: 100%;
  }

  .consent-embed-placeholder {
    min-height: 240px;
    padding: 22px 16px;
  }

  .consent-embed-placeholder button {
    width: 100%;
  }

  .cookie-consent__banner,
  .cookie-consent__settings {
    border-radius: 14px;
  }

  .cookie-consent__banner {
    padding: 22px 20px 20px;
  }

  .cookie-consent__copy h2,
  .cookie-consent__settings h2 {
    font-size: 27px;
  }

  .cookie-consent__actions {
    min-width: 0;
  }

  .cookie-consent__settings {
    padding: 26px 18px 0;
  }

  .cookie-consent__close {
    top: 12px;
    right: 12px;
  }

  .cookie-consent__option {
    padding: 16px;
  }

  .cookie-consent__settings h2 {
    padding-right: 52px;
    overflow-wrap: anywhere;
  }

  .cookie-consent__settings-actions {
    position: sticky;
    z-index: 2;
    bottom: 0;
    margin: 18px -18px 0;
    padding: 14px 18px calc(18px + env(safe-area-inset-bottom, 0px));
    background: linear-gradient(to bottom, rgba(6, 17, 29, 0.88), #06111d 24%);
  }

  .cookie-policy-table-wrap {
    width: 100%;
    margin-inline: 0;
    overflow: visible;
    border: 0;
  }

  .cookie-policy-details summary {
    min-height: 50px;
    padding: 13px 0;
    overflow-wrap: anywhere;
  }

  .cookie-policy-details__content {
    padding: 4px 0 18px;
  }

  .cookie-policy-details__content .cookie-policy-table-wrap {
    margin-block: 0;
  }

  .general-terms__detail-copy,
  .cookie-policy-table,
  .cookie-policy-table tbody {
    display: block;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .cookie-policy-table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    clip-path: inset(50%);
  }

  .cookie-policy-table tbody tr {
    display: block;
    width: 100%;
    min-width: 0;
    margin-bottom: 14px;
    overflow: hidden;
    border: 1px solid rgba(17, 17, 17, 0.2);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(7, 23, 37, 0.07);
  }

  .cookie-policy-table tbody td {
    display: grid;
    grid-template-columns: minmax(96px, 0.38fr) minmax(0, 0.62fr);
    gap: 12px;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    padding: 12px 14px;
    overflow-wrap: anywhere;
    border: 0;
    border-bottom: 1px solid rgba(17, 17, 17, 0.12);
  }

  .cookie-policy-table tbody td::before {
    content: attr(data-label);
    color: #071725;
    font-size: 0.78em;
    font-weight: 900;
    letter-spacing: 0.03em;
    line-height: 1.35;
    text-transform: uppercase;
  }

  .cookie-policy-table tbody td:last-child {
    border-bottom: 0;
  }

  .cookie-policy-table strong {
    overflow-wrap: anywhere;
  }
}

@media (max-width: 380px) {
  .cookie-policy-table tbody td {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .contact-reference__info {
    column-gap: 0.5rem;
    row-gap: 0.75rem;
  }

  .contact-reference__info article[data-contact-disclosure] {
    padding-inline: 6%;
  }

  .contact-reference__info article[data-contact-disclosure].is-open {
    grid-column: 1 / -1;
  }

  .contact-reference__info article[data-contact-disclosure] h2,
  .contact-reference__toggle {
    min-width: 0;
  }

  .contact-reference__info article[data-contact-disclosure] h2 {
    width: 100%;
    margin-inline: 0;
    line-height: 1.2;
  }

  .contact-reference__toggle {
    position: static;
    display: block;
    padding-right: 0;
    overflow-wrap: anywhere;
    hyphens: auto;
  }

  .contact-reference__toggle::after {
    content: none;
  }
}

/* ---------- FINI POPRAVKI 3 + varnostna mreza ---------- */
@media (max-width: 768px) {
  .tech-digital-flow__item:nth-child(even) {
    grid-template-columns: 1fr;
  }

  .about-industry-list {
    grid-template-columns: minmax(0, 1fr);
    max-width: 100%;
  }

  .about-industry-list span {
    font-size: clamp(1.25rem, 6vw, 1.7rem);
    min-height: 88px;
  }

  /* Varnostna mreza: morebitni pod-pikselski ostanki ne smejo
     povzrociti vodoravnega drsenja na pravih napravah */
  html,
  body {
    overflow-x: clip;
  }
}

/* ---------- FINI POPRAVKI 4 ---------- */
@media (max-width: 768px) {
  .about-story__grid .about-story__media,
  .about-story__grid .about-photo {
    margin-inline: 0;
  }

  /* Proizvodnja: manj praznega prostora nad naslovom - preglasi desktop-2.css
     .production-photo-stage .page-hero (min-height: clamp(220px, 20vw, 260px)) */
  .production-photo-stage .page-hero {
    min-height: 140px;
  }

  /* Se manj prostora: manjsi razmik kartice od glave (preglasi
     desktop-5.css .production-intro-card { margin-top: var(--production-intro-top-gap) },
     ki se na tem ozadju sklicuje na vrednost, nastavljeno na .production-photo-stage) */
  .production-intro-card {
    margin-top: 0px;
  }

  .production-photo-stage .page-hero .breadcrumbs {
    margin-top: 4px;
  }

  /* Proizvodnja: intrinzicna sirina naslova ne sme raztegniti kartice */
  .production-intro-card,
  .production-intro-card .page-hero,
  .production-intro-card .page-hero .container {
    min-width: 0;
    max-width: 100%;
  }

  /* Namesto "kartice" (rob/oblina/senca) naj ostane samo njeno ozadje
     (tehnicna mreza + rdec/moder odsev), raztegnjeno cez celotno sirino
     zaslona - enako kot pri Strojni park/Dodelave/Meritve/Montaza. */
  .production-intro-card {
    width: 100%;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  /* Proizvodnja: enako levo poravnan naslov kot na drugih vsebinskih straneh. */
  .production-photo-stage .page-hero h1 {
    width: auto;
    max-width: 100%;
    margin-inline: 0;
    font-size: clamp(2.8rem, 5.8vw, 5.8rem);
    text-align: left;
  }

  /* EN "Manufacturing" naj ostane v EN VRSTICI (brez preloma pri mehkem
     vezaju), tudi ce zato sega cez rob zaslona - pisava ostane enake
     velikosti kot SL/DE in #strojni-park h2. */
  html[lang="en"] .production-photo-stage .page-hero h1 {
    max-inline-size: 100%;
    font-size: clamp(2.8rem, 5.8vw, 5.8rem);
    white-space: normal;
    overflow-wrap: normal;
    hyphens: manual;
  }

  .production-intro-card .page-hero .container {
    padding-inline: 1rem;
    padding-top: 0px;
    padding-bottom: 14px;
  }
}

/* ---------- FINI POPRAVKI 5 (721-768px pas) ---------- */
@media (max-width: 768px) {
  /* Karusel je gnezden v .container (14px centriranje + 24px padding =
     38px na vsako stran, glej .home-video-stage .intro-band > .home-capabilities-layer
     > .container) - znano vrednost izniceno, da karusel sega od roba do roba. */
  .capability-carousel {
    width: calc(100% + 76px);
    max-width: none;
    margin-inline: -38px;
  }

  .about-industry-list {
    transform: none;
  }
}

/* ---------- SKLOP 6a: FOOTER (meni 4 stolpci, e-posta pod telefon) ---------- */
@media (max-width: 768px) {
  /* Meni v nogi: 4 stolpci, 2 vrstici, z okvirjem */
  .footer__grid > div:nth-child(2) {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    align-content: start;
  }

  .footer__grid > div:nth-child(2) h3 {
    grid-column: 1 / -1;
    margin-bottom: 0.2rem;
  }

  .footer__grid > div:nth-child(2) a {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 48px;
    margin: 0;
    padding: 0.35rem 0.25rem;
    font-size: 0.76rem;
    line-height: 1.12;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 8px;
  }

  /* Nemški naslov pogojev se v ozki menijski celici prelomi samo na
     predvidenem vezaju: Allgemeine / Geschäfts- / bedingungen. */
  body.language-de .footer__grid > div:nth-child(2) a[href="/splosni-pogoji"] {
    hyphens: manual;
    word-break: normal;
  }

  body.language-en .footer__grid > div:nth-child(2) a[href="/proizvodnja"] {
    hyphens: manual;
    word-break: normal;
  }

  /* Kontakt v nogi: e-posta pod telefonsko stevilko (ne poleg nje) */
  .footer__grid > div:nth-child(3) a {
    display: block;
    width: fit-content;
  }
}

/* ---------- SKLOP 6b: GENERALNO - page-hero brez opisa (nizji vrhnji pas) ---------- */
@media (max-width: 768px) {
  .page-hero p {
    display: none;
  }

  .page-hero {
    min-height: 200px;
  }

  .page-hero .breadcrumbs {
    margin-top: 15px;
  }

  .page-hero--about-grid::before,
  .page-hero--ethics-grid::before,
  .page-hero--certificates-grid::before,
  .page-hero--policy::before {
    display: none;
  }

  .page-hero--about-grid,
  .page-hero--ethics-grid,
  .page-hero--certificates-grid,
  .page-hero--tech,
  .page-hero--gallery-grid {
    min-height: 165px;
  }

  .page-hero--procurement-grid .container {
    padding-bottom: 20px;
  }

  .page-hero--policy .container {
    padding-top: 7.2px;
    padding-bottom: 22.2px;
  }

  /* Fiksen razmik zadnja vrstica naslova -> spodnji rob headerja, ne glede na
     stevilo vrstic (npr. daljsi EN/DE naslovi, ki se prelomijo v 2 vrstici) */
  .page-hero--about-grid .container,
  .page-hero--ethics-grid .container,
  .page-hero--certificates-grid .container,
  .page-hero--tech .container,
  .page-hero--gallery-grid .container {
    padding-bottom: 22px;
  }

  .page-hero--tech .container {
    z-index: 1;
  }

  /* Galerija: enako ozadje kot Tehnologija */
  .page-hero--gallery-grid {
    background:
      radial-gradient(circle at 82% 12%, rgba(103, 201, 255, 0.16), transparent 26rem),
      linear-gradient(135deg, var(--tech-blue-deep), var(--tech-blue) 58%, #05070b);
  }

  .page-hero--gallery-grid::before {
    background:
      linear-gradient(90deg, rgba(3, 13, 24, 0.96), rgba(9, 35, 63, 0.74) 46%, rgba(3, 13, 24, 0.24)),
      radial-gradient(circle at 78% 20%, rgba(103, 201, 255, 0.22), transparent 22rem);
  }

  /* Temnejsa rdeca mrezica v hero ozadju (about/ethics/certificates/policy) */
  .page-hero--certificates-grid::after,
  .page-hero--ethics-grid::after,
  .page-hero--about-grid::after,
  .page-hero--policy::after {
    background-image:
      radial-gradient(circle at 12% 8%, rgba(150, 15, 20, 0.24), transparent 30rem),
      radial-gradient(circle at 88% 48%, rgba(150, 15, 20, 0.16), transparent 34rem),
      linear-gradient(rgba(150, 20, 24, 0.38) 1px, transparent 1px),
      linear-gradient(90deg, rgba(150, 20, 24, 0.38) 1px, transparent 1px);
  }
}

/* ---------- SKLOP 6c: O PODJETJU industrije (2 stolpca, 3 vrstice, brez slike) ---------- */
@media (max-width: 768px) {
  /* Slika ob industrijah se odstrani */
  .about-industries__grid > figure,
  .about-industries .about-photo {
    display: none;
  }

  .about-industries__grid {
    grid-template-columns: 1fr;
  }

  /* 2 stolpca x 3 vrstice; besedi se zlozita (zgoraj/spodaj) z ovijanjem */
  .about-industry-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
    max-width: 100%;
    transform: none;
  }

  .about-industry-list span {
    min-height: 76px;
    padding: 0.6rem 0.4rem;
    font-size: clamp(1.0474rem, 4.9875vw, 1.3965rem);
    line-height: 1.12;
    text-align: center;
    text-indent: 0;
  }

  /* Desktop optични popravek zamika (za 3-stolpcno postavitev) ni potreben
     pri mobilni 2-stolpcni postavitvi - podnicilizacija za sredinsko poravnavo */
  .about-industry-list span:nth-child(3),
  .about-industry-list__semiconductor {
    text-indent: 0;
  }

  /* "Polprevodniska industrija" - najdaljsa beseda se skoraj dotika robov
     kvadrata, zato ima ta kvadrat manjso pisavo, da je besedilo resnicno
     na sredini (z enakim odmikom od obeh robov) */
  .about-industry-list span.about-industry-list__semiconductor {
    font-size: clamp(1.0474rem, 4.9875vw, 1.3965rem);
    padding-left: calc(0.4rem - 6px);
    padding-right: calc(0.4rem + 6px);
  }

  /* EN/DE: "Semiconductor industry" / "Halbleiterindustrie" - 3px bolj v desno
     kot slovenska razlicica (ki ostane pri -6px/+6px) */
  body.language-en .about-industry-list span.about-industry-list__semiconductor,
  body.language-de .about-industry-list span.about-industry-list__semiconductor {
    padding-left: calc(0.4rem - 3px);
    padding-right: calc(0.4rem + 3px);
  }
}

/* ---------- SKLOP 6d: CERTIFIKATI stran - vecje kartice po celi sirini ---------- */
@media (max-width: 768px) {
  #certifikati-in-dokumenti .cert-card {
    grid-template-rows: auto auto;
  }

  /* Certifikat naj gre cez celotno sirino kartice (enako kot na Domov),
     visina kartice se prilagodi naravnemu razmerju slike - brez rezanja */
  #certifikati-in-dokumenti .cert-card > img {
    width: 100%;
    height: auto;
    max-height: none;
    padding: 0;
    object-fit: initial;
    background: transparent;
  }
}

/* ---------- SKLOP 6e: SPONZORSTVO - video/slika pod naslovom ---------- */
@media (max-width: 768px) {
  /* Kristjan Ceh: naslov -> video -> besedilo */
  .sponsorship-feature:not(.sponsorship-feature--footgolf) .sponsorship-feature__copy {
    display: contents;
  }
  .sponsorship-feature:not(.sponsorship-feature--footgolf) .sponsorship-feature__copy h3 {
    order: 1;
    position: relative;
    top: 40px;
  }
  .sponsorship-feature:not(.sponsorship-feature--footgolf) .sponsorship-feature__media--video {
    order: 2;
    margin-top: 0.9rem;
  }
  .sponsorship-feature:not(.sponsorship-feature--footgolf) .sponsorship-feature__copy p {
    order: 3;
    margin-top: 0.9rem;
  }

  /* Footgolf: naslov -> slika -> besedilo */
  .sponsorship-feature--footgolf .sponsorship-feature__copy--footgolf {
    display: contents;
  }
  .sponsorship-feature--footgolf .sponsorship-feature__copy--footgolf h3 {
    order: 1;
    position: relative;
    top: 40px;
  }
  .sponsorship-feature--footgolf .sponsorship-feature__media--footgolf {
    order: 2;
    margin-top: 0.9rem;
  }
  .sponsorship-feature--footgolf .sponsorship-feature__copy--footgolf p {
    order: 3;
    margin-top: 0.9rem;
  }
}

/* ---------- SKLOP 6f: LOGOTIP - vrstni red slik ---------- */
@media (max-width: 768px) {
  /* Izvor imena: naslov -> slika RESEDA_PLANT -> besedilo */
  .logo-origin__copy {
    display: contents;
  }
  .logo-origin__copy h2 {
    order: 1;
    position: relative;
    top: 55px;
  }
  .logo-origin__image {
    order: 2;
    margin: 0.6rem 0;
  }
  .logo-origin__copy p {
    order: 3;
  }

  /* Logotip RESEDA: logo varianti med 1. in 2. odstavkom */
  .logo-meaning__copy {
    display: contents;
  }
  .logo-meaning__copy h2 {
    order: 1;
    position: relative;
    top: 47px;
  }
  .logo-meaning__copy p:nth-of-type(1) {
    order: 2;
  }
  .logo-meaning__visuals {
    order: 3;
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    margin: 0.9rem 0;
  }
  .logo-meaning__visuals img {
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
  }
  .logo-meaning__copy p:nth-of-type(2) {
    order: 4;
    position: relative;
    top: -15px;
  }

  .logo-download__copy h2 {
    position: relative;
    top: 25px;
  }
}

/* ---------- SKLOP 6g: MENI - gumb podmenija (skrit na namizju) + belo dno ---------- */
@media (min-width: 769px) {
  .nav-group__toggle {
    display: none;
  }
}

@media (max-width: 768px) {
  /* Belo dno za SL/EN/DE in POVPRASEVANJE: menijska vsebina (ki jo scrollas)
     se vidi samo nad tem belim pasom, ne prosevaja med gumbi. */
  body.menu-open .main-nav::after {
    content: "";
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: calc(120.6px + env(safe-area-inset-bottom, 0px));
    background: #ffffff;
    border-top: 1px solid var(--line);
    z-index: 90;
    pointer-events: auto;
  }
}

/* ---------- TEMNI NACIN (mobilni meni): dno menija ---------- */
/* Glava je zdaj vedno temna (glej SKLOP 1), zato tu ni vec potrebno; dno
   menija (SL/EN/DE + Povprasevanje) pa v svetlem nacinu ostaja belo. */
@media (max-width: 768px) and (prefers-color-scheme: dark) {
  body.menu-open .main-nav::after {
    background: #0c0f12;
    border-top-color: rgba(255, 255, 255, 0.14);
  }
}

/* ---------- SKLOP 6h: temne sekcije naj se v dark modu ne "force-darkajo" ----------
   Chrome na telefonu (auto/force dark) algoritmicno spreminja barve. Tem ze
   namensko temnim sekcijam (rdeci/modri grid, temni pasovi, noga) povemo, da so
   dark, da jih pusti pri miru in se prikazejo z enakimi barvami kot na namizju. */
@media (max-width: 768px) {
  .home-video-stage,
  .section--dark,
  .footer,
  .production-photo-stage,
  .tech-services-section,
  .video-section {
    color-scheme: dark;
  }
}

/* ---------- SKLOP 6i: mobilni naslov domov - skrij 3-vrsticni blok na namizju ---------- */
@media (min-width: 769px) {
  .m-headline-lines {
    display: none;
  }
}

/* ---------- SKLOP 6j: drsni trak karusela zmogljivosti - tanjsi, palcka 4x daljsa ---------- */
@media (max-width: 768px) {
  .capability-carousel__scrollbar {
    height: 8px;
  }

  /* Dotikalna tarca ostane velika (touch-friendly), tudi ce je vidni trak tanjsi */
  .capability-carousel__scrollbar-hitbox {
    height: 64px;
    margin-block: -25px;
  }
}

/* ---------- SKLOP 6k: tehnologija - dvo-vrstični drsni trak razvojnih storitev ---------- */
@media (max-width: 768px) {
  .tech-services-section .tech-service-layout > .tech-service-grid {
    display: none;
  }

  .tech-service-carousel {
    display: block;
    position: static;
    width: 100vw;
    max-width: none;
    margin: 0.5rem 0 0 calc(50% - 50vw);
  }

  .tech-service-carousel .capability-carousel__controls {
    display: none;
  }

  .tech-service-carousel__track {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    padding: 0.2rem 1.4rem 0.45rem;
  }

  .tech-service-carousel__track::-webkit-scrollbar {
    display: none;
  }

  .tech-service-carousel__track.is-scrollbar-dragging {
    scroll-behavior: auto;
  }

  .tech-service-carousel__pair {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 0.7rem;
    width: 275px;
  }

  .tech-service-carousel__pair article {
    box-sizing: border-box;
    width: 100%;
    height: 118.8px;
    min-height: 118.8px;
    cursor: pointer;
    transition: height 0.25s ease, min-height 0.25s ease;
  }

  .tech-service-carousel__pair article p {
    width: calc(100% + 1.45rem);
    max-width: none;
    margin-right: 0;
    font-size: 1.05rem;
    font-weight: 500;
  }

  .tech-service-carousel__pair article:not(.is-open) p {
    display: none;
  }

  .tech-service-carousel__pair article.is-open {
    height: auto;
    min-height: 0;
  }

  body.language-de .tech-service-carousel__pair:nth-child(3) article:nth-child(2) h3 {
    white-space: normal;
    overflow-wrap: normal;
    hyphens: manual;
  }

  body.language-de .tech-service-carousel__pair:nth-child(1) article:nth-child(2) h3 {
    white-space: nowrap;
  }

  body.language-de .tech-digital-flow__title-lines span {
    white-space: normal;
    overflow-wrap: normal;
    hyphens: manual;
  }

  .tech-service-carousel__pair article.is-open p {
    margin-bottom: 0;
  }

  .tech-service-card__hint {
    position: absolute;
    left: 1.45rem;
    bottom: 1.1rem;
    color: var(--tech-blue-soft);
    font-size: 0.76rem;
    font-style: normal;
    font-weight: 950;
    letter-spacing: 0.12em;
  }

  .tech-service-carousel__pair article.is-open .tech-service-card__hint {
    display: none;
  }

  .tech-service-carousel .capability-carousel__scrollbar-hitbox {
    margin-inline: 1.4rem;
  }

  .tech-service-carousel .capability-carousel__scrollbar {
    width: 100%;
    margin-inline: auto;
    background: transparent;
  }

  .tech-service-carousel .capability-carousel__scrollbar span {
    background: var(--red);
  }

  .tech-digital-flow__copy p span > strong {
    color: var(--tech-blue-deep) !important;
    font-weight: 680 !important;
  }

  .tech-services-section {
    background-attachment: scroll;
    background-position: center calc(50% + (360px - 100vh) / 2 + 170px);
  }

  /* Mreza se na mobilnem preden doseze desni rob neopazno iztece. */
  .tech-services-section::after {
    mask-image: linear-gradient(90deg, black 0 66%, transparent 78%);
  }

  .tech-materials__copy .section-head {
    position: relative;
    top: 15px;
  }

  .tech-materials__copy .section-head .eyebrow {
    position: relative;
    top: 0;
  }

}