/* Cleaned cinematic-ia.css */
/* Repeats merged, abandoned plant-flow-person code removed. */

:root {
  --black: #090909;
  --black-2: #111;
  --black-3: #181818;
  --panel: rgba(255,255,255,.055);
  --panel-strong: rgba(255,255,255,.09);
  --line: rgba(255,255,255,.13);
  --line-soft: rgba(255,255,255,.075);
  --text: #f7f2e9;
  --muted: rgba(247,242,233,.68);
  --red: #c41119;
  --red-2: #ed1c24;
  --red-glow: #ff4a51;
  --orange: #ff9f1c;
  --green: #18851f;
  --radius: 28px;
  --container: 1210px;
  --header-h: 84px;
  --shadow: 0 32px 110px rgba(0,0,0,.45);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 34px);
}

body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color: var(--text);
  background: var(--black);
  line-height: 1.55;
  overflow-x: hidden;
}

body.menu-open {
  overflow: hidden;
}

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

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

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

h1,h2,h3 {
  line-height: .96;
  letter-spacing: -.062em;
}

h1 {
  font-size: clamp(44px, 6.2vw, 92px);
}

h2 {
  font-size: clamp(34px, 4.8vw, 74px);
}

h3 {
  font-size: clamp(22px, 2.2vw, 34px);
}

p {
  color: var(--muted);
}

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

.section {
  position: relative;
  padding: 122px 0;
}

.dark-section {
  background: radial-gradient(circle at 18% 5%, rgba(237,28,36,.18), transparent 30%), radial-gradient(circle at 85% 12%, rgba(255,159,28,.08), transparent 26%), var(--black);
}

.skip-link {
  position: absolute;
  z-index: 999;
  top: -90px;
  left: 12px;
  background: var(--red);
  color: white;
  padding: 12px 18px;
  border-radius: 999px;
}

.skip-link:focus {
  top: 12px;
}

.page-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 0;
  background: linear-gradient(90deg, var(--red), var(--orange));
  z-index: 200;
  box-shadow: 0 0 18px rgba(237,28,36,.8);
}

.grain {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 150;
  opacity: .11;
  mix-blend-mode: overlay;
  background-image: radial-gradient(circle at 20% 20%, rgba(255,255,255,.3) 0 1px, transparent 1px), radial-gradient(circle at 75% 65%, rgba(255,255,255,.18) 0 1px, transparent 1px);
  background-size: 34px 34px, 46px 46px;
  animation: grainMove 8s steps(9) infinite;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 90;
  height: var(--header-h);
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 24px;
  padding: 0 max(21px, calc((100vw - var(--container)) / 2));
  background: rgba(10,10,10,.92);
  backdrop-filter: blur(24px) saturate(1.3);
  border-bottom: 1px solid rgba(255,255,255,.07);
  box-shadow: 0 1px 0 rgba(255,255,255,.05), 0 8px 36px rgba(0,0,0,.50);
}

.brand img {
  width: clamp(230px, 22vw, 370px);
  height: 58px;
  object-fit: contain;
  object-position: left center;
  transition: opacity 0.42s cubic-bezier(.4, 0, .2, 1),
              transform 0.42s cubic-bezier(.4, 0, .2, 1);
}

/* Hero logo (index.html only) — flows inside .hero-copy flex column */
.hero-logo-wrap {
  position: relative;
  width: fit-content;
  pointer-events: none;
  margin-bottom: 32px;
  isolation: isolate;
}

.hero-logo-wrap::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -22% -10% -18% -8%;
  border-radius: 52% 48% 54% 46% / 44% 46% 58% 56%;
  background:
    radial-gradient(ellipse at 30% 45%, rgba(255,255,255,.18), transparent 38%),
    radial-gradient(ellipse at 18% 48%, rgba(237,28,36,.34), transparent 54%),
    radial-gradient(ellipse at 72% 52%, rgba(34,145,62,.14), transparent 56%),
    radial-gradient(ellipse at center, rgba(0,0,0,.72), transparent 72%);
  filter: blur(clamp(14px, 1.8vw, 26px));
  opacity: .82;
  transform: translateY(3%);
}

.hero-logo {
  width: clamp(330px, 36vw, 540px);
  height: auto;
  display: block;
  position: relative;
  z-index: 1;
  filter:
    drop-shadow(0 4px 24px rgba(0,0,0,.78))
    drop-shadow(0 0 8px rgba(255,255,255,.08));
  will-change: opacity;
}

/* Homepage: header brand hidden while hero logo is visible */
.hero-page .brand {
  pointer-events: none;
}

.hero-page .brand img {
  opacity: 0;
  transform: scale(0.88) translateY(-4px);
}

/* Header brand visible once hero logo scrolls out */
.hero-page.header-brand-visible .brand {
  pointer-events: auto;
}

.hero-page.header-brand-visible .brand img {
  opacity: 1;
  transform: none;
}

@media (max-width: 820px) {
  .hero-logo { width: 360px; }
}

@media (max-width: 520px) {
  .hero-logo { width: 78vw; }
}

.main-nav {
  justify-self: center;
  display: flex;
  gap: 2px;
  padding: 5px;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(0,0,0,.20),
    0 4px 22px rgba(0,0,0,.32);
}

.main-nav a {
  position: relative;
  padding: 10px 16px;
  color: rgba(255,255,255,.58);
  font-weight: 860;
  font-size: 13px;
  letter-spacing: .01em;
  border-radius: 999px;
  transition: color .22s ease, background .22s ease, box-shadow .22s ease;
}

.main-nav a::after {
  content: "";
  position: absolute;
  bottom: 7px;
  left: 50%;
  transform: translateX(-50%) scaleX(0);
  width: 16px;
  height: 2px;
  border-radius: 999px;
  background: var(--red-2);
  transition: transform .26s cubic-bezier(.4,0,.2,1);
}

.main-nav a:hover {
  color: white;
  background: rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 0 0 1px rgba(255,255,255,.06);
}

.main-nav a:hover::after {
  transform: translateX(-50%) scaleX(1);
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.quote-link {
  display: inline-flex;
  align-items: center;
  min-height: 42px;
  padding: 0 18px;
  border-radius: 999px;
  background: var(--red);
  color: white;
  font-weight: 950;
  font-size: 13px;
  box-shadow: 0 16px 44px rgba(237,28,36,.30);
  transition: transform .22s ease, box-shadow .22s ease;
}

.quote-link:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 58px rgba(237,28,36,.44);
}

.lang {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-weight: 900;
  font-size: 13px;
  border: 1px solid rgba(255,255,255,.17);
  color: white;
  transition: .22s ease;
}

.lang:hover {
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.32);
}

.menu-trigger {
  width: 48px;
  height: 48px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 14px;
  background: rgba(255,255,255,.07);
  cursor: pointer;
  transition: background .22s ease, border-color .22s ease, transform .22s ease;
}

.menu-trigger:hover {
  background: rgba(255,255,255,.13);
  border-color: rgba(255,255,255,.28);
  transform: scale(1.06);
}

.menu-trigger span {
  display: block;
  height: 2px;
  border-radius: 999px;
  background: white;
  transition: width .28s cubic-bezier(.4,0,.2,1);
}

.menu-trigger span:nth-child(1) { width: 20px; }
.menu-trigger span:nth-child(2) { width: 13px; }
.menu-trigger span:nth-child(3) { width: 17px; }

.menu-trigger:hover span { width: 20px; }

.mega-menu {
  position: fixed;
  inset: 0;
  z-index: 190;
  opacity: 0;
  pointer-events: none;
  transform: scale(1.015);
  transition: opacity .28s ease, transform .28s ease;
  background: #030303;
}

.mega-menu.is-open {
  opacity: 1;
  pointer-events: auto;
  transform: scale(1);
}

.mega-backdrop {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 12% 18%, rgba(237,28,36,.30), transparent 34%),
    radial-gradient(circle at 88% 82%, rgba(255,159,28,.09), transparent 28%),
    radial-gradient(circle at 66% 30%, rgba(237,28,36,.07), transparent 22%),
    linear-gradient(135deg, #020202, #0d0d0d 52%, #040404);
}

.mega-close {
  position: absolute;
  right: 34px;
  top: 28px;
  z-index: 3;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.15);
  background: rgba(255,255,255,.07);
  color: white;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  transition: .22s ease;
}

.mega-close:hover {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.28);
  transform: rotate(90deg);
}

.mega-wrap {
  position: relative;
  z-index: 2;
  width: min(1520px, calc(100% - clamp(54px, 5vw, 96px)));
  height: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: clamp(64px, 6vw, 120px);
  align-items: center;
}

.mega-intro img {
  width: min(430px, 100%);
  margin-bottom: 22px;
}

.mega-intro p {
  max-width: 440px;
  color: rgba(247,242,233,.52);
  font-size: clamp(18px, .95vw, 22px);
  line-height: 1.55;
  margin-bottom: 28px;
}

.mega-links {
  display: grid;
  gap: clamp(4px, .28vw, 8px);
}

.mega-links a {
  display: grid;
  grid-template-columns: clamp(46px, 2.7vw, 58px) 1fr;
  grid-template-rows: auto auto;
  column-gap: clamp(18px, 1.3vw, 26px);
  row-gap: 1px;
  padding: clamp(11px, .68vw, 16px) clamp(16px, 1.1vw, 24px) clamp(11px, .68vw, 16px) clamp(10px, .65vw, 14px);
  border-radius: 18px;
  transition: background .22s ease, transform .22s ease;
  position: relative;
  overflow: hidden;
}

.mega-links a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  bottom: 14px;
  width: 2px;
  border-radius: 999px;
  background: var(--red);
  transform: scaleY(0);
  transition: transform .22s ease;
}

.mega-links a:hover {
  background: rgba(255,255,255,.058);
  transform: translateX(6px);
}

.mega-links a:hover::before {
  transform: scaleY(1);
}

.mega-links span {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: center;
  display: inline-grid;
  place-items: center;
  width: clamp(38px, 2.3vw, 48px);
  height: clamp(38px, 2.3vw, 48px);
  border-radius: 50%;
  background: rgba(237,28,36,.11);
  border: 1px solid rgba(237,28,36,.36);
  color: #ff6068;
  font-weight: 950;
  font-size: clamp(12px, .62vw, 14px);
}

.mega-links b {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  font-size: clamp(28px, min(2.55vw, 5.3vh), 50px);
  line-height: .94;
  letter-spacing: 0;
  color: transparent;
  -webkit-text-stroke: 1.1px rgba(255,255,255,.74);
  transition: color .22s ease, -webkit-text-stroke-color .22s ease;
}

.mega-links em {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  color: rgba(255,255,255,.40);
  font-style: normal;
  font-weight: 600;
  font-size: clamp(12px, .72vw, 15px);
  line-height: 1.25;
  margin-top: clamp(3px, .18vw, 5px);
}

.mega-links a:hover b {
  color: white;
  -webkit-text-stroke-color: transparent;
}

.error-hero {
  min-height: 760px;
}

.error-copy {
  max-width: 980px;
}

.error-code {
  display: inline-flex;
  align-items: center;
  min-height: 46px;
  padding: 0 16px;
  border-radius: 999px;
  background: rgba(237,28,36,.14);
  border: 1px solid rgba(237,28,36,.40);
  color: #ff5b62;
  font-weight: 950;
  margin-bottom: 18px;
}

.error-actions {
  margin-top: 32px;
}

.error-routes {
  padding: 82px 0 118px;
  background: #050505;
}

.error-route-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 26px;
}

.error-route-grid a {
  min-height: 82px;
  padding: 18px;
  border-radius: 18px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.10);
  color: white;
  font-weight: 950;
  display: flex;
  align-items: center;
  transition: .22s ease;
}

.error-route-grid a:hover {
  transform: translateY(-3px);
  border-color: rgba(237,28,36,.42);
  background: rgba(237,28,36,.12);
}

.redirect-page {
  min-height: 100svh;
  display: grid;
  place-items: center;
  padding: 28px;
  background:
    linear-gradient(135deg, rgba(237,28,36,.16), transparent 34%),
    linear-gradient(215deg, rgba(255,159,28,.08), transparent 42%),
    #050505;
}

.redirect-card {
  width: min(620px, 100%);
  padding: 34px;
  border-radius: 24px;
  background: rgba(12,12,12,.82);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 34px 110px rgba(0,0,0,.38);
}

.redirect-card img {
  width: min(300px, 100%);
  margin-bottom: 24px;
}

.redirect-card h1 {
  font-size: 32px;
  margin-bottom: 10px;
}

.redirect-card p {
  color: rgba(247,242,233,.62);
  margin-bottom: 22px;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 0 24px;
  border-radius: 999px;
  font-weight: 950;
  transition: transform .22s ease, box-shadow .22s ease, background .22s ease;
}

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

.btn.red {
  background: var(--red);
  color: white;
  box-shadow: 0 22px 68px rgba(237,28,36,.33);
}

.btn.glass {
  background: rgba(255,255,255,.11);
  color: white;
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(16px);
}

.btn.red:hover {
  box-shadow: 0 28px 80px rgba(237,28,36,.54);
}

.btn.glass:hover {
  background: rgba(255,255,255,.17);
  border-color: rgba(255,255,255,.28);
}

.text-link {
  color: #ffd5d7;
  font-weight: 950;
  display: inline-flex;
  margin-top: 14px;
  transition: color .22s ease, transform .22s ease;
}

.text-link:hover {
  color: white;
  transform: translateX(5px);
}

.product-copy .overline {
  display: flex;
  align-items: center;
  gap: 12px;
}

.product-copy .overline::before {
  content: "";
  flex-shrink: 0;
  width: 22px;
  height: 2px;
  border-radius: 999px;
  background: var(--red);
}

.overline {
  color: #ffd4d6;
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: 12px;
  font-weight: 950;
  margin-bottom: 18px;
}

.hero-film {
  position: relative;
  min-height: calc(100svh - var(--header-h));
  overflow: hidden;
  background: var(--black);
}

.hero-frame, .hero-frame > picture, .hero-frame img, .hero-vignette {
  position: absolute;
  inset: 0;
}

.hero-frame > picture {
  display: block;
}

.hero-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .86;
  filter: saturate(.86) contrast(1.14) brightness(.92);
  animation: kenBurns 22s ease-in-out infinite alternate;
}

.hero-vignette {
  background:
    linear-gradient(90deg, rgba(0,0,0,.98) 0%, rgba(0,0,0,.90) 34%, rgba(0,0,0,.22) 64%, rgba(0,0,0,.78) 100%),
    linear-gradient(0deg, rgba(0,0,0,.96) 0%, rgba(0,0,0,.54) 26%, transparent 56%),
    linear-gradient(180deg, rgba(0,0,0,.54) 0%, transparent 16%),
    radial-gradient(ellipse at 7% 40%, rgba(237,28,36,.42), transparent 36%),
    radial-gradient(ellipse at 88% 62%, rgba(255,159,28,.06), transparent 28%);
}

.scan-line {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.scan-line::before {
  content: "";
  position: absolute;
  left: -20%;
  top: 0;
  width: 20%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.10), transparent);
  transform: skewX(-16deg);
  animation: sweep 7.5s ease-in-out infinite;
}

.scan-line::after {
  content: "";
  position: absolute;
  left: -14%;
  top: 0;
  width: 14%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.04), transparent);
  transform: skewX(-16deg);
  animation: sweep 13s ease-in-out 4s infinite;
}

.hero-copy {
  position: relative;
  z-index: 3;
  width: min(850px, calc(100% - 42px));
  min-height: calc(100svh - var(--header-h));
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: max(21px, calc((100vw - var(--container)) / 2));
  padding: 100px 0 120px;
}

.hero-copy .overline {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 22px;
}

.hero-copy .overline::before {
  content: "";
  flex-shrink: 0;
  width: 28px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--red), var(--red-2));
}

.hero-copy h1 {
  max-width: 850px;
  margin-bottom: 24px;
  text-shadow: 0 4px 52px rgba(0,0,0,.72);
}

.hero-text {
  max-width: 680px;
  font-size: clamp(17px, 1.6vw, 22px);
  color: rgba(247,242,233,.72);
}

.hero-actions {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 34px;
}

.decision-deck {
  position: absolute;
  z-index: 4;
  right: max(21px, calc((100vw - var(--container)) / 2));
  bottom: 58px;
  width: 348px;
  background: rgba(10,10,10,.82);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 28px;
  padding: 10px;
  box-shadow: 0 40px 120px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.09);
  backdrop-filter: blur(32px) saturate(1.6);
}

.decision-title {
  padding: 15px 17px 17px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.decision-title span {
  color: var(--red-2);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.decision-title b {
  display: block;
  font-size: 21px;
  line-height: 1.1;
  letter-spacing: -.03em;
  margin-top: 7px;
}

.decision-deck a {
  position: relative;
  display: block;
  padding: 13px 16px;
  border-radius: 18px;
  transition: background .22s ease, transform .22s ease;
  overflow: hidden;
}

.decision-deck a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 2px;
  border-radius: 999px;
  background: var(--red);
  transform: scaleY(0);
  transition: transform .22s ease;
}

.decision-deck a:hover {
  background: rgba(255,255,255,.075);
  transform: translateX(5px);
}

.decision-deck a:hover::before {
  transform: scaleY(1);
}

.decision-deck strong {
  display: block;
  color: white;
  font-size: 14px;
}

.decision-deck em {
  display: block;
  color: rgba(255,255,255,.48);
  font-style: normal;
  font-size: 12px;
  margin-top: 2px;
}

.hero-scroll {
  position: absolute;
  z-index: 3;
  left: 50%;
  bottom: 26px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  color: rgba(255,255,255,.36);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .24em;
}

.hero-scroll span {
  display: block;
  width: 1px;
  height: 48px;
  background: linear-gradient(180deg, transparent, rgba(255,255,255,.80), transparent);
  animation: scrollPulse 1.8s ease-in-out infinite;
}

.video-feature {
  padding: 124px 0;
  background:
    radial-gradient(circle at 74% 52%, rgba(237,28,36,.24), transparent 32%),
    radial-gradient(circle at 16% 74%, rgba(237,28,36,.07), transparent 26%),
    #080808;
}

.video-grid {
  display: grid;
  grid-template-columns: .8fr 1.2fr;
  gap: 52px;
  align-items: center;
}

.video-copy .overline {
  display: flex;
  align-items: center;
  gap: 12px;
}

.video-copy .overline::before {
  content: "";
  flex-shrink: 0;
  width: 22px;
  height: 2px;
  border-radius: 999px;
  background: var(--red);
}

.video-copy p {
  font-size: 18px;
  max-width: 540px;
}

.video-frame {
  position: relative;
  border-radius: 38px;
  overflow: hidden;
  background: #111;
  box-shadow: 0 48px 130px rgba(0,0,0,.68), 0 0 0 1px rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.09);
  aspect-ratio: 16 / 9;
}

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

.yt-facade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: #000;
  cursor: pointer;
  display: block;
  overflow: hidden;
}
.yt-facade img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: .9;
  transition: opacity .25s ease, transform .35s ease;
}
.yt-facade:hover img,
.yt-facade:focus-visible img {
  opacity: 1;
  transform: scale(1.02);
}
.yt-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 86px;
  height: 86px;
  border-radius: 50%;
  background: rgba(255,255,255,.92);
  color: #111;
  font-size: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 6px;
  box-shadow: 0 14px 40px rgba(0,0,0,.4);
  transition: transform .25s ease, background .25s ease;
}
.yt-facade:hover .yt-play,
.yt-facade:focus-visible .yt-play {
  transform: translate(-50%, -50%) scale(1.06);
  background: var(--red, #e22b2b);
  color: #fff;
}

.stats-cinema {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background:
    radial-gradient(ellipse at 50% 0%, rgba(237,28,36,.13), transparent 55%),
    #090909;
  border-top: 1px solid rgba(255,255,255,.07);
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.stat {
  position: relative;
  min-height: 200px;
  padding: 40px 32px;
  border-right: 1px solid rgba(255,255,255,.07);
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  transition: background .30s ease;
}

.stat::after {
  content: "";
  position: absolute;
  top: 0;
  left: 16%;
  right: 16%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(237,28,36,.58), transparent);
  opacity: 0;
  transition: opacity .30s ease;
}

.stat:hover {
  background: rgba(237,28,36,.045);
}

.stat:hover::after {
  opacity: 1;
}

.stat b {
  display: block;
  color: var(--red-2);
  font-size: clamp(36px, 4.2vw, 66px);
  line-height: .88;
  letter-spacing: -.07em;
  font-variant-numeric: tabular-nums;
  min-width: 4ch;
}

.stat span {
  display: block;
  color: rgba(255,255,255,.48);
  font-weight: 740;
  font-size: 14px;
  margin-top: 13px;
  max-width: 220px;
  line-height: 1.4;
}

.section-head {
  max-width: 900px;
  margin-bottom: 44px;
}

.section-head p {
  font-size: 19px;
}

.category-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.category-card, .sector-tile, .quality-panel, .intl-card, .package-card, .calcite-panel, .timeline-item, .detail-list article {
  border-radius: 32px;
  background: linear-gradient(135deg, rgba(255,255,255,.085), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 24px 80px rgba(0,0,0,.18);
}

.category-card {
  min-height: 290px;
  padding: 32px;
  display: flex;
  flex-direction: column;
  transition: transform .32s ease, border-color .32s ease, box-shadow .32s ease, background .32s ease;
  position: relative;
  overflow: hidden;
}

.category-card::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(ellipse at 50% 0%, rgba(237,28,36,.24), transparent 64%);
  opacity: 0;
  transition: opacity .32s ease;
  pointer-events: none;
}

.category-card::after {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent 10%, rgba(237,28,36,.55) 50%, transparent 90%);
  opacity: 0;
  transition: opacity .32s ease;
  pointer-events: none;
}

.category-card:hover {
  transform: translateY(-10px);
  border-color: rgba(237,28,36,.38);
  background: linear-gradient(135deg, rgba(237,28,36,.13), rgba(255,255,255,.04));
  box-shadow: 0 36px 100px rgba(0,0,0,.44), 0 0 36px rgba(237,28,36,.12);
}

.category-card:hover::before,
.category-card:hover::after {
  opacity: 1;
}

.category-card span {
  display: inline-grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: rgba(237,28,36,.10);
  border: 1px solid rgba(237,28,36,.42);
  box-shadow: 0 0 20px rgba(237,28,36,.14);
  color: var(--red-2);
  font-weight: 950;
  font-size: 12px;
  letter-spacing: .04em;
  flex-shrink: 0;
  transition: background .32s ease, box-shadow .32s ease;
}

.category-card:hover span {
  background: rgba(237,28,36,.18);
  box-shadow: 0 0 28px rgba(237,28,36,.30);
}

.category-card h3 {
  margin-top: auto;
  padding-top: 28px;
}

.sector-tile:hover {
  transform: translateY(-7px);
  border-color: rgba(237,28,36,.55);
  background: linear-gradient(135deg, rgba(237,28,36,.18), rgba(255,255,255,.04));
}

.category-card span, .sector-tile span, .package-card span, .intl-card span, .calcite-panel span, .timeline-item span, .detail-list span, .process-card span {
  color: var(--red-2);
  font-weight: 950;
}

.sector-tile h3 {
  margin-top: 70px;
}

.three-d-concept {
  position: relative;
  overflow: hidden;
  padding: 126px 0;
  background: radial-gradient(circle at 70% 50%, rgba(237,28,36,.20), transparent 30%), linear-gradient(135deg, #050505, #151515 60%, #070707);
}

.model-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 56px;
  align-items: center;
}

.model-copy p {
  font-size: 19px;
  max-width: 650px;
}

.model-stage {
  min-height: 560px;
  position: relative;
  border-radius: 40px;
  background: radial-gradient(circle at 50% 50%, rgba(255,255,255,.08), transparent 32%), rgba(255,255,255,.035);
  border: 1px solid rgba(255,255,255,.12);
  display: grid;
  place-items: center;
  box-shadow: var(--shadow);
  perspective: 1000px;
}

.orbital {
  position: relative;
  width: min(420px, 80vw);
  height: min(420px, 80vw);
  transform-style: preserve-3d;
  animation: orbitTilt 9s ease-in-out infinite alternate;
}

.mineral-core {
  position: absolute;
  inset: 50%;
  width: 150px;
  height: 150px;
  margin: -75px;
  border-radius: 38% 62% 46% 54% / 52% 43% 57% 48%;
  background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(210,196,172,.66) 45%, rgba(237,28,36,.40)), radial-gradient(circle at 32% 28%, white, transparent 34%);
  box-shadow: 0 0 80px rgba(255,255,255,.18), inset -25px -18px 36px rgba(0,0,0,.35);
  transform: rotateX(-62deg);
  animation: mineralSpin 8s linear infinite;
}

.orbital span {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 120px;
  height: 42px;
  margin: -21px -60px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  font-weight: 950;
  font-size: 12px;
  transform: rotate(calc(var(--i) * 60deg)) translateX(195px) rotate(calc(var(--i) * -60deg)) rotateX(-62deg);
  box-shadow: 0 18px 44px rgba(0,0,0,.22);
}

.scroll-sequence {
  position: relative;
  min-height: 440svh;
  background: #000;
}

.scroll-sequence-sticky {
  position: sticky;
  top: var(--header-h);
  height: calc(100svh - var(--header-h));
  min-height: 560px;
  overflow: hidden;
  isolation: isolate;
  background: #000;
}

.scroll-sequence-canvas {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  display: block;
  background: #000;
}

.scroll-sequence-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.95) 0%, rgba(0,0,0,.72) 31%, rgba(0,0,0,.08) 58%, rgba(0,0,0,.38) 100%),
    linear-gradient(0deg, rgba(0,0,0,.80) 0%, transparent 28%, rgba(0,0,0,.52) 100%),
    radial-gradient(ellipse at 18% 52%, rgba(237,28,36,.26), transparent 34%);
}

.scroll-sequence-copy {
  position: relative;
  z-index: 2;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: calc(var(--header-h) + 56px) 0 92px;
  pointer-events: none;
}

.scroll-sequence-copy .overline {
  width: fit-content;
  color: #ffd2d5;
}

.scroll-sequence-copy h2 {
  max-width: 840px;
  margin-bottom: 22px;
  text-shadow: 0 18px 72px rgba(0,0,0,.86);
}

.scroll-sequence-copy p:not(.overline) {
  max-width: 590px;
  font-size: clamp(17px, 1.45vw, 22px);
  color: rgba(247,242,233,.72);
  text-shadow: 0 10px 36px rgba(0,0,0,.72);
}

.scroll-sequence-copy .text-link {
  width: fit-content;
  pointer-events: auto;
}

.scroll-sequence-progress {
  position: absolute;
  z-index: 3;
  left: max(21px, calc((100vw - var(--container)) / 2));
  right: max(21px, calc((100vw - var(--container)) / 2));
  bottom: 28px;
  height: 2px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
}

.scroll-sequence-progress span {
  display: block;
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--red), var(--orange));
  box-shadow: 0 0 18px rgba(237,28,36,.62);
}

.process-bg, .process-bg img, .process-mask {
  position: absolute;
  inset: 0;
}

.process-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .44;
}

.process-mask {
  background:
    linear-gradient(180deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.92) 52%, rgba(0,0,0,.98) 100%),
    radial-gradient(circle at 20% 10%, rgba(237,28,36,.20), transparent 30%);
}

.process-cinema .container {
  position: relative;
  z-index: 2;
}

.process-cinema h2 {
  max-width: 940px;
}

.story-split {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  min-height: 720px;
  background: var(--black);
  border-top: 1px solid rgba(255,255,255,.08);
}

.story-panel {
  position: relative;
  min-height: 720px;
  overflow: hidden;
}

.story-panel.image img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .82;
  transition: transform 1.2s ease;
}

.story-panel.image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center, transparent 20%, rgba(0,0,0,.46) 100%);
}

.story-panel.copy {
  padding: 92px min(7vw, 86px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: radial-gradient(circle at 15% 25%, rgba(237,28,36,.18), transparent 32%), #111;
}

.story-panel.copy p {
  font-size: 20px;
  max-width: 560px;
}

.final-scene {
  position: relative;
  min-height: 690px;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.final-bg, .final-bg img {
  position: absolute;
  inset: 0;
}

.final-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .42;
  animation: kenBurns 24s ease-in-out infinite alternate;
}

.final-scene::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 46%, rgba(237,28,36,.20), transparent 28%), linear-gradient(0deg, rgba(0,0,0,.92), rgba(0,0,0,.62));
}

.final-content {
  position: relative;
  z-index: 2;
  max-width: 900px;
  text-align: center;
}

.final-content p {
  max-width: 760px;
  margin-inline: auto;
  font-size: 20px;
}

.final-content .hero-actions {
  justify-content: center;
}

.breadcrumb {
  display: inline-flex;
  color: rgba(255,255,255,.55);
  margin-bottom: 18px;
  font-size: 13px;
  font-weight: 850;
}

.about-experience, .calcite-flow, .products-experience, .selection-matrix, .sector-experience, .facility-experience, .quality-experience, .logistics-experience, .international-experience, .contact-experience, .detail-flow, .category-deep, .gallery-section {
  padding: 120px 0;
}

.about-grid, .split-copy, .product-detail-layout, .contact-grid, .video-grid {
  display: grid;
  grid-template-columns: .62fr 1.38fr;
  gap: 60px;
  align-items: start;
}

.about-copy, .sticky-title {
  position: sticky;
  top: calc(var(--header-h) + 36px);
}

.about-copy p, .sticky-title p {
  font-size: 19px;
}

.timeline-cinema {
  position: relative;
  display: grid;
  gap: 18px;
}

.timeline-cinema::before {
  content: "";
  position: absolute;
  left: 37px;
  top: 0;
  bottom: 0;
  width: 1px;
  background: linear-gradient(180deg, var(--red), rgba(255,255,255,.12), var(--orange));
}

.timeline-item {
  position: relative;
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 24px;
  padding: 30px;
}

.timeline-item span {
  font-size: 26px;
  letter-spacing: -.04em;
}

.timeline-item p {
  margin: 10px 0 0;
}

.page-photo-band {
  position: relative;
  min-height: 620px;
  display: flex;
  align-items: end;
  overflow: hidden;
}

.page-photo-band img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .58;
}

.page-photo-band::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,.94), rgba(0,0,0,.22));
}

.photo-band-copy {
  position: relative;
  z-index: 2;
  padding-bottom: 86px;
  max-width: 850px;
}

.photo-band-copy p {
  font-size: 20px;
}

.calcite-panels {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.calcite-panel {
  min-height: 330px;
  padding: 32px;
}

.calcite-panel h3 {
  margin-top: 90px;
}

.product-comparison {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.product-hero-card {
  min-height: 560px;
  position: relative;
  overflow: hidden;
  border-radius: 34px;
  background: #111;
  box-shadow: var(--shadow);
}

.product-hero-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .74;
  transition: transform .8s ease;
}

.product-hero-card:hover img {
  transform: scale(1.08);
}

.product-hero-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,.92), transparent 54%);
}

.product-hero-card div {
  position: absolute;
  z-index: 2;
  left: 28px;
  right: 28px;
  bottom: 28px;
}

.product-hero-card span {
  color: #ffd2d5;
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: 12px;
  font-weight: 950;
}

.selection-matrix {
  padding-top: 0;
}

.matrix-row {
  display: grid;
  grid-template-columns: .35fr .65fr;
  gap: 22px;
  padding: 30px 0;
  border-top: 1px solid rgba(255,255,255,.13);
}

.matrix-row b {
  color: white;
  font-size: 28px;
  letter-spacing: -.04em;
}

.matrix-row span {
  color: var(--muted);
  font-size: 18px;
}

.detail-list {
  display: grid;
  gap: 18px;
}

.detail-list article p {
  font-size: 18px;
}

.sector-tiles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}

.sector-tile {
  min-height: 300px;
  padding: 30px;
  transition: .25s ease;
}

.sector-tile h3 {
  margin-top: 72px;
}

.deep-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .72;
  transition: transform .8s ease;
}

.deep-card:hover img {
  transform: scale(1.08);
}

.deep-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,.92), transparent 52%);
}

.deep-card span {
  color: var(--red-2);
  font-weight: 950;
}

/* ─── Gallery — Pinterest-style masonry preserving natural aspect ratios */
.gallery-grid {
  column-count: 3;
  column-gap: 18px;
  /* Force layout column-by-column so each item keeps natural ratio */
}

/* Each clickable item wraps an img — opens lightbox via data-gallery-index */
.gallery-item {
  display: block;
  position: relative;
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  margin: 0 0 18px;
  overflow: hidden;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.09);
  box-shadow: 0 16px 52px rgba(0,0,0,.28);
  background: #0a0a0a;
  cursor: zoom-in;
  transform: translateZ(0);
  transition: transform .42s cubic-bezier(.2,.7,.2,1),
              border-color .42s ease,
              box-shadow .42s ease;
}

/* Subtle frame highlight + bottom shade on hover */
.gallery-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, transparent 52%, rgba(0,0,0,.55) 100%),
    radial-gradient(ellipse at 78% 82%, rgba(237,28,36,.18), transparent 58%);
  opacity: 0;
  transition: opacity .42s ease;
  pointer-events: none;
}

.gallery-item:hover,
.gallery-item:focus-visible {
  transform: translateY(-3px);
  border-color: rgba(237,28,36,.38);
  box-shadow: 0 28px 80px rgba(0,0,0,.42);
}

.gallery-item:hover::after,
.gallery-item:focus-visible::after {
  opacity: 1;
}

.gallery-grid img {
  width: 100%;
  height: auto;
  display: block;
  filter: brightness(.94);
  transition: transform .8s cubic-bezier(.2,.7,.2,1), filter .42s ease;
}

.gallery-item:hover img,
.gallery-item:focus-visible img {
  transform: scale(1.04);
  filter: brightness(1);
}

@media (max-width: 1280px) { .gallery-grid { column-count: 3; } }
@media (max-width: 980px)  { .gallery-grid { column-count: 2; column-gap: 14px; } .gallery-item { margin-bottom: 14px; } }
@media (max-width: 520px)  { .gallery-grid { column-count: 1; column-gap: 12px; } .gallery-item { margin-bottom: 12px; border-radius: 14px; } }

/* ─── Lightbox ─────────────────────────────────────────────────────── */
.gallery-lightbox {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: rgba(8,8,8,.94);
  backdrop-filter: blur(12px) saturate(1.2);
  display: none;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity .32s ease;
}

.gallery-lightbox.is-open {
  display: flex;
  opacity: 1;
}

.gallery-lightbox-img {
  max-width: 92vw;
  max-height: 86vh;
  border-radius: 14px;
  box-shadow: 0 40px 120px rgba(0,0,0,.6);
  background: #0a0a0a;
  user-select: none;
  transition: opacity .22s ease;
}

.gallery-lightbox-img.is-loading {
  opacity: .35;
}

.gallery-lightbox-counter {
  position: absolute;
  top: 22px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 13px;
  letter-spacing: .14em;
  font-weight: 850;
  color: rgba(247,242,233,.66);
  text-transform: uppercase;
}

.gallery-lightbox-btn {
  position: absolute;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(20,20,20,.78);
  color: #f7f2e9;
  font-size: 22px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.gallery-lightbox-btn:hover,
.gallery-lightbox-btn:focus-visible {
  background: rgba(237,28,36,.32);
  border-color: rgba(237,28,36,.55);
  transform: scale(1.06);
}

.gallery-lightbox-close { top: 22px; right: 22px; }
.gallery-lightbox-prev  { left: 22px; top: 50%; transform: translateY(-50%); }
.gallery-lightbox-next  { right: 22px; top: 50%; transform: translateY(-50%); }

.gallery-lightbox-prev:hover { transform: translateY(-50%) scale(1.06); }
.gallery-lightbox-next:hover { transform: translateY(-50%) scale(1.06); }

@media (max-width: 720px) {
  .gallery-lightbox-btn { width: 44px; height: 44px; font-size: 18px; }
  .gallery-lightbox-close { top: 14px; right: 14px; }
  .gallery-lightbox-prev  { left: 10px; }
  .gallery-lightbox-next  { right: 10px; }
  .gallery-lightbox-counter { top: 16px; font-size: 12px; }
}


@media (prefers-reduced-motion: reduce) {
  .gallery-item,
  .gallery-grid img,
  .gallery-lightbox,
  .gallery-lightbox-img,
  .gallery-lightbox-btn {
    transition: none;
  }
  .gallery-item:hover img { transform: none; }
}

.quality-grid {
  display: grid;
  grid-template-columns: 1.2fr .8fr .8fr;
  gap: 15px;
}

.quality-panel {
  min-height: 300px;
  padding: 30px;
  overflow: hidden;
}

.quality-panel.large {
  grid-row: span 2;
  min-height: 620px;
}

.quality-panel.large h2 {
  margin-top: 120px;
}

.package-runway {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 14px;
}

.package-card {
  min-height: 310px;
  padding: 30px;
}

.package-card h3 {
  margin-top: 96px;
}

.package-card.port {
  background: linear-gradient(135deg, rgba(237,28,36,.26), rgba(255,255,255,.04));
}

.international-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.intl-card {
  min-height: 340px;
  padding: 30px;
}

.intl-card h3 {
  margin-top: 100px;
}

.contact-grid {
  grid-template-columns: .9fr 1.1fr;
}

.contact-copy {
  padding: 36px;
  border-radius: 34px;
  background: linear-gradient(135deg, rgba(237,28,36,.18), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.12);
}

.contact-copy p {
  font-size: 19px;
}

.request-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 26px;
}

.request-list span {
  padding: 10px 13px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  font-weight: 850;
  font-size: 13px;
}

.contact-links {
  display: grid;
  gap: 12px;
}

.contact-links a {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  padding: 22px;
  border-radius: 24px;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.12);
  transition: .22s ease;
}

.contact-links a:hover {
  transform: translateX(6px);
  border-color: rgba(237,28,36,.55);
}

.contact-links span {
  color: rgba(255,255,255,.58);
}

.contact-links b {
  color: white;
}

.site-footer {
  position: relative;
  overflow: hidden;
  background: #050505;
  border-top: 1px solid rgba(255,255,255,.08);
}

.footer-glow {
  position: absolute;
  inset: -40% -10% auto auto;
  width: 520px;
  height: 520px;
  border-radius: 50%;
  background: rgba(237,28,36,.18);
  filter: blur(70px);
}

.footer-inner, .footer-bottom {
  position: relative;
  z-index: 2;
  width: min(var(--container), calc(100% - 42px));
  margin-inline: auto;
}

.footer-inner {
  padding: 58px 0 38px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 36px;
  align-items: center;
}

.footer-inner img {
  width: min(380px, 100%);
  margin-bottom: 18px;
}

.footer-inner p {
  max-width: 620px;
}

.footer-actions {
  display: grid;
  gap: 12px;
}

.footer-actions a {
  min-width: 220px;
  padding: 18px 20px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  text-align: center;
  font-weight: 900;
}

.footer-actions a:last-child {
  background: var(--red);
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 0;
  border-top: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.48);
  font-size: 14px;
}

/* ---------- New multi-column footer layout (footer-cols) ---------- */
.footer-inner.footer-cols {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 40px;
  align-items: start;
}
.footer-brand img {
  width: min(220px, 100%);
  margin-bottom: 14px;
}
.footer-brand p {
  font-size: 14.5px;
  line-height: 1.6;
  color: rgba(255,255,255,.66);
  max-width: 380px;
}
.footer-meta {
  margin-top: 16px;
  font-size: 13.5px;
  color: rgba(255,255,255,.55);
}
.footer-meta a {
  color: inherit;
  border-bottom: 1px dashed rgba(255,255,255,.18);
}
.footer-col {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.footer-col h3 {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .14em;
  color: rgba(255,255,255,.55);
  margin: 0 0 10px;
  font-weight: 600;
}
.footer-col a {
  color: rgba(255,255,255,.85);
  text-decoration: none;
  font-size: 15px;
  padding: 4px 0;
  border-bottom: none;
  transition: color .2s ease;
}
.footer-col a:hover, .footer-col a:focus-visible {
  color: var(--red);
}
@media (max-width: 960px) {
  .footer-inner.footer-cols {
    grid-template-columns: 1fr 1fr;
  }
  .footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .footer-inner.footer-cols {
    grid-template-columns: 1fr;
  }
}

/* ---------- Cookie consent banner ---------- */
.consent-root {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 9999;
  padding: 18px;
  display: flex;
  justify-content: center;
  pointer-events: none;
}
.consent-root .consent-card {
  pointer-events: auto;
  max-width: 720px;
  width: 100%;
  background: rgba(15,15,15,.96);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  padding: 22px 24px;
  color: rgba(255,255,255,.92);
  box-shadow: 0 24px 60px rgba(0,0,0,.5);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.consent-card h2 {
  font-size: 18px;
  margin: 0 0 8px;
}
.consent-card .consent-body {
  font-size: 14.5px;
  line-height: 1.55;
  color: rgba(255,255,255,.78);
  margin: 0 0 14px;
}
.consent-card .consent-body a {
  color: inherit;
  text-decoration: underline;
}
.consent-toggles {
  display: grid;
  gap: 10px;
  margin: 12px 0 14px;
}
.consent-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 10px;
  background: rgba(255,255,255,.02);
}
.consent-row strong { display: block; font-size: 14.5px; }
.consent-row em { display: block; font-style: normal; font-size: 13px; color: rgba(255,255,255,.6); margin-top: 2px; }
.consent-row input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--red, #e22b2b); }
.consent-row-locked input { opacity: .55; }
.consent-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}
.consent-btn {
  appearance: none;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  color: #fff;
  padding: 11px 18px;
  font-size: 14px;
  border-radius: 999px;
  cursor: pointer;
  transition: background .15s ease, transform .15s ease;
}
.consent-btn:hover { background: rgba(255,255,255,.12); }
.consent-btn.primary {
  background: var(--red, #c41119);
  border-color: transparent;
  color: #fff;
  font-weight: 600;
}
.consent-btn.primary:hover { transform: translateY(-1px); }
@media (max-width: 480px) {
  .consent-root { padding: 12px; }
  .consent-card { padding: 18px; }
  .consent-actions .consent-btn { flex: 1 1 auto; }
}

.reveal-up, .reveal-slide, .reveal-scale {
  opacity: 0;
  will-change: transform, opacity;
}

.reveal-up {
  transform: translateY(34px);
}

.reveal-slide {
  transform: translateX(42px);
}

.reveal-scale {
  transform: scale(.965) translateY(18px);
}

.reveal-up.is-visible, .reveal-slide.is-visible, .reveal-scale.is-visible {
  opacity: 1;
  transform: none;
  transition: opacity .84s ease, transform .84s cubic-bezier(.2,.78,.18,1);
}

.delay-1 {
  transition-delay: .08s !important;
}

.delay-2 {
  transition-delay: .16s !important;
}

.delay-3 {
  transition-delay: .25s !important;
}

.delay-4 {
  transition-delay: .34s !important;
}

.delay-5 {
  transition-delay: .43s !important;
}

.section-lead {
  max-width: 720px;
  font-size: 19px;
}

.product-scene-grid {
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: 56px;
  align-items: center;
}

.product-copy p {
  font-size: 19px;
  max-width: 620px;
}

.cinema-product-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.cinema-card {
  position: relative;
  min-height: 560px;
  overflow: hidden;
  border-radius: 34px;
  background: #0c0c0c;
  box-shadow: 0 36px 110px rgba(0,0,0,.52);
  border: 1px solid rgba(255,255,255,.09);
  transition: transform .34s ease, border-color .34s ease, box-shadow .34s ease;
}

.cinema-card:hover {
  transform: translateY(-10px) scale(1.016);
  border-color: rgba(237,28,36,.36);
  box-shadow: 0 50px 130px rgba(0,0,0,.62), 0 0 40px rgba(237,28,36,.10);
}

.cinema-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .76;
  transition: transform .9s ease, opacity .4s ease;
}

.cinema-card:hover img {
  transform: scale(1.10);
  opacity: .66;
}

.cinema-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: radial-gradient(circle at 50% 0%, rgba(255,255,255,.10), transparent 44%);
  opacity: 0;
  transition: opacity .34s ease;
  pointer-events: none;
}

.cinema-card:hover::before {
  opacity: 1;
}

.cinema-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(0deg, rgba(0,0,0,.96) 0%, rgba(0,0,0,.54) 38%, transparent 62%),
    radial-gradient(circle at 14% 90%, rgba(237,28,36,.22), transparent 34%);
}

.cinema-card div {
  position: absolute;
  z-index: 2;
  left: 30px;
  right: 30px;
  bottom: 30px;
  transition: transform .34s ease;
}

.cinema-card:hover div {
  transform: translateY(-6px);
}

.cinema-card span {
  color: #ffd2d5;
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: 11px;
  font-weight: 950;
}

.cinema-card p {
  margin: 0;
  color: rgba(247,242,233,.70);
}

.horizontal-showcase {
  padding: 120px 0 130px;
  overflow: hidden;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(237,28,36,.08), transparent 52%),
    #050505;
  position: relative;
}

.horizontal-showcase::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 50% 100%, rgba(237,28,36,.05), transparent 48%);
  pointer-events: none;
}

.horizontal-showcase h2 {
  max-width: 820px;
}

.sector-marquee {
  margin-top: 60px;
  overflow: hidden;
  position: relative;
  border-top: 1px solid rgba(255,255,255,.09);
  border-bottom: 1px solid rgba(255,255,255,.09);
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 9%, black 91%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, black 9%, black 91%, transparent 100%);
}

.sector-marquee::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 5%, rgba(237,28,36,.30) 30%, rgba(237,28,36,.30) 70%, transparent 95%);
  pointer-events: none;
}

.sector-marquee::after {
  content: "";
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 5%, rgba(255,255,255,.07) 30%, rgba(255,255,255,.07) 70%, transparent 95%);
  pointer-events: none;
}

.marquee-track {
  display: flex;
  width: max-content;
  animation: marquee 34s linear infinite;
}

.marquee-track a {
  display: inline-flex;
  align-items: center;
  min-height: 160px;
  padding: 0 60px;
  color: transparent;
  -webkit-text-stroke: 1px rgba(255,255,255,.42);
  font-size: clamp(42px, 7vw, 104px);
  font-weight: 950;
  letter-spacing: -.07em;
  transition: color .30s ease, -webkit-text-stroke-color .30s ease, text-shadow .30s ease;
  position: relative;
}

.marquee-track a::after {
  content: "·";
  position: absolute;
  right: -4px;
  color: rgba(237,28,36,.40);
  -webkit-text-stroke: 0;
  font-size: .45em;
  letter-spacing: 0;
}

.marquee-track a:hover {
  color: var(--red-2);
  -webkit-text-stroke-color: transparent;
  text-shadow: 0 0 48px rgba(237,28,36,.50), 0 0 90px rgba(237,28,36,.22);
}

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

.category-grid.compact .category-card {
  min-height: 230px;
}

.process-cinema {
  position: relative;
  overflow: hidden;
  background: #050505;
  padding: 140px 0 152px;
}

.process-cinema .section-lead {
  max-width: 720px;
  margin-bottom: 34px;
}

.process-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 14px;
  margin-top: 56px;
  position: relative;
}

.process-card {
  position: relative;
  overflow: hidden;
  min-height: 290px;
  padding: 28px 22px 32px;
  border-radius: 26px;
  background:
    radial-gradient(circle at 50% 0%, rgba(237,28,36,.18), transparent 52%),
    linear-gradient(180deg, rgba(24,24,24,.98), rgba(8,8,8,.98));
  border: 1px solid rgba(255,255,255,.09);
  box-shadow: 0 18px 50px rgba(0,0,0,.32);
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}

.process-card::after {
  content: "";
  position: absolute;
  top: 0;
  left: 18px;
  right: 18px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(237,28,36,.70), transparent);
  opacity: 0;
  transition: opacity .28s ease;
}

.process-card:hover {
  transform: translateY(-8px);
  border-color: rgba(237,28,36,.38);
  box-shadow: 0 30px 72px rgba(0,0,0,.42), 0 0 30px rgba(237,28,36,.10);
}

.process-card:hover::after {
  opacity: 1;
}

.process-card span {
  position: relative;
  z-index: 4;
  display: inline-grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(237,28,36,.12);
  border: 1px solid rgba(237,28,36,.50);
  color: #ff6068;
  font-weight: 950;
  font-size: 13px;
  margin-bottom: 20px;
  box-shadow: 0 0 20px rgba(237,28,36,.18);
}

.process-card b {
  display: block;
  margin: 0 0 12px;
  letter-spacing: -.04em;
  font-size: 20px;
  line-height: 1.1;
  color: white;
}

.process-card p {
  margin: 0;
  color: rgba(247,242,233,.56);
  font-size: 14px;
  line-height: 1.6;
}

.about-apple {
  padding: 140px 0 150px;
  background:
    radial-gradient(ellipse at 8% 38%, rgba(237,28,36,.09), transparent 44%),
    radial-gradient(ellipse at 92% 62%, rgba(255,159,28,.04), transparent 40%),
    #060606;
}

.timeline-theater {
  padding: 140px 0 150px;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(237,28,36,.07), transparent 52%),
    radial-gradient(ellipse at 50% 100%, rgba(237,28,36,.05), transparent 50%),
    #050505;
  position: relative;
}

.about-apple-grid {
  display: grid;
  grid-template-columns: 1.08fr .92fr;
  gap: 66px;
  align-items: center;
}

.about-visual-stack {
  position: relative;
  min-height: 700px;
  border-radius: 46px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 50px 140px rgba(0,0,0,.54), 0 0 0 1px rgba(237,28,36,.06);
  background: #0d0d0d;
}

.about-visual-stack img {
  position: absolute;
  object-fit: cover;
  border-radius: 30px;
  box-shadow: 0 28px 90px rgba(0,0,0,.42);
}

.about-visual-stack img:first-child {
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: .72;
  border-radius: 46px;
}

.about-visual-stack img:nth-child(2) {
  right: 34px;
  bottom: 34px;
  width: 46%;
  height: 42%;
  opacity: .98;
  border: 1px solid rgba(255,255,255,.18);
}

.about-visual-stack::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 20% 10%, rgba(237,28,36,.28), transparent 36%),
    linear-gradient(180deg, rgba(0,0,0,.18) 0%, transparent 30%),
    linear-gradient(0deg, rgba(0,0,0,.82), rgba(0,0,0,.30) 36%, transparent 62%);
  pointer-events: none;
}

.floating-proof {
  position: absolute;
  z-index: 3;
  left: 30px;
  bottom: 30px;
  width: 240px;
  padding: 24px 26px;
  border-radius: 28px;
  background: rgba(8,8,8,.78);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(22px) saturate(1.4);
  box-shadow: 0 20px 60px rgba(0,0,0,.50), 0 0 0 1px rgba(237,28,36,.08);
}

.floating-proof::before {
  content: "";
  position: absolute;
  top: 0; left: 18px; right: 18px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(237,28,36,.60), transparent);
}

.floating-proof b {
  display: block;
  color: var(--red-2);
  font-size: 52px;
  line-height: .88;
  letter-spacing: -.06em;
  margin-bottom: 10px;
}

.floating-proof span {
  display: block;
  color: rgba(255,255,255,.66);
  font-weight: 760;
  font-size: 13px;
  line-height: 1.4;
}

.about-apple-copy p {
  font-size: 20px;
  max-width: 620px;
}

.about-proof-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 40px;
}

.about-proof-grid div {
  min-height: 160px;
  padding: 24px 22px;
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.030));
  border: 1px solid rgba(255,255,255,.10);
  position: relative;
  overflow: hidden;
  transition: border-color .30s ease, box-shadow .30s ease, background .30s ease;
}

.about-proof-grid div::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 10%, rgba(237,28,36,.55) 50%, transparent 90%);
  opacity: 0;
  transition: opacity .30s ease;
}

.about-proof-grid div:hover {
  border-color: rgba(237,28,36,.28);
  background: linear-gradient(145deg, rgba(237,28,36,.10), rgba(255,255,255,.03));
  box-shadow: 0 20px 60px rgba(0,0,0,.30), 0 0 28px rgba(237,28,36,.09);
}

.about-proof-grid div:hover::before {
  opacity: 1;
}

.about-proof-grid b {
  display: block;
  color: var(--red-2);
  font-size: 34px;
  line-height: .90;
  letter-spacing: -.05em;
  margin-bottom: 14px;
}

.about-proof-grid span {
  color: rgba(247,242,233,.58);
  font-weight: 760;
  font-size: 13px;
  line-height: 1.4;
}

.timeline-head {
  max-width: 860px;
  margin-bottom: 52px;
}

.timeline-v8 {
  display: grid;
  gap: 12px;
  position: relative;
}

.timeline-v8::before {
  content: "";
  position: absolute;
  left: 75px;
  top: 28px;
  bottom: 28px;
  width: 1px;
  background: linear-gradient(180deg, transparent 0%, rgba(237,28,36,.35) 15%, rgba(237,28,36,.35) 85%, transparent 100%);
  pointer-events: none;
}

.timeline-card {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 32px;
  padding: 32px 36px 32px 32px;
  border-radius: 28px;
  background:
    radial-gradient(ellipse at 4% 50%, rgba(237,28,36,.10), transparent 36%),
    linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.025));
  border: 1px solid rgba(255,255,255,.09);
  box-shadow: 0 16px 56px rgba(0,0,0,.24);
  position: relative;
  overflow: hidden;
  transition: border-color .32s ease, box-shadow .32s ease, transform .32s ease, background .32s ease;
}

.timeline-card::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 2px;
  border-radius: 999px;
  background: linear-gradient(180deg, transparent, var(--red-2) 40%, var(--red-2) 60%, transparent);
  transform: scaleY(0);
  transition: transform .38s cubic-bezier(.4,0,.2,1);
}

.timeline-card::after {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(237,28,36,.45) 0%, transparent 40%);
  opacity: 0;
  transition: opacity .32s ease;
}

.timeline-card:hover {
  border-color: rgba(237,28,36,.28);
  box-shadow: 0 26px 80px rgba(0,0,0,.36), 0 0 32px rgba(237,28,36,.10);
  background:
    radial-gradient(ellipse at 4% 50%, rgba(237,28,36,.15), transparent 40%),
    linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
  transform: translateX(6px);
}

.timeline-card:hover::before {
  transform: scaleY(1);
}

.timeline-card:hover::after {
  opacity: 1;
}

.timeline-card span {
  color: var(--red-2);
  font-size: 36px;
  font-weight: 950;
  letter-spacing: -.05em;
  line-height: 1;
  align-self: center;
  text-align: center;
}

.timeline-card h3 {
  margin-bottom: 10px;
}

.timeline-card p {
  max-width: 760px;
  font-size: 18px;
  color: rgba(247,242,233,.68);
  margin: 0;
}

.about-fullscreen-photo,
.quality-fullscreen {
  position: relative;
  min-height: 820px;
  display: flex;
  align-items: end;
  overflow: hidden;
  background: #050505;
}

.about-fullscreen-photo img,
.quality-fullscreen img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .52;
  filter: saturate(1.06) contrast(1.04);
  transform: scale(1.04);
  transform-origin: center center;
}

.about-fullscreen-photo::after,
.quality-fullscreen::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  background:
    linear-gradient(0deg, rgba(0,0,0,.98) 0%, rgba(0,0,0,.80) 24%, rgba(0,0,0,.22) 60%, rgba(0,0,0,.44) 100%),
    linear-gradient(90deg, rgba(0,0,0,.44) 0%, transparent 50%),
    radial-gradient(ellipse at 10% 80%, rgba(237,28,36,.26), transparent 38%),
    radial-gradient(ellipse at 75% 20%, rgba(255,159,28,.05), transparent 30%);
}

.about-photo-copy,
.quality-fullscreen-copy{
  position: relative;
  z-index: 3;
  padding-bottom: 110px;
  max-width: 960px;
}

.about-photo-copy h2,
.quality-fullscreen-copy h2 {
  text-shadow: 0 16px 48px rgba(0,0,0,.70);
}

.about-photo-copy p,
.quality-fullscreen-copy p {
  font-size: 20px;
  color: rgba(247,242,233,.76);
}

.quarry-hero-experience,
.quarry-scroll-scenes,
.quarry-cta {
  padding: 122px 0;
}

.quarry-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 50px;
  align-items: center;
}

.quarry-copy p {
  font-size: 20px;
  max-width: 640px;
}

.quarry-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 34px;
}

.quarry-metrics div {
  padding: 22px;
  min-height: 155px;
  border-radius: 26px;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.12);
}

.quarry-metrics b {
  display: block;
  color: var(--red-2);
  font-size: 34px;
  letter-spacing: -.04em;
  line-height: .95;
  margin-bottom: 12px;
}

.quarry-metrics span {
  color: var(--muted);
  font-weight: 780;
}

.quarry-visual {
  position: relative;
  min-height: 620px;
  border-radius: 46px;
  overflow: hidden;
  box-shadow: var(--shadow);
  border: 1px solid rgba(255,255,255,.13);
}

.quarry-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  inset: 0;
}

.quarry-visual::after {
  content: "";
  position: absolute;
  inset: 0;
}

.quarry-scroll-scenes {
  display: grid;
  gap: 22px;
}

.quarry-scene {
  position: relative;
  width: min(var(--container), calc(100% - 42px));
  min-height: 620px;
  margin-inline: auto;
  border-radius: 46px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: var(--shadow);
}

.quarry-scene img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .74;
  transition: transform 1s ease;
}

.quarry-scene:hover img {
  transform: scale(1.06);
}

.quarry-scene::after {
  content: "";
  position: absolute;
  inset: 0;
}

.quarry-scene div {
  position: absolute;
  z-index: 2;
  left: 46px;
  bottom: 46px;
  max-width: 620px;
}

.quarry-scene span {
  color: var(--red-2);
  font-weight: 950;
  letter-spacing: .14em;
}

.quarry-scene p {
  font-size: 20px;
}

.quarry-cta {
  background: radial-gradient(circle at 50% 20%, rgba(237,28,36,.22), transparent 28%),
    #050505;
}

.quarry-cta-inner {
  max-width: 860px;
  text-align: center;
}

.quarry-cta-inner p {
  font-size: 20px;
  margin-inline: auto;
}

.quality-theater,
.quality-path {
  padding: 124px 0;
}

.quality-theater-grid {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 56px;
  align-items: center;
}

.quality-main {
  padding: 38px;
  border-radius: 38px;
  background: radial-gradient(circle at 8% 14%, rgba(237,28,36,.18), transparent 32%),
    rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.12);
}

.quality-main p {
  font-size: 19px;
}

.quality-image {
  position: relative;
  min-height: 620px;
  border-radius: 46px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.13);
  box-shadow: var(--shadow);
}

.quality-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  inset: 0;
}

.quality-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,.48), transparent 54%),
    radial-gradient(circle at 16% 18%, rgba(237,28,36,.18), transparent 30%);
}

.quality-path-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}

.quality-path-card {
  min-height: 390px;
  padding: 30px;
  border-radius: 34px;
  background: radial-gradient(circle at 88% 10%, rgba(237,28,36,.16), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.085), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 28px 90px rgba(0,0,0,.22);
  transition: transform .25s ease, border-color .25s ease;
}

.quality-path-card:hover {
  transform: translateY(-8px);
  border-color: rgba(237,28,36,.50);
}

.quality-path-card span {
  color: var(--red-2);
  font-weight: 950;
}

.quality-path-card h3 {
  margin-top: 96px;
}

.quality-path-card p {
  min-height: 118px;
}

.quality-path-card em {
  color: #ffd5d7;
  font-style: normal;
  font-weight: 950;
}

.detail-hero {
  position: relative;
  display: flex;
  align-items: end;
  overflow: hidden;
  background: #050505;
  min-height: 720px;
}

.detail-copy h1 {
  max-width: 1040px;
  font-size: clamp(48px, 5.8vw, 92px);
}

.detail-copy p {
  font-size: clamp(18px, 1.8vw, 24px);
  max-width: 880px;
}

.product-detail-layout {
  grid-template-columns: .65fr 1.35fr;
  align-items: start;
}

.product-detail-copy {
  position: sticky;
  top: calc(var(--header-h) + 40px);
}

.product-detail-copy h2 {
  font-size: clamp(38px, 4.4vw, 68px);
}

.product-detail-copy p {
  font-size: 19px;
  color: rgba(247,242,233,.72);
}

.product-hero-card,
.deep-card,
.video-frame,
.about-visual-stack,
.quarry-visual,
.quality-image {
  border-color: rgba(255,255,255,.08);
  box-shadow: 0 34px 120px rgba(0,0,0,.34);
}

.product-hero-card::before,
.deep-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: radial-gradient(circle at 40% 14%, rgba(255,255,255,.10), transparent 24%),
    linear-gradient(0deg, rgba(0,0,0,.78), transparent 55%);
}

.product-hero-card::after,
.deep-card::after {
  z-index: 1;
}

.product-hero-card div,
.deep-card div {
  z-index: 3;
}

.category-deep .deep-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: 1.1fr .95fr .95fr;
  align-items: stretch;
}

.deep-card {
  position: relative;
  overflow: hidden;
  background: #111;
  box-shadow: var(--shadow);
  min-height: 640px;
  border-radius: 42px;
}

.deep-card:first-child {
  min-height: 700px;
}

.deep-card div {
  position: absolute;
  z-index: 2;
  left: 34px;
  right: 34px;
  bottom: 34px;
}

.detail-list article {
  padding: 30px;
  background: radial-gradient(circle at 90% 10%, rgba(237,28,36,.16), transparent 26%),
    linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.030));
  border-color: rgba(255,255,255,.10);
}

.detail-list article:hover {
  border-color: rgba(237,28,36,.42);
  transform: translateY(-4px);
  transition: transform .25s ease, border-color .25s ease;
}

.edge-image-section {
  position: relative;
  min-height: 760px;
  overflow: hidden;
  display: flex;
  align-items: end;
}

.edge-image-section > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.edge-image-section::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,.94), rgba(0,0,0,.16)),
    radial-gradient(circle at 22% 20%, rgba(237,28,36,.18), transparent 34%);
}

.edge-image-copy {
  position: relative;
  z-index: 2;
  padding-bottom: 92px;
}

.local-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.micronized-process,
.granular-process {
  position: relative;
  padding: 130px 0;
  overflow: hidden;
}

.micronized-process::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 12% 8%, rgba(237, 28, 36, .18), transparent 30%),
    radial-gradient(circle at 86% 18%, rgba(255, 159, 28, .08), transparent 28%);
  pointer-events: none;
}

.micro-process-intro,
.granular-process-intro {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 56px;
  align-items: center;
  margin-bottom: 90px;
}

.micro-process-copy p,
.granular-process-copy p {
  max-width: 660px;
  font-size: 20px;
}

.micro-process-visual,
.granular-process-visual {
  position: relative;
  min-height: 620px;
  border-radius: 46px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 34px 120px rgba(0,0,0,.34);
}

.micro-process-visual img,
.granular-process-visual img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .78;
  transition: transform 1s ease;
}

.micro-process-visual:hover img,
.granular-process-visual:hover img {
  transform: scale(1.06);
}

.micro-process-visual::after,
.granular-process-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,.78), transparent 58%),
    radial-gradient(circle at 18% 18%, rgba(237,28,36,.20), transparent 30%);
}

.micro-visual-label {
  position: absolute;
  z-index: 2;
  left: 34px;
  bottom: 34px;
  width: min(340px, calc(100% - 68px));
  padding: 24px;
  border-radius: 28px;
  background: rgba(8,8,8,.68);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(18px);
}

.micro-visual-label span,
.granular-visual-label span {
  display: block;
  color: var(--red-2);
  font-weight: 950;
  letter-spacing: .14em;
  margin-bottom: 10px;
}

.micro-visual-label b,
.granular-visual-label b {
  display: block;
  font-size: 26px;
  line-height: 1;
  letter-spacing: -.04em;
}

.micro-timeline,
.granular-timeline {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 18px;
}

.micro-timeline::before,
.granular-timeline::before {
  content: "";
  position: absolute;
  left: 40px;
  top: 20px;
  bottom: 20px;
  width: 1px;
  background: linear-gradient(180deg, var(--red), rgba(255,255,255,.20), var(--orange));
  opacity: .72;
}

.micro-step,
.granular-step {
  position: relative;
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 28px;
  padding: 32px;
  border-radius: 34px;
  background: radial-gradient(circle at 92% 10%, rgba(237,28,36,.14), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.085), rgba(255,255,255,.030));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 24px 80px rgba(0,0,0,.20);
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}

.micro-step:hover,
.granular-step:hover {
  transform: translateY(-6px);
  border-color: rgba(237,28,36,.46);
  background: radial-gradient(circle at 92% 10%, rgba(237,28,36,.22), transparent 30%),
    linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.035));
}

.micro-step span,
.granular-step span {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: rgba(237,28,36,.18);
  border: 1px solid rgba(237,28,36,.45);
  color: var(--red-2);
  font-weight: 950;
}

.micro-step h3,
.granular-step h3 {
  margin-bottom: 14px;
}

.micro-step p,
.granular-step p {
  max-width: 860px;
  font-size: 18px;
  margin: 0;
}

.micro-application-band,
.granular-size-band {
  position: relative;
  min-height: 760px;
  display: flex;
  align-items: end;
  overflow: hidden;
}

.micro-application-band > img,
.granular-size-band > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .62;
}

.micro-application-band::after,
.granular-size-band::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,.95), rgba(0,0,0,.18)),
    radial-gradient(circle at 20% 22%, rgba(237,28,36,.20), transparent 34%);
}

.micro-band-copy,
.granular-band-copy {
  position: relative;
  z-index: 2;
  max-width: 920px;
  padding-bottom: 92px;
}

.micro-band-copy p,
.granular-band-copy p {
  max-width: 760px;
  font-size: 20px;
}

.micro-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 30px;
}

.micro-tags span,
.micro-tags a {
  padding: 11px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.13);
  color: rgba(255,255,255,.82);
  font-weight: 850;
  font-size: 13px;
  text-decoration: none;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.micro-tags a:hover,
.micro-tags a:focus-visible {
  background: var(--red, #e22b2b);
  border-color: transparent;
  color: #fff;
}

.micro-offer,
.granular-usage {
  padding: 120px 0;
}

.micro-offer-grid,
.granular-usage-grid {
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  gap: 48px;
  align-items: start;
}

.micro-offer-copy,
.granular-usage-copy {
  position: sticky;
  top: calc(var(--header-h) + 40px);
}

.micro-offer-list,
.granular-info-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.micro-offer-list div,
.granular-info-list div {
  min-height: 160px;
  padding: 24px;
  border-radius: 28px;
  background: radial-gradient(circle at 90% 10%, rgba(237,28,36,.14), transparent 30%),
    rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.11);
}

.micro-offer-list b,
.granular-info-list b {
  display: block;
  color: var(--red-2);
  font-size: 22px;
  margin-bottom: 42px;
}

.micro-offer-list span,
.granular-info-list span {
  color: rgba(255,255,255,.84);
  font-weight: 850;
  font-size: 18px;
}

.granular-process::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 14% 8%, rgba(237, 28, 36, .16), transparent 30%),
    radial-gradient(circle at 84% 20%, rgba(255, 159, 28, .10), transparent 30%);
  pointer-events: none;
}

.granular-visual-label {
  position: absolute;
  z-index: 2;
  left: 34px;
  bottom: 34px;
  width: min(360px, calc(100% - 68px));
  padding: 24px;
  border-radius: 28px;
  background: rgba(8,8,8,.68);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(18px);
}

.granular-size-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 34px;
}

.granular-size-grid div {
  min-height: 150px;
  padding: 24px;
  border-radius: 28px;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.13);
  backdrop-filter: blur(14px);
}

.granular-size-grid b {
  display: block;
  color: var(--red-2);
  font-size: 34px;
  line-height: .95;
  letter-spacing: -.04em;
  margin-bottom: 14px;
}

.granular-size-grid span {
  color: rgba(255,255,255,.78);
  font-weight: 850;
}

.granular-usage-copy p {
  max-width: 640px;
  font-size: 19px;
}

.micronized-hero > img {
  object-position: center 75%;
}



.vision-mission-hero > img {
  object-position: center 90%;
}

.quality-hero > img {
  object-position: center 35%;
}
.detail-hero > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: kenBurns 22s ease-in-out infinite alternate;
  opacity: .88;
  filter: saturate(1.08) contrast(1.04) brightness(1.06);
}

.detail-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,.56) 36%, rgba(0,0,0,.16) 68%, rgba(0,0,0,.48) 100%),
    linear-gradient(0deg, rgba(0,0,0,.94) 0%, rgba(0,0,0,.40) 32%, transparent 66%),
    linear-gradient(180deg, rgba(0,0,0,.52) 0%, transparent 18%),
    radial-gradient(ellipse at 12% 28%, rgba(237,28,36,.26), transparent 36%),
    radial-gradient(ellipse at 82% 72%, rgba(255,159,28,.05), transparent 28%);
}

.detail-copy {
  position: relative;
  z-index: 2;
  padding: 150px 0 120px;
  text-shadow: 0 12px 38px rgba(0,0,0,.62);
}

.detail-copy .overline {
  display: flex;
  align-items: center;
  gap: 14px;
}

.detail-copy .overline::before {
  content: "";
  flex-shrink: 0;
  width: 28px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--red), var(--red-2));
}

.detail-copy .breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,.42);
  font-size: 13px;
  font-weight: 760;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-bottom: 20px;
  transition: color .22s ease;
}

.detail-copy .breadcrumb::before {
  content: "←";
  font-size: 14px;
  color: rgba(237,28,36,.70);
  transition: transform .22s ease;
}

.detail-copy .breadcrumb:hover {
  color: rgba(255,255,255,.72);
}

.detail-copy .breadcrumb:hover::before {
  transform: translateX(-3px);
}

.plant-overview {
  position: relative;
  padding: 130px 0;
  overflow: hidden;
}

.plant-overview::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 14% 8%, rgba(237,28,36,.18), transparent 30%),
    radial-gradient(circle at 86% 20%, rgba(255,159,28,.08), transparent 28%);
  pointer-events: none;
}

.plant-overview-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 56px;
  align-items: center;
}

.plant-overview-copy p {
  max-width: 660px;
  font-size: 20px;
}

.plant-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 34px;
}

.plant-metrics div {
  min-height: 155px;
  padding: 22px;
  border-radius: 28px;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.12);
}

.plant-metrics b {
  display: block;
  color: var(--red-2);
  font-size: 34px;
  line-height: .95;
  letter-spacing: -.04em;
  margin-bottom: 14px;
}

.plant-metrics span {
  color: rgba(255,255,255,.74);
  font-weight: 850;
}

.plant-overview-visual {
  position: relative;
  min-height: 640px;
  border-radius: 46px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 34px 120px rgba(0,0,0,.34);
}

.plant-overview-visual img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .82;
  transition: transform 1s ease;
}

.plant-overview-visual:hover img {
  transform: scale(1.06);
}

.plant-overview-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,.72), transparent 58%),
    radial-gradient(circle at 18% 18%, rgba(237,28,36,.18), transparent 30%);
}

.plant-visual-label {
  position: absolute;
  z-index: 2;
  left: 34px;
  bottom: 34px;
  width: min(420px, calc(100% - 68px));
  padding: 24px;
  border-radius: 28px;
  background: rgba(8,8,8,.68);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(18px);
}

.plant-visual-label span {
  display: block;
  color: var(--red-2);
  font-weight: 950;
  letter-spacing: .14em;
  margin-bottom: 10px;
}

.plant-visual-label b {
  display: block;
  font-size: 26px;
  line-height: 1;
  letter-spacing: -.04em;
}

.plant-flow {
  position: relative;
  padding: 130px 0;
  overflow: hidden;
  background: radial-gradient(circle at 16% 8%, rgba(237,28,36,.15), transparent 30%),
    #050505;
}

.plant-flow-head {
  max-width: 900px;
  margin-bottom: 52px;
}

.plant-flow-head p {
  max-width: 760px;
  font-size: 20px;
}

.plant-flow-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}

.plant-flow-card {
  min-height: 330px;
  padding: 30px;
  border-radius: 34px;
  background: radial-gradient(circle at 90% 10%, rgba(237,28,36,.16), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.085), rgba(255,255,255,.030));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 24px 80px rgba(0,0,0,.0);
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}

.plant-flow-card:hover {
  transform: translateY(-7px);
  border-color: rgba(237,28,36,.46);
  background: radial-gradient(circle at 90% 10%, rgba(237,28,36,.24), transparent 30%),
    linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.035));
}

.plant-flow-card span {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 18px;
  background: rgba(237,28,36,.18);
  border: 1px solid rgba(237,28,36,.45);
  color: var(--red-2);
  font-weight: 950;
  margin-bottom: 82px;
}

.plant-flow-card p {
  font-size: 17px;
  margin: 0;
}

.plant-industries {
  padding: 120px 0;
}

.plant-industries-grid {
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  gap: 48px;
  align-items: center;
}

.plant-industries-copy p {
  max-width: 620px;
  font-size: 19px;
}

.plant-sector-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.plant-sector-cloud a {
  padding: 18px 22px;
  border-radius: 999px;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.82);
  font-weight: 900;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}

.plant-sector-cloud a:hover {
  transform: translateY(-4px);
  border-color: rgba(237,28,36,.45);
  background: rgba(237,28,36,.16);
}

.plant-capacity-band {
  position: relative;
  min-height: 760px;
  display: flex;
  align-items: end;
  overflow: hidden;
}

.plant-capacity-band > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .66;
}

.plant-capacity-band::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0,0,0,.95), rgba(0,0,0,.18)),
    radial-gradient(circle at 20% 22%, rgba(237,28,36,.20), transparent 34%);
}

.plant-band-copy {
  position: relative;
  z-index: 2;
  max-width: 920px;
  padding-bottom: 92px;
}

.plant-band-copy p {
  max-width: 760px;
  font-size: 20px;
}

.plant-logistics {
  padding: 120px 0;
}

.plant-logistics-grid {
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  gap: 48px;
  align-items: start;
}

.plant-logistics-copy {
  position: sticky;
  top: calc(var(--header-h) + 40px);
}

.plant-logistics-copy p {
  max-width: 640px;
  font-size: 19px;
}

.plant-logistics-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.plant-logistics-list div {
  min-height: 160px;
  padding: 24px;
  border-radius: 28px;
  background: radial-gradient(circle at 90% 10%, rgba(237,28,36,.14), transparent 30%),
    rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.11);
}

.plant-logistics-list b {
  display: block;
  color: var(--red-2);
  font-size: 22px;
  margin-bottom: 42px;
}

.plant-logistics-list span {
  color: rgba(255,255,255,.84);
  font-weight: 850;
  font-size: 18px;
}

.plant-cta {
  position: relative;
  overflow: hidden;
  padding: 130px 0;
  background: #050505;
}

.plant-cta > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  z-index: 0;
}

.plant-cta::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at 50% 20%, rgba(237,28,36,.28), transparent 38%),
    linear-gradient(to bottom, rgba(5,5,5,.68) 0%, rgba(5,5,5,.52) 50%, rgba(5,5,5,.78) 100%);
}

.plant-cta-inner {
  position: relative;
  z-index: 2;
  max-width: 920px;
  text-align: center;
}

.plant-cta-inner p {
  max-width: 760px;
  margin-inline: auto;
  font-size: 20px;
}

.plant-cta-inner .hero-actions {
  justify-content: center;
}

@keyframes grainMove { 0% { transform: translate(0,0); } 25% { transform: translate(-2%,1%); } 50% { transform: translate(1%,-2%); } 75% { transform: translate(2%,2%); } 100% { transform: translate(0,0); } }

@keyframes kenBurns { 0% { transform: scale(1) translate3d(0,0,0); } 100% { transform: scale(1.12) translate3d(-2.4%, -1.4%, 0); } }

@keyframes sweep { 0%, 18% { left: -30%; opacity: 0; } 28% { opacity: 1; } 52% { left: 115%; opacity: 0; } 100% { left: 115%; opacity: 0; } }

@keyframes scrollPulse { 0%,100% { transform: scaleY(.35); opacity: .45; } 50% { transform: scaleY(1); opacity: 1; } }

@keyframes orbitTilt { from { transform: rotateX(62deg) rotateZ(0deg); } to { transform: rotateX(58deg) rotateZ(18deg); } }

@keyframes mineralSpin { from { rotate: 0deg; } to { rotate: 360deg; } }

@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (max-width: 1180px) {
  .main-nav {
    display: none;
  }

  .site-header {
    grid-template-columns: auto auto;
  }

  .header-actions {
    justify-self: end;
  }

  .decision-deck {
    position: relative;
    right: auto;
    bottom: auto;
    width: min(100% - 42px, 640px);
    margin: -48px auto 42px;
  }

  .hero-film {
    display: block;
  }

  .stats-cinema, .video-grid, .model-grid, .about-grid, .product-detail-layout, .split-copy, .contact-grid {
    grid-template-columns: 1fr;
  }

  .sticky-title, .about-copy {
    position: static;
  }

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

  .sector-tiles, .category-grid, .gallery-grid, .category-deep .deep-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .package-runway, .international-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .quality-grid {
    grid-template-columns: 1fr 1fr;
  }

  .quality-panel.large {
    grid-row: auto;
    min-height: 420px;
  }

  .product-scene-grid {
    grid-template-columns: 1fr;
  }

  .category-grid.compact {
    grid-template-columns: repeat(2, 1fr);
  }

  .about-apple-grid,
    .quarry-grid,
    .quality-theater-grid {
    grid-template-columns: 1fr;
  }

  .quality-path-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .about-proof-grid,
    .quarry-metrics {
    grid-template-columns: repeat(3, 1fr);
  }

  .category-deep .deep-grid {
    grid-template-columns: 1fr;
  }

  .deep-card,
    .deep-card:first-child {
    min-height: 520px;
  }

  .product-detail-copy {
    position: static;
  }

  .micro-process-intro,
  .micro-offer-grid,
  .granular-process-intro,
  .granular-usage-grid {
    grid-template-columns: 1fr;
  }

  .micro-offer-copy,
  .granular-usage-copy {
    position: static;
  }

  .plant-overview-grid,
    .plant-industries-grid,
    .plant-logistics-grid {
    grid-template-columns: 1fr;
  }

  .plant-logistics-copy {
    position: static;
  }

  .plant-flow-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 820px) {
  .brand img {
    width: 220px;
  }

  .quote-link {
    display: none;
  }

  .lang {
    display: grid;
  }

  .mega-wrap {
    grid-template-columns: 1fr;
    gap: 26px;
    align-content: center;
    overflow-y: auto;
    padding: 94px 0 42px;
  }

  .mega-intro p {
    display: none;
  }

  .mega-links a {
    grid-template-columns: 42px 1fr;
  }

  .mega-links em {
    grid-column: 2;
  }

  .mega-links b {
    font-size: 42px;
  }

  .error-route-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .hero-copy {
    min-height: calc(100svh - var(--header-h));
    width: min(100% - 28px, 930px);
    margin-left: 14px;
    padding-top: 84px;
  }

  .stats-cinema, .category-grid, .calcite-panels, .sector-tiles, .gallery-grid, .category-deep .deep-grid, .product-comparison, .quality-grid, .package-runway, .international-grid {
    grid-template-columns: 1fr;
  }

  /* Process flow: 3-col → 2-col at tablet/mobile */
  .process-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .story-split {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .story-panel {
    min-height: auto;
  }

  .story-panel.image {
    min-height: 430px;
  }

  .story-panel.copy {
    padding: 74px 24px;
  }

  .footer-inner, .footer-bottom {
    grid-template-columns: 1fr;
    display: grid;
  }

  .contact-links a, .matrix-row, .timeline-item {
    display: grid;
    grid-template-columns: 1fr;
  }

  .cinema-product-cards,
    .category-grid.compact {
    grid-template-columns: 1fr;
  }

  .cinema-card {
    min-height: 430px;
  }

  .timeline-card,
    .about-proof-grid,
    .quarry-metrics,
    .quality-path-grid {
    grid-template-columns: 1fr;
  }

  .about-visual-stack,
    .quarry-visual,
    .quality-image {
    min-height: 460px;
  }

  .quarry-scene {
    min-height: 520px;
    width: min(100% - 28px, var(--container));
  }

  .quarry-scene div {
    left: 26px;
    right: 26px;
    bottom: 26px;
  }

  .micronized-process,
  .micro-offer,
  .granular-process,
  .granular-usage {
    padding: 86px 0;
  }

  .micro-process-visual,
  .granular-process-visual {
    min-height: 460px;
  }

  .micro-step,
  .granular-step {
    grid-template-columns: 1fr;
  }

  .micro-timeline::before,
  .granular-timeline::before {
    display: none;
  }

  .micro-offer-list,
  .granular-size-grid,
  .granular-info-list {
    grid-template-columns: 1fr;
  }

  .micro-application-band,
  .granular-size-band {
    min-height: 640px;
  }

  .plant-overview,
    .plant-flow,
    .plant-industries,
    .plant-logistics,
    .plant-cta {
    padding: 86px 0;
  }

  .plant-overview-visual {
    min-height: 460px;
  }

  .plant-metrics,
    .plant-flow-grid,
    .plant-logistics-list {
    grid-template-columns: 1fr;
  }

  .plant-capacity-band {
    min-height: 640px;
  }

  /* Timeline: hide decorative vertical line when cards stack */
  .timeline-v8::before {
    display: none;
  }

  .timeline-card {
    grid-template-columns: 110px 1fr;
    gap: 18px;
    padding: 24px 20px 24px 20px;
  }

  /* Logistics cards description text size on mobile */
  .plant-logistics-list div p {
    font-size: 13px;
  }

  /* News meta tags: wrap on mobile */
  .news-meta {
    flex-wrap: wrap;
  }

  /* Quarry operation + unit grids stack to 1 col on mobile */
  .quarry-operation-grid,
  .quarry-units-grid {
    grid-template-columns: 1fr;
  }

  /* Auto-metrics strip: borders behave correctly at 2-col */
  .auto-metric {
    min-height: 130px;
  }

  /* About apple-grid: visual stack height */
  .about-visual-stack {
    min-height: 380px;
  }

  /* Quote strip padding shrink */
  .plant-quote-strip {
    padding: 64px 0;
  }
}

@media (max-width: 520px) {
  .container, .footer-inner, .footer-bottom {
    width: min(100% - 28px, var(--container));
  }

  .section, .about-experience, .calcite-flow, .products-experience, .sector-experience, .quality-experience, .logistics-experience, .international-experience, .contact-experience, .three-d-concept, .detail-flow, .category-deep, .gallery-section, .video-feature {
    padding: 82px 0;
  }

  .site-header {
    gap: 12px;
    padding: 0 14px;
  }

  .header-actions {
    gap: 8px;
  }

  .brand img {
    width: clamp(144px, 46vw, 184px);
  }

  .menu-trigger {
    width: 46px;
    height: 46px;
  }

  .menu-trigger span {
    width: 29px;
    height: 3px;
  }

  h1 {
    font-size: 42px;
  }

  h2 {
    font-size: 36px;
  }

  .process-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .mega-close {
    right: 16px;
    top: 18px;
  }

  /* Mega menu link font shrink on small phones */
  .mega-links b {
    font-size: 32px;
  }

  .mega-links em {
    display: none;
  }

  .error-hero {
    min-height: 650px;
  }

  .error-route-grid {
    grid-template-columns: 1fr;
  }

  .redirect-card {
    padding: 26px;
    border-radius: 20px;
  }

  .redirect-card h1 {
    font-size: 26px;
  }

  /* CTA sections: reduce padding on small phones */
  .plant-cta,
  .quarry-cta {
    padding: 90px 0;
  }

  /* Plant/quarry CTA heading size */
  .plant-cta-inner h2,
  .quarry-cta-inner h2 {
    font-size: 28px;
  }

  /* Detail hero: less min-height on tiny phones */
  .detail-hero {
    min-height: 480px;
  }

  /* Proof grid in about: single column on tiny phones */
  .about-proof-grid {
    grid-template-columns: 1fr;
  }

  .model-stage {
    min-height: 440px;
  }

  .orbital {
    width: 300px;
    height: 300px;
  }

  .orbital span {
    transform: rotate(calc(var(--i) * 60deg)) translateX(138px) rotate(calc(var(--i) * -60deg)) rotateX(-62deg);
  }
}

@media (max-width: 720px) {
  .scroll-sequence {
    min-height: 360svh;
  }

  .scroll-sequence-sticky {
    min-height: 520px;
  }

  .scroll-sequence-shade {
    background:
      linear-gradient(180deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.10) 34%, rgba(0,0,0,.90) 100%),
      radial-gradient(ellipse at 50% 72%, rgba(237,28,36,.20), transparent 44%);
  }

  .scroll-sequence-copy {
    justify-content: flex-end;
    padding: calc(var(--header-h) + 28px) 0 86px;
  }

  .scroll-sequence-copy h2 {
    max-width: 100%;
  }

  .scroll-sequence-progress {
    left: 14px;
    right: 14px;
    bottom: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }

  .reveal-up, .reveal-slide, .reveal-scale {
    opacity: 1 !important;
    transform: none !important;
  }
}

@media (max-width: 720px) {
  .detail-hero {
    min-height: 620px;
  }

  .detail-copy {
    padding-top: 110px;
    padding-bottom: 78px;
  }
}

/* Custom Photoshop background for plant flow section.
   Add class in HTML: <section class="plant-flow plant-flow-bg"> */
.plant-flow-bg {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(
      90deg,
      rgba(0,0,0,.06) 0%,
      rgba(0,0,0,.32) 36%,
      rgba(0,0,0,.76) 62%,
      rgba(0,0,0,.96) 100%
    ),
    url("../img/plant-flow-bg.webp") left center / cover no-repeat;
}

/* Brighter quarry image cards */
.quarry-scene img {
  opacity: .9;
  filter: brightness(.96) contrast(1.04) saturate(1.03);
}

.quarry-scene::after {
  background:
    linear-gradient(
      90deg,
      rgba(0,0,0,.62),
      rgba(0,0,0,.20),
      rgba(0,0,0,.56)
    ),
    linear-gradient(
      0deg,
      rgba(0,0,0,.56),
      transparent 58%
    );
}

.quarry-visual img {
  opacity: .9;
  filter: brightness(.96) contrast(1.04) saturate(1.03);
}

.quarry-visual::after {
  background:
    linear-gradient(0deg, rgba(0,0,0,.48), transparent 52%),
    radial-gradient(circle at 20% 20%, rgba(237,28,36,.14), transparent 32%);
}

/* Quarry page - expanded operation experience */
.quarry-command {
  position: relative;
  padding: 130px 0;
  overflow: hidden;
}

.quarry-command-grid {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 56px;
  align-items: center;
}

.quarry-command-copy p {
  max-width: 680px;
  font-size: 20px;
}

.quarry-command-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 34px;
}

.quarry-command-metrics div {
  min-height: 155px;
  padding: 22px;
  border-radius: 28px;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.12);
}

.quarry-command-metrics b {
  display: block;
  color: var(--red-2);
  font-size: 34px;
  line-height: .95;
  letter-spacing: -.04em;
  margin-bottom: 14px;
}

.quarry-command-metrics span {
  color: rgba(247,242,233,.72);
  font-weight: 850;
}

.quarry-command-visual {
  position: relative;
  min-height: 640px;
  border-radius: 46px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 34px 120px rgba(0,0,0,.34);
}

.quarry-command-visual img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .9;
  filter: brightness(.96) contrast(1.04) saturate(1.04);
  transition: transform 1s ease;
}

.quarry-command-visual:hover img {
  transform: scale(1.055);
}

.quarry-command-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(0deg, rgba(0,0,0,.58), transparent 58%),
    radial-gradient(circle at 18% 18%, rgba(237,28,36,.16), transparent 32%);
}

.quarry-command-label {
  position: absolute;
  z-index: 2;
  left: 34px;
  bottom: 34px;
  width: min(430px, calc(100% - 68px));
  padding: 24px;
  border-radius: 28px;
  background: rgba(8,8,8,.64);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(18px);
}

.quarry-command-label span {
  display: block;
  color: var(--red-2);
  font-weight: 950;
  letter-spacing: .14em;
  text-transform: uppercase;
  font-size: 12px;
  margin-bottom: 10px;
}

.quarry-command-label b {
  display: block;
  font-size: 26px;
  line-height: 1;
  letter-spacing: -.04em;
}

.quarry-machine-hero {
  position: relative;
  min-height: 820px;
  display: flex;
  align-items: end;
  overflow: hidden;
  background: #050505;
}

.quarry-machine-hero > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: .82;
  filter: brightness(.92) contrast(1.06) saturate(1.04);
}

.quarry-machine-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.70), rgba(0,0,0,.28), rgba(0,0,0,.82)),
    linear-gradient(0deg, rgba(0,0,0,.92), transparent 58%),
    radial-gradient(circle at 20% 20%, rgba(237,28,36,.18), transparent 34%);
}

.quarry-machine-copy {
  position: relative;
  z-index: 2;
  max-width: 940px;
  padding-bottom: 96px;
}

.quarry-machine-copy p {
  max-width: 760px;
  font-size: 20px;
}

.quarry-operation-flow {
  position: relative;
  padding: 130px 0;
  overflow: hidden;
}

.quarry-operation-head {
  max-width: 920px;
  margin-bottom: 54px;
}

.quarry-operation-head p {
  max-width: 760px;
  font-size: 20px;
}

.quarry-operation-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}

.quarry-operation-card {
  min-height: 330px;
  padding: 30px;
  border-radius: 34px;
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.16), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.085), rgba(255,255,255,.030));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 24px 80px rgba(0,0,0,.20);
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}

.quarry-operation-card:hover {
  transform: translateY(-7px);
  border-color: rgba(237,28,36,.46);
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.24), transparent 30%),
    linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.035));
}

.quarry-operation-card span {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 18px;
  background: rgba(237,28,36,.18);
  border: 1px solid rgba(237,28,36,.45);
  color: var(--red-2);
  font-weight: 950;
  margin-bottom: 78px;
}

.quarry-operation-card p {
  font-size: 17px;
  margin: 0;
}

.quarry-fleet {
  padding: 125px 0;
}

.quarry-fleet-grid {
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  gap: 52px;
  align-items: start;
}

.quarry-fleet-copy {
  position: sticky;
  top: calc(var(--header-h) + 40px);
}

.quarry-fleet-copy p {
  max-width: 640px;
  font-size: 19px;
}

.quarry-fleet-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.quarry-fleet-list div {
  min-height: 230px;
  padding: 26px;
  border-radius: 30px;
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.14), transparent 30%),
    rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 24px 80px rgba(0,0,0,.18);
}

.quarry-fleet-list b {
  display: block;
  color: var(--red-2);
  font-size: 22px;
  margin-bottom: 52px;
}

.quarry-fleet-list h3 {
  font-size: clamp(22px, 2vw, 31px);
  margin-bottom: 14px;
}

.quarry-fleet-list p {
  margin: 0;
}

.quarry-units {
  position: relative;
  padding: 125px 0;
  background:
    radial-gradient(circle at 12% 10%, rgba(237,28,36,.18), transparent 30%),
    linear-gradient(135deg, #050505, #111 56%, #050505);
}

.quarry-units-head {
  max-width: 920px;
  margin-bottom: 48px;
}

.quarry-units-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}

.quarry-unit-card {
  min-height: 300px;
  padding: 30px;
  border-radius: 34px;
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.14), transparent 30%),
    linear-gradient(135deg, rgba(255,255,255,.085), rgba(255,255,255,.030));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 24px 80px rgba(0,0,0,.18);
  transition: transform .25s ease, border-color .25s ease;
}

.quarry-unit-card:hover {
  transform: translateY(-6px);
  border-color: rgba(237,28,36,.45);
}

.quarry-unit-card span {
  display: inline-flex;
  padding: 9px 12px;
  border-radius: 999px;
  background: rgba(237,28,36,.16);
  border: 1px solid rgba(237,28,36,.32);
  color: #ffd4d6;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: 11px;
  font-weight: 950;
  margin-bottom: 76px;
}

.quarry-unit-card p {
  margin: 0;
  font-size: 17px;
}

@media (max-width: 1180px) {
  .quarry-command-grid,
  .quarry-fleet-grid {
    grid-template-columns: 1fr;
  }

  .quarry-fleet-copy {
    position: static;
  }

  .quarry-operation-grid,
  .quarry-units-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 820px) {
  .quarry-command,
  .quarry-operation-flow,
  .quarry-fleet,
  .quarry-units {
    padding: 86px 0;
  }

  .quarry-command-visual {
    min-height: 460px;
  }

  .quarry-command-metrics,
  .quarry-operation-grid,
  .quarry-fleet-list,
  .quarry-units-grid {
    grid-template-columns: 1fr;
  }

  .quarry-machine-hero {
    min-height: 660px;
  }

  .quarry-operation-card,
  .quarry-unit-card {
    min-height: auto;
  }
}

.quality-path-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.quality-path-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 460px;
  border-radius: 34px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  padding: 0; /* önemli */
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.14), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.028));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 24px 80px rgba(0,0,0,.20);
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}

.quality-path-card:hover {
  transform: translateY(-7px);
  border-color: rgba(237,28,36,.42);
  box-shadow: 0 32px 100px rgba(0,0,0,.28);
}

.quality-path-thumb {
  position: relative;
  width: 100%;
  height: 180px;
  margin: 0; /* önemli */
  overflow: hidden;
  border-radius: 0; /* dış kart zaten köşeyi kırpıyor */
  flex-shrink: 0;
}

.quality-path-thumb img {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: brightness(.88) contrast(1.04) saturate(1.04);
  transform: scale(1.02);
  transition: transform .7s ease, filter .7s ease;
}

.quality-path-card:hover .quality-path-thumb img {
  transform: scale(1.08);
  filter: brightness(.94) contrast(1.06) saturate(1.06);
}

.quality-path-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.06) 0%, rgba(0,0,0,.18) 50%, rgba(0,0,0,.56) 100%),
    radial-gradient(circle at 18% 18%, rgba(237,28,36,.14), transparent 34%);
}

.quality-path-thumb span {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: rgba(237,28,36,.92);
  color: #fff;
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 10px 26px rgba(237,28,36,.25);
}

.quality-path-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 22px 20px 22px; /* padding sadece burada */
}

.quality-path-body h3 {
  margin: 0 0 14px;
  font-size: clamp(26px, 2vw, 36px);
  line-height: .98;
  letter-spacing: -.04em;
}

.quality-path-body p {
  margin: 0;
  color: rgba(247,242,233,.74);
  font-size: 15px;
  line-height: 1.65;
}

.quality-path-body em {
  margin-top: auto;
  padding-top: 28px;
  font-style: normal;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .02em;
  color: #fff;
}

@media (max-width: 1180px) {
  .quality-path-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 760px) {
  .quality-path-grid {
    grid-template-columns: 1fr;
  }

  .quality-path-card {
    min-height: 420px;
  }

  .quality-path-thumb {
    height: 190px;
  }
}
/* Logistics packaging cards with top images */
.logistics-packaging {
  padding: 120px 0;
}

.logistics-packaging-head {
  max-width: 820px;
  margin-bottom: 34px;
}

.logistics-packaging-head p:last-child {
  color: rgba(247,242,233,.72);
  max-width: 700px;
}

.logistics-packaging-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
}

.logistics-pack-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 430px;
  padding: 0;
  overflow: hidden;
  border-radius: 30px;
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.12), transparent 28%),
    linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 24px 70px rgba(0,0,0,.20);
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}

.logistics-pack-card:hover {
  transform: translateY(-8px);
  border-color: rgba(237,28,36,.42);
  box-shadow: 0 32px 96px rgba(0,0,0,.28);
}

.logistics-pack-thumb {
  position: relative;
  width: 100%;
  height: 250px;
  overflow: hidden;
  flex-shrink: 0;
}

.logistics-pack-thumb img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transform: scale(1.02);
  filter: brightness(.88) contrast(1.04) saturate(1.04);
  transition: transform .7s ease, filter .7s ease;
}

.logistics-pack-card:hover .logistics-pack-thumb img {
  transform: scale(1.08);
  filter: brightness(.94) contrast(1.06) saturate(1.06);
}

.logistics-pack-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.15) 44%, rgba(0,0,0,.60) 100%),
    radial-gradient(circle at 18% 18%, rgba(237,28,36,.14), transparent 36%);
}

.logistics-pack-thumb span {
  position: absolute;
  top: 16px;
  left: 16px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background: rgba(237,28,36,.92);
  color: #fff;
  font-size: 13px;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 10px 26px rgba(237,28,36,.26);
}

.logistics-pack-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 22px 18px 20px;
}

.logistics-pack-body h3 {
  margin: 0 0 12px;
  font-size: clamp(26px, 1.8vw, 38px);
  line-height: .98;
  letter-spacing: -.04em;
}

.logistics-pack-body p {
  margin: 0;
  color: rgba(247,242,233,.74);
  font-size: 15px;
  line-height: 1.6;
}

.logistics-pack-card--accent {
  background:
    radial-gradient(circle at 90% 10%, rgba(255,255,255,.10), transparent 28%),
    linear-gradient(135deg, rgba(237,28,36,.34), rgba(120,0,0,.28));
  border-color: rgba(237,28,36,.32);
}

.logistics-pack-card--accent .logistics-pack-thumb::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(70,0,0,.12) 42%, rgba(35,0,0,.62) 100%),
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.10), transparent 34%);
}

@media (max-width: 1280px) {
  .logistics-packaging-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 900px) {
  .logistics-packaging-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .logistics-packaging {
    padding: 86px 0;
  }

  .logistics-packaging-grid {
    grid-template-columns: 1fr;
  }

  .logistics-pack-card {
    min-height: auto;
  }

  .logistics-pack-thumb {
    height: 72vw;
    max-height: 340px;
  }
}

/* Homepage detail overview background */
.index-detail-bg {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background:
    linear-gradient(
      90deg,
      rgba(0,0,0,.38) 0%,
      rgba(0,0,0,.18) 36%,
      rgba(0,0,0,.54) 68%,
      rgba(0,0,0,.94) 100%
    ),
    linear-gradient(
      0deg,
      rgba(0,0,0,.62) 0%,
      rgba(0,0,0,.18) 42%,
      rgba(0,0,0,.48) 100%
    ),
    url("../img/etna_faraway.webp") center center / cover no-repeat;
}

/* Red / orange cinematic atmosphere */
.index-detail-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 22%, rgba(237,28,36,.22), transparent 34%),
    radial-gradient(circle at 82% 28%, rgba(255,159,28,.10), transparent 30%);
}

/* Slight depth fade so cards stay readable */
.index-detail-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.72) 0%,
      transparent 24%,
      transparent 70%,
      rgba(0,0,0,.82) 100%
    );
}

/* Make content stay above background */
.index-detail-bg .container {
  position: relative;
  z-index: 2;
}


/* Quarry fleet background - safe version, layout kaydırmaz */
.quarry-fleet-bg {
  background:
    linear-gradient(
      90deg,
      rgba(0,0,0,.52) 0%,
      rgba(0,0,0,.58) 38%,
      rgba(0,0,0,.78) 68%,
      rgba(0,0,0,.94) 100%
    ),
    linear-gradient(
      0deg,
      rgba(0,0,0,.88) 0%,
      rgba(0,0,0,.22) 44%,
      rgba(0,0,0,.78) 100%
    ),
    url("../img/maden4.webp") center center / cover no-repeat;
}

/* Plant flow section with full background image */
.plant-flow-visual-bg {
  position: relative;
  min-height: 980px;
  padding: 135px 0;
  overflow: hidden;
  background: #050505;
}

.plant-flow-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
  opacity: .82;
  filter: brightness(.86) contrast(1.08) saturate(1.02);
  transform: scale(1.01);
}

.plant-flow-bg-shade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(
      90deg,
      rgba(0,0,0,.84) 0%,
      rgba(0,0,0,.52) 34%,
      rgba(0,0,0,.58) 58%,
      rgba(0,0,0,.92) 100%
    ),
    linear-gradient(
      0deg,
      rgba(0,0,0,.94) 0%,
      rgba(0,0,0,.18) 42%,
      rgba(0,0,0,.86) 100%
    ),
    radial-gradient(
      circle at 18% 22%,
      rgba(237,28,36,.24),
      transparent 34%
    );
}

.plant-flow-content-wrap {
  position: relative;
  z-index: 2;
}

.plant-flow-visual-bg .plant-flow-head {
  max-width: 820px;
  margin-bottom: 48px;
}

.plant-flow-visual-bg .plant-flow-head h2 {
  font-size: clamp(42px, 4.4vw, 78px);
  line-height: .94;
}

.plant-flow-visual-bg .plant-flow-head p {
  max-width: 760px;
  color: rgba(247,242,233,.72);
  font-size: 19px;
}

.plant-flow-visual-bg .plant-flow-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}

.plant-flow-visual-bg .plant-flow-card {
  min-height: 320px;
  padding: 30px;
  border-radius: 34px;
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.18), transparent 30%),
    rgba(16,16,16,.66);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 24px 80px rgba(0,0,0,.28);
  backdrop-filter: blur(16px);
  transition:
    transform .25s ease,
    border-color .25s ease,
    background .25s ease;
}

.plant-flow-visual-bg .plant-flow-card:hover {
  transform: translateY(-7px);
  border-color: rgba(237,28,36,.48);
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.28), transparent 32%),
    rgba(20,20,20,.72);
}

.plant-flow-visual-bg .plant-flow-card span {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin-bottom: 78px;
  border-radius: 17px;
  background: rgba(237,28,36,.20);
  border: 1px solid rgba(237,28,36,.46);
  color: var(--red-2);
  font-weight: 950;
}

.plant-flow-visual-bg .plant-flow-card h3 {
  margin-bottom: 16px;
}

.plant-flow-visual-bg .plant-flow-card p {
  margin: 0;
  color: rgba(247,242,233,.68);
  font-size: 16px;
}

@media (max-width: 1180px) {
  .plant-flow-visual-bg .plant-flow-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 820px) {
  .plant-flow-visual-bg {
    min-height: auto;
    padding: 90px 0;
  }

  .plant-flow-visual-bg .plant-flow-grid {
    grid-template-columns: 1fr;
  }

  .plant-flow-visual-bg .plant-flow-card {
    min-height: auto;
  }
}

.plant-flow-visual-bg > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: kenBurns 22s ease-in-out infinite alternate;
  opacity: .88;
  filter: saturate(1.08) contrast(1.04) brightness(1.06);
}

/* Homepage news / developments section */
.home-news {
  position: relative;
  padding: 125px 0;
  overflow: hidden;
}

.home-news::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 14% 12%, rgba(237,28,36,.20), transparent 32%),
    radial-gradient(circle at 88% 18%, rgba(255,159,28,.08), transparent 28%);
}

.home-news-head {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 34px;
  margin-bottom: 42px;
}

.home-news-head h2 {
  max-width: 850px;
}

.home-news-all {
  flex-shrink: 0;
  padding: 14px 18px;
  border-radius: 999px;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.82);
  font-weight: 900;
  transition: transform .22s ease, border-color .22s ease, background .22s ease;
}

.home-news-all:hover {
  transform: translateY(-3px);
  border-color: rgba(237,28,36,.45);
  background: rgba(237,28,36,.16);
}

.home-news-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  gap: 18px;
  align-items: stretch;
}

.home-news-feature {
  position: relative;
  min-height: 680px;
  overflow: hidden;
  border-radius: 44px;
  background: #111;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 34px 120px rgba(0,0,0,.34);
}

.home-news-feature img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  transform: scale(1.18) translateY(-6%);
  transform-origin: center center;
  opacity: .86;
  filter: brightness(.92) contrast(1.06) saturate(1.03);
  transition: transform 1s ease;
}

.home-news-feature:hover img {
  transform: scale(1.25) translateY(-6%);
}

.home-news-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(0deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.30) 54%, rgba(0,0,0,.52) 100%),
    radial-gradient(circle at 18% 20%, rgba(237,28,36,.20), transparent 34%);
}

.home-news-feature-copy {
  position: absolute;
  z-index: 2;
  left: 38px;
  right: 38px;
  bottom: 38px;
  max-width: 760px;
}

.home-news-feature-copy span,
.home-news-card span {
  display: inline-flex;
  color: #ffd4d6;
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: 11px;
  font-weight: 950;
  margin-bottom: 14px;
}

.home-news-feature-copy time {
  display: inline-flex;
  margin-left: 12px;
  color: rgba(255,255,255,.55);
  font-size: 12px;
  font-weight: 850;
}

.home-news-feature-copy h3 {
  max-width: 760px;
  font-size: clamp(34px, 3.3vw, 58px);
  margin-bottom: 18px;
}

.home-news-feature-copy p {
  max-width: 690px;
  font-size: 18px;
  color: rgba(247,242,233,.74);
}

.home-news-feature-copy em {
  display: inline-flex;
  margin-top: 12px;
  font-style: normal;
  color: white;
  font-weight: 950;
}

.home-news-list {
  display: grid;
  gap: 14px;
}

.home-news-card {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 22px;
  min-height: 208px;
  padding: 14px;
  border-radius: 34px;
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.14), transparent 30%),
    rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 24px 80px rgba(0,0,0,.20);
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}

.home-news-card:hover {
  transform: translateY(-5px);
  border-color: rgba(237,28,36,.45);
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.22), transparent 32%),
    rgba(255,255,255,.070);
}

.home-news-thumb {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  background: #111;
  min-height: 180px;
}

.home-news-thumb img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: .86;
  filter: brightness(.92) contrast(1.04) saturate(1.03);
  transition: transform .7s ease;
}

.home-news-card:hover .home-news-thumb img {
  transform: scale(1.07);
}

.home-news-card div:last-child {
  padding: 10px 8px 8px 0;
}

.home-news-card h3 {
  font-size: clamp(23px, 1.9vw, 32px);
  margin-bottom: 12px;
}

.home-news-card p {
  margin: 0;
  color: rgba(247,242,233,.66);
  font-size: 15px;
}

@media (max-width: 1180px) {
  .home-news-head {
    display: grid;
  }

  .home-news-grid {
    grid-template-columns: 1fr;
  }

  .home-news-feature {
    min-height: 580px;
  }
}

@media (max-width: 760px) {
  .home-news {
    padding: 86px 0;
  }

  .home-news-feature {
    min-height: 520px;
    border-radius: 34px;
  }

  .home-news-feature-copy {
    left: 24px;
    right: 24px;
    bottom: 24px;
  }

  .home-news-card {
    grid-template-columns: 1fr;
  }

  .home-news-thumb {
    min-height: 210px;
  }
}

/* Home news refinements - real Etna Maden news */
.home-news-video {
  cursor: pointer;
}

.home-news-play {
  position: absolute;
  z-index: 3;
  right: 34px;
  top: 34px;
  width: 74px;
  height: 74px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(237,28,36,.92);
  box-shadow: 0 24px 70px rgba(237,28,36,.34);
  border: 1px solid rgba(255,255,255,.18);
  backdrop-filter: blur(14px);
  transition: transform .25s ease, background .25s ease;
}

.home-news-play span {
  transform: translateX(2px);
  color: white;
  font-size: 25px;
  line-height: 1;
}

.home-news-feature:hover .home-news-play {
  transform: scale(1.08);
  background: #ff2630;
}

.home-news-list {
  display: grid;
  grid-template-rows: 1fr 1fr;
  gap: 14px;
}

.home-news-card {
  min-height: 330px;
}

.home-news-card h3 {
  max-width: 520px;
}

.home-news-card p {
  max-width: 560px;
}

/* Slightly stronger headline for the featured interview */
.home-news-feature-copy h3 {
  max-width: 820px;
}

.home-news-feature-copy p {
  max-width: 760px;
}

/* Mobile play button */
@media (max-width: 760px) {
  .home-news-play {
    width: 58px;
    height: 58px;
    right: 22px;
    top: 22px;
  }

  .home-news-play span {
    font-size: 20px;
  }

  .home-news-card {
    min-height: auto;
  }
}

/* News detail pages */
.news-detail-hero {
  position: relative;
  min-height: 720px;
  display: flex;
  align-items: end;
  overflow: hidden;
  background: #050505;
}

.news-detail-hero > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  opacity: .78;
  filter: brightness(.82) contrast(1.08) saturate(1.04);
}

.automation-news-hero > img {
  object-position: center 35%;
}

.news-detail-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.88), rgba(0,0,0,.48), rgba(0,0,0,.88)),
    linear-gradient(0deg, rgba(0,0,0,.94), transparent 54%),
    radial-gradient(circle at 18% 24%, rgba(237,28,36,.24), transparent 34%);
}

.news-detail-copy {
  position: relative;
  z-index: 2;
  padding-bottom: 90px;
  max-width: 960px;
}

.news-detail-copy h1 {
  max-width: 980px;
}

html[lang="en"] .automation-news-hero .news-detail-copy {
  max-width: 760px;
}

.news-detail-copy p {
  max-width: 780px;
  font-size: clamp(18px, 1.6vw, 23px);
}

.news-meta {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 22px;
}

.news-meta span {
  padding: 9px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.13);
  color: rgba(255,255,255,.78);
  font-weight: 850;
  font-size: 12px;
}

.news-article {
  padding: 120px 0;
}

.news-article-grid {
  display: grid;
  grid-template-columns: .72fr 1.28fr;
  gap: 64px;
  align-items: start;
}

.news-article-side {
  position: sticky;
  top: calc(var(--header-h) + 38px);
}

.news-article-side h2 {
  font-size: clamp(34px, 4vw, 64px);
}

.news-article-body {
  display: grid;
  gap: 24px;
}

.news-block {
  padding: 34px;
  border-radius: 34px;
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.14), transparent 30%),
    rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 24px 80px rgba(0,0,0,.20);
}

.news-block h3 {
  margin-bottom: 16px;
}

.news-block p {
  font-size: 18px;
  margin-bottom: 0;
}

.news-block-lead {
  background:
    radial-gradient(circle at 12% 8%, rgba(237,28,36,.22), transparent 34%),
    linear-gradient(135deg, rgba(237,28,36,.16), rgba(255,255,255,.052));
  border-color: rgba(237,28,36,.22);
}

.news-rich-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.news-rich-card {
  min-height: 280px;
  padding: 26px;
  border-radius: 30px;
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.13), transparent 30%),
    rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 24px 80px rgba(0,0,0,.20);
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}

.news-rich-card:hover {
  transform: translateY(-6px);
  border-color: rgba(237,28,36,.36);
  background:
    radial-gradient(circle at 90% 10%, rgba(237,28,36,.20), transparent 32%),
    rgba(255,255,255,.070);
}

.news-rich-card span {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  margin-bottom: 58px;
  border-radius: 16px;
  background: rgba(237,28,36,.16);
  border: 1px solid rgba(237,28,36,.42);
  color: var(--red-2);
  font-weight: 950;
  font-size: 13px;
}

.news-rich-card h3 {
  margin-bottom: 14px;
}

.news-rich-card p {
  margin: 0;
  color: rgba(247,242,233,.68);
  font-size: 15px;
}

.news-block-closing {
  border-color: rgba(255,159,28,.20);
  background:
    radial-gradient(circle at 84% 16%, rgba(255,159,28,.12), transparent 28%),
    rgba(255,255,255,.055);
}

.news-quote-list {
  display: grid;
  gap: 12px;
}

.news-quote-list blockquote {
  margin: 0;
  padding: 18px 20px;
  border-radius: 22px;
  background: rgba(0,0,0,.20);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(247,242,233,.82);
  font-size: 17px;
  font-weight: 760;
  line-height: 1.5;
}

.news-video-frame {
  position: relative;
  overflow: hidden;
  border-radius: 34px;
  aspect-ratio: 16 / 9;
  background: #111;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: var(--shadow);
}

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

.news-detail-cta {
  padding: 110px 0;
  background:
    radial-gradient(circle at 50% 20%, rgba(237,28,36,.22), transparent 28%),
    #050505;
}

.news-detail-cta-inner {
  max-width: 900px;
  text-align: center;
}

.news-detail-cta-inner p {
  max-width: 720px;
  margin-inline: auto;
  font-size: 20px;
}

.news-detail-cta-inner .hero-actions {
  justify-content: center;
}

@media (max-width: 980px) {
  .news-article-grid {
    grid-template-columns: 1fr;
  }

  .news-article-side {
    position: static;
  }

  .news-rich-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .news-detail-hero {
    min-height: 640px;
  }

  .news-article,
  .news-detail-cta {
    padding: 86px 0;
  }

  .news-block {
    padding: 26px;
  }

  .news-rich-card {
    min-height: auto;
  }

  .news-rich-card span {
    margin-bottom: 34px;
  }
}

/* ─── Otomasyon Haberi — Premium Layout ────────────────────── */

/* Hero HUD card */
.auto-hud-card {
  position: absolute;
  z-index: 4;
  right: max(21px, calc((100vw - var(--container)) / 2 - 70px));
  bottom: 90px;
  width: 284px;
  border-radius: 26px;
  background: rgba(5,5,5,.82);
  border: 1px solid rgba(255,255,255,.13);
  backdrop-filter: blur(28px) saturate(1.5);
  box-shadow: 0 44px 110px rgba(0,0,0,.74), inset 0 1px 0 rgba(255,255,255,.09);
  padding: 20px;
  overflow: hidden;
}

.auto-hud-card::before {
  content: "";
  position: absolute;
  top: 0; left: 18px; right: 18px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(34,197,94,.55), transparent);
}

.auto-hud-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .09em;
  color: rgba(255,255,255,.52);
}

.auto-hud-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 8px #22c55e;
  animation: autoLive 1.3s ease-in-out infinite;
  flex-shrink: 0;
}

.auto-hud-live {
  margin-left: auto;
  color: #22c55e;
  font-size: 9px;
  letter-spacing: .18em;
}

.auto-hud-rows {
  display: grid;
  gap: 6px;
}

.auto-hud-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 9px 13px;
  border-radius: 13px;
  background: rgba(255,255,255,.046);
  border: 1px solid rgba(255,255,255,.07);
  font-size: 12px;
}

.auto-hud-row span:first-child {
  color: rgba(255,255,255,.44);
  font-weight: 760;
}

.auto-hud-val {
  font-weight: 950;
  color: rgba(255,255,255,.80);
  font-variant-numeric: tabular-nums;
  font-size: 12px;
}

.auto-hud-val.is-online {
  color: #22c55e;
  font-size: 11px;
  letter-spacing: .03em;
}

.auto-hud-footer {
  margin-top: 14px;
  padding-top: 11px;
  border-top: 1px solid rgba(255,255,255,.07);
  font-size: 10px;
  color: rgba(255,255,255,.26);
  letter-spacing: .07em;
}

/* Metrics strip */
.auto-metrics-strip {
  border-top: 1px solid rgba(255,255,255,.07);
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.auto-metrics-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.auto-metric {
  min-height: 162px;
  padding: 36px 28px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-right: 1px solid rgba(255,255,255,.07);
  position: relative;
  overflow: hidden;
  transition: background .30s ease;
}

.auto-metric::after {
  content: "";
  position: absolute;
  top: 0; left: 16%; right: 16%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(237,28,36,.58), transparent);
  opacity: 0;
  transition: opacity .30s ease;
}

.auto-metric:hover {
  background: rgba(237,28,36,.045);
}

.auto-metric:hover::after {
  opacity: 1;
}

.auto-metric b {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 2px 10px;
  font-size: clamp(30px, 3.6vw, 56px);
  line-height: .88;
  letter-spacing: -.06em;
  color: var(--red-2);
}

.auto-metric b .metric-count,
.auto-metric b .metric-unit {
  color: inherit;
  font: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  margin: 0;
  max-width: none;
}

.auto-metric b .metric-unit {
  font-size: .68em;
  letter-spacing: -.03em;
}

.auto-metric > span {
  color: rgba(255,255,255,.44);
  font-size: 13px;
  font-weight: 760;
  margin-top: 12px;
  max-width: 200px;
  line-height: 1.4;
}

/* Dashboard visualization block */
.auto-dashboard-block {
  padding: 30px;
  border-radius: 34px;
  background:
    radial-gradient(circle at 92% 8%, rgba(34,197,94,.09), transparent 32%),
    linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.034));
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
}

.auto-db-header {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 24px;
}

.auto-db-header h3 {
  margin: 0;
  font-size: clamp(18px, 1.8vw, 26px);
  flex: 1;
}

.auto-db-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 22px;
}

.auto-db-meter {
  background: rgba(255,255,255,.042);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 18px;
  padding: 16px 18px;
}

.auto-db-label {
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .08em;
  color: rgba(255,255,255,.36);
  text-transform: uppercase;
  margin-bottom: 14px;
}

.auto-db-bar-wrap {
  height: 4px;
  background: rgba(255,255,255,.09);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 10px;
}

.auto-db-bar {
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--red), var(--orange));
  box-shadow: 0 0 10px rgba(237,28,36,.38);
  transition: width 1.4s cubic-bezier(.2,.78,.18,1);
}

.auto-db-bar.auto-db-bar-green {
  background: linear-gradient(90deg, #15803d, #22c55e);
  box-shadow: 0 0 10px rgba(34,197,94,.38);
}

.auto-dashboard-block.is-visible .auto-db-bar {
  width: var(--pct);
}

.auto-db-val {
  font-size: 26px;
  font-weight: 950;
  color: white;
  letter-spacing: -.04em;
  font-variant-numeric: tabular-nums;
}

.auto-db-status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.08);
}

.auto-db-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 13px;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.09);
  font-size: 11px;
  font-weight: 950;
  color: rgba(255,255,255,.40);
  letter-spacing: .05em;
}

.auto-db-status span {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  flex-shrink: 0;
}

.auto-db-status.active {
  border-color: rgba(34,197,94,.32);
  background: rgba(34,197,94,.10);
  color: #4ade80;
}

.auto-db-status.active span {
  background: #4ade80;
  box-shadow: 0 0 6px #4ade80;
}

.auto-db-status.warn {
  border-color: rgba(255,159,28,.34);
  background: rgba(255,159,28,.09);
  color: var(--orange);
}

.auto-db-status.warn span {
  background: var(--orange);
  box-shadow: 0 0 6px var(--orange);
}

/* Manual vs Automatic comparison */
.auto-compare-block {
  display: grid;
  grid-template-columns: 1fr 48px 1fr;
  gap: 0;
  align-items: stretch;
}

.auto-compare-card {
  padding: 32px;
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.032));
  border: 1px solid rgba(255,255,255,.10);
  transition: border-color .30s ease, box-shadow .30s ease;
}

.auto-compare-card:hover {
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 20px 60px rgba(0,0,0,.26);
}

.auto-compare-card-active {
  background:
    radial-gradient(circle at 8% 12%, rgba(237,28,36,.22), transparent 40%),
    linear-gradient(135deg, rgba(237,28,36,.12), rgba(255,255,255,.04));
  border-color: rgba(237,28,36,.26);
}

.auto-compare-card-active:hover {
  border-color: rgba(237,28,36,.48);
  box-shadow: 0 24px 70px rgba(237,28,36,.12);
}

.auto-compare-card > span:first-child {
  display: inline-block;
  padding: 5px 13px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .10em;
  color: rgba(255,255,255,.40);
  margin-bottom: 18px;
  text-transform: uppercase;
}

.auto-compare-card-active > span:first-child {
  background: rgba(237,28,36,.16);
  border-color: rgba(237,28,36,.38);
  color: #ff6a71;
}

.auto-compare-card h3 {
  font-size: clamp(19px, 1.8vw, 27px);
  margin-bottom: 14px;
  line-height: 1.1;
}

.auto-compare-card p {
  font-size: 15px;
  color: rgba(247,242,233,.58);
  margin: 0;
}

.auto-compare-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,.18);
  font-size: 22px;
}

/* Animations */
@keyframes autoLive {
  0%, 100% { opacity: 1; box-shadow: 0 0 9px #22c55e; }
  50%       { opacity: .22; box-shadow: 0 0 3px #22c55e; }
}

/* Responsive */
@media (max-width: 980px) {
  .auto-hud-card {
    display: none;
  }

  .auto-compare-block {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .auto-compare-divider {
    transform: rotate(90deg);
    height: 36px;
  }
}

@media (max-width: 1360px) {
  html[lang="en"] .automation-news-hero .news-detail-copy {
    max-width: 960px;
  }

  html[lang="en"] .automation-news-hero .auto-hud-card {
    display: none;
  }
}

@media (max-width: 760px) {
  .auto-metrics-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .auto-metrics-grid .auto-metric:nth-child(2n) {
    border-right: none;
  }

  .auto-metrics-grid .auto-metric:nth-child(3),
  .auto-metrics-grid .auto-metric:nth-child(4) {
    border-top: 1px solid rgba(255,255,255,.07);
  }

  .auto-db-grid {
    grid-template-columns: 1fr;
  }

  .auto-compare-divider {
    display: none;
  }
}

/* ─── Erçal Truck Haberi — Fleet & Logistics Layout ────────── */

/* Hero fleet card */
.fleet-card {
  position: absolute;
  z-index: 4;
  right: max(21px, calc((100vw - var(--container)) / 2));
  bottom: 90px;
  width: 278px;
  border-radius: 26px;
  background: rgba(5,5,5,.82);
  border: 1px solid rgba(255,255,255,.13);
  backdrop-filter: blur(28px) saturate(1.5);
  box-shadow: 0 44px 110px rgba(0,0,0,.74), inset 0 1px 0 rgba(255,255,255,.09);
  padding: 20px;
  overflow: hidden;
}

.fleet-card::before {
  content: "";
  position: absolute;
  top: 0; left: 18px; right: 18px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,159,28,.58), transparent);
}

.fleet-card-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .09em;
  color: rgba(255,255,255,.52);
}

.fleet-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 8px var(--orange);
  animation: fleetDot 1.4s ease-in-out infinite;
  flex-shrink: 0;
}

.fleet-status {
  margin-left: auto;
  color: var(--orange);
  font-size: 9px;
  letter-spacing: .18em;
}

.fleet-rows {
  display: grid;
  gap: 6px;
  margin-bottom: 14px;
}

.fleet-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 10px;
  padding: 10px 13px;
  border-radius: 13px;
  background: rgba(255,255,255,.046);
  border: 1px solid rgba(255,255,255,.07);
}

.fleet-brand-label {
  font-size: 13px;
  font-weight: 950;
  color: white;
}

.fleet-count {
  font-size: 11px;
  font-weight: 760;
  color: rgba(255,255,255,.48);
}

.fleet-dot-sm {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(255,255,255,.20);
  flex-shrink: 0;
}

.fleet-dot-sm.active {
  background: var(--orange);
  box-shadow: 0 0 6px var(--orange);
}

.fleet-partner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 11px 13px;
  border-radius: 13px;
  background: rgba(255,159,28,.10);
  border: 1px solid rgba(255,159,28,.22);
}

.fleet-partner span {
  font-size: 10px;
  color: rgba(255,159,28,.66);
  font-weight: 760;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.fleet-partner strong {
  font-size: 13px;
  color: var(--orange);
  font-weight: 950;
}

/* Video section */
.truck-video-section {
  padding: 110px 0;
  background:
    radial-gradient(circle at 74% 52%, rgba(237,28,36,.22), transparent 30%),
    radial-gradient(circle at 16% 74%, rgba(255,159,28,.07), transparent 26%),
    #080808;
}

/* Pillars — horizontal list */
.truck-pillars {
  display: grid;
  gap: 10px;
}

.truck-pillar {
  display: grid;
  grid-template-columns: 52px 1fr;
  column-gap: 22px;
  align-items: start;
  padding: 26px 28px;
  border-radius: 26px;
  background: linear-gradient(135deg, rgba(255,255,255,.072), rgba(255,255,255,.030));
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 14px 44px rgba(0,0,0,.16);
  transition: transform .26s ease, border-color .26s ease, background .26s ease, box-shadow .26s ease;
  position: relative;
  overflow: hidden;
}

.truck-pillar::before {
  content: "";
  position: absolute;
  left: 0; top: 14px; bottom: 14px;
  width: 2px;
  border-radius: 999px;
  background: linear-gradient(180deg, transparent, var(--red-2) 40%, var(--red-2) 60%, transparent);
  transform: scaleY(0);
  transition: transform .26s cubic-bezier(.4,0,.2,1);
}

.truck-pillar:hover {
  transform: translateX(8px);
  border-color: rgba(237,28,36,.32);
  background: linear-gradient(135deg, rgba(237,28,36,.10), rgba(255,255,255,.04));
  box-shadow: 0 22px 64px rgba(0,0,0,.26), 0 0 26px rgba(237,28,36,.08);
}

.truck-pillar:hover::before {
  transform: scaleY(1);
}

.truck-pillar-num {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: rgba(237,28,36,.12);
  border: 1px solid rgba(237,28,36,.36);
  color: var(--red-2);
  font-weight: 950;
  font-size: 13px;
  flex-shrink: 0;
  transition: background .26s ease, box-shadow .26s ease;
}

.truck-pillar:hover .truck-pillar-num {
  background: rgba(237,28,36,.22);
  box-shadow: 0 0 22px rgba(237,28,36,.24);
}

.truck-pillar-content h3 {
  font-size: clamp(17px, 1.5vw, 23px);
  margin-bottom: 9px;
  line-height: 1.1;
}

.truck-pillar-content p {
  font-size: 15px;
  color: rgba(247,242,233,.60);
  margin: 0;
  line-height: 1.6;
}

/* Fuel comparison meters */
.truck-fuel-block {
  padding: 30px;
  border-radius: 34px;
  background:
    radial-gradient(circle at 90% 8%, rgba(255,159,28,.09), transparent 32%),
    linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.034));
  border: 1px solid rgba(255,255,255,.11);
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
}

.truck-fuel-header {
  margin-bottom: 26px;
}

.truck-fuel-header .overline {
  margin-bottom: 12px;
}

.truck-fuel-header h3 {
  margin: 0;
  font-size: clamp(18px, 1.7vw, 25px);
  max-width: 620px;
}

.truck-fuel-meters {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 20px;
}

.truck-fuel-meter {
  padding: 20px 22px;
  border-radius: 20px;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.08);
}

.truck-fuel-meter.is-winner {
  background: rgba(34,197,94,.09);
  border-color: rgba(34,197,94,.28);
}

.truck-fuel-meter-label {
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: rgba(255,255,255,.36);
  margin-bottom: 14px;
}

.truck-fuel-meter.is-winner .truck-fuel-meter-label {
  color: rgba(74,222,128,.75);
}

.truck-fuel-bar-wrap {
  height: 5px;
  background: rgba(255,255,255,.09);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 12px;
}

.truck-fuel-bar {
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(237,28,36,.7), rgba(255,159,28,.9));
  transition: width 1.4s cubic-bezier(.2,.78,.18,1);
}

.truck-fuel-bar.is-green {
  background: linear-gradient(90deg, #15803d, #22c55e);
}

.truck-fuel-block.is-visible .truck-fuel-bar {
  width: var(--pct);
}

.truck-fuel-val {
  font-size: 32px;
  font-weight: 950;
  color: white;
  letter-spacing: -.05em;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.truck-fuel-meter.is-winner .truck-fuel-val {
  color: #4ade80;
}

.truck-fuel-unit {
  font-size: 13px;
  font-weight: 760;
  color: rgba(255,255,255,.38);
  margin-top: 4px;
}

.truck-fuel-meter.is-winner .truck-fuel-unit {
  color: rgba(74,222,128,.60);
}

.truck-fuel-note {
  font-size: 14px;
  color: rgba(247,242,233,.44);
  font-style: italic;
  margin: 0;
  padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,.07);
  line-height: 1.6;
}

.truck-fuel-bar-100 { --pct: 100%; }
.truck-fuel-bar-79  { --pct: 79%; }

/* Cinematic quotes */
.truck-quotes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.truck-quote {
  padding: 32px;
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border: 1px solid rgba(255,255,255,.11);
  position: relative;
  overflow: hidden;
  transition: transform .28s ease, border-color .28s ease, box-shadow .28s ease;
}

.truck-quote::before {
  content: "\201C";
  position: absolute;
  top: -8px;
  right: 18px;
  font-size: 118px;
  line-height: 1;
  color: rgba(237,28,36,.12);
  font-weight: 950;
  pointer-events: none;
  letter-spacing: 0;
}

.truck-quote:hover {
  transform: translateY(-7px);
  border-color: rgba(237,28,36,.28);
  box-shadow: 0 28px 80px rgba(0,0,0,.32), 0 0 28px rgba(237,28,36,.08);
}

.truck-quote blockquote {
  margin: 0 0 20px;
  padding: 0;
  border: none;
  background: none;
  font-size: clamp(15px, 1.3vw, 19px);
  font-weight: 850;
  color: rgba(247,242,233,.88);
  line-height: 1.48;
  letter-spacing: -.015em;
}

.truck-quote cite {
  font-style: normal;
  font-size: 11px;
  font-weight: 950;
  letter-spacing: .09em;
  color: rgba(237,28,36,.75);
  text-transform: uppercase;
}

/* Animations */
@keyframes fleetDot {
  0%, 100% { opacity: 1; box-shadow: 0 0 9px var(--orange); }
  50%       { opacity: .22; box-shadow: 0 0 3px var(--orange); }
}

/* Responsive */
@media (max-width: 980px) {
  .fleet-card {
    display: none;
  }

  .truck-quotes {
    grid-template-columns: 1fr;
  }

  .truck-fuel-meters {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .truck-video-section {
    padding: 80px 0;
  }

  .truck-quotes {
    grid-template-columns: 1fr;
  }

  .truck-pillar {
    padding: 20px;
  }
}

/* ─── Scroll Sequence — Enhanced Cinematic ─────────────────── */

.scroll-sequence .scroll-sequence-canvas {
  filter: contrast(1.07) saturate(1.14) brightness(.95);
}

.scroll-sequence .scroll-sequence-shade {
  background:
    linear-gradient(90deg, rgba(0,0,0,.97) 0%, rgba(0,0,0,.84) 34%, rgba(0,0,0,.05) 62%, rgba(0,0,0,.52) 100%),
    linear-gradient(0deg, rgba(0,0,0,.58) 0%, transparent 22%, rgba(0,0,0,.50) 100%),
    radial-gradient(ellipse at 10% 52%, rgba(237,28,36,.30), transparent 38%),
    radial-gradient(ellipse at 88% 28%, rgba(0,0,0,.52), transparent 30%);
}

/* Cinematic bars */
.seq-bar {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 6;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 max(21px, calc((100vw - var(--container)) / 2));
  pointer-events: none;
  background: rgba(0,0,0,.76);
  backdrop-filter: blur(10px) saturate(1.3);
}

.seq-bar-t {
  top: 0;
  height: 50px;
  border-bottom: 1px solid rgba(255,255,255,.055);
}

.seq-bar-b {
  bottom: 0;
  height: 68px;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 9px;
  padding-top: 12px;
  padding-bottom: 12px;
  border-top: 1px solid rgba(255,255,255,.055);
}

/* REC indicator */
.seq-rec {
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--red-2);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .18em;
  flex-shrink: 0;
}

.seq-rec-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--red);
  box-shadow: 0 0 8px var(--red);
  animation: seqRec 1.4s ease-in-out infinite;
}

.seq-bar-title {
  flex: 1;
  font-size: 11px;
  font-weight: 760;
  color: rgba(255,255,255,.38);
  letter-spacing: .07em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.seq-frame-ct {
  font-size: 11px;
  font-weight: 950;
  color: rgba(255,255,255,.34);
  letter-spacing: .10em;
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}

/* Phase copy area */
.seq-copy-abs {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 82px max(21px, calc((100vw - var(--container)) / 2)) 108px;
  pointer-events: none;
}

.seq-phases {
  display: grid;
  max-width: 740px;
}

.seq-phase {
  grid-area: 1 / 1;
  opacity: 0;
  transform: translateY(30px);
  transition: opacity .68s ease, transform .68s cubic-bezier(.2,.78,.18,1);
  pointer-events: none;
}

.seq-phase.is-active {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

.seq-phase.seq-phase-out {
  opacity: 0;
  transform: translateY(-20px);
  transition: opacity .40s ease, transform .40s cubic-bezier(.4,0,1,1);
}

.seq-phase h2 {
  max-width: 840px;
  text-shadow: 0 18px 72px rgba(0,0,0,.88);
  margin-bottom: 20px;
}

.seq-phase p:not(.overline) {
  font-size: clamp(16px, 1.45vw, 21px);
  color: rgba(247,242,233,.70);
  text-shadow: 0 8px 32px rgba(0,0,0,.74);
  max-width: 580px;
  margin-bottom: 0;
}

.seq-phase .overline {
  width: fit-content;
  color: #ffd2d5;
}

.seq-phase .text-link {
  margin-top: 24px;
}

/* Chapter tabs */
.seq-chapters {
  display: flex;
  gap: 6px;
  pointer-events: none;
}

.seq-ch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px 4px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.32);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .06em;
  transition: background .40s ease, border-color .40s ease, color .40s ease, box-shadow .40s ease;
  white-space: nowrap;
}

.seq-ch.is-active {
  background: rgba(237,28,36,.16);
  border-color: rgba(237,28,36,.46);
  color: #ff6a71;
  box-shadow: 0 0 16px rgba(237,28,36,.14);
}

.seq-ch-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  opacity: .55;
  flex-shrink: 0;
  font-style: normal;
  transition: opacity .40s ease, box-shadow .40s ease;
}

.seq-ch.is-active .seq-ch-dot {
  opacity: 1;
  box-shadow: 0 0 6px currentColor;
}

/* Progress track */
.seq-prog-track {
  position: relative;
  height: 2px;
  border-radius: 999px;
  background: rgba(255,255,255,.11);
  overflow: visible;
}

.seq-prog-track > span {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--red), var(--orange));
  box-shadow: 0 0 14px rgba(237,28,36,.52);
}

.seq-pip {
  position: absolute;
  top: 50%;
  left: var(--p);
  transform: translate(-50%, -50%);
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  border: 1px solid rgba(255,255,255,.12);
  font-style: normal;
}

/* Animations */
@keyframes seqRec {
  0%, 100% { opacity: 1; box-shadow: 0 0 9px var(--red); }
  50%       { opacity: .22; box-shadow: 0 0 3px var(--red); }
}

/* Mobile overrides */
@media (max-width: 720px) {
  .seq-bar-t {
    height: 44px;
  }

  .seq-bar-b {
    height: 62px;
  }

  .seq-bar-title {
    display: none;
  }

  .seq-copy-abs {
    justify-content: flex-end;
    padding-top: 44px;
    padding-bottom: 94px;
  }

  .seq-phase h2 {
    max-width: 100%;
  }

  .seq-ch {
    font-size: 9px;
    padding: 4px 9px 4px 7px;
  }
}

/* ─── Plant Page — Premium Redesign ───────────────────────── */

/* --pct utility classes (used by auto-db-bar and truck-fuel-bar) */
.pct-74  { --pct: 74%; }
.pct-88  { --pct: 88%; }
.pct-90  { --pct: 90%; }
.pct-95  { --pct: 95%; }

/* Floating HUD widget in detail-hero */
.plant-hud-card {
  position: absolute;
  z-index: 4;
  right: max(21px, calc((100vw - var(--container)) / 2));
  bottom: 80px;
  width: 286px;
  border-radius: 26px;
  background: rgba(8,8,8,.72);
  border: 1px solid rgba(34,197,94,.22);
  backdrop-filter: blur(22px) saturate(1.5);
  box-shadow: 0 24px 80px rgba(0,0,0,.40), 0 0 0 1px rgba(34,197,94,.06);
  padding: 20px 22px;
  font-size: 13px;
}

.plant-hud-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-size: 10px;
  color: rgba(255,255,255,.50);
}

.plant-hud-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 10px #22c55e;
  animation: autoLive 2s ease-in-out infinite;
  flex-shrink: 0;
}

.plant-hud-status {
  margin-left: auto;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(34,197,94,.18);
  border: 1px solid rgba(34,197,94,.32);
  color: #4ade80;
  font-size: 9px;
  letter-spacing: .1em;
}

.plant-hud-rows {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-bottom: 14px;
}

.plant-hud-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.plant-hud-row:last-child {
  border-bottom: none;
}

.plant-hud-label {
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .07em;
  color: rgba(255,255,255,.36);
  text-transform: uppercase;
  flex-shrink: 0;
}

.plant-hud-val {
  font-size: 15px;
  font-weight: 950;
  color: white;
  letter-spacing: -.03em;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.plant-hud-pipeline {
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .06em;
  color: rgba(74,222,128,.55);
  text-transform: uppercase;
  padding-top: 13px;
  border-top: 1px solid rgba(255,255,255,.07);
  line-height: 1.8;
}

.plant-hud-pipeline span {
  color: rgba(255,255,255,.22);
  margin: 0 2px;
}

/* Capacity & efficiency section wrapper */
.plant-cap-section {
  padding: 100px 0;
}

/* Override auto-db-header for stacked layout (overline + h3 stacked) */
.plant-cap-section .auto-db-header {
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

@media (max-width: 860px) {
  .plant-hud-card {
    display: none;
  }
}

/* Plant cinematic quote strip */
.plant-quote-strip {
  padding: 90px 0;
  border-top: 1px solid rgba(255,255,255,.06);
  border-bottom: 1px solid rgba(255,255,255,.06);
  background:
    radial-gradient(circle at 12% 50%, rgba(237,28,36,.10), transparent 32%),
    #050505;
}

.plant-quote {
  font-size: clamp(22px, 2.6vw, 38px);
  font-weight: 850;
  line-height: 1.38;
  letter-spacing: -.03em;
  color: rgba(247,242,233,.88);
  max-width: 960px;
  margin: 0 0 22px;
  font-style: italic;
}

.plant-quote::before {
  content: "\201C";
  color: var(--red-2);
  font-size: 1.4em;
  line-height: 0;
  vertical-align: -.18em;
  margin-right: .12em;
}

.plant-quote-cite {
  display: block;
  font-size: 13px;
  font-weight: 950;
  color: rgba(237,28,36,.72);
  letter-spacing: .12em;
  text-transform: uppercase;
}

/* Logistics card descriptions */
.plant-logistics-list div p {
  font-size: 14px;
  color: rgba(255,255,255,.44);
  margin: 4px 0 0;
  line-height: 1.55;
  font-weight: 520;
}

@media (max-width: 720px) {
  .plant-quote-strip {
    padding: 60px 0;
  }
}

/* ─── Quarry Page — Premium Enhancements ───────────────────── */

/* Floating HUD widget in quarry hero */
.quarry-hud-card {
  position: absolute;
  z-index: 4;
  right: max(21px, calc((100vw - var(--container)) / 2));
  bottom: 80px;
  width: 286px;
  border-radius: 26px;
  background: rgba(8,8,8,.72);
  border: 1px solid rgba(255,159,28,.22);
  backdrop-filter: blur(22px) saturate(1.5);
  box-shadow: 0 24px 80px rgba(0,0,0,.40), 0 0 0 1px rgba(255,159,28,.06);
  padding: 20px 22px;
  font-size: 13px;
}

.quarry-hud-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-size: 10px;
  color: rgba(255,255,255,.50);
}

.quarry-hud-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 10px var(--orange);
  animation: fleetDot 2s ease-in-out infinite;
  flex-shrink: 0;
}

.quarry-hud-status {
  margin-left: auto;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(255,159,28,.18);
  border: 1px solid rgba(255,159,28,.32);
  color: var(--orange);
  font-size: 9px;
  letter-spacing: .1em;
}

.quarry-hud-rows {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-bottom: 14px;
}

.quarry-hud-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 9px 0;
  border-bottom: 1px solid rgba(255,255,255,.07);
}

.quarry-hud-row:last-child {
  border-bottom: none;
}

.quarry-hud-label {
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .07em;
  color: rgba(255,255,255,.36);
  text-transform: uppercase;
  flex-shrink: 0;
}

.quarry-hud-val {
  font-size: 15px;
  font-weight: 950;
  color: white;
  letter-spacing: -.03em;
  text-align: right;
}

.quarry-hud-pipeline {
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .06em;
  color: rgba(255,159,28,.55);
  text-transform: uppercase;
  padding-top: 13px;
  border-top: 1px solid rgba(255,255,255,.07);
  line-height: 1.8;
}

.quarry-hud-pipeline span {
  color: rgba(255,255,255,.22);
  margin: 0 2px;
}

/* Quarry CTA — photo backdrop */
.quarry-cta {
  position: relative;
  overflow: hidden;
  padding: 140px 0;
  text-align: center;
  background: #050505;
}

.quarry-cta > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
}

.quarry-cta::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at 50% 20%, rgba(237,28,36,.32), transparent 40%),
    radial-gradient(circle at 80% 80%, rgba(255,159,28,.12), transparent 35%),
    linear-gradient(to bottom, rgba(5,5,5,.72) 0%, rgba(5,5,5,.58) 50%, rgba(5,5,5,.80) 100%);
}

.quarry-cta-inner {
  position: relative;
  z-index: 2;
  max-width: 860px;
  margin-inline: auto;
}

.quarry-cta-inner p {
  max-width: 680px;
  margin-inline: auto;
  font-size: 20px;
}

.quarry-cta-inner .hero-actions {
  justify-content: center;
  margin-top: 36px;
}

@media (max-width: 860px) {
  .quarry-hud-card {
    display: none;
  }
}