/* Phase 4A: first-viewport styles. Keep this file small and render-blocking. */
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url("../fonts/industrial/barlow-condensed-600-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: optional;
  src: url("../fonts/industrial/barlow-condensed-700-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 800;
  font-display: optional;
  src: url("../fonts/industrial/barlow-condensed-800-latin.woff2") format("woff2");
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 800;
  font-display: optional;
  src: url("../fonts/industrial/inter-variable-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400 800;
  font-display: optional;
  src: url("../fonts/industrial/inter-variable-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191,
    U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --gnc-color-turquoise: #00b4cc;
  --gnc-color-red: #ed1b2f;
  --gnc-color-red-dark: #c71325;
  --gnc-color-dark: #101a20;
  --gnc-color-white: #fff;
  --gnc-font-display: "Barlow Condensed", "Arial Narrow", sans-serif;
  --gnc-font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --gnc-motion-standard: cubic-bezier(.22, 1, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 5.75rem; }
body { margin: 0; overflow-x: clip; color: #172228; background: #fff; font-family: var(--gnc-font-body); line-height: 1.5; }
a { color: inherit; text-decoration: none; }
button { margin: 0; font: inherit; }
img { display: block; max-width: 100%; }
h1, h2, h3, h4, h5, h6 { font-family: var(--gnc-font-display); }
.container, .container-fluid, .container-xxl { width: 100%; margin-right: auto; margin-left: auto; padding-right: .75rem; padding-left: .75rem; }
@media (min-width: 576px) { .container { max-width: 540px; } }
@media (min-width: 768px) { .container { max-width: 720px; } }
@media (min-width: 992px) { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container, .container-xxl { max-width: 1140px; } }
@media (min-width: 1400px) { .container, .container-xxl { max-width: 1320px; } }
.d-none { display: none !important; }
.modal { display: none; }
.bi { display: inline-block; width: 1em; min-width: 1em; }
.quick-quote-trigger, .whatsapp-float { visibility: hidden; }
.deferred-styles-ready .quick-quote-trigger,
.deferred-styles-ready .whatsapp-float { visibility: visible; }

/* Header */
.industrial-header { position: fixed; z-index: 997; top: 0; right: 0; left: 0; min-height: 5.25rem; padding: .55rem 0; color: #fff; background: rgb(16 26 32 / 86%); border-bottom: 1px solid rgb(255 255 255 / 11%); backdrop-filter: blur(18px) saturate(130%); -webkit-backdrop-filter: blur(18px) saturate(130%); }
.industrial-header__shell { display: flex; align-items: center; gap: 1.3rem; }
.industrial-header__brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: .7rem; color: #fff; }
.industrial-header__brand img { width: 3.65rem; height: 3.65rem; object-fit: contain; }
.industrial-header__brand span { display: grid; line-height: 1; }
.industrial-header__brand strong { font-family: var(--gnc-font-display); font-size: 1.45rem; letter-spacing: .05em; }
.industrial-header__brand small { margin-top: .3rem; color: rgb(255 255 255 / 54%); font-size: .53rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.industrial-header__nav { margin-left: auto; }
.industrial-header__nav ul { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; }
.industrial-header__nav li { padding: .8rem .55rem; }
.industrial-header__nav a { color: rgb(255 255 255 / 74%); font-size: .72rem; font-weight: 700; letter-spacing: .035em; text-transform: uppercase; }
.industrial-header__actions { display: flex; flex: 0 0 auto; align-items: center; gap: .65rem; }
.industrial-button { display: inline-flex; min-height: 3rem; align-items: center; justify-content: center; gap: .7rem; padding: .8rem 1.15rem; color: #fff; background: var(--gnc-color-turquoise); border: 1px solid var(--gnc-color-turquoise); border-radius: .25rem; font-size: .76rem; font-weight: 800; letter-spacing: .055em; line-height: 1; text-transform: uppercase; }
.industrial-header__quote { background: var(--gnc-color-red); border-color: var(--gnc-color-red); }
.language-switcher { position: relative; color: #fff; }
.language-switcher summary { display: inline-flex; min-height: 2.8rem; align-items: center; gap: .5rem; padding: .7rem .75rem; border: 1px solid rgb(255 255 255 / 16%); border-radius: .25rem; cursor: pointer; font-size: .68rem; font-weight: 800; letter-spacing: .08em; list-style: none; }
.language-switcher summary::-webkit-details-marker { display: none; }
.language-switcher__menu { display: none; }
.language-switcher[open] .language-switcher__menu { z-index: 1002; display: grid; }
.mobile-nav-toggle { display: none; }

/* Hero */
.cinematic-hero { position: relative; display: grid; min-height: max(46rem, 100svh); align-items: end; overflow: hidden; color: #fff; background: var(--gnc-color-dark); isolation: isolate; }
.cinematic-hero__media, .cinematic-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; }
.cinematic-hero__media { z-index: -4; }
.cinematic-hero__media img { object-fit: cover; object-position: 58% 50%; filter: saturate(.78) contrast(1.08); }
.cinematic-hero__shade { position: absolute; z-index: -3; inset: 0; background: linear-gradient(90deg, rgb(8 15 19 / 94%) 0%, rgb(8 15 19 / 76%) 42%, rgb(8 15 19 / 18%) 77%), linear-gradient(0deg, rgb(8 15 19 / 78%) 0%, transparent 50%); }
.cinematic-hero__grid { position: absolute; z-index: -2; inset: 0; opacity: .14; background-image: linear-gradient(rgb(255 255 255 / 20%) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / 20%) 1px, transparent 1px); background-size: 5rem 5rem; mask-image: linear-gradient(90deg, #000, transparent 72%); }
.cinematic-hero__line { position: absolute; z-index: -1; height: 1px; background: linear-gradient(90deg, transparent, var(--gnc-color-turquoise), transparent); opacity: .78; }
.cinematic-hero__line--one { top: 29%; left: -20%; width: 68%; }
.cinematic-hero__line--two { top: 62%; left: 35%; width: 48%; }
.cinematic-hero__content { padding-top: 10rem; padding-bottom: clamp(7rem, 11vh, 9rem); }
.cinematic-hero__eyebrow { display: flex; align-items: center; gap: .85rem; margin: 0 0 1.5rem; color: var(--gnc-color-turquoise); font-size: .68rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.cinematic-hero__eyebrow::before { width: 3rem; height: 2px; background: var(--gnc-color-red); content: ""; }
.cinematic-hero h1 { max-width: 67rem; margin: 0; color: #fff; font-size: clamp(4.4rem, 8.7vw, 9.4rem); font-weight: 800; letter-spacing: -.035em; line-height: .78; text-wrap: balance; }
.cinematic-hero h1 span { color: transparent; -webkit-text-stroke: 1.5px rgb(255 255 255 / 88%); }
.cinematic-hero__intro { max-width: 45rem; margin: 2.2rem 0 0; color: rgb(255 255 255 / 82%); font-size: clamp(1rem, 1.5vw, 1.22rem); line-height: 1.7; }
.cinematic-hero__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2.25rem; }
.cinematic-hero__primary, .cinematic-hero__secondary { display: inline-flex; min-height: 3.65rem; align-items: center; justify-content: center; gap: .75rem; padding: .9rem 1.35rem; color: #fff; border: 1px solid; border-radius: .2rem; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.cinematic-hero__primary { background: var(--gnc-color-red); border-color: var(--gnc-color-red); }
.cinematic-hero__secondary { background: rgb(16 26 32 / 55%); border-color: rgb(255 255 255 / 58%); backdrop-filter: blur(8px); }
.cinematic-hero__scroll { position: absolute; right: max(1.5rem, calc((100vw - 82rem) / 2)); bottom: 2.25rem; display: flex; align-items: center; gap: .65rem; color: rgb(255 255 255 / 75%); font-size: .62rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }

@media (min-width: 992px) { .d-lg-inline-flex { display: inline-flex !important; } }
@media (max-width: 1199px) {
  .industrial-header { min-height: 4.75rem; padding: .35rem 0; }
  .industrial-header__brand img { width: 3.25rem; height: 3.25rem; }
  .industrial-header__nav { order: 3; margin-left: 0; }
  .industrial-header__nav ul { display: none; }
  .industrial-header__nav .mobile-nav-toggle { position: relative; display: grid; width: 2.65rem; height: 2.65rem; place-items: center; margin: 0 0 0 .1rem; padding: 0; color: #fff; background: rgb(255 255 255 / 5%); border: 1px solid rgb(255 255 255 / 18%); border-radius: .25rem; font-size: 1.35rem; }
  .industrial-header__actions { margin-left: auto; }
  .cinematic-hero h1 { font-size: clamp(4.2rem, 10vw, 7.2rem); }
}
@media (max-width: 767px) {
  :root {
    --gnc-font-display: "Arial Narrow", Arial, sans-serif;
    --gnc-font-body: system-ui, -apple-system, "Segoe UI", sans-serif;
  }
  .industrial-header__shell { justify-content: space-between; gap: .5rem; }
  .industrial-header__brand { margin-right: auto; }
  .industrial-header__brand span { display: none; }
  .industrial-header__brand img { width: 3rem; height: 3rem; }
  .industrial-header__actions { flex: 0 0 auto; margin-left: 0; }
  .industrial-header__nav { flex: 0 0 2.65rem; }
  .language-switcher summary { min-height: 2.5rem; padding: .55rem .65rem; }
  .language-switcher summary .bi-globe2 { display: none; }
  .cinematic-hero { min-height: 43rem; }
  .cinematic-hero__media img { object-position: 57% 50%; }
  .cinematic-hero__shade { background: linear-gradient(0deg, rgb(8 15 19 / 97%) 0%, rgb(8 15 19 / 78%) 61%, rgb(8 15 19 / 36%) 100%); }
  .cinematic-hero__content { padding-top: 7.5rem; padding-bottom: 5.6rem; }
  .cinematic-hero h1 { font-size: clamp(3.2rem, 14vw, 5.15rem); line-height: .84; }
  .cinematic-hero h1 span { -webkit-text-stroke: 1.25px #fff; text-shadow: 0 2px 18px rgb(0 0 0 / 48%); }
  .cinematic-hero__intro { margin-top: 1.35rem; color: rgb(255 255 255 / 88%); font-size: .93rem; }
  .cinematic-hero__actions { display: grid; margin-top: 1.7rem; }
  .cinematic-hero__primary, .cinematic-hero__secondary { width: 100%; min-height: 3.45rem; }
  .cinematic-hero__scroll { right: auto; bottom: 1.35rem; left: 1rem; }
}
@media (max-width: 390px) {
  .industrial-header__brand img { width: 2.75rem; height: 2.75rem; }
  .cinematic-hero h1 { font-size: 2.72rem; letter-spacing: -.025em; }
  .cinematic-hero__eyebrow { gap: .55rem; font-size: .54rem; letter-spacing: .09em; }
  .cinematic-hero__eyebrow::before { width: 1.25rem; }
}
@media (max-width: 360px) {
  .cinematic-hero h1 { font-size: 2.52rem; }
  .cinematic-hero__content { padding-inline: .15rem; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
