@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Jost:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500;600;700&display=swap');

/* ==========================================================================
   DOCUMENT DOWNLOAD CARDS STYLES (BEM Scoped & Namespaced)
   ========================================================================== */

:root,
.ddc-wrapper {
  /* Namespaced CSS Variables to prevent page style contamination */
  --ddc-bg-color: #111111;
  --ddc-card-bg: #242424;
  --ddc-input-bg: #000000;
  --ddc-btn-bg: #ffffff;
  --ddc-btn-text: #000000;
  --ddc-text-primary: #ffffff;
  --ddc-text-secondary: #a0a0a0;
  --ddc-text-muted: #888888;
  --ddc-accent-underline: #ffffff;
  --ddc-focus-outline: #ffffff;
  
  /* Fonts - Customize easily to match your exact parent styles */
  --ddc-font-title: 'Jost', sans-serif;
  --ddc-font-body: 'Inter', sans-serif;
  --ddc-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
  
  /* Radii & Durations */
  --ddc-radius-card: 0px; /* Sharp edges identical to visual specification */
  --ddc-transition-speed: 0.3s;
}

/* Wrapper and Layout Grid */
.ddc-wrapper {
  /*background-color: var(--ddc-bg-color, #111111) !important;*/
  padding: 40px 20px;
  width: 100%;
  box-sizing: border-box;
  font-family: var(--ddc-font-body, 'Inter', sans-serif);
}

.ddc-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
  max-width: 1100px;
  margin: 0 auto;
  box-sizing: border-box;
}

@media (min-width: 1024px) {
  .ddc-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Card Element */
.ddc-card {
  display: flex;
  flex-direction: column; /* Default stack on mobile */
  background-color: var(--ddc-card-bg, #242424) !important;
  border: 1px solid #333333;
  overflow: hidden;
  position: relative;
  box-sizing: border-box;
  transition: transform var(--ddc-transition-speed, 0.3s) ease, box-shadow var(--ddc-transition-speed, 0.3s) ease;
  min-height: 210px;
}

@media (min-width: 768px) {
  .ddc-card {
    flex-direction: row; /* Row layout on tablet/desktop */
  }
}

.ddc-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

/* Card Image Container & Image */
.ddc-card__image-container {
  width: 100%;
  height: 200px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  outline: none;
}

@media (min-width: 768px) {
  .ddc-card__image-container {
    width: 38%;
    height: auto;
    min-width: 120px;
  }
}

.ddc-card__image-container:focus {
  outline: 2px solid var(--ddc-focus-outline);
  outline-offset: -2px;
}

.ddc-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--ddc-transition-speed) ease;
  display: block;
}

.ddc-card__image-container:hover .ddc-card__image {
  transform: scale(1.05);
}

/* Card Content Area */
.ddc-card__content {
  width: 100%;
  padding: 20px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .ddc-card__content {
    width: 62%;
    padding: 30px 25px;
  }
}

/* Card Title */
.ddc-card__title {
  font-family: var(--ddc-font-title);
  font-size: 1.15rem;
  font-weight: 500;
  letter-spacing: 1.5px;
  margin: 0 0 6px 0;
  text-transform: uppercase;
  line-height: 1.3;
}

.ddc-card--downloadable .ddc-card__title {
  margin-bottom: 25px;
}

.ddc-card__title-link {
  color: var(--ddc-text-primary, #ffffff) !important;
  text-decoration: none !important;
  position: relative;
  display: inline-block;
  padding-bottom: 3px;
  border-bottom: 2px solid var(--ddc-accent-underline, #ffffff) !important;
  transition: color var(--ddc-transition-speed, 0.3s) ease, border-color var(--ddc-transition-speed, 0.3s) ease;
}

.ddc-card__title-link:hover {
  color: var(--ddc-text-secondary, #a0a0a0) !important;
}

.ddc-card__title-link:focus {
  outline: 2px solid var(--ddc-focus-outline);
  outline-offset: 4px;
}

/* Card Subtitle */
.ddc-card__subtitle {
  font-family: var(--ddc-font-sans, system-ui, sans-serif);
  font-size: 0.68rem;
  font-weight: 400;
  color: #a0a0a0;
  margin: 0 0 20px 0;
  font-style: italic;
  letter-spacing: 0.5px;
  line-height: 1.4;
}

/* Downloadable modifier */
.ddc-card--downloadable .ddc-card__title-link--download::after {
  content: none !important;
  display: none !important;
}

.ddc-card--downloadable:hover .ddc-card__title-link--download::after {
  transform: none;
}

/* Form Styles */
.ddc-card__form-wrapper {
  position: relative;
  margin-top: auto;
  min-height: 76px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.ddc-card__form {
  display: flex;
  flex-direction: column;
  gap: 0px;
}

.ddc-card__label {
  display: block;
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 1.2px;
  color: var(--ddc-text-secondary);
  margin-bottom: 8px;
  text-transform: uppercase;
}

.ddc-card__input-group {
  display: flex;
  background-color: var(--ddc-input-bg);
  border: 1px solid #444444;
  height: 38px;
  position: relative;
}

.ddc-card__input {
  flex-grow: 1;
  background-color: transparent;
  border: none;
  color: var(--ddc-text-primary);
  padding: 0 12px;
  font-family: var(--ddc-font-body);
  font-size: 0.85rem;
  width: 100%;
  box-sizing: border-box;
}

/* Force dark input background and white text when autofilled by browser */
.ddc-card__input:-webkit-autofill,
.ddc-card__input:-webkit-autofill:hover, 
.ddc-card__input:-webkit-autofill:focus, 
.ddc-card__input:-webkit-autofill:active {
  -webkit-text-fill-color: var(--ddc-text-primary) !important;
  -webkit-box-shadow: 0 0 0px 1000px var(--ddc-input-bg) inset !important;
  box-shadow: 0 0 0px 1000px var(--ddc-input-bg) inset !important;
  transition: background-color 5000s ease-in-out 0s;
}

.ddc-card__input:focus {
  outline: none;
}

.ddc-card__input-group:focus-within {
  border-color: #777777;
  outline: 1px solid var(--ddc-focus-outline);
}

.ddc-card__submit-btn {
  background-color: var(--ddc-btn-bg, #ffffff) !important;
  color: var(--ddc-btn-text, #000000) !important;
  border: 1px solid var(--ddc-btn-bg, #ffffff) !important;
  font-family: var(--ddc-font-mono, 'JetBrains Mono', monospace) !important;
  font-weight: 500;
  font-size: 0.8rem;
  padding: 0 18px;
  cursor: pointer;
  text-transform: uppercase !important;
  transition: background-color var(--ddc-transition-speed, 0.3s) ease, color var(--ddc-transition-speed, 0.3s) ease, border-color var(--ddc-transition-speed, 0.3s) ease !important;
  white-space: nowrap;
  flex-shrink: 0;
  width: 100%;
  height: 38px;
  display: block;
  text-align: center;
  box-sizing: border-box;
  outline: none !important;
}

.ddc-card__submit-btn:hover {
  background-color: #000000 !important;
  color: #ffffff !important;
  border: 1px solid transparent !important;
  outline: 1px solid #ffffff !important;
  outline-offset: -1px !important;
}

.ddc-card__submit-btn:focus {
  outline: 1px solid var(--ddc-focus-outline) !important;
  outline-offset: -1px !important;
}

/* Success Message State */
.ddc-card__success-msg {
  font-size: 0.85rem;
  color: var(--ddc-text-primary);
  background-color: transparent;
  padding: 8px 0;
  animation: ddcFadeIn 0.3s ease forwards;
  height: 38px;
  display: flex;
  align-items: center;
  font-weight: 500;
  letter-spacing: 0.3px;
}

.ddc-card__success-msg--hidden {
  display: none !important;
}

.ddc-card__form--hidden {
  display: none !important;
}

/* Meta tags for Downloadable cards */
.ddc-card__meta {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.ddc-card__format-tag {
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 1px;
  color: var(--ddc-text-muted);
  text-transform: uppercase;
}

.ddc-card__download-hint {
  font-size: 0.72rem;
  color: var(--ddc-text-secondary);
}

/* Shake Animation for focus prompting */
@keyframes ddcShake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-6px); }
  40%, 80% { transform: translateX(6px); }
}

.ddc-card__input-group--shake {
  animation: ddcShake 0.4s ease-in-out;
  border-color: #ffffff !important;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.4);
}

@keyframes ddcFadeIn {
  from { opacity: 0; transform: translateY(3px); }
  to { opacity: 1; transform: translateY(0); }
}


/* Floating WhatsApp Button */

.footer-contact-links{
    margin-top:20px;
    display:flex;
    flex-direction:column;
    gap:14px;
}

/* Phone Link */
.footer-phone{
    display:flex;
    align-items:center;
    gap:12px;
    color:#39e87b;
    text-decoration:none;
    font-size:15px;
    font-weight:500;
    transition:.3s ease;
}

.footer-phone svg{
    width:22px;
    height:22px;
    flex-shrink:0;
}

.footer-phone:hover{
    color:#d9d9d9;
}

/* WhatsApp Button */
.footer-whatsapp{
    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:#25D366;
    border-radius:50%;

    margin-left:auto;      /* Push to the right */
    margin-top:12px;       /* Space above */
    margin-right:0;

    box-shadow:0 4px 12px rgba(37,211,102,.35);
    transition:all .3s ease;
}

.footer-whatsapp:hover{
    transform:scale(1.08);
    box-shadow:0 6px 16px rgba(37,211,102,.45);
}

.footer-whatsapp svg{
    width:22px;
    height:22px;
    display:block;
    color:#fff;
}
.footer-whatsapp{
    align-self:flex-end;
}

/* Mobile */
@media (max-width:768px){

    .footer-whatsapp{
        align-self:center;
        margin-left:0;
        margin-right:0;
    }

}




html {
  scroll-behavior: smooth;
  scroll-snap-type: y proximity;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Inter", "Segoe UI", Arial, sans-serif;
  letter-spacing: 0;
  overscroll-behavior-y: contain;
}

html.error-page {
  scroll-snap-type: none;
}

body.error-page {
  min-height: 100vh;
  min-height: 100svh;
  overflow-x: hidden;
  overscroll-behavior-y: auto;
}

body.error-page .site-header {
  background: rgba(8, 13, 14, 0.82);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

.error-shell,
.error-hero {
  min-height: 100vh;
  min-height: 100svh;
}

.error-hero {
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 136px 24px 72px;
  background: #070909;
  text-align: center;
}

.error-hero > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.36) saturate(0.76) contrast(1.06);
}

.error-hero::after {
  position: absolute;
  inset: 0;
  content: "";
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 0.12), transparent 34%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.48), rgba(0, 0, 0, 0.82));
}

.error-copy {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  width: min(100%, 820px);
}

.error-copy p {
  margin: 0 0 14px;
  color: #c4c7c8;
  font-family: "JetBrains Mono", monospace;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 7px;
  line-height: 1;
}

.error-copy h1 {
  max-width: 820px;
  color: #e5e2e1;
  font-size: clamp(42px, 6vw, 86px);
  line-height: 0.96;
}

.error-copy span {
  max-width: 560px;
  margin-top: 24px;
  color: #c4c7c8;
  font-size: 18px;
  font-weight: 300;
  line-height: 1.55;
}

.error-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
  margin-top: 38px;
}

.error-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 168px;
  min-height: 48px;
  border: 1px solid rgba(255, 255, 255, 0.78);
  color: #fff;
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  transition: background 160ms ease, color 160ms ease, border-color 160ms ease;
}

.error-actions a:first-child,
.error-actions a:hover,
.error-actions a:focus-visible {
  border-color: #fff;
  background: #fff;
  color: #111;
}

@media (max-width: 560px) {
  .error-hero {
    padding: 116px 20px 54px;
  }

  .error-copy p {
    letter-spacing: 4px;
  }

  .error-copy h1 {
    font-size: 42px;
    line-height: 1.06;
  }

  .error-copy span {
    font-size: 14px;
    line-height: 1.5;
  }

  .error-actions {
    width: 100%;
  }

  .error-actions a {
    width: min(100%, 260px);
  }
}


main > section {
  min-height: 100vh;
  min-height: 100svh;
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}

.project-anchor {
  display: block;
  height: 0;
  scroll-margin-top: 0;
}

.footer {
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}

p {
  font-family: Inter, sans-serif;
}

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

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

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 1px solid rgba(255, 255, 255, 0.32);
}

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 20;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 36px;
  padding: 30px 6vw;
  color: #fff;
  transition: background 180ms ease, padding 180ms ease;
}

.site-header.is-scrolled {
  background: rgba(8, 13, 14, 0.82);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  padding-block: 18px;
}

.brand {
  display: inline-flex;
  align-items: center;
}

.brand img {
  width: clamp(138px, 10vw, 188px);
  height: auto;
  max-height: 34px;
  object-fit: contain;
}
nav.site-nav a {
    font-size: 12px;
    letter-spacing: 2.4px;
    font-family: 'JetBrains Mono';
    color: #fff;
    font-weight: 400;
    white-space: nowrap;
}
.site-nav {
  justify-self: center;
  display: flex;
  gap: clamp(18px, 3vw, 52px);
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.7);
}

.site-nav a,
.footer-links a {
  position: relative;
  transition: color 160ms ease;
}

.site-nav a::after {
  position: absolute;
  right: 0;
  bottom: -8px;
  left: 0;
  height: 1px;
  content: "";
  background: currentColor;
  opacity: 0;
  transform: scaleX(0);
  transform-origin: center;
  transition: opacity 160ms ease, transform 160ms ease;
}

.site-nav a:hover,
.site-nav a:focus-visible,
.site-nav a.is-active,
.footer-links a:hover {
  color: #fff;
}

.site-nav a:hover::after,
.site-nav a:focus-visible::after,
.site-nav a.is-active::after {
  opacity: 1;
  transform: scaleX(1);
}

/* 1. HIDE ON ALL PORTRAIT MOBILE AND LANDSCAPE DEVICES */
@media (max-width: 1199px), screen and (max-device-width: 1024px) and (orientation: landscape) {
    a.header-action {
        display: none !important;
    }
}

/* 2. SHOW ONLY ON TRUE LAPTOPS & DESKTOPS */
@media (min-width: 1200px) {
    a.header-action {
        position: relative !important; 
        z-index: 9999 !important;     
        display: inline-block !important;
        box-sizing: border-box !important;
        border: 1px solid var(--line, #BEBEBE) !important; 
        padding: 12px 32px !important;
        font-size: 12px;
        font-weight: 400;
        text-transform: uppercase;
        letter-spacing: 2.4px;
        font-family: 'JetBrains Mono';
        white-space: nowrap;
        transition: all 0.3s cubic-bezier(0.075, 0.82, 0.165, 1) !important;
    }

    a.header-action:hover {
        background: #ffffff !important;
        color: #000000 !important;
        border-color: #ffffff !important; 
    }
}
.menu-toggle {
  display: none;
}

.nav-close,
.mobile-nav-action {
  display: none;
}

@media (min-width: 901px) and (max-width: 1500px) {
  .site-header {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    padding: 24px 3vw;
  }

  .site-header.is-scrolled {
    padding-block: 16px;
  }

  .brand img {
    width: clamp(132px, 11vw, 152px) !important;
  }

  .site-nav {
    justify-self: center;
    gap: clamp(10px, 1.35vw, 18px);
    min-width: 0;
  }

  nav.site-nav a {
    font-size: clamp(9px, 0.78vw, 11px);
    letter-spacing: clamp(0.8px, 0.12vw, 1.4px);
    white-space: nowrap;
  }

  .header-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    font-size: 9px;
    letter-spacing: 1.2px;
    white-space: nowrap;
  }
}

.section-nav {
  position: fixed;
  top: 50%;
  left: clamp(16px, 3vw, 8px);
  z-index: 18;
  display: grid;
  gap: 17px;
  place-items: center;
  padding: 16px 10px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.46);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.34);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  transform: translateY(-50%);
}

.section-nav a {
  position: relative;
  display: grid;
  width: 18px;
  height: 18px;
  place-items: center;
  border-radius: 50%;
  outline-offset: 5px;
}

.section-nav a::before,
.section-nav a::after {
  border-radius: 50%;
  content: "";
  transition: background 180ms ease, border-color 180ms ease, opacity 180ms ease, transform 180ms ease;
}

.section-nav a::before {
  width: 6px;
  height: 6px;
  background: rgba(255, 255, 255, 0.5);
}

.section-nav a::after {
  position: absolute;
  inset: 1px;
  border: 2px solid rgba(255, 255, 255, 0);
  opacity: 0;
}

.section-nav a:hover::before,
.section-nav a:focus-visible::before,
.section-nav a.is-active::before {
  background: #fff;
}

.section-nav a.is-active::before {
  transform: scale(0.72);
}

.section-nav a.is-active::after {
  border-color: #fff;
  opacity: 1;
}

.panel {
  position: relative;
  overflow: hidden;
  min-height: 76vh;
}

.panel::after {
  position: absolute;
  inset: 0;
  content: "";
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.18), rgba(0, 0, 0, 0.46));
  pointer-events: none;
}

.panel > img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
}

.hero {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  background: #050607;
}

.hero-media,
.hero-slide,
.hero-vignette {
  position: absolute;
  inset: 0;
}

.hero-slide {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  filter: brightness(0.58) saturate(0.72) contrast(1.05);
  transform: scale(1.045);
  transition: opacity 1200ms ease, transform 6500ms ease;
}

.hero-slide.is-active {
  opacity: 1;
  transform: scale(1);
}

.hero-slide:nth-child(1) {
  object-position: center 43%;
}

.hero-slide:nth-child(2) {
  object-position: center 52%;
}

.hero-slide:nth-child(3) {
  object-position: center 48%;
}

.hero-vignette {
  z-index: 1;
  background:
    radial-gradient(circle at 50% 42%, rgba(255, 255, 255, 0.09), transparent 28%),
    linear-gradient(180deg, rgba(2, 4, 5, 0.68) 0%, rgba(2, 4, 5, 0.1) 31%, rgba(2, 4, 5, 0.24) 56%, #050607 100%),
    linear-gradient(90deg, rgba(2, 4, 5, 0.54), transparent 23%, transparent 77%, rgba(2, 4, 5, 0.54));
  pointer-events: none;
}

.hero-copy {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  align-content: center;
  justify-items: center;
  padding: 12vh 22px 18vh;
  text-align: center;
  text-transform: uppercase;
}

.hero-copy p,
.clients p,
.heritage-copy span,
.assembly-copy span {
  margin: 0 0 10px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.hero-copy .hero-kicker {
  margin-bottom: 14px;
  color: rgba(224, 209, 178, 0.92);
  font-size: clamp(0.56rem, 0.72vw, 0.68rem);
  font-weight: 500;
  letter-spacing: 0.48em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 300;
  line-height: 0.92;
  text-transform: uppercase;
}

h1 {
  max-width: 760px;
  font-size: clamp(4rem, 9.6vw, 8.8rem);
  font-weight: 300;
  line-height: 0.82;
  letter-spacing: 0;
}

.hero-copy span {
  margin-top: 24px;
  color: rgba(255, 255, 255, 0.72);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(0.95rem, 1.35vw, 1.35rem);
  font-style: italic;
  text-transform: none;
}

.hero-copy a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 166px;
  min-height: 42px;
  margin-top: 38px;
  border: 1px solid rgba(255, 255, 255, 0.58);
  color: #fff;
  font-size: 0.62rem;
  font-weight: 800;
  text-transform: uppercase;
  transition: border-color 180ms ease, color 180ms ease, background 180ms ease;
}

.hero-copy a:hover {
  border-color: rgba(224, 209, 178, 0.92);
  background: rgba(224, 209, 178, 0.08);
  color: #e0d1b2;
}

.hero-rail {
  position: absolute;
  top: 50%;
  right: 38px;
  z-index: 3;
  display: grid;
  gap: 14px;
  transform: translateY(-50%);
}

.hero-dot {
  position: relative;
  width: 1px;
  height: 34px;
  padding: 0;
  border: 0;
  background: rgba(255, 255, 255, 0.24);
  cursor: pointer;
}

.hero-dot::after {
  position: absolute;
  inset: 0;
  height: 0;
  content: "";
  background: #e0d1b2;
  transition: height 260ms ease;
}

.hero-dot.is-active::after {
  height: 100%;
}

.hero-counter {
  position: absolute;
  bottom: 38px;
  left: 6vw;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 11px;
  color: rgba(255, 255, 255, 0.42);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 0.9rem;
}

.hero-counter span:first-child {
  color: #e0d1b2;
  font-size: 1.28rem;
}

.hero-counter i {
  width: 34px;
  height: 1px;
  background: rgba(255, 255, 255, 0.24);
}
.hero-scroll {
    position: absolute;
    left: 50%;
    bottom: 30px;
    z-index: 3;
    display: grid;
    justify-items: center;
    gap: 8px;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.85);
    text-transform: uppercase;
    transform: translateX(-50%);
    font-family: 'JetBrains Mono';
}
.hero-scroll i {
  width: 2px;
  height: 44px;
  background: linear-gradient(360deg, #fff 0%, rgba(255, 255, 255, 0.78) 62%, rgba(255, 255, 255, 0.16) 100%);
  box-shadow: 0 0 5px rgba(255, 255, 255, 0.45);
  animation: scrollPulse 2.1s ease-in-out infinite;
  
}

@keyframes scrollPulse {
  0%,
  100% {
    opacity: 0.35;
    transform: scaleY(1);
  }

  50% {
    opacity: 1;
    transform: scaleY(0.62);
  }
}

.hero-video-showcase {
  position: relative;
  height: 100vh;
  height: 100svh;
  min-height: 100vh;
  min-height: 100svh;
  background: #050505;
}

.hero-video-sticky {
  position: relative;
  top: 0;
  height: 100%;
  min-height: inherit;
  overflow: hidden;
  background: #050505;
}

.hero-video-slides,
.hero-video-slide,
.hero-video-slide video {
  position: absolute;
  inset: 0;
}

.hero-video-slide {
  display: grid;
  align-items: end;
  justify-items: center;
  padding: 118px 6vw 196px;
  opacity: 0;
  transform: scale(1.08);
  transition: opacity 720ms ease, transform 1100ms ease;
}

.hero-video-slide.is-active {
  z-index: 2;
  opacity: 1;
  transform: scale(1);
}

.hero-video-slide::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  content: "";
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.42), rgba(0, 0, 0, 0.08) 38%, rgba(0, 0, 0, 0.76)),
    linear-gradient(90deg, rgba(0, 0, 0, 0.74), rgba(0, 0, 0, 0.22) 42%, rgba(0, 0, 0, 0.18));
  pointer-events: none;
}

.hero-video-slide video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.88) contrast(1.06);
}

.hero-video-copy {
  position: relative;
  z-index: 2;
  color: #fff;
  text-align: center;
  text-transform: uppercase;
}
.hero-video-copy h1 {
    margin: 0;
    margin-inline: auto;
    color: rgb(255 255 255 / 79%);
    
    /* FIX: Tries the variable first. If broken, falls back to your raw font name, then sans-serif */
    font-family: var(--heading-font, 'Jost'), sans-serif;
    
    font-size: 56px;
    font-weight: 300;
    line-height: 61px;
    letter-spacing: -1.6px;
    text-transform: uppercase;
    max-width: 100%;
}
.hero-video-copy p {
    font-size: 16px;
    font-family: 'JetBrains Mono';
    font-weight: 300;
    letter-spacing: 2.4px;
    color: #ffffffa6;
    line-height: 23px;
}

.hero-video-sound {
  position: fixed;
  right: 32px;
  bottom: 28px;
  z-index: 4;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #fff;
  background: rgba(42, 42, 42, 0.9);
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  cursor: pointer;
  transition: background 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.hero-video-sound:hover,
.hero-video-sound:focus-visible {
  border-color: rgba(255, 255, 255, 0.58);
  background: rgba(54, 54, 54, 0.96);
  box-shadow: 0 5px 14px rgba(0, 0, 0, 0.28);
  transform: translateY(-2px);
}

.hero-video-sound:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.hero-video-sound-icon{
  display:block;
  width:26px;
  height:26px;
  overflow:visible;

  fill:none;
  stroke:currentColor;
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.sound-speaker{
  fill:none;
}

.sound-wave,
.sound-slash{
  fill:none;
}

.sound-slash{
  stroke-width:2.8;
}

/* Speaker is always visible */
.sound-speaker {
    fill: currentColor;
    stroke: currentColor;
    stroke-linejoin: round;
    stroke-width: 1.5;
}

/* Waves are ALWAYS visible */
.sound-wave {
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* Slash hidden by default */
.sound-slash {
    display: none;
    fill: none;
    stroke: currentColor;
    stroke-width: 3;
    stroke-linecap: round;
}

/* Only show slash when muted */
.hero-video-sound:not(.is-unmuted) .sound-slash {
    display: block;
}

/* Hide slash when unmuted */
.hero-video-sound.is-unmuted .sound-slash {
    display: none;
}

.hero-video-progress {
  position: absolute;
  top: 50%;
  left: 6vw;
  z-index: 3;
  display: grid;
  gap: 22px;
  transform: translateY(-50%);
}

.hero-video-progress button {
  position: relative;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}

.hero-video-progress button::before,
.hero-video-progress button::after {
  position: absolute;
  border-radius: 50%;
  content: "";
  transition: background 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.hero-video-progress button::before {
  inset: 6px;
  background: rgba(255, 255, 255, 0.58);
}

.hero-video-progress button::after {
  inset: 0;
  border: 2px solid transparent;
}

.hero-video-progress button:hover::before,
.hero-video-progress button:focus-visible::before {
  background: #fff;
}

.hero-video-progress button:focus-visible {
  outline: 0;
}

.hero-video-progress button.is-active::before {
  background: #fff;
  transform: scale(0.72);
}

.hero-video-progress button.is-active::after {
  border-color: #fff;
}


h2 {
  font-size: clamp(2rem, 4.2vw, 4.9rem);
}

.section-pad {
  padding: clamp(58px, 8vh, 96px) 6vw;
}

.showcase {
  display: grid;
  align-content: center;
  min-height: 100vh;
  min-height: 100svh;
  padding-right: 0;
  padding-left: 0;
  background: #111;
}

.tabs {
  display: flex;
  justify-content: center;
  gap: clamp(28px, 7vw, 130px);
  margin-bottom: clamp(70px, 5vh, 56px);
}

.tab {
    position: relative;
    appearance: none;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.64);
    cursor: pointer;
    font: inherit;
    font-size: 24px;
    font-weight: 400;
    text-transform: uppercase;
    transition: color 180ms ease;
    font-family: 'JetBrains Mono';
}
.tab:hover,
.tab:focus-visible,
.tab.is-active {
  color: #fff;
}

.tab:focus-visible,
.dot:focus-visible {
  outline: 1px solid rgba(255, 255, 255, 0.82);
  outline-offset: 6px;
}

.tab.is-active::after {
  position: absolute;
  right: 0;
  bottom: -8px;
  left: 0;
  height: 1px;
  content: "";
  background: #fff;
}

.project-slider {
  position: relative;
  width: 100%;
  margin: 0;
}

.die-grid {
  --project-slide-direction: 1;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  min-height: clamp(230px, 34vh, 350px);
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
  overflow: hidden;
}

.die-grid.is-dragging {
  cursor: grabbing;
}

.die-grid:focus-visible {
  outline: 1px solid rgba(255, 255, 255, 0.65);
  outline-offset: 8px;
}

.die-card {
  position: relative;
  z-index: 1;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: #1a1a1a;
  animation: projectCardIn 900ms cubic-bezier(0.22, 1, 0.36, 1) both;
  will-change: opacity, transform;
}

.die-card-exit {
  position: absolute !important;
  z-index: 2;
  margin: 0 !important;
  pointer-events: none;
  animation: projectCardOut 900ms cubic-bezier(0.22, 1, 0.36, 1) both !important;
}

.die-card:only-child {
  grid-column: 1 / -1;
}

.die-card a,
.die-card-expand {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}

.die-card-expand::before {
  position: absolute;
  top: clamp(14px, 2vw, 22px);
  right: clamp(14px, 2vw, 22px);
  z-index: 2;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.48);
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.58);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
  content: "";
  pointer-events: none;
  transition: background 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.die-card-expand::after {
  position: absolute;
  top: calc(clamp(14px, 2vw, 22px) + 11px);
  right: calc(clamp(14px, 2vw, 22px) + 11px);
  z-index: 3;
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 8V3H8M12 3H17V8M17 12V17H12M8 17H3V12' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  pointer-events: none;
  transition: transform 180ms ease;
}

.die-card-expand:hover::before,
.die-card-expand:focus-visible::before {
  border-color: #fff;
  background: rgba(255, 255, 255, 0.14);
  transform: scale(1.06);
}

.die-card-expand:hover::after,
.die-card-expand:focus-visible::after {
  transform: scale(1.08);
}

.die-card img {
  width: 100%;
  height: 550px;
  object-fit: cover;
  filter: saturate(0.78) contrast(1.05);
  transform: scale(1.001);
  transform-origin: center;
  transition:
    transform 900ms cubic-bezier(0.2, 0.65, 0.3, 1),
    filter 700ms ease;
  will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
  .die-card:hover img,
  .die-card:focus-within img {
    filter: saturate(0.94) contrast(1.08);
    transform: scale(1.06);
  }
}

.project-lightbox {
  --lightbox-scale: 1;
  --lightbox-pan-x: 0px;
  --lightbox-pan-y: 0px;
  position: fixed;
  inset: 0;
  z-index: 1000;
  overflow: hidden;
  background: rgba(5, 5, 5, 0.97);
  opacity: 0;
  touch-action: none;
  transition: opacity 320ms ease;
}

.project-lightbox[hidden] {
  display: none;
}

.project-lightbox-stage {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  cursor: zoom-in;
  touch-action: none;
}

.project-lightbox img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  user-select: none;
  opacity: 0;
  transform:
    translate3d(var(--lightbox-pan-x), var(--lightbox-pan-y), 0)
    scale(calc(var(--lightbox-scale) * 0.88));
  transition:
    opacity 360ms ease,
    transform 720ms cubic-bezier(0.16, 1, 0.3, 1);
  transform-origin: center;
  will-change: transform;
}

.project-lightbox.is-open {
  opacity: 1;
}

.project-lightbox.is-open img {
  opacity: 1;
  transform:
    translate3d(var(--lightbox-pan-x), var(--lightbox-pan-y), 0)
    scale(var(--lightbox-scale));
  transition:
    opacity 360ms ease,
    transform 240ms cubic-bezier(0.2, 0.65, 0.3, 1);
}

.project-lightbox.is-dragging img,
.project-lightbox.is-pinching img {
  transition: none;
}

.project-lightbox.is-zoomed .project-lightbox-stage {
  cursor: grab;
}

.project-lightbox.is-dragging .project-lightbox-stage {
  cursor: grabbing;
}

.project-lightbox-toolbar {
  position: absolute;
  top: clamp(16px, 2.5vw, 30px);
  right: clamp(16px, 2.5vw, 30px);
  z-index: 4;
  display: flex;
  align-items: center;
  gap: 8px;
}

.project-lightbox-tool,
.project-lightbox-close {
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.48);
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.52);
  color: #fff;
  font: 300 25px/1 Arial, sans-serif;
  cursor: pointer;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease;
}

.project-lightbox-zoom {
  min-width: 52px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-align: center;
}

.project-lightbox-hint {
  position: absolute;
  bottom: clamp(16px, 3vw, 30px);
  left: 50%;
  z-index: 3;
  margin: 0;
  color: rgba(255, 255, 255, 0.62);
  font-size: 12px;
  letter-spacing: 0.06em;
  pointer-events: none;
  transform: translateX(-50%);
  transition: opacity 240ms ease;
}

.project-lightbox.is-zoomed .project-lightbox-hint {
  opacity: 0;
}

.project-lightbox-close {
  position: relative;
}

.project-lightbox-close::before,
.project-lightbox-close::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 22px;
  height: 2px;
  background: currentColor;
  content: "";
}

.project-lightbox-close::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.project-lightbox-close::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

.project-lightbox-tool:hover,
.project-lightbox-tool:focus-visible,
.project-lightbox-close:hover,
.project-lightbox-close:focus-visible {
  border-color: #fff;
  background: #fff;
  color: #000;
}

.project-lightbox-arrow {
  position: absolute;
  top: 50%;
  z-index: 4;
  display: grid;
  width: 48px;
  height: 48px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.65);
  border-radius: 50%;
  background: rgba(2, 7, 8, 0.28);
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  transform: translateY(-50%);
  transition: background 180ms ease, border-color 180ms ease;
}

.project-lightbox-arrow-left {
  left: clamp(14px, 3vw, 42px);
}

.project-lightbox-arrow-right {
  right: clamp(14px, 3vw, 42px);
}

.project-lightbox-arrow:hover,
.project-lightbox-arrow:focus-visible {
  border-color: #fff;
  background: rgba(2, 7, 8, 0.55);
}

.project-lightbox-arrow:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 4px;
}

.project-lightbox-close:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 4px;
}

body.is-project-lightbox-open {
  overflow: hidden;
}

@media (max-width: 600px) {
  .project-lightbox-arrow {
    top: auto;
    bottom: 24px;
    transform: none;
  }

  .project-lightbox-arrow-left {
    left: 20px;
  }

  .project-lightbox-arrow-right {
    right: 20px;
  }

  .project-lightbox-hint {
    bottom: 82px;
    width: calc(100% - 40px);
    text-align: center;
  }
}

/* Equipment & Facilities moved from the former Capabilities page */
.equipment-page {
  position: relative;
  min-height: 100vh;
  min-height: 100svh;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 18%, rgba(32, 118, 91, 0.11), transparent 26%),
    linear-gradient(180deg, #070808 0%, #101211 52%, #080909 100%);
  color: #f2f0ed;
}

.equipment-inner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(300px, 0.82fr) minmax(480px, 1.18fr);
  gap: clamp(48px, 5.2vw, 82px);
  align-items: center;
  width: min(100%, 1380px);
  min-height: 100vh;
  min-height: 100svh;
  margin: 0 auto;
  padding: clamp(96px, 11vh, 132px) clamp(28px, 5vw, 76px) clamp(70px, 9vh, 104px);
}

.equipment-media {
  position: relative;
  align-self: stretch;
  overflow: hidden;
  min-height: 510px;
  background: transparent;
}

.equipment-media::after {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
}

.equipment-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.equipment-content {
  position: relative;
  min-width: 0;
}

.equipment-kicker {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 14px;
  color: #fff;
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  letter-spacing: 2.3px;
  line-height: 1.4;
  text-transform: uppercase;
}

.equipment-kicker::before {
  width: 2px;
  height: 11px;
  background: #fff;
  content: "";
}

.equipment-content h2 {
  margin: 0 0 20px;
  color: #e5e2e1;
  font-family: "Jost", sans-serif;
  font-size: 52px;
  font-weight: 300;
  letter-spacing: 0;
  line-height: 62px;
  text-transform: uppercase;
}

.equipment-copy {
  max-width: 680px;
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: clamp(14px, 1.05vw, 16px);
  font-weight: 300;
  line-height: 1.75;
}

.equipment-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(200px, 1fr));
  gap: 0 clamp(30px, 4vw, 56px);
  margin: clamp(24px, 2.8vw, 36px) 0 0;
  padding: 0;
  list-style: none;
}

.equipment-list li {
  min-height: 54px;
  padding: 14px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.13);
  color: #fff;
  font-size: 14px;
  line-height: 1.4;
}

.equipment-list li:nth-last-child(-n + 2) {
  border-bottom: 1px solid rgba(255, 255, 255, 0.13);
}

.equipment-iso {
  display: block;
  width: clamp(62px, 5vw, 78px);
  height: auto;
  margin: 16px 0 0 auto;
  position: absolute;
  right: -60px;
}

@media (max-width: 980px) {
  .equipment-inner {
    grid-template-columns: 1fr;
    gap: 34px;
    min-height: auto;
  }

  .equipment-media {
    min-height: 430px;
  }
}

@media (max-width: 700px) {
  .equipment-inner {
    gap: 28px;
    padding: 72px 22px 52px;
  }

  .equipment-media {
    min-height: 320px;
  }

  .equipment-content h2 {
    font-size: 31px;
    line-height: 1.15;
  }

  .equipment-list {
    grid-template-columns: 1fr;
  }

  .equipment-list li:nth-last-child(-n + 2) {
    border-bottom: 0;
  }

  .equipment-list li:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, 0.13);
  }

  .equipment-iso {
    position: static;
    width: 62px;
    margin-top: 18px;
    margin-left: auto;
  }
}

@media (hover: none), (pointer: coarse) {
  .project-lightbox-hint {
    content: "Pinch to zoom · Drag to move";
  }
}

.die-card:nth-child(1) img {
  object-position: 15% 46%;
}

.die-card:nth-child(2) img {
  object-position: 84% 46%;
}

.die-card span {
  position: absolute;
  right: 18%;
  bottom: 12px;
  left: 18%;
  padding: 10px 18px;
  background: rgba(0, 0, 0, 0.75);
  color: #fff;
  font-size: 0.72rem;
  font-weight: 800;
  text-align: center;
  text-transform: uppercase;
}

.project-arrow {
  position: absolute;
  top: 50%;
  z-index: 2;
  display: grid;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 50%;
  place-items: center;
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  transform: translateY(-50%);
}

.project-arrow:hover,
.project-arrow:focus-visible {
  background: rgba(0, 0, 0, 0.62);
}

.project-arrow:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.project-arrow-left {
  left: max(16px, calc((100% - 1100px) / 2 + 16px));
}

.project-arrow-right {
  right: max(16px, calc((100% - 1100px) / 2 + 16px));
}

.slider-dots {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-top: clamp(32px, 5vh, 56px);
}

.project-slider .slider-dots {
  position: relative;
  right: auto;
  bottom: auto;
  left: auto;
  z-index: 3;
  width: max-content;
  padding: 10px 14px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.52);
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.35);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  margin: 18px auto 0;
  pointer-events: none;
  transform: none;
}

.project-slider .slider-dots .dot {
  background: rgba(255, 255, 255, 0.58);
  pointer-events: auto;
}

.project-slider .slider-dots .dot:hover,
.project-slider .slider-dots .dot.is-active {
  background: #fff;
}

.dot {
  width: 12px;
  height: 12px;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.22);
  cursor: pointer;
  transition: background 180ms ease, transform 180ms ease;
}

.dot:hover,
.dot.is-active {
  background: rgba(255, 255, 255, 0.62);
}

.dot.is-active {
  transform: scale(1.12);
}

@keyframes projectCardIn {
  from {
    opacity: 0;
    transform: translate3d(calc(var(--project-slide-direction, 1) * 2.5%), 0, 0) scale(1.01);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes projectCardOut {
  from {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }

  to {
    opacity: 0;
    transform: translate3d(calc(var(--project-slide-direction, 1) * -2.5%), 0, 0) scale(1.01);
  }
}

@keyframes sliderEnterLeft {
  from {
    opacity: 0;
    transform: translateX(6%) scale(1.02);
  }

  to {
    opacity: 1;
    transform: translateX(0) scale(1);
  }
}

.factory {
  min-height: 0;
  height: 100vh;
  height: 100svh;
  cursor: grab;
  touch-action: pan-y;
  user-select: none;
}

.factory.is-dragging {
  cursor: grabbing;
}

.factory::after {
  background:
    linear-gradient(180deg, rgba(2, 7, 8, 0.42), rgba(2, 7, 8, 0.34) 42%, rgba(2, 7, 8, 0.7)),
    linear-gradient(90deg, rgba(2, 7, 8, 0.46), rgba(2, 7, 8, 0.22) 58%, rgba(2, 7, 8, 0.3));
}

.factory-bg,
.factory-slide {
  position: absolute;
  inset: 0;
}

.factory-bg {
  pointer-events: none;
}

.factory-bg.is-resetting .factory-slide {
  transition: none !important;
}

.factory-slide {
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: brightness(0.78) saturate(0.78) contrast(1.03);
  opacity: 0;
  transform: translate3d(2.5%, 0, 0) scale(1.01);
  transition:
    opacity 760ms ease,
    transform 900ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

.factory-slide.is-active {
  z-index: 1;
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.factory-slide.is-entering-from-right {
  z-index: 2;
  opacity: 0;
  transform: translate3d(2.5%, 0, 0) scale(1.01);
}

.factory-slide.is-entering-from-left {
  z-index: 2;
  opacity: 0;
  transform: translate3d(2.5%, 0, 0) scale(1.01);
}

.factory-slide.is-leaving-to-left {
  z-index: 1;
  opacity: 0;
  transform: translate3d(-2.5%, 0, 0) scale(1.01);
}

.factory-slide.is-leaving-to-right {
  z-index: 1;
  opacity: 0;
  transform: translate3d(-2.5%, 0, 0) scale(1.01);
}

.factory .lower-left {
  bottom: clamp(28px, 5.2vw, 68px);
  left: 50%;
  width: min(890px, calc(100vw - 48px));
  text-align: center;
  transform: translateX(-50%);
}.factory .lower-left h2 {
    max-width: 890px;
    margin: 0 auto;
    font-size: 52px;
    font-family: var(--heading-font, 'Jost'), sans-serif !important; 
    line-height: 62px;
    text-transform: uppercase;
    color: #E5E2E1;
    letter-spacing: 0;
}

.factory .lower-left::after {
  width: 64px;
  margin-top: 22px;
  margin-right: auto;
  margin-left: auto;
}

.factory-dots {
  position: absolute;
  right: 50%;
  bottom: 25px;
  z-index: 3;
  display: flex;
  gap: 11px;
  transform: translateX(50%);
}

.factory-dots button {
  display: grid;
  width: 16px;
  height: 16px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  place-items: center;
  background: transparent;
  cursor: pointer;
}

.factory-dots button::before {
  display: block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.38);
  content: "";
  transition: background 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.factory-dots button:hover::before,
.factory-dots button:focus-visible::before,
.factory-dots button.is-active::before {
  background: #fff;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.28);
  transform: scale(1.12);
}

.factory-dots button:focus-visible {
  outline: 1px solid #fff;
  outline-offset: 3px;
}

.factory-expand {
  position: absolute;
  top: 100px;
  right: clamp(18px, 4vw, 54px);
  z-index: 4;
  display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.48);
  border-radius: 50%;
  place-items: center;
  background: rgba(0, 0, 0, 0.58);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
  cursor: zoom-in;
  transition: background 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.factory-expand::before {
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 8V3H8M12 3H17V8M17 12V17H12M8 17H3V12' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  transition: transform 180ms ease;
}

.factory-expand:hover,
.factory-expand:focus-visible {
  border-color: #fff;
  background: rgba(255, 255, 255, 0.14);
  transform: scale(1.06);
}

.factory-expand:hover::before,
.factory-expand:focus-visible::before {
  transform: scale(1.08);
}

.factory-expand:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.factory-arrow {
  position: absolute;
  top: 50%;
  z-index: 3;
  display: grid;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.65);
  border-radius: 50%;
  place-items: center;
  background: rgba(2, 7, 8, 0.28);
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  transform: translateY(-50%);
  transition: background 180ms ease, border-color 180ms ease;
}

.factory-arrow:hover,
.factory-arrow:focus-visible {
  border-color: #fff;
  background: rgba(2, 7, 8, 0.55);
}

.factory-arrow:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.factory-arrow-left {
  left: clamp(90px, 7vw, 130px);
}

.factory-arrow-right {
  right: clamp(32px, 4vw, 72px);
}

.lower-left {
  position: absolute;
  z-index: 2;
  bottom: 72px;
  left: 6vw;
}

.lower-left::after {
  display: block;
  width: min(760px, 82vw);
  height: 1px;
  margin-top: 30px;
  content: "";
  background: rgba(255, 255, 255, 0.24);
}

.precision-panel {
  position: relative;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  background: #070b0d;
  outline: 0;
}

.precision-column {
  min-width: 0;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  filter: brightness(0.9) saturate(0.96) contrast(1.02);
  transition: filter 240ms ease, transform 360ms ease;
}

.precision-dots {
  display: none;
}

.precision-column.is-active {
  opacity: 1;
}

.precision-dots button {
  width: 11px;
  height: 11px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.38);
  cursor: pointer;
}

.precision-dots button.is-active {
  background: #fff;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.2);
}

.precision-arrow {
  position: absolute;
  top: 50%;
  z-index: 4;
  display: none;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.65);
  border-radius: 50%;
  place-items: center;
  background: rgba(2, 7, 8, 0.28);
  color: #fff;
  cursor: pointer;
  transform: translateY(-50%);
  transition: background 180ms ease, border-color 180ms ease;
}

.precision-arrow:hover,
.precision-arrow:focus-visible {
  border-color: #fff;
  background: rgba(2, 7, 8, 0.55);
}

.precision-arrow-left {
  left: clamp(90px, 7vw, 130px);
}

.precision-arrow-right {
  right: clamp(32px, 4vw, 72px);
}

.precision-column-left {
  background-image: url("images/grid-image-1.avif");
}

.precision-column-center {
  background-image: url("images/grid-image-2.avif");
}

.precision-column-right {
  background-image: url("images/grid-image-3.avif");
}

.precision-panel:hover .precision-column,
.precision-panel.is-hovered .precision-column,
.precision-panel:focus .precision-column,
.precision-panel:focus-visible .precision-column {
  filter: brightness(0.78) saturate(0.9) contrast(1.06);
  transform: scale(1.015);
}

@media (max-width: 900px) {
  .precision-panel {
    display: block;
    grid-template-columns: none;
  }

  .precision-column {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    opacity: 0;
    transform: translate3d(100%, 0, 0);
    transition:
      opacity 360ms ease,
      filter 240ms ease,
      transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .precision-column.is-active {
    z-index: 1;
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }

  .precision-panel:hover .precision-column,
  .precision-panel.is-hovered .precision-column,
  .precision-panel:focus .precision-column,
  .precision-panel:focus-visible .precision-column {
    transform: translate3d(100%, 0, 0);
  }

  .precision-panel:hover .precision-column.is-active,
  .precision-panel.is-hovered .precision-column.is-active,
  .precision-panel:focus .precision-column.is-active,
  .precision-panel:focus-visible .precision-column.is-active {
    transform: translate3d(0, 0, 0);
  }

  .precision-dots {
    position: absolute;
    right: 0;
    bottom: 24px;
    left: 0;
    z-index: 4;
    display: flex;
    justify-content: center;
    gap: 9px;
  }
}

@media (max-width: 900px) {
  .precision-arrow {
    display: grid;
    width: 42px;
    height: 42px;
  }

  .precision-arrow-left {
    left: 18px;
  }

  .precision-arrow-right {
    right: 18px;
  }
}
.precision-strip {
    position: absolute;
    top: 44%;
    left: 50%;
    z-index: 2;
    display: grid;
    gap: 9px;
    width: min(624px, 56vw);
    min-height: 74px;
    padding: 18px clamp(22px, 3vw, 48px);
    background: rgba(2, 5, 6, 0.92);
    color: rgba(255, 255, 255, 0.88);
    text-align: center;
    text-transform: uppercase;
    opacity: 0;
    transform: translate(-50%, -50%) translateY(12px);
    transition: opacity 220ms ease, transform 260ms ease;
    pointer-events: none;
}

.precision-panel:hover .precision-strip,
.precision-panel.is-hovered .precision-strip,
.precision-panel:focus .precision-strip,
.precision-panel:focus-visible .precision-strip {
  opacity: 1;
  transform: translate(-50%, -50%);
}
.precision-strip strong {
    font-size: 26px;
    font-weight: 300;
    line-height: 32px;
    font-family: var(--heading-font);
    letter-spacing: -0.64px;
    color: #E5E2E1;
}
.precision-strip span {
    color: #C4C7C8;
    font-family: 'JetBrains Mono';
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
}
.assembly {
  min-height: 86vh;
  background: #070909;
}

.assembly::after {
  background:
    linear-gradient(180deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.18) 48%, rgba(0, 0, 0, 0.62)),
    linear-gradient(90deg, rgba(2, 5, 6, 0.8), rgba(2, 5, 6, 0.28) 34%, rgba(2, 5, 6, 0.18) 68%, rgba(2, 5, 6, 0.72));
}

.assembly-media,
.assembly-slide {
  position: absolute;
  inset: 0;
}

.assembly-slide {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0;
  filter: brightness(0.55) saturate(0.68) contrast(1.05);
  transform: scale(1.045);
  transition: opacity 900ms ease, transform 5600ms ease;
}

.assembly-slide.is-active {
  opacity: 1;
  transform: scale(1);
  animation: sliderEnterLeft 720ms ease both;
}

.assembly-slide:nth-child(1) {
  object-position: center 52%;
}

.assembly-slide:nth-child(2) {
  object-position: center 46%;
}

.assembly-slide:nth-child(3) {
  object-position: center 50%;
}

.assembly-copy {
  position: absolute;
  z-index: 2;
  top: 33%;
  left: 6vw;
  max-width: 590px;
}

.assembly-copy h2 {
  margin-bottom: 40px;
  font-size: clamp(2.35rem, 4.45vw, 5rem);
  line-height: 0.92;
}

.assembly-copy a,
.contact-copy a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 154px;
  min-height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.65);
  background: rgba(255, 255, 255, 0.94);
  color: #171717;
  font-size: 0.64rem;
  font-weight: 900;
  text-transform: uppercase;
}

.assembly-control {
  position: absolute;
  right: 6vw;
  bottom: 54px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 16px;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.18em;
}

.assembly-control button {
  width: 34px;
  height: 34px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.04);
  color: #fff;
  cursor: pointer;
  font-size: 1.1rem;
  line-height: 1;
  transition: background 160ms ease, border-color 160ms ease;
}

.assembly-control button:hover,
.assembly-control button:focus-visible {
  border-color: rgba(255, 255, 255, 0.46);
  background: rgba(255, 255, 255, 0.12);
}

.assembly-control strong,
.assembly-control em {
  color: rgba(255, 255, 255, 0.9);
  font: inherit;
}

.clients {
  display: grid;
  align-content: center;
  justify-items: center;
  min-height: 100vh;
  min-height: 100svh;
  background: #111;
  text-align: center;
}
.clients p {
    margin-bottom: 9px;
    color: #C4C7C8;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 2.4px;
    line-height: 14px;
    font-family: 'JetBrains Mono';
}

.clients h2 {
    margin: 0 0 16px;
    color: #E5E2E1;
    font-size: 52px;
    font-weight: 300;
    font-family: var(--heading-font, 'Jost'), sans-serif !important; 
    line-height: 62px;
    text-transform: uppercase;
    letter-spacing: -2px;
    font-family: var(--heading-font);
}

.clients .clients-intro {
    margin: 0 0 clamp(42px, 4.8vw, 70px);
    color: #C4C7C8;
    font-size: 20px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 1.45;
    text-transform: none;
    font-family: var(--heading-font);
}

.logo-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(96px, 1fr));
  gap: clamp(36px, 4.2vw, 66px) clamp(42px, 5vw, 82px);
  width: min(1120px, 82vw);
  align-items: center;
  justify-items: center;
}

.logo-grid img {
  width: auto;
  max-width: min(150px, 100%);
  max-height: 48px;
  object-fit: contain;
}

.logo-grid img:nth-child(3),
.logo-grid img:nth-child(7),
.logo-grid img:nth-child(9),
.logo-grid img:nth-child(10) {
  max-height: 58px;
}

.logo-grid img:nth-child(4),
.logo-grid img:nth-child(5),
.logo-grid img:nth-child(6),
.logo-grid img:nth-child(11),
.logo-grid img:nth-child(12) {
  max-width: 150px;
}

.clients .clients-disclaimer {
  width: min(1040px, 82vw);
  margin: clamp(30px, 3.2vw, 44px) auto 0;
  color: #fff;
  font-family: var(--heading-font);
  font-size: 9px;
  font-weight: 300;
  letter-spacing: 0.02em;
  line-height: 1.65;
  text-align: center;
  text-transform: none;
  color: #292929;
}

.heritage {
  position: relative;
  display: grid;
  min-height: 100vh;
  min-height: 100svh;
  overflow: hidden;
  background: #111;
}

.heritage::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(17, 17, 17, 0) 0%, rgba(17, 17, 17, 0.16) 42%, rgba(17, 17, 17, 0.88) 69%, #111 100%),
    linear-gradient(180deg, rgba(17, 17, 17, 0.04) 0%, rgba(17, 17, 17, 0.12) 56%, rgba(17, 17, 17, 0.36) 100%);
  content: "";
  pointer-events: none;
}

.heritage-media {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.heritage-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left center;
}

.heritage-copy {
  position: relative;
  z-index: 2;
  align-self: center;
  justify-self: end;
  font-family: var(--heading-font, 'YourFontName'), sans-serif;
  width: min(34vw, 520px);
  margin-right: clamp(62px, 9vw, 156px);
  padding: clamp(60px, 5.6vw, 96px) 0;
}

.heritage-copy span {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin: 0 0 18px;
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 2.4px;
    line-height: 14px;
    text-transform: uppercase;
    font-family: 'JetBrains Mono';
}

.heritage-copy span::before {
    display: block;
    width: 2px;
    height: 10px;
    background: rgba(255, 255, 255, 0.74);
    content: "";
}

.heritage-copy h2 {
    max-width: 390px;
    margin: 0 0 clamp(28px, 3vw, 44px);
    color: #E5E2E1;
    font-size: 52px;
    line-height: 62px;
    text-transform: uppercase;
    font-family: var(--heading-font, 'Jost'), sans-serif;
    font-weight: 300;
}
.heritage-copy p, .heritage-list li {
    color: #fff;
    font-size: 16px;
    font-weight: 300;
    line-height: 32px;
    font-family: inter, sans-serif;
}
.heritage-copy p {
  margin: 0 0 30px;
}

.heritage-list {
  margin: 0 0 30px;
}

.heritage-list p {
  margin-bottom: 7px;
}

.heritage-list ul {
  display: grid;
  gap: 5px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.heritage-list li::before {
  content: ">";
  margin-right: 2px;
  color: rgba(255, 255, 255, 0.88);
}

.contact {
  min-height: 100vh;
  min-height: 100svh;
  background: #050809;
}

.contact::after {
  background:
    radial-gradient(circle at 50% 26%, rgba(255, 255, 255, 0.1), transparent 54%),
    linear-gradient(180deg, rgba(2, 5, 6, 0.54), rgba(2, 5, 6, 0.25) 42%, rgba(2, 5, 6, 0.78)),
    linear-gradient(90deg, rgba(2, 5, 6, 0.8), rgba(2, 5, 6, 0.22) 28%, rgba(2, 5, 6, 0.22) 72%, rgba(2, 5, 6, 0.82));
}

.contact > img {
  filter: brightness(0.66) saturate(0.78) contrast(1.04);
  object-position: center 45%;
}

.contact-copy {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  align-content: center;
  justify-items: center;
  padding: clamp(72px, 9vw, 132px) 24px;
  text-align: center;
}

.contact-copy h2 {
    max-width: 610px;
    margin: 0 0 50px;
    color: #E5E2E1;
    font-size: 52px;
     font-family: var(--heading-font, 'Jost'), sans-serif !important; 
    line-height: 62px;
    text-transform: uppercase;
    font-family: var(--heading-font);
    font-weight: 300;
    letter-spacing: -2px;
}

.contact-email {
  display: grid;
  justify-items: center;
  width: min(100%, 520px);
  margin-bottom: 26px;
  text-align: center;
}

.contact-email-confirm {
  min-height: 42px;
  padding: 0 18px;
  border: 1px solid rgba(255, 255, 255, 0.48);
  background: rgba(0, 0, 0, 0.28);
  color: #fff;
  cursor: pointer;
  font-family: "JetBrains Mono", monospace;
  font-size: 10px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  transition: background 180ms ease, color 180ms ease, border-color 180ms ease;
}

.contact-email-confirm:hover,
.contact-email-confirm:focus-visible {
  border-color: #fff;
  background: #fff;
  color: #111;
}

.contact-email-image[hidden] {
  display: none;
}

.contact-email-image {
  display: grid;
  justify-items: center;
  gap: 8px;
  width: min(100%, 400px);
  margin-inline: auto;
}

.contact-email-image span {
  color: rgba(255, 255, 255, 0.68);
  font-family: "JetBrains Mono", monospace;
  font-size: 9px;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.contact-email-image img {
  width: 100%;
  max-width: 400px;
  height: auto;
  border: 1px solid rgba(255, 255, 255, 0.14);
}

@media (max-width: 900px) {
  .contact-email {
    width: min(100%, 460px);
    margin-bottom: 22px;
  }

  .contact-email-image {
    width: min(100%, 360px);
  }
}

@media (max-width: 560px) {
  .contact-email {
    width: 100%;
    margin-bottom: 18px;
  }

  .contact-email-confirm {
    width: 100%;
    max-width: 320px;
    min-height: 46px;
    padding: 10px 14px;
    line-height: 1.45;
  }

  .contact-email-image {
    width: min(100%, 310px);
  }

  .contact-email-image img {
    max-width: 310px;
  }
}

.contact-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(190px, 1fr));
  gap: 22px 28px;
  width: min(100%, 800px);
}

.contact-field {
  display: grid;
  gap: 7px;
  min-width: 0;
  text-align: left;
}

.contact-field-wide {
  grid-column: 1 / -1;
}
.contact-field label {
    color: #E5E2E1;
    font-size: 10px;
    font-weight: 400;
    line-height: 1;
    font-family: 'JetBrains Mono';
    text-transform: uppercase;
}
.contact-field input,
.contact-field textarea {
    width: 100%;
    min-height: 62px;
    border: 0;
    border-bottom: 1px solid rgba(210, 235, 233, 0.34);
    border-radius: 0;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: rgba(255, 255, 255, 0.3);
    font-family: 'JetBrains Mono';
    font-size: 16px;
    line-height: 1.45;
    letter-spacing: 0px;
    text-transform: uppercase;
    outline: 0;
    font-weight: 400;
    box-shadow: none;
    color-scheme: dark;
    appearance: none;
    -webkit-appearance: none;
}

.contact-field input:hover,
.contact-field textarea:hover,
.contact-field input:focus,
.contact-field textarea:focus,
.contact-field input:active,
.contact-field textarea:active {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: rgba(255, 255, 255, 0.72);
}

.contact-field input:-webkit-autofill,
.contact-field input:-webkit-autofill:hover,
.contact-field input:-webkit-autofill:focus,
.contact-field input:-webkit-autofill:active,
.contact-field textarea:-webkit-autofill,
.contact-field textarea:-webkit-autofill:hover,
.contact-field textarea:-webkit-autofill:focus,
.contact-field textarea:-webkit-autofill:active {
  caret-color: #fff;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.72) !important;
  -webkit-box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0) inset !important;
  box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0) inset !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  filter: none !important;
  transition: background-color 999999s ease-in-out 0s, color 999999s ease-in-out 0s;
}

.contact-field input:autofill,
.contact-field textarea:autofill,
.contact-field input:-moz-autofill,
.contact-field textarea:-moz-autofill {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  color: rgba(255, 255, 255, 0.72) !important;
  box-shadow: none !important;
}

.contact-field textarea {
  min-height: calc((16px * 1.45 * 4) + 24px);
  padding-top: 24px;
  resize: vertical;
}

.contact-field input::placeholder,
.contact-field textarea::placeholder {
  color: rgba(255, 255, 255, 0.5);
  opacity: 1;
}

.contact-field input:focus,
.contact-field textarea:focus {
  border-color: rgba(255, 255, 255, 0.86);
}

.ddc-card__input:hover,
.ddc-card__input:focus,
.ddc-card__input:active {
  background: transparent !important;
  box-shadow: none !important;
}

.contact-form button {
    grid-column: 1 / -1;
    justify-self: center;
    min-width: 206px;
    min-height: 48px;
    margin-top: 28px;
    border: 1px solid rgba(255, 255, 255, 0.86);
    background: #fff;
    color: #000;
    font: inherit;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 2.4px;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 160ms ease, color 160ms ease, border-color 160ms ease;
    font-family: 'JetBrains Mono';
}

.contact-form button:hover,
.contact-form button:focus-visible {
  border-color: #fff;
  background: transparent;
  color: #fff;
}

.contact-form button:disabled,
.career-form button:disabled {
  cursor: wait;
  opacity: 0.72;
}

.contact-form button:disabled:hover,
.contact-form button:disabled:focus-visible {
  border-color: rgba(255, 255, 255, 0.86);
  background: #fff;
  color: #000;
}

.form-status {
  grid-column: 1 / -1;
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
  font-family: 'JetBrains Mono';
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 1px;
  line-height: 1.5;
  text-align: center;
  text-transform: uppercase;
}

.form-status.is-success {
  color: #a7f3d0;
}

.form-status.is-error {
  color: #fecaca;
}

.terms-page {
  min-height: 100vh;
  background: #070808;
  color: #e5e2e1;
}

.terms-page main {
  background:
    radial-gradient(circle at 18% 14%, rgba(32, 118, 91, 0.12), transparent 28%),
    linear-gradient(180deg, #070808 0%, #101211 100%);
}

.terms-privacy-section {
  min-height: 100vh;
  padding: clamp(128px, 15vh, 172px) clamp(22px, 6vw, 96px) clamp(72px, 9vh, 112px);
}

.terms-privacy-inner {
  width: min(100%, 980px);
  margin: 0 auto;
}

.terms-privacy-kicker {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 14px;
  color: #fff;
  font-family: "JetBrains Mono", monospace;
  font-size: 11px;
  letter-spacing: 2.3px;
  line-height: 1.4;
  text-transform: uppercase;
}

.terms-privacy-kicker::before {
  width: 2px;
  height: 11px;
  background: #fff;
  content: "";
}

.terms-privacy-section h1 {
  margin: 0 0 clamp(34px, 5vw, 58px);
  color: #e5e2e1;
  font-family: "Jost", sans-serif;
  font-size: clamp(38px, 5vw, 56px);
  font-weight: 300;
  letter-spacing: 0;
  line-height: 1.08;
  text-transform: uppercase;
}

.terms-privacy-copy {
  display: grid;
  gap: 22px;
}

.terms-privacy-copy p {
  max-width: 900px;
  margin: 0;
  color: rgba(255, 255, 255, 0.74);
  font-size: clamp(14px, 1.05vw, 16px);
  font-weight: 300;
  line-height: 1.8;
}

.footer {
  background: #111;
  color: rgba(255, 255, 255, 0.48);
}

.footer-container {
  width: 100%;
  margin: 0 auto;
  padding: clamp(42px, 4.5vw, 68px) 6vw 22px;
}

.footer-top {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(460px, 2fr) minmax(210px, 1fr);
  gap: clamp(36px, 4vw, 72px);
  align-items: start;
}

.footer-brand {
  display: block;
}

.footer-brand img {
  width: clamp(138px, 10vw, 188px);
  height: auto;
  margin-bottom: 22px;
}

.footer-brand p, .footer-bottom p {
    margin: 0;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 1.2px;
    line-height: 1.85;
    text-transform: uppercase;
    font-family: 'JetBrains Mono';
    color: #C4C7C8;
}

.footer-brand-social {
  display: flex;
  gap: 16px;
  margin-top: 22px;
}

.footer-brand-social a {
  color: #c4c7c8;
  transition: color 0.2s ease;
}

.footer-brand-social a:hover {
  color: #fff;
}

.footer-brand-social svg {
  display: block;
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.footer-made-india {
  width: clamp(45px, 7vw, 70px);
  height: auto;
  object-fit: contain;
}
.footer-column h4 {
    margin: 0 0 30px;
    color: rgba(255, 255, 255, 0.78);
    font-family: "JetBrains Mono", "Courier New", monospace;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}
.footer-column ul {
  display: grid;
  gap: 18px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer-navigation ul {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 24px;
}

.footer-navigation li {
  white-space: nowrap;
}

.footer-column a, .footer-column p {
    margin: 0;
    font-size: 14px;
    line-height: 22px;
    font-weight: 300;
    color: #C4C7C8;
    font-family: Inter, sans-serif;
}

.footer-column p {
  font-weight: 300;
    font-family: Inter, sans-serif;
}

.footer-phone {
  display: inline-block;
  margin-top: 12px;
}

.footer-column a:hover {
  color: #fff;
}

.footer-social svg {
  display: none;
}

.footer-column.location {
  justify-self: end;
  text-align: right;
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  margin-top: 24px;
  padding-top: 30px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.footer-bottom-info {
  display: flex;
  align-items: center;
  gap: 24px;
}

.footer-bottom-info a {
  color: #c4c7c8;
  font-family: "JetBrains Mono", "Courier New", monospace;
  font-size: 12px;
  letter-spacing: 1.2px;
}

.footer-bottom-info a:hover {
  color: #fff;
}

@media (max-width: 900px) {
  html {
    scroll-snap-type: none;
  }

  body.nav-open {
    overflow: hidden;
  }

  main > section,
  .panel,
  .hero,
  .assembly,
  .contact,
  .factory,
  .precision-panel,
  .hero-video-showcase,
  .showcase,
  .heritage,
  .clients {
    height: auto;
    min-height: auto;
    scroll-snap-align: none;
    scroll-snap-stop: normal;
  }

  .precision-panel {
    aspect-ratio: 1 / 1.15;
  }

  .site-header {
    grid-template-columns: auto auto;
    gap: 16px;
    padding: 22px 22px;
  }

  .brand img {
    width: 170px;
  }

  .site-header .brand {
    padding-top: 3px;
    overflow: visible;
  }

  .site-header .brand img {
    width: min(220px, calc(100vw - 112px)) !important;
    max-height: none;
  }

  .site-header::before {
    position: fixed;
    inset: 0;
    z-index: 21;
    content: "";
    pointer-events: none;
    background: rgba(0, 0, 0, 0);
    transition: background 240ms ease;
  }

  .site-header.is-open::before {
    pointer-events: auto;
    background: rgba(0, 0, 0, 0.56);
  }

  .menu-toggle {
    position: relative;
    z-index: 23;
    display: inline-grid;
    justify-self: end;
    gap: 7px;
    width: 38px;
    height: 38px;
    place-content: center;
    border: 1px solid var(--line);
    border-radius: 0px;
    background: rgba(0, 0, 0, 0.24);
    transition: background 180ms ease, border-color 180ms ease, transform 180ms ease;
  }

  .menu-toggle:hover,
  .menu-toggle:focus-visible {
    border-color: rgba(255, 255, 255, 0.38);
    background: rgba(255, 255, 255, 0.12);
  }

  .menu-toggle span {
    display: block;
    width: 18px;
    height: 1px;
    background: #fff;
    transition: transform 180ms ease, opacity 180ms ease;
  }

  .site-header.is-open .menu-toggle span:first-child {
    transform: translateY(4px) rotate(45deg);
  }

  .site-header.is-open .menu-toggle span:last-child {
    transform: translateY(-4px) rotate(-45deg);
  }

  .header-action {
    display: none;
  }

 .site-nav {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 22;
    display: grid;
    align-content: start;
    gap: 6px;
    width: min(84vw, 360px);
    padding: 28px 24px 30px;
    overflow-y: auto;
    color: #fff;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0) 34%),
      rgba(8, 13, 14, 0.98);
    border-right: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 28px 0 80px rgba(0, 0, 0, 0.42);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
    transform: translateX(-105%);
    visibility: hidden;
    transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1), visibility 260ms ease;
    height: 100vh;
}

  .site-header.is-open .site-nav {
    transform: translateX(0);
    visibility: visible;
  }

  .nav-close {
    display: none;
  }

  .nav-close span {
    grid-area: 1 / 1;
    display: block;
    width: 18px;
    height: 1px;
    background: #fff;
  }

  .nav-close span:first-child {
    transform: rotate(45deg);
  }

  .nav-close span:last-child {
    transform: rotate(-45deg);
  }

  nav.site-nav a {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: 0 2px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 13px;
    letter-spacing: 2px;
  }

  .site-nav a::after {
    display: none;
  }

  .site-nav a:hover,
  .site-nav a:focus-visible,
  .site-nav a.is-active {
    color: #fff;
  }

  .mobile-nav-action {
    justify-content: center;
    min-height: 46px;
    margin-top: 20px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: #fff;
    color: #000 !important;
  }

  .section-nav {
    left: 14px;
    gap: 14px;
    padding: 13px 8px;
  }

  .hero-copy {
    padding: 13vh 22px 18vh;
  }

  .hero-copy .hero-kicker {
    letter-spacing: 0.34em;
  }

  .hero-rail {
    right: 22px;
  }

  .hero-counter {
    left: 22px;
  }

  .hero-scroll {
    left: 50%;
  }

  .hero-video-showcase {
    height: auto;
    min-height: auto;
  }

  section#contact {
    height: 590px;
    min-height: 590px;
  }

  .hero-video-sticky {
    height: 600px;
    min-height: 600px;
  }

  .hero-video-slide {
    align-items: center;
    padding: 112px 22px 96px;
  }

  .hero-video-copy {
    width: min(100%, 620px);
  }

  .hero-video-copy h1 {
    font-size: 30px;
    line-height: 36px;
  }

  .hero-video-sound {
    right: 18px;
    bottom: 20px;
    width: 42px;
    height: 42px;
    min-height: 0;
    padding: 0;
  }

  .hero-video-sound-icon {
    width: 25px;
    height: 25px;
  }

  .factory .lower-left h2,
  .assembly-copy h2,
  .clients h2,
  .heritage-copy h2,
  .contact-copy h2 {
    font-size: 28px;
    line-height: 1.3;
  }

  .hero-video-progress {
    right: 22px;
    bottom: 80px;
  }

  .tabs {
    flex-wrap: wrap;
    gap: 18px 30px;
    margin-bottom: 28px;
  }

  .tab {
    font-size: clamp(0.9rem, 2.6vw, 1.25rem);
  }

  .die-grid {
    grid-template-columns: 1fr;
    gap: 22px;
    width: 100%;
    min-height: 0;
  }

  .slider-dots {
    margin-top: 28px;
  }

  .heritage::after {
    background:
      linear-gradient(90deg, rgba(17, 17, 17, 0.08) 0%, rgba(17, 17, 17, 0.32) 38%, rgba(17, 17, 17, 0.9) 74%, #111 100%),
      linear-gradient(180deg, rgba(17, 17, 17, 0.04), rgba(17, 17, 17, 0.28));
  }

  .assembly-copy {
    top: 24%;
    right: 22px;
    left: 22px;
  }

  .logo-grid {
    grid-template-columns: repeat(3, minmax(88px, 1fr));
    gap: 28px 34px;
    width: min(680px, 86vw);
  }

  .logo-grid img {
    max-width: 128px;
    max-height: 42px;
  }

  .heritage-media {
    position: absolute;
    min-height: 100%;
  }

  .heritage-copy {
    width: min(48vw, 430px);
    margin-right: 34px;
    padding: 70px 0 44px;
  }

  .heritage-copy h2 {
    font-size: clamp(2rem, 5vw, 2.875rem);
    line-height: 1.06;
  }

  .heritage-copy p,
  .heritage-list li {
    font-size: clamp(0.78rem, 1.7vw, 0.95rem);
    line-height: 1.65;
  }

  .heritage-copy p,
  .heritage-list {
    margin-bottom: 18px;
  }

  .contact-copy {
    padding-inline: 22px;
  }

  section#contact {
    height: 590px;
  }

  .contact-form {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .contact-copy h2 {
    max-width: 360px;
    margin-bottom: 40px;
    font-size: 30px;
    line-height: 40px;
  }

  .footer-container {
    padding: 44px 22px 24px;
  }

  .footer-top {
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 42px 30px;
    min-height: 0;
  }

  .footer-brand {
    grid-column: 1 / -1;
  }

  .footer-column.location {
    justify-self: start;
    text-align: left;
  }
}

.project-arrow span,
.factory-arrow span,
.project-lightbox-arrow span,
.precision-arrow span {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  color: transparent;
  font-size: 0;
  line-height: 0;
}

.project-arrow span::before,
.factory-arrow span::before,
.project-lightbox-arrow span::before,
.precision-arrow span::before {
  display: block;
  width: 11px;
  height: 11px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  content: "";
}

.project-arrow-left span::before,
.factory-arrow-left span::before,
.project-lightbox-arrow-left span::before,
.precision-arrow-left span::before {
  transform: translateX(2px) rotate(-135deg);
}

.project-arrow-right span::before,
.factory-arrow-right span::before,
.project-lightbox-arrow-right span::before,
.precision-arrow-right span::before {
  transform: translateX(-2px) rotate(45deg);
}

@media (max-width: 560px) {
  .contact-form {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
  }

  .contact-form .contact-field,
  .contact-form .contact-field-wide {
    grid-column: 1 / -1;
    width: 100%;
  }

  .precision-arrow {
    width: 38px;
    height: 38px;
  }

  .project-arrow-left {
    left: 16px;
  }

  .die-card img {
    height: clamp(230px, 65vw, 300px);
    object-fit: cover;
    object-position: center center !important;
  }

  .brand img,
  .footer-brand img {
    width: 170px;
  }

  .footer-brand-social {
    justify-content: center;
    margin-top: 18px;
  }

  .site-header,
  .footer-container {
    width: 100%;
    padding-right: 22px;
    padding-left: 22px;
  }

  .footer-container {
    padding-top: 30px;
    padding-bottom: 18px;
  }

  .footer-brand img {
    display: block;
    margin-bottom: 14px;
    margin-right: auto;
    margin-left: auto;
  }

  .footer-top,
  .footer-brand,
  .footer-column,
  .footer-bottom {
    text-align: center;
  }

  .footer-column,
  .footer-column.location {
    justify-self: center;
  }

  .footer-column.location {
    text-align: center;
  }

  .footer-social ul,
  .footer-legal ul {
    justify-content: center;
  }

  .footer-bottom {
    justify-items: center;
    gap: 12px;
    margin-top: 18px;
    padding-top: 20px;
  }

  .footer-bottom-info {
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px 22px;
  }

  .footer-bottom-info p {
    flex-basis: 100%;
  }

  .footer-navigation {
    display: none;
  }

  .footer-column.location {
    order: 1;
  }

  .footer-top > .footer-column:not(.footer-navigation):not(.location) {
    order: 2;
  }

  .footer-social h4,
  .footer-legal h4 {
    display: none;
  }

  .footer-social ul,
  .footer-legal ul {
    display: flex;
    align-items: center;
    gap: 22px;
  }

  .footer-social a {
    display: grid;
    place-items: center;
  }

  .footer-social a span {
    display: none;
  }

  .footer-social svg {
    display: block;
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
  }

  .precision-panel {
    display: block;
    position: relative;
    grid-template-columns: none;
    overflow: hidden;
}

.precision-column {
    position: absolute;
    inset: 0;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 100% !important;
    opacity: 0;
    transform: translateX(100%);
    transition: opacity 360ms ease, transform 420ms ease;
}

.precision-column.is-active {
    z-index: 1;
    opacity: 1;
    transform: translateX(0);
    animation: sliderEnterLeft 520ms ease both;
}

section#precision {
    height: 420px;
    width: 100%;
    cursor: grab;
    touch-action: pan-y;
    user-select: none;
}

section#precision.is-dragging {
    cursor: grabbing;
}

.precision-strip {
    width: 100%;
    display: none;
}

.precision-dots {
    position: absolute;
    right: 0;
    bottom: 22px;
    left: 0;
    z-index: 3;
    display: flex;
    justify-content: center;
    gap: 8px;
}

.precision-dots button {
    width: 12px;
    height: 12px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.62);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.34);
    cursor: pointer;
    transition: background 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.precision-dots button.is-active {
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.2);
    transform: scale(1.08);
}
  .factory .lower-left {
    width: calc(100vw - 32px);
  }

  .factory .lower-left h2 {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    font-size: 28px;
    line-height: 1.3;
    font-family: var(--heading-font, 'Jost'), sans-serif !important; 
    text-align: center;
    white-space: normal;
    overflow-wrap: break-word;
}
.factory-slide {
    height: 400px;
    object-fit: cover;
}
  main > section {
    min-height: auto;
  }

  .panel,
  .hero,
  .assembly,
  .contact {
    min-height: auto;
  }

  .factory,
  .precision-panel {
    height: auto;
    min-height: auto;
  }

  .factory {
    height: 400px;
    min-height: 400px;
  }

  .precision-panel {
    min-height: 420px;
  }

  .hero-copy {
    padding-bottom: 150px;
  }

  .hero-copy h1 {
    font-size: clamp(2.7rem, 11.8vw, 3.6rem);
    line-height: 0.9;
  }

  .hero-copy span {
    max-width: 290px;
    margin-top: 20px;
  }

  .hero-rail {
    top: auto;
    right: 22px;
    bottom: 112px;
    display: flex;
    gap: 9px;
    transform: none;
  }

  .hero-dot {
    width: 30px;
    height: 1px;
  }

  .hero-dot::after {
    width: 0;
    height: 1px;
    transition: width 260ms ease;
  }

  .hero-dot.is-active::after {
    width: 100%;
    height: 1px;
  }

  .hero-scroll {
    bottom: 22px;
    display: grid;
  }

  .hero-video-slide {
    align-items: end;
    padding: 112px 22px 150px;
  }

  .hero-video-copy h1 br {
    display: none;
  }

  .hero-video-copy p {
    font-size: 14px;
    font-family: 'JetBrains Mono';
    font-weight: 300;
    letter-spacing: 2px;
    color: #ffffffa6;
    line-height: 23px;
  }

  .hero-video-copy p br {
    display: none;
  }

  .section-nav {
    display: none;
  }

  .section-pad {
    padding: 76px 22px 46px;
  }

  .precision-strip {
    width: calc(100% - 36px);
    min-height: 68px;
    padding: 15px 18px;
  }

  .precision-strip strong {
    font-size: clamp(0.82rem, 4.3vw, 1.1rem);
  }

  .die-card span {
    right: 24px;
    left: 24px;
  }

  .showcase {
    align-content: center;
  }

  .tabs {
    gap: 13px 18px;
    margin-bottom: 22px;
  }

  .tab {
    font-size: clamp(0.72rem, 3.6vw, 0.92rem);
  }

  .die-grid {
    gap: 16px;
    width: 100%;
  }

  .slider-dots {
    gap: 12px;
    margin-top: 22px;
  }

  .dot {
    width: 10px;
    height: 10px;
  }

  .logo-grid {
    grid-template-columns: repeat(2, minmax(90px, 1fr));
    gap: 18px 24px;
    width: min(330px, 82vw);
  }

  .clients {
    min-height: auto;
  }

  .clients p {
    font-size: 0.48rem;
    letter-spacing: 0.32em;
  }

  .clients h2 {
    margin-bottom: 12px;
    font-size: 28px;
    line-height: 1.3;
  }

  .clients .clients-intro {
    width: min(330px, 86vw);
    margin-bottom: 26px;
    font-size: 0.95rem;
    letter-spacing: 0;
    line-height: 1.45;
  }

  .clients .clients-disclaimer {
    width: min(330px, 86vw);
    margin-top: 26px;
    font-size: 13px;
    letter-spacing: 0;
    line-height: 1.55;
  }
  section#projects {
    padding: 50px 20px;
}
section#clients {
    padding: 40px 0px 50px;
}
  .logo-grid img {
    max-width: 100%;
    max-height: fit-content;
    background: #00000012;
    width: 100%;
    padding: 10px;
    height: 46px;
    /*border: 1px solid #ffffff24;*/
}

  .heritage-media {
    position: absolute;
    min-height: 100%;
    aspect-ratio: auto;
  }

  .heritage-media img {
    object-position: 30% center;
  }

  .heritage::after {
    background:
      linear-gradient(180deg, rgba(17, 17, 17, 0.48) 0%, rgba(17, 17, 17, 0.82) 45%, #111 100%),
      linear-gradient(90deg, rgba(17, 17, 17, 0.72), rgba(17, 17, 17, 0.42));
  }

  .heritage-copy {
    width: auto;
    margin: 0;
    padding: 88px 22px 38px;
    background: transparent;
  }

  .heritage-copy span {
    margin-bottom: 16px;
    font-size: 0.48rem;
    letter-spacing: 0.24em;
  }

  .heritage-copy h2 {
    max-width: 330px;
    margin-bottom: 18px;
    font-size: 28px;
    line-height: 1.3;
  }

  .heritage-copy p, .heritage-list li {
    font-size: 14px;
    line-height: 24px;
}

  .heritage-copy p,
  .heritage-list {
    margin-bottom: 11px;
  }

  .heritage-list ul {
    gap: 2px;
  }

  .contact-copy {
    align-content: center;
    padding: 76px 22px 42px;
  }
.contact-copy h2 {
    max-width: 360px;
    margin-bottom: 34px;
    font-size: 28px;
    line-height: 1.3;
}

 .contact-form {
    grid-template-columns: 1fr;
    gap: 22px;
}

  .contact-field input,
  .contact-field textarea {
    min-height: 34px;
    font-size: 0.75rem;
  }

  .contact-field textarea {
    min-height: calc((0.75rem * 1.45 * 4) + 20px);
    padding-top: 10px;
  }

  .contact-form button {
    width: min(100%, 190px);
    min-height: 42px;
    margin-top: 14px;
  }

  .footer-top {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .footer-brand img {
    width: min(225px, 72vw);
  }

  .footer-column h4 {
    margin-bottom: 16px;
  }

  .footer-column ul {
    gap: 10px;
  }

  .footer-bottom {
    display: grid;
    gap: 16px;
  }
}

main > section {
  min-height: 100vh;
  min-height: 100svh;
}

.factory,
.precision-panel {
  height: 100vh;
  height: 100svh;
}

.hero-video-showcase {
  height: 100vh;
  height: 100svh;
}

@media (max-width: 900px) {
  main > section,
  .panel,
  .hero,
  .assembly,
  .contact,
  .factory,
  .precision-panel,
  .hero-video-showcase,
  .showcase,
  .heritage,
  .clients {
    height: auto;
    min-height: auto;
  }

  .hero-video-showcase {
    height: auto;
    min-height: auto;
  }

  .hero-video-sticky {
    height: 600px;
    min-height: 600px;
  }
}

@media (max-width: 900px) {
  .factory {
    height: 520px;
    min-height: 520px;
  }
}

@media (max-width: 560px) {
  .factory {
    height: 400px;
    min-height: 400px;
  }
}

.hero-video-sticky {
  height: 100%;
  min-height: 100%;
}

@media (max-width: 900px) {
  .hero-video-sticky {
    height: 600px;
    min-height: 600px;
  }
}

@media (max-width: 560px) {
  .project-arrow {
    width: 38px;
    height: 38px;
    font-size: 20px;
  }

  .project-arrow span,
  .factory-arrow span,
  .project-lightbox-arrow span {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    color: transparent;
    font-size: 0;
    line-height: 0;
  }

  .project-arrow span::before,
  .factory-arrow span::before,
  .project-lightbox-arrow span::before {
    display: block;
    width: 9px;
    height: 9px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    content: "";
  }

  .project-arrow-left span::before,
  .factory-arrow-left span::before,
  .project-lightbox-arrow-left span::before {
    transform: translateX(2px) rotate(-135deg);
  }

  .project-arrow-right span::before,
  .factory-arrow-right span::before,
  .project-lightbox-arrow-right span::before {
    transform: translateX(-2px) rotate(45deg);
  }

  .factory-arrow {
    width: 38px;
    height: 38px;
    font-size: 20px;
  }

  .factory-arrow-left {
    left: 18px;
  }

  .factory-arrow-right {
    right: 18px;
  }

  .factory .lower-left {
    bottom: 66px;
  }

  .factory .lower-left::after {
    margin-top: 14px;
  }

  .factory-dots {
    bottom: 18px;
    gap: 4px;
  }

  .factory-dots button {
    width: 12px;
    height: 12px;
  }

  .factory-dots button::before {
    width: 6px;
    height: 6px;
  }
}

@media (max-width: 900px) {
  html,
  body {
    overflow-x: hidden;
    overflow-y: auto;
  }

  html.home-page {
    scroll-behavior: smooth;
    scroll-snap-type: y proximity;
  }

  body.home-page {
    min-height: 100%;
    overflow-x: hidden;
    overscroll-behavior-y: auto;
  }

  body.home-page main > section {
    width: 100%;
    height: auto;
    min-height: 100vh;
    min-height: 100svh;
    overflow-x: hidden;
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }

  body.home-page .hero-video-showcase,
  body.home-page .factory,
  body.home-page .precision-panel,
  body.home-page section#precision {
    height: 100vh;
    height: 100svh;
    min-height: 100vh;
    min-height: 100svh;
  }

  body.home-page .hero-video-sticky {
    height: 100%;
    min-height: 100%;
  }

  body.home-page .factory-bg,
  body.home-page .factory-slide,
  body.home-page .precision-column {
    width: 100%;
    height: 100% !important;
    min-height: 100% !important;
  }

  body.home-page main > section.factory {
    height: 100vh;
    height: 100svh;
    min-height: 100vh;
    min-height: 100svh;
  }

  body.home-page main > section.factory .factory-bg,
  body.home-page main > section.factory .factory-slide {
    position: absolute;
    inset: 0;
  }

  body.home-page main > section.factory .factory-slide {
    object-fit: cover;
    object-position: center;
  }

  body.home-page .precision-column {
    background-size: cover;
    background-position: center;
  }

  body.home-page .footer {
    scroll-snap-align: start;
  }
}

html.inner-page {
  scroll-behavior: smooth;
  scroll-snap-type: y proximity;
}

html.inner-page body {
  overflow-x: hidden;
  overscroll-behavior-y: contain;
}

html.inner-page main > section {
  min-height: 100vh;
  min-height: 100svh;
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}

html.inner-page .footer {
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}

html.long-content-page {
  overflow-y: auto;
  scroll-behavior: smooth;
  scroll-snap-type: y proximity;
}

html.long-content-page main > section,
html.long-content-page .footer {
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}

@media (max-width: 900px) {
  html,
  html.home-page,
  html.inner-page {
    height: auto;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    scroll-behavior: smooth;
    scroll-snap-type: y proximity;
  }

  body,
  body.home-page,
  html.inner-page body {
    height: auto;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: visible;
    overscroll-behavior-y: contain;
  }

  main > section,
  body.home-page main > section,
  html.inner-page main > section {
    min-height: 100vh;
    min-height: 100svh;
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }

  .footer,
  body.home-page .footer,
  html.inner-page .footer {
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }

  html.long-content-page {
    overflow-y: auto;
    scroll-behavior: smooth;
    scroll-snap-type: y proximity;
  }

  html.long-content-page main > section,
  html.long-content-page .footer {
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }

  /* Native touch scrolling is more reliable than mandatory snap on real phones. */
  html,
  html.home-page,
  html.inner-page,
  html.long-content-page {
    height: auto;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    scroll-snap-type: none;
    -webkit-overflow-scrolling: touch;
  }

  body,
  body.home-page,
  html.inner-page body {
    height: auto;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: visible;
    overscroll-behavior-y: auto;
    touch-action: pan-y;
  }

  main > section,
  body.home-page main > section,
  html.inner-page main > section,
  .footer,
  body.home-page .footer,
  html.inner-page .footer {
    scroll-snap-align: none;
    scroll-snap-stop: normal;
  }
}

/* Full-screen section snapping on every snap-enabled page and viewport. */
body.snap-page {
  width: 100%;
  height: auto;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: auto;
  scroll-snap-type: none;
}

body.snap-page .mobile-snap-wrapper {
  position: static;
  inset: auto;
  width: 100%;
  height: auto;
  min-height: 100%;
  overflow: visible;
  overscroll-behavior-y: auto;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: none;
  scroll-behavior: smooth;
}

body.snap-page .mobile-snap-wrapper.is-equipment-visible {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

body.snap-page .mobile-snap-wrapper.is-equipment-visible::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

body.snap-page .mobile-snap-wrapper.is-footer-scrolling {
  scroll-snap-type: none;
}

body.snap-page main > section {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  min-height: 100vh;
  min-height: 100dvh;
  overflow: hidden;
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}

body.snap-page .footer {
  width: 100%;
  height: auto;
  min-height: 0;
  overflow: visible;
  scroll-snap-align: none;
  scroll-snap-stop: normal;
}

body.snap-page main > section#contact {
  height: 100vh;
  height: 100dvh;
  min-height: 100vh;
  min-height: 100dvh;
}

body.snap-page main > section.career-page,
body.snap-page main > section.equipment-page {
  height: auto;
  min-height: 100vh;
  min-height: 100dvh;
  overflow-x: hidden;
  overflow-y: visible;
}

/* Keep the shared footer identical regardless of page-specific styles. */
body.snap-page .footer {
  overflow-x: hidden;
  overflow-y: visible;
  background: #111;
  color: rgba(255, 255, 255, 0.48);
  font-family: "Inter", "Segoe UI", Arial, sans-serif;
}

body.snap-page .footer-container {
  width: 100%;
  margin-inline: auto;
}

html.safari-browser,
body.safari-browser.snap-page {
  height: auto;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}

body.safari-browser.snap-page {
  scroll-snap-type: none;
}

body.safari-browser.snap-page .mobile-snap-wrapper {
  position: static;
  inset: auto;
  height: auto;
  min-height: 100%;
  overflow: visible;
  scroll-snap-type: none;
}

body.safari-browser.snap-page main > section,
body.safari-browser.snap-page .footer {
  scroll-snap-align: none;
  scroll-snap-stop: normal;
}

body.safari-browser.snap-page main > section {
  height: auto;
  min-height: 100vh;
  min-height: 100svh;
}

body.safari-browser.snap-page main > section.hero-video-showcase,
body.safari-browser.snap-page main > section.precision-panel,
body.safari-browser.snap-page main > section.factory,
body.safari-browser.snap-page main > section#contact {
  height: 100vh;
  height: 100svh;
  overflow: hidden;
}

html.legacy-safari,
body.legacy-safari.snap-page {
  height: auto;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}

body.legacy-safari.snap-page,
body.legacy-safari.snap-page .mobile-snap-wrapper {
  scroll-snap-type: none;
}

body.legacy-safari.snap-page .mobile-snap-wrapper {
  position: static;
  inset: auto;
  width: 100%;
  height: auto;
  min-height: 100%;
  overflow: visible;
  -webkit-overflow-scrolling: touch;
}

body.legacy-safari.snap-page main > section,
body.legacy-safari.snap-page .footer {
  height: auto;
  min-height: 100vh;
  overflow: hidden;
  scroll-snap-align: none;
  scroll-snap-stop: normal;
}

body.legacy-safari.snap-page main > section#about,
body.legacy-safari.snap-page main > section#projects,
body.legacy-safari.snap-page main > section#clients,
body.legacy-safari.snap-page .footer {
  overflow: visible;
}

body.legacy-safari .project-lightbox {
  height: 100vh;
}

.site-header .brand img {
  display: block;
  height: auto !important;
  object-fit: contain;
}

@supports (-webkit-hyphens: none) {
  html,
  body.snap-page {
    height: auto;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
  }

  body.snap-page {
    scroll-snap-type: none;
  }

  body.snap-page .mobile-snap-wrapper {
    position: static;
    inset: auto;
    width: 100%;
    height: auto;
    min-height: 100%;
    overflow: visible;
    scroll-snap-type: none;
  }

  body.snap-page main > section,
  body.snap-page .footer {
    scroll-snap-align: none;
    scroll-snap-stop: normal;
  }

  body.snap-page main > section {
    height: auto;
    min-height: 100vh;
    min-height: 100svh;
  }

  body.snap-page main > section.hero-video-showcase,
  body.snap-page main > section.precision-panel,
  body.snap-page main > section.factory,
  body.snap-page main > section#contact {
    height: 100vh;
    height: 100svh;
    overflow: hidden;
  }
}

@supports not (font-size: clamp(1rem, 2vw, 2rem)) {
  .hero-copy h1,
  .factory .lower-left h2 {
    font-size: 52px;
    line-height: 1.12;
  }

  .project-copy h2,
  .contact-title h2 {
    font-size: 44px;
    line-height: 1.12;
  }

  .die-grid {
    min-height: 300px;
  }

  .site-header,
  .footer-container {
    padding-right: 6vw;
    padding-left: 6vw;
  }
}

/* Keep the project tabs visible on short laptop screens. */
@media (min-width: 901px) and (max-height: 850px) {
  body.home-page #projects.showcase {
    padding-top: 48px;
    padding-bottom: 32px;
  }

  body.home-page #projects .tabs {
    margin-bottom: 24px;
  }

  body.home-page #projects .tab {
    font-size: 20px;
  }

  body.home-page #projects .die-card img {
    height: 380px;
  }

  body.home-page #projects .project-slider .slider-dots {
    margin-top: 14px;
  }
}

@media (min-width: 901px) and (max-height: 700px) {
  body.home-page #projects.showcase {
    padding-top: 34px;
    padding-bottom: 22px;
  }

  body.home-page #projects .tabs {
    margin-bottom: 18px;
  }

  body.home-page #projects .die-card img {
    height: 380px;
  }
}

/* Compact the About panel on short desktop/laptop screens. */
@media (min-width: 901px) and (max-height: 850px) {
  body.home-page #about .heritage-copy {
    width: min(42vw, 560px);
    margin-right: clamp(34px, 5vw, 76px);
    padding-block: 40px;
  }

  body.home-page #about .heritage-copy span {
    margin-bottom: 10px;
    font-size: 10px;
    line-height: 12px;
  }

  body.home-page #about .heritage-copy h2 {
    max-width: 440px;
    margin-bottom: 16px;
    font-size: clamp(30px, 3.2vw, 40px);
    line-height: 1.08;
  }

  body.home-page #about .heritage-copy p,
  body.home-page #about .heritage-list li {
    font-size: clamp(12px, 1.15vw, 14px);
    line-height: 1.48;
  }

  body.home-page #about .heritage-copy p,
  body.home-page #about .heritage-list {
    margin-bottom: 12px;
  }

  body.home-page #about .heritage-list ul {
    gap: 2px;
  }
}

@media (min-width: 901px) and (max-height: 680px) {
  body.home-page #about .heritage-copy {
    padding-block: 24px;
  }

  body.home-page #about .heritage-copy h2 {
    margin-bottom: 12px;
    font-size: 28px;
  }

  body.home-page #about .heritage-copy p,
  body.home-page #about .heritage-list li {
    font-size: 11px;
    line-height: 1.4;
  }

  body.home-page #about .heritage-copy p,
  body.home-page #about .heritage-list {
    margin-bottom: 8px;
  }
}

@media (min-width: 901px) and (max-width: 1180px) {
  body.snap-page .mobile-snap-wrapper {
    height: auto;
    overflow-x: hidden;
    overflow-y: visible;
    scroll-snap-type: none;
  }

  body.snap-page main > section {
    height: auto;
    min-height: 100vh;
    min-height: 100svh;
    scroll-snap-align: none;
    scroll-snap-stop: normal;
  }

  body.snap-page main > section.hero-video-showcase,
  body.snap-page main > section.precision-panel,
  body.snap-page main > section.factory,
  body.snap-page main > section#contact {
    height: 100vh;
    height: 100svh;
    overflow: hidden;
  }

  .equipment-inner {
    grid-template-columns: 1fr;
    gap: 38px;
    min-height: auto;
    padding: 96px 7vw 76px;
  }

  .equipment-media {
    min-height: 460px;
    max-height: 560px;
  }

  .equipment-content {
    width: 100%;
    max-width: none;
  }

  .footer-top {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 42px 64px;
    min-height: 0;
  }

  .footer-brand {
    grid-column: 1 / -1;
  }

  .footer-column.location {
    justify-self: start;
    max-width: 100%;
    text-align: left;
  }
}

@media (min-width: 561px) and (max-width: 1180px) {
  .footer-container {
    padding: clamp(38px, 5vw, 58px) clamp(24px, 4vw, 48px) 22px;
  }

  .footer-top {
    display: grid;
    grid-template-columns: minmax(160px, 0.9fr) minmax(300px, 1.45fr) minmax(170px, 0.9fr);
    gap: clamp(24px, 3vw, 42px);
    align-items: start;
    text-align: left;
  }

  .footer-brand {
    grid-column: auto;
    text-align: left;
  }

  .footer-brand img {
    width: clamp(138px, 13vw, 188px);
    margin-right: 0;
    margin-left: 0;
  }

  .footer-brand-social {
    justify-content: flex-start;
  }

  .footer-navigation {
    display: block;
  }

  .footer-navigation ul {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 18px;
    justify-content: flex-start;
  }

  .footer-column,
  .footer-column.location {
    justify-self: stretch;
    text-align: left;
  }

  .footer-column.location {
    justify-self: end;
    max-width: 220px;
    text-align: right;
  }

  .footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    text-align: left;
  }

  .footer-bottom-info {
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 12px 20px;
  }

  .footer-bottom-info p {
    flex-basis: auto;
  }
}

/* Keep the mobile factory slide flush with the snap viewport. */
@media (max-width: 560px) {
  body.home-page main > section.factory {
    height: 100vh;
    min-height: 100vh;
  }

  @supports (height: 100dvh) {
    body.home-page main > section.factory {
      height: 100dvh;
      min-height: 100dvh;
    }
  }

  body.home-page main > section.factory .factory-bg {
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 0 !important;
    overflow: hidden;
  }

  body.home-page main > section.factory .factory-slide {
    display: block;
    inset: 0;
    width: 100%;
    height: 100% !important;
    min-height: 0 !important;
  }
}

/* Long form sections must not be clipped to one Safari viewport. */
body.safari-browser:not(.legacy-safari).snap-page main > section.career-page,
body.safari-browser:not(.legacy-safari).snap-page main > section.equipment-page {
  height: auto;
  min-height: 100vh;
  min-height: 100dvh;
  overflow-x: hidden;
  overflow-y: visible;
}

/* Mandatory snapping can trap Safari inside a section taller than the viewport. */
body.safari-browser:not(.legacy-safari).careers-page.snap-page .mobile-snap-wrapper {
  scroll-snap-type: y proximity;
}

/* Prevent horizontal overflow */
html,
body {
    overflow-x: hidden;
}

.project-slider {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

.slider-dots {
    width: 100%;
    max-width: 100%;
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    overflow: hidden;
    box-sizing: border-box;
}

/* Mobile Landscape */
@media only screen
and (max-width: 1199px)
and (orientation: landscape){

    html,
    html.home-page,
    html.inner-page,
    html.long-content-page{
        height:auto;
        min-height:100%;
        overflow-x:hidden;
        overflow-y:auto;
        scroll-snap-type:none;
        -webkit-overflow-scrolling:touch;
    }

    body.snap-page,
    body.snap-page .mobile-snap-wrapper{
        height:auto;
        min-height:100%;
        overflow-x:hidden;
        scroll-snap-type:none;
    }

    body,
    body.home-page,
    body.snap-page{
        overflow-x:hidden;
        overflow-y:auto;
        overscroll-behavior-y:auto;
        touch-action:pan-y;
    }

    body.snap-page .mobile-snap-wrapper{
        position:static;
        inset:auto;
        overflow:visible;
        overscroll-behavior-y:auto;
        -webkit-overflow-scrolling:touch;
    }

    body.snap-page main > section,
    main > section,
    .showcase,
    .heritage,
    .clients,
    .equipment-page,
    .career-page{
        height:auto;
        min-height:100dvh;
        overflow:visible;
        scroll-snap-align:none;
        scroll-snap-stop:normal;
    }

    .hero-video-showcase{
        height:auto;
        min-height:100dvh;
        overflow:hidden;
    }

    .hero-video-sticky{
        height:100dvh;
        min-height:320px;
    }

    .hero-video-slide{
        padding:88px 24px 62px;
    }

    .hero-video-copy h1{
        font-size:clamp(24px, 5.4vw, 38px);
        line-height:1.08;
    }

    .hero-scroll{
        display:grid;
        bottom:14px;
        gap:5px;
        font-size:10px;
        letter-spacing:0.8px;
    }

    .hero-scroll i{
        height:28px;
    }

    .site-header{
        grid-template-columns:auto minmax(0, 1fr) auto;
        gap:12px;
        padding:14px 20px;
    }

    .site-header .brand img{
        width:min(160px, 18vw) !important;
    }

    .site-nav{
        gap:clamp(8px, 1.2vw, 14px);
        min-width:0;
    }

    nav.site-nav a{
        min-height:38px;
        font-size:clamp(8px, 0.95vw, 10px);
        letter-spacing:1.1px;
    }

    a.header-action{
        position:relative !important;
        z-index:9999 !important;
        display:none !important;
        align-items:center;
        justify-content:center;
        box-sizing:border-box !important;
        min-height:34px;
        padding:8px 13px !important;
        border:1px solid var(--line, #BEBEBE) !important;
        color:#fff;
        font-family:'JetBrains Mono';
        font-size:9px;
        font-weight:400;
        letter-spacing:1.1px;
        line-height:1;
        text-transform:uppercase;
        white-space:nowrap;
    }

    .section-pad{
        padding:58px 22px 38px;
    }

    body.home-page #projects.showcase{
        min-height:auto;
        padding:88px 28px 24px;
        align-content:start;
    }

    body.home-page #projects .tabs{
        gap:12px 24px;
        margin-bottom:12px;
    }

    .tab{
        font-size:12px;
    }

    .heritage-copy{
        padding:70px 22px 32px;
    }

    .heritage-copy h2,
    .clients h2,
    .contact-copy h2,
    .factory .lower-left h2{
        font-size:24px;
        line-height:1.2;
    }

    .heritage-copy p,
    .heritage-list li,
    .clients .clients-intro,
    .clients .clients-disclaimer{
        font-size:12px;
        line-height:1.45;
    }

    .section-nav{
        display:none;
    }

    .clients{
        align-content:start;
        min-height:auto;
        padding:72px 22px 38px;
        overflow:hidden;
    }

    .clients p{
        margin-bottom:8px;
        font-size:10px;
        letter-spacing:1.6px;
        line-height:1.35;
    }

    .clients h2{
        margin-bottom:10px;
    }

    .clients .clients-intro{
        width:min(100%, 560px);
        margin-bottom:22px;
    }

    .logo-grid{
        grid-template-columns:repeat(4, minmax(0, 1fr));
        gap:22px 28px;
        width:min(100%, 760px);
    }

    .logo-grid img,
    .logo-grid img:nth-child(3),
    .logo-grid img:nth-child(4),
    .logo-grid img:nth-child(5),
    .logo-grid img:nth-child(6),
    .logo-grid img:nth-child(7),
    .logo-grid img:nth-child(9),
    .logo-grid img:nth-child(10),
    .logo-grid img:nth-child(11),
    .logo-grid img:nth-child(12){
        width:100%;
        max-width:clamp(76px, 12vw, 132px);
        height:42px;
        max-height:42px;
        object-fit:contain;
    }

    .clients .clients-disclaimer{
        width:min(100%, 720px);
        margin-top:22px;
        color:rgba(255, 255, 255, 0.58);
        font-size:10px;
        line-height:1.45;
    }

    .equipment-inner{
        grid-template-columns:1fr;
        gap:22px;
        padding:66px 22px 36px;
    }

    .equipment-media{
        min-height:220px;
        max-height:46dvh;
    }

    h2#equipment-title{
        font-size:26px;
        line-height:1.18;
    }

    .equipment-copy,
    .equipment-list li{
        font-size:12px;
        line-height:1.45;
    }

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

    .equipment-list li{
        min-height:0;
        padding:10px 0;
    }

    .career-page{
        padding:66px 22px 36px;
    }

    .career-hero h2{
        font-size:26px;
        line-height:1.2;
        letter-spacing:0;
    }

    .career-intro{
        font-size:12px;
    }

    .career-form{
        gap:24px 34px;
        padding:28px 24px;
    }

    .career-field input,
    .career-field select,
    .career-field textarea{
        min-height:40px;
        font-size:12px;
    }

    .contact,
    body.snap-page main > section#contact{
        height:auto;
        min-height:auto;
        overflow:visible;
    }

    .contact > img{
        position:absolute;
        inset:0;
        height:100%;
    }

    .contact-copy{
        position:relative;
        inset:auto;
        min-height:auto;
        align-content:start;
        padding:64px 22px 10px;
    }

    .contact-copy h2{
        display:block;
        max-width:min(100%, 560px);
        margin:0 auto 8px;
        font-size:clamp(16px, 2.9vw, 20px);
        line-height:1.16;
    }

    .contact-email{
        margin-bottom:8px;
    }

    .contact-email-confirm{
        min-height:34px;
        padding:8px 16px;
        font-size:9px;
        letter-spacing:1.4px;
        line-height:1.2;
    }

    .contact-form{
        gap:8px 24px;
        width:min(100%, 920px);
    }

    .contact-form > div[style*="grid-column"]{
        grid-column:1 / -1 !important;
        margin:0 !important;
    }

    .contact-field{
        gap:4px;
    }

    .contact-field label{
        font-size:9px;
        line-height:1;
    }

    .contact-field input,
    .contact-field textarea{
        min-height:30px;
        font-size:12px;
        line-height:1.25;
    }

    .contact-field textarea{
        min-height:42px;
        padding-top:7px;
    }

    .contact-form button{
        min-height:32px;
        margin-top:2px;
        padding:0 34px;
        font-size:11px;
        letter-spacing:1.5px;
    }

    .project-slider{
        width:100%;
        max-width:100%;
    }

    .die-grid{
        display:grid;
        grid-template-columns:minmax(0, 1fr);
        width:100%;
        max-width:380px !important;
        margin:0 auto;
        min-height:clamp(230px, 34vh, 350px);
        cursor:grab;
        touch-action:pan-y;
        user-select:none;
    }

    body.home-page #projects .die-grid{
        min-height:0;
    }

    body.home-page #projects .die-card,
    body.home-page #projects .die-card-expand{
        height:clamp(210px, calc(100dvh - 178px), 360px);
    }

    body.home-page #projects .die-card img{
        object-fit:contain;
        width:100%;
        height:100%;
        object-position:center center !important;
    }

    body.home-page #projects .project-slider .slider-dots{
        margin-top:10px;
    }

    body.home-page #projects .project-slider .slider-dots .dot{
        width:8px;
        height:8px;
    }

    .footer-container{
        padding:26px 4vw 16px;
    }

    .footer-top{
        grid-template-columns:minmax(190px, 0.95fr) minmax(260px, 1.2fr) minmax(200px, 0.9fr);
        gap:22px;
    }

    .footer-brand img{
        width:clamp(233px, 18vw, 210px) !important;
        margin-bottom:14px;
    }

    .footer-brand p,
    .footer-bottom p{
        font-size:10px;
        letter-spacing:1.6px;
        line-height:1.65;
    }

    .footer-brand-social{
        gap:14px;
        margin-top:16px;
    }

    .footer-brand-social svg{
        width:18px;
        height:18px;
    }

    .footer-column h4{
        margin-bottom:20px;
        font-size:10px;
        letter-spacing:2px;
    }

    .footer-navigation ul{
        gap:10px 18px;
    }

    .footer-column a,
    .footer-column p{
        font-size:12px;
        line-height:1.55;
    }

    .footer-column.location{
        max-width:260px;
    }

    .footer-phone{
        margin-top:10px;
    }

    .footer-bottom{
        gap:14px;
        margin-top:18px;
        padding-top:18px;
    }

    .footer-bottom-info{
        gap:12px 18px;
    }

    .footer-bottom-info a{
        font-size:10px;
        letter-spacing:1px;
    }

    .contact-panel{
        padding-bottom:80px;
    }

    .factory,
    .precision-panel,
    body.snap-page main > section.factory,
    body.snap-page main > section.precision-panel{
        height:100dvh;
        min-height:320px;
        overflow:hidden;
    }
}

@media only screen and (max-width: 760px) and (orientation: portrait) {
  body.home-page .precision-panel,
  body.home-page #precision.precision-panel {
    width: 100vw;
    max-width: 100vw;
    margin-inline: calc(50% - 50vw);
  }

  body.home-page .precision-column {
    width: 100vw;
    max-width: 100vw;
    background-size: cover;
    background-position: center center;
  }

  body.home-page .hero-video-showcase,
  body.home-page .hero-video-sticky,
  body.home-page .hero-video-slides,
  body.home-page .hero-video-slide,
  body.home-page .hero-video-slide video {
    width: 100vw;
    max-width: 100vw;
  }
}

@media only screen
and (max-width: 760px)
and (orientation: landscape){
    .clients{
        padding-top:66px;
    }

    .logo-grid{
        grid-template-columns:repeat(3, minmax(0, 1fr));
        gap:18px 22px;
    }

    .logo-grid img,
    .logo-grid img:nth-child(3),
    .logo-grid img:nth-child(4),
    .logo-grid img:nth-child(5),
    .logo-grid img:nth-child(6),
    .logo-grid img:nth-child(7),
    .logo-grid img:nth-child(9),
    .logo-grid img:nth-child(10),
    .logo-grid img:nth-child(11),
    .logo-grid img:nth-child(12){
        max-width:112px;
        height:38px;
        max-height:38px;
    }

    .footer-container{
        padding-inline:22px;
    }

    .footer-top{
        grid-template-columns:1fr 1fr;
        gap:20px 28px;
    }

    .footer-navigation{
        grid-column:2;
    }

    .footer-column.location{
        grid-column:1 / -1;
        justify-self:start;
        max-width:100%;
        text-align:left;
    }

    .footer-navigation ul{
        display:grid;
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap:9px 16px;
    }

    .footer-column a,
    .footer-column p{
        font-size:11px;
        line-height:1.45;
    }
}

@media (min-width: 901px) and (max-width: 1199px) {
  body.nav-open {
    overflow: hidden;
  }

  .site-header {
    grid-template-columns: auto auto;
    gap: 16px;
    padding: 20px 24px;
  }

  .site-header .brand {
    padding-top: 3px;
    overflow: visible;
  }

  .site-header .brand img {
    width: min(220px, calc(100vw - 112px)) !important;
    max-height: none;
  }

  .site-header::before {
    position: fixed;
    inset: 0;
    z-index: 21;
    content: "";
    pointer-events: none;
    background: rgba(0, 0, 0, 0);
    transition: background 240ms ease;
  }

  .site-header.is-open::before {
    pointer-events: auto;
    background: rgba(0, 0, 0, 0.56);
  }

  .menu-toggle {
    position: relative;
    z-index: 23;
    display: inline-grid;
    justify-self: end;
    gap: 7px;
    width: 38px;
    height: 38px;
    place-content: center;
    border: 1px solid var(--line);
    border-radius: 0;
    background: rgba(0, 0, 0, 0.24);
    transition: background 180ms ease, border-color 180ms ease, transform 180ms ease;
  }

  .menu-toggle:hover,
  .menu-toggle:focus-visible {
    border-color: rgba(255, 255, 255, 0.38);
    background: rgba(255, 255, 255, 0.12);
  }

  .menu-toggle span {
    display: block;
    width: 18px;
    height: 1px;
    background: #fff;
    transition: transform 180ms ease, opacity 180ms ease;
  }

  .site-header.is-open .menu-toggle span:first-child {
    transform: translateY(4px) rotate(45deg);
  }

  .site-header.is-open .menu-toggle span:last-child {
    transform: translateY(-4px) rotate(-45deg);
  }

  a.header-action {
    display: none !important;
  }

  .site-nav {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 22;
    display: grid;
    align-content: start;
    gap: 6px;
    width: min(84vw, 360px);
    height: 100vh;
    padding: 28px 24px 30px;
    overflow-y: auto;
    color: #fff;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0) 34%),
      rgba(8, 13, 14, 0.98);
    border-right: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 28px 0 80px rgba(0, 0, 0, 0.42);
    -webkit-backdrop-filter: blur(18px);
    backdrop-filter: blur(18px);
    transform: translateX(-105%);
    visibility: hidden;
    transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1), visibility 260ms ease;
  }

  .site-header.is-open .site-nav {
    transform: translateX(0);
    visibility: visible;
  }

  nav.site-nav a {
    display: flex;
    align-items: center;
    min-height: 48px;
    padding: 0 2px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 13px;
    letter-spacing: 2px;
  }

  .site-nav a::after {
    display: none;
  }

  .mobile-nav-action {
    display: flex;
    justify-content: center;
    min-height: 46px;
    margin-top: 20px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: #fff;
    color: #000 !important;
  }
}

html.home-page,
html.inner-page,
html.long-content-page {
  scroll-behavior: smooth;
  scroll-snap-type: y mandatory;
}

body.snap-page {
  height: auto;
  min-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior-y: auto;
}

body.snap-page .mobile-snap-wrapper {
  position: static;
  inset: auto;
  width: 100%;
  height: auto;
  min-height: 100%;
  overflow: visible;
  scroll-snap-type: none;
  -webkit-overflow-scrolling: touch;
}

body.snap-page main > section,
body.snap-page .footer {
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}

body.snap-page main > section.equipment-page {
  overflow: visible;
}

.factory,
.factory-bg,
.precision-panel {
  max-width: 100%;
  overflow: hidden;
}

body.home-page main > section.factory .factory-slide {
  width: 100% !important;
  height: 100% !important;
  max-width: 100%;
  object-fit: cover;
}

@media (max-width: 900px) {
  body.home-page main > section.precision-panel,
  body.home-page main > section#precision {
    height: 110svh !important;
    min-height: 110svh !important;
  }
}

@media (max-width: 900px) and (orientation: portrait) {
  body.home-page.snap-page .mobile-snap-wrapper {
    scroll-snap-type: y mandatory !important;
    scroll-behavior: smooth !important;
  }
}

@media (max-width: 1199px) {
  .equipment-inner {
    gap: clamp(16px, 3vh, 28px);
    padding-top: clamp(74px, 10vh, 92px);
    padding-bottom: clamp(28px, 5vh, 48px);
  }

  .equipment-media {
    min-height: clamp(180px, 32vh, 360px);
    max-height: 38vh;
  }

  .equipment-content h2 {
    margin-bottom: 12px;
    font-size: clamp(26px, 5vw, 40px);
    line-height: 1.08;
  }

  .equipment-copy {
    font-size: 13px;
    line-height: 1.5;
  }

  .equipment-list {
    gap: 0 20px;
    margin-top: 18px;
  }

  .equipment-list li {
    min-height: 0;
    padding: 8px 0;
    font-size: 12px;
    line-height: 1.34;
  }

  .equipment-iso {
    right: 0;
    width: 58px;
    margin-top: 12px;
  }
}

@media (max-width: 760px) {
  .equipment-inner {
    padding: 72px 22px 34px;
  }

  .equipment-media {
    min-height: 168px;
    max-height: 26vh;
  }

  .equipment-kicker {
    margin-bottom: 8px;
    font-size: 9px;
    letter-spacing: 1.8px;
  }

  .equipment-content h2 {
    font-size: 24px;
    line-height: 1.08;
  }

  .equipment-copy {
    font-size: 11px;
    line-height: 1.42;
  }

  .equipment-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 12px;
  }

  .equipment-list li {
    padding: 6px 0;
    font-size: 10px;
    line-height: 1.28;
  }

  .equipment-iso {
    position: static;
    width: 50px;
    margin-top: 10px;
    margin-left: auto;
  }
}

@media only screen and (max-width: 1199px) and (orientation: landscape) {
  .equipment-inner {
    grid-template-columns: minmax(160px, 0.6fr) minmax(0, 1.4fr);
    gap: 18px;
    min-height: 100dvh;
    padding: 72px 22px 22px;
  }

  .equipment-media {
    align-self: center;
    min-height: 0;
    height: min(54vh, 260px);
    max-height: none;
  }

  .equipment-content h2 {
    font-size: clamp(20px, 4.2vh, 28px);
    line-height: 1.05;
  }

  .equipment-copy,
  .equipment-list li {
    font-size: clamp(9px, 2.35vh, 12px);
    line-height: 1.25;
  }

  .equipment-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 10px;
  }

  .equipment-list li {
    padding: 5px 0;
  }

  .equipment-iso {
    width: 42px;
    margin-top: 8px;
  }

  body.home-page #about .heritage-copy {
    width: min(46vw, 380px);
    padding: 70px 22px 22px;
  }

  body.home-page #about .heritage-copy span {
    margin-bottom: 8px;
    font-size: 9px;
    line-height: 1.2;
  }

  body.home-page #about .heritage-copy h2 {
    max-width: 340px;
    margin-bottom: 10px;
    font-size: clamp(22px, 6vh, 30px);
    line-height: 1.06;
  }

  body.home-page #about .heritage-copy p,
  body.home-page #about .heritage-list li {
    font-size: clamp(9px, 2.4vh, 12px);
    line-height: 1.3;
  }

  body.home-page #about .heritage-copy p,
  body.home-page #about .heritage-list {
    margin-bottom: 8px;
  }

  body.home-page #clients.clients {
    padding-bottom: 22px;
  }

  body.home-page #clients .clients-disclaimer {
    margin-top: 12px;
    font-size: 9px;
    line-height: 1.28;
  }
}

@media (max-width: 900px) {
  body.home-page #projects,
  body.home-page #precision.precision-panel {
    overflow: hidden;
    contain: paint;
  }

  body.home-page #projects .die-card,
  body.home-page #projects .die-card-expand {
    max-width: 100%;
    box-sizing: border-box;
  }

  body.home-page #precision .precision-column,
  body.home-page #precision:hover .precision-column,
  body.home-page #precision.is-hovered .precision-column,
  body.home-page #precision:focus .precision-column,
  body.home-page #precision:focus-visible .precision-column {
    transform: none;
  }

  body.home-page #precision .precision-column:not(.is-active) {
    opacity: 0;
    pointer-events: none;
  }

  body.home-page #projects .project-slider .slider-dots {
    right: auto;
    left: auto;
    justify-content: center;
    padding-inline: 18px;
    max-width: calc(100vw - 44px);
    overflow: hidden;
  }

  body.home-page #projects .project-slider .slider-dots .dot,
  body.home-page #projects .project-slider .slider-dots .dot.is-active {
    transform: none;
  }
}

@media (max-width: 370px) {
  body.home-page #projects .project-slider .slider-dots {
    display: none;
  }

  .equipment-inner {
    padding-top: 66px;
    padding-bottom: 24px;
  }

  .equipment-media {
    min-height: 132px;
    max-height: 18vh;
  }

  .equipment-content h2 {
    margin-bottom: 8px;
    font-size: 21px;
  }

  .equipment-copy {
    font-size: 10px;
    line-height: 1.35;
  }

  .equipment-list {
    margin-top: 9px;
  }

  .equipment-list li {
    padding: 5px 0;
    font-size: 9px;
    line-height: 1.2;
  }

  .equipment-iso {
    width: 42px;
    margin-top: 7px;
  }
}

/* =========================================================================
   MASTER RESPONSIVE SYSTEM: PORTRAIT CAPABILITIES OVERHAUL
   Syncs with your native framework engine to restore images and stop jumps.
   ========================================================================= */

@media only screen and (max-width: 900px) and (orientation: portrait) {

  /* 1. RESTORE YOUR CODE'S ORIGINAL WRAPPER TOUCH SCROLLING */
  html, 
  html.home-page, 
  html.inner-page, 
  html.long-content-page {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scroll-snap-type: none !important; /* Kept off root per line 1121 of your file */
    -webkit-overflow-scrolling: touch !important;
  }

  body, 
  body.home-page, 
  html.inner-page body {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    touch-action: pan-y !important;
  }

  /* Syncs directly with your wrapper scrolling container properties (line 1128) */
  body.snap-page .mobile-snap-wrapper {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100dvh !important;
    overflow-x: hidden !important;
    overflow-y: scroll !important;
    overscroll-behavior-y: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scroll-snap-type: y mandatory !important; 
    scroll-behavior: smooth !important;
  }

  /* 2. SLOW DOWN SWIPES BY LINKING SELECTORS TO YOUR LONG-CONTENT RULES */
  /* Forcing height auto here matches line 1162 of your file, allowing long text 
     to expand down the page instead of truncating or sliding out of view. */
  body.snap-page main > section#capabilities,
  body.home-page main > section#capabilities,
  main > section#capabilities,
  #capabilities {
    height: auto !important;            /* Removes viewport limitations */
    min-height: 100vh !important;
    min-height: 100dvh !important;
    max-height: none !important;        /* Prevents text from being cut off */
    overflow-x: hidden !important;
    overflow-y: visible !important;     /* Restores standard, fluid page reading flow */
    
    /* GESTURE UX CONTROL: Locks onto top edge on entry, but lets your finger pause and scroll */
    scroll-snap-align: start !important; 
    scroll-snap-stop: normal !important; /* SLOWS DOWN SPEED: Disarms the aggressive full-slide skip */
  }

  /* 3. RESTRUCTURE INNER CONTENT TO ACCEP MODIFIED FLOW & PREVENT OVERLAPS */
  /* Changes grid columns to a vertical block stack to push down subsequent panels naturally */
  #capabilities .equipment-inner {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    gap: 32px !important;
    padding: 110px 24px 100px !important; /* Bottom padding floor stops panels below from bleeding up */
    height: auto !important;
    min-height: 100% !important;
    overflow: visible !important;         /* Unclutches text truncation issues */
    box-sizing: border-box !important;
  }

  /* 4. BALANCED AND POSITION-LOCKED CENTER MATRIX IMAGE */
  /* Restores the precise portrait image dimensions you approved earlier */
  #capabilities .equipment-media {
    width: 100% !important;
    height: 280px !important;       
    min-height: 280px !important;
    max-height: 280px !important;
    display: block !important;
    overflow: hidden !important;
    position: relative !important;   
    order: 1 !important;            /* Places image clean above text elements */
  }

  #capabilities .equipment-media img {
    position: absolute !important;   
    top: 50% !important;             
    left: 50% !important;
    transform: translate(-50%, -50%) !important; /* Mathematical dead-center alignment positioning crop */
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    object-fit: cover !important;    
    object-position: 50% 50% !important; 
  }

  #capabilities .equipment-content {
    width: 100% !important;
    order: 2 !important;            /* Paragraphs sit cleanly underneath the media block */
    overflow: visible !important;
  }

  /* 5. TYPOGRAPHY SCALED EXACTLY TO THE ABOUT US HERITAGE PARAGRAPHS */
  #capabilities .equipment-content h2 {
    font-size: 36px !important;     /* Bold display typography scale matching About text header specifications */
    line-height: 1.15 !important;
    margin: 0 0 18px 0 !important;
    font-weight: 700 !important;
    letter-spacing: -0.5px !important;
  }

  #capabilities .equipment-copy {
    font-size: 16px !important;     /* Matches clear mobile body font scale guidelines */
    line-height: 1.65 !important;
    color: rgba(255, 255, 255, 0.9) !important;
    margin-bottom: 28px !important;
  }

  /* 6. COMFORTABLE EXPANDED FACILITY LIST SPACING */
  #capabilities .equipment-list {
    display: grid !important;
    grid-template-columns: 1fr !important; /* Drops columns to standard vertical formatting blocks */
    width: 100% !important;
    margin-top: 24px !important;
  }

  #capabilities .equipment-list li {
    padding: 14px 0 !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
  }
}