:root {
  --ink: #071018;
  --ink-soft: #12212c;
  --blue: #0b5cff;
  --electric: #5a8cff;
  --ice: #dfe8ee;
  --paper: #f4f7f8;
  --white: #ffffff;
  --line: rgba(7,16,24,.14);
  --muted: #61707b;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "DM Sans", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
.shell { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.page-grid {
  position: fixed; inset: 0; pointer-events: none; z-index: -1; opacity: .32;
  background-image: linear-gradient(rgba(7,16,24,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(7,16,24,.035) 1px, transparent 1px);
  background-size: 56px 56px;
}

.site-header {
  width: min(1320px, calc(100% - 48px)); height: 88px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
  border-bottom: 1px solid var(--line);
}
.site-header-overlay { position:absolute; z-index:10; left:50%; transform:translateX(-50%); color:white; border-color:rgba(255,255,255,.25); }
.site-header-overlay nav { color:rgba(255,255,255,.76); }
.site-header-overlay nav a:hover { color:white; }
.site-header-overlay .header-cta span { color:#8eb1ff; }
.brand { display: inline-flex; align-items: center; gap: 12px; font-family: Manrope, sans-serif; font-weight: 800; letter-spacing: .13em; }
.brand-mark { width: 29px; height: 23px; display: flex; align-items: flex-end; gap: 3px; transform: skewX(-19deg); }
.brand-mark i { display: block; width: 7px; background: var(--blue); }
.brand-mark i:nth-child(1) { height: 13px; }
.brand-mark i:nth-child(2) { height: 21px; }
.brand-mark i:nth-child(3) { height: 16px; }
nav { display: flex; gap: 34px; font-size: .91rem; font-weight: 500; color: #42515c; }
nav a, .header-cta { transition: color .2s ease; }
nav a:hover { color: var(--blue); }
.header-cta { font-weight: 600; font-size: .91rem; }
.header-cta span { color: var(--blue); margin-left: 6px; }

.hero { min-height: 670px; display: grid; grid-template-columns: 1.2fr .8fr; gap: 80px; align-items: center; padding-block: 92px 88px; }
.hero-cinematic { position:relative; min-height:100svh; display:block; padding:0; overflow:hidden; background:var(--ink); color:white; }
.moving-image { position:absolute; inset:0; overflow:hidden; }
.moving-image img { width:100%; height:100%; object-fit:cover; display:block; will-change:transform; }
.hero-bg img { animation:cinematic-pan 20s ease-in-out infinite alternate; }
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,10,15,.9) 0%,rgba(3,10,15,.72) 43%,rgba(3,10,15,.16) 82%),linear-gradient(0deg,rgba(3,10,15,.58),transparent 55%); }
.hero-inner { position:relative; z-index:2; min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end; padding-block:180px 52px; }
.hero-cinematic .hero-copy { max-width:840px; margin-bottom:auto; padding-top:clamp(75px,12vh,145px); }
.hero-cinematic h1 { font-size:clamp(2.65rem,4.15vw,4.45rem); max-width:780px; line-height:1.04; text-wrap:balance; text-shadow:0 4px 26px rgba(0,0,0,.28); }
.hero-cinematic h1 em { color:#82a8ff; }
.hero-cinematic .hero-lead { color:rgba(255,255,255,.8); max-width:710px; }
.button-ghost { color:white; border-color:rgba(255,255,255,.4); background:rgba(5,14,21,.22); backdrop-filter:blur(7px); }
.button-ghost:hover { background:rgba(255,255,255,.08); }
.hero-facts { display:grid; grid-template-columns:repeat(3,1fr); max-width:720px; border-top:1px solid rgba(255,255,255,.3); padding-top:20px; }
.hero-facts div { display:grid; gap:4px; padding-right:28px; }
.hero-facts small { color:rgba(255,255,255,.48); font-size:.61rem; letter-spacing:.16em; }
.hero-facts strong { font:600 .9rem Manrope,sans-serif; }
.about-manufacturing { position:relative; isolation:isolate; min-height:76svh; overflow:hidden; background:var(--ink); color:white; }
.about-bg { z-index:-2; }
.about-bg img { animation:cinematic-pan-reverse 25s ease-in-out infinite alternate; }
.about-shade { position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,rgba(3,10,15,.92) 0%,rgba(3,10,15,.72) 46%,rgba(3,10,15,.16) 82%),linear-gradient(0deg,rgba(3,10,15,.7),transparent 62%); }
.about-inner { min-height:76svh; display:flex; flex-direction:column; justify-content:flex-end; padding-block:clamp(96px,11vw,138px) 48px; }
.about-copy { max-width:900px; }
.about-copy h2 { margin:0 0 24px; max-width:760px; font-size:clamp(2.2rem,3.45vw,3.55rem); line-height:1.07; letter-spacing:-.05em; text-wrap:balance; text-shadow:0 4px 28px rgba(0,0,0,.34); }
.about-copy > p:not(.eyebrow):not(.experience-line) { max-width:700px; margin:0; color:rgba(255,255,255,.82); font-size:clamp(1rem,1.35vw,1.2rem); line-height:1.7; }
.about-copy .experience-line { display:grid; grid-template-columns:auto 1fr; gap:18px; align-items:start; max-width:760px; margin:28px 0 0; padding:20px 0 0; border-top:1px solid rgba(255,255,255,.28); color:rgba(255,255,255,.82); }
.experience-line small { padding-top:3px; color:#9bb7ff; font-size:.61rem; font-weight:700; letter-spacing:.16em; white-space:nowrap; }
.experience-line span { font-size:.93rem; line-height:1.65; }
.about-facts { display:grid; grid-template-columns:repeat(3,1fr); max-width:850px; margin-top:52px; padding-top:22px; border-top:1px solid rgba(255,255,255,.3); }
.about-facts div { display:grid; gap:5px; padding-right:30px; }
.about-facts small { color:rgba(255,255,255,.5); font-size:.61rem; letter-spacing:.16em; }
.about-facts strong { font:600 .9rem Manrope,sans-serif; }
.eyebrow { margin: 0 0 28px; color: #52616c; font-size: .75rem; letter-spacing: .18em; font-weight: 700; text-transform: uppercase; display: flex; align-items: center; gap: 10px; }
.eyebrow span { width: 28px; height: 2px; background: var(--blue); }
h1, h2, h3 { font-family: Manrope, sans-serif; margin-top: 0; }
h1 { font-size: clamp(3.4rem, 6vw, 6.2rem); line-height: .96; letter-spacing: -.065em; margin-bottom: 32px; max-width: 800px; }
h1 em { color: var(--blue); font-style: normal; }
.hero-lead { max-width: 650px; font-size: 1.2rem; line-height: 1.65; color: #4a5964; margin: 0 0 38px; }
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 28px; padding: 0 22px; font-weight: 600; font-size: .92rem; border: 1px solid var(--line); transition: transform .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--blue); border-color: var(--blue); color: white; }
.button-primary:hover { background: #004fe7; }
.button-secondary { background: rgba(255,255,255,.6); }

.hero-media { position: relative; align-self: stretch; min-height: 520px; margin: 0; overflow: hidden; background: var(--ink); box-shadow: 0 30px 60px rgba(7,16,24,.18); }
.hero-media::after { content:""; position:absolute; inset:0; background: linear-gradient(180deg, transparent 45%, rgba(7,16,24,.92)); }
.hero-media img { width:100%; height:100%; object-fit:cover; display:block; }
.hero-media figcaption { position:absolute; z-index:1; left:25px; right:25px; bottom:22px; display:grid; grid-template-columns:auto 1fr; column-gap:14px; color:white; }
.hero-media figcaption span { grid-row:span 2; align-self:center; padding:10px 12px; border:1px solid rgba(255,255,255,.45); font:700 .76rem Manrope,sans-serif; letter-spacing:.12em; }
.hero-media figcaption strong { font:700 1rem Manrope,sans-serif; }
.hero-media figcaption small { color:#aebbc4; font-size:.72rem; }
.trade-panel { align-self: stretch; min-height: 490px; background: var(--ink); color: white; padding: 24px; display: flex; flex-direction: column; box-shadow: 0 30px 60px rgba(7,16,24,.18); }
.panel-topline { display: flex; justify-content: space-between; align-items: center; font-size: .68rem; letter-spacing: .17em; color: #8797a2; border-bottom: 1px solid rgba(255,255,255,.12); padding-bottom: 18px; }
.live { display: flex; align-items: center; gap: 7px; color: #b9c9d3; }
.live i { width: 6px; height: 6px; background: #58e59a; border-radius: 50%; box-shadow: 0 0 10px #58e59a; }
.route-map { position: relative; flex: 1; min-height: 310px; overflow: hidden; background: radial-gradient(circle at 50% 50%, rgba(11,92,255,.16), transparent 52%); }
.orbit { position: absolute; border: 1px solid rgba(126,161,255,.28); border-radius: 50%; left: 50%; top: 50%; transform: translate(-50%,-50%) rotate(-18deg); }
.orbit-one { width: 320px; height: 170px; }
.orbit-two { width: 210px; height: 300px; transform: translate(-50%,-50%) rotate(52deg); }
.route { position: absolute; height: 1px; background: linear-gradient(90deg, transparent, var(--electric), transparent); transform-origin: left; }
.route-a { width: 290px; left: 12%; top: 35%; transform: rotate(21deg); }
.route-b { width: 240px; left: 26%; top: 68%; transform: rotate(-26deg); }
.node { position: absolute; width: 9px; height: 9px; background: white; border: 3px solid var(--blue); border-radius: 50%; box-shadow: 0 0 0 7px rgba(11,92,255,.16); }
.n1 { left: 16%; top: 33%; }.n2 { right: 16%; top: 58%; }.n3 { left: 31%; bottom: 18%; }.n4 { right: 29%; top: 22%; }
.map-label { position: absolute; font-size: .58rem; letter-spacing: .16em; color: #77909f; }
.ml1 { left: 6%; top: 21%; }.ml2 { right: 10%; top: 70%; }.ml3 { right: 18%; top: 15%; }
.route-data { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; border-top: 1px solid rgba(255,255,255,.12); padding-top: 18px; }
.route-data small { display: block; font-size: .55rem; letter-spacing: .14em; color: #71838f; margin-bottom: 5px; }
.route-data strong { font-size: .72rem; font-weight: 500; color: #dce6ec; }

.statement { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding-block: 62px; }
.statement p { margin: 0; max-width: 980px; font-family: Manrope, sans-serif; font-size: clamp(1.45rem, 2.6vw, 2.35rem); line-height: 1.4; letter-spacing: -.03em; }

.materials { padding-block: 120px; }
.section-heading { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr); align-items:end; gap:clamp(34px,6vw,82px); margin-bottom:42px; }
.section-heading .eyebrow { margin: 0 0 10px; }
.section-heading h2 { margin:0; font-size:clamp(2.15rem,3.2vw,3.3rem); line-height:1.08; letter-spacing:-.05em; max-width:760px; text-wrap:balance; }
.materials-heading h2 { max-width:760px; white-space:normal; }
.materials-heading,
.catalog-heading { padding-bottom:30px; border-bottom:1px solid rgba(255,255,255,.22); }
.material-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.material-card { min-height: 360px; position: relative; isolation:isolate; overflow:hidden; padding: 36px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.36); transition: background .25s ease, transform .25s ease; }
.material-card:hover { background: white; transform: translateY(-3px); }
.material-card.featured { background: var(--blue); color: white; }
.card-number { position: absolute; right: 28px; top: 24px; color: #81909a; font-size: .72rem; letter-spacing: .12em; }
.featured .card-number { color: rgba(255,255,255,.58); }
.material-card h3 { font-size: 1.65rem; margin: 27px 0 14px; letter-spacing: -.035em; }
.material-card p { max-width: 430px; color: #586772; margin: 0; }
.featured p { color: rgba(255,255,255,.78); }
.card-tag { position: absolute; left: 36px; bottom: 30px; font-size: .62rem; letter-spacing: .15em; font-weight: 700; color: #7b8a94; }
.featured .card-tag { color: rgba(255,255,255,.68); }
.material-photo-card { min-height:520px; color:white; }
.material-photo-card .material-photo { position:absolute; z-index:-2; inset:0; width:100%; height:100%; object-fit:cover; animation:cinematic-pan 22s ease-in-out infinite alternate; }
.material-photo-card:nth-child(2) .material-photo { animation-name:cinematic-pan-reverse; }
.material-photo-shade { position:absolute; z-index:-1; inset:0; background:linear-gradient(180deg,rgba(4,12,18,.12),rgba(4,12,18,.92) 82%); }
.material-photo-card:hover { color:white; background:transparent; }
.material-photo-card .card-number, .material-photo-card .card-tag { color:rgba(255,255,255,.7); }
.material-photo-card p { color:rgba(255,255,255,.78); }
.material-icon { width: 52px; height: 52px; position: relative; margin-top: 8px; }
.material-icon::before, .material-icon::after { content:""; position:absolute; border: 1px solid currentColor; }
.alloy::before { inset: 5px 14px 5px 5px; transform: skewY(-22deg); }.alloy::after { inset: 15px 4px 15px 15px; transform: skewY(18deg); }
.carbide::before { width: 30px; height: 30px; left: 6px; top: 12px; transform: rotate(18deg); }.carbide::after { width: 20px; height: 20px; right: 4px; top: 4px; transform: rotate(48deg); }
.chemical::before { width: 32px; height: 42px; left: 10px; top: 4px; border-radius: 50% 50% 42% 42%; }.chemical::after { width: 20px; height: 1px; left: 16px; top: 30px; border-width: 1px 0 0; }
.scrap::before { width: 40px; height: 16px; left: 3px; top: 7px; transform: rotate(35deg); }.scrap::after { width: 38px; height: 16px; left: 10px; top: 27px; transform: rotate(-22deg); }

.carbide-focus { position:relative; isolation:isolate; overflow:hidden; background:var(--ink-soft); color:white; padding-block:clamp(94px,9vw,118px); }
.carbide-bg { z-index:-2; }
.carbide-bg img { animation:cinematic-pan-reverse 24s ease-in-out infinite alternate; }
.carbide-shade { position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,rgba(7,16,24,.96) 0%,rgba(7,16,24,.86) 55%,rgba(7,16,24,.63)); }
.carbide-inner { display: grid; grid-template-columns: .84fr 1.16fr; gap: 100px; align-items: start; }
.carbide-intro, .carbide-data { padding:34px; background:rgba(7,16,24,.58); border:1px solid rgba(255,255,255,.15); backdrop-filter:blur(12px); }
.carbide-intro .eyebrow { color: #94a6b2; }
.carbide-intro h2 { max-width:520px; font-size:clamp(2.05rem,3vw,3.15rem); line-height:1.08; letter-spacing:-.05em; margin-bottom:24px; text-wrap:balance; }
.carbide-intro > p:not(.eyebrow) { color: #a7b5be; font-size: 1.08rem; max-width: 520px; margin: 0 0 34px; }
.button-outline { color: white; border-color: rgba(255,255,255,.34); }
.button-outline:hover { background: rgba(255,255,255,.07); }
.carbide-data { border-top: 1px solid rgba(255,255,255,.18); }
.yield-highlight { display:grid; grid-template-columns:auto 1fr; column-gap:24px; row-gap:4px; align-items:end; padding:4px 0 26px; border-bottom:1px solid rgba(255,255,255,.18); }
.yield-highlight small { grid-column:1; color:#8ea9bb; font-size:.62rem; letter-spacing:.16em; font-weight:700; }
.yield-highlight strong { grid-column:1; color:white; }
.yield-value { display:flex; align-items:baseline; gap:.08em; white-space:nowrap; font-family:Manrope,sans-serif; line-height:.98; letter-spacing:0; }
.yield-value span { font-size:clamp(2.15rem,3.6vw,3.6rem); font-weight:600; }
.yield-value b { font-size:clamp(2.7rem,4.5vw,4.7rem); font-weight:800; letter-spacing:-.045em; }
.yield-value em { margin-left:.1em; font-size:clamp(1.65rem,2.75vw,2.8rem); font-weight:700; font-style:normal; letter-spacing:-.035em; }
.yield-highlight > span { grid-column:2; grid-row:1 / span 2; align-self:end; max-width:290px; padding-bottom:5px; color:#93a7b3; font-size:.82rem; line-height:1.55; }
.data-block { padding: 26px 0 30px; border-bottom: 1px solid rgba(255,255,255,.18); }
.data-block small, .data-grid small { display: block; color: #708796; font-size: .61rem; letter-spacing: .16em; font-weight: 700; margin-bottom: 14px; }
.size-chips { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.size-chips span { display:flex; align-items:center; justify-content:center; min-height:44px; border:1px solid rgba(255,255,255,.24); background:rgba(255,255,255,.045); padding:8px 10px; color:#eef3f6; font:600 .78rem Manrope,sans-serif; }
.size-line { margin:0; color:#eef3f6; font:600 clamp(.88rem,1.25vw,1.08rem)/1.8 Manrope,sans-serif; letter-spacing:.015em; }
.data-grid { display: grid; grid-template-columns: 1fr 1fr; }
.data-grid > div { min-height: 180px; padding: 27px 28px 24px 0; border-bottom: 1px solid rgba(255,255,255,.18); }
.data-grid > div:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.18); }
.data-grid > div:nth-child(even) { padding-left: 28px; }
.data-grid strong { display: block; font: 700 1.12rem Manrope, sans-serif; margin-bottom: 9px; }
.data-grid p { margin: 0; color: #8fa1ac; font-size: .88rem; }
.spec-note { color: #6f8491; font-size: .73rem; margin: 22px 0 0; }

.carbide-grades { position:relative; isolation:isolate; overflow:hidden; padding-block:clamp(94px,9vw,118px); background:#071018; color:white; }
.carbide-grades::before { content:""; position:absolute; z-index:-2; inset:-5%; background:url("assets/carbide-production.jpg") center/cover; opacity:.32; animation:section-pan 27s ease-in-out infinite alternate-reverse; }
.carbide-grades::after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,rgba(4,11,17,.96),rgba(4,11,17,.84) 58%,rgba(4,11,17,.68)); }
.grades-heading { padding-bottom:30px; border-bottom:1px solid rgba(255,255,255,.22); }
.grades-heading h2 { max-width:760px; }
.grades-heading > p { max-width:440px; margin:0; color:rgba(255,255,255,.74); font-size:1rem; line-height:1.7; }
.carbide-grades .eyebrow { color:rgba(255,255,255,.68); }
.grades-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:14px; }
.grade-card { position:relative; grid-column:span 3; min-width:0; min-height:340px; margin:0; overflow:hidden; background:#dfe6ea; border:1px solid rgba(255,255,255,.2); }
.grade-card:nth-child(n+5) { grid-column:span 4; }
.grade-card img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .55s ease; }
.grade-card:nth-child(-n+2) img { object-position:left center; }
.grade-card:hover img { transform:scale(1.035); }
.grade-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 46%,rgba(4,11,17,.87) 100%); pointer-events:none; }
.grade-card figcaption { position:absolute; z-index:1; left:0; right:0; bottom:0; display:flex; align-items:end; justify-content:space-between; gap:18px; padding:24px; color:white; }
.grade-card figcaption small { max-width:130px; color:#b7c8ff; font-size:.58rem; font-weight:700; letter-spacing:.15em; line-height:1.4; }
.grade-card figcaption strong { flex:none; font:700 clamp(1.25rem,2vw,1.75rem) Manrope,sans-serif; letter-spacing:-.035em; }
.grades-note { margin:18px 0 0; color:rgba(255,255,255,.56); font-size:.75rem; }

.packing { padding-block:120px; }
.packing-heading {
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);
  gap:clamp(34px,6vw,86px);
  align-items:end;
  padding:0 0 34px;
  margin-bottom:30px;
  border-bottom:1px solid rgba(255,255,255,.28);
}
.packing-heading h2 { max-width:760px; text-wrap:balance; }
.packing-heading > p {
  max-width:460px;
  margin:0;
  padding-left:clamp(22px,3vw,38px);
  border-left:1px solid rgba(255,255,255,.25);
  color:rgba(255,255,255,.84);
  font-size:1rem;
  line-height:1.75;
}
.packing-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(300px,1fr)); gap:1px; min-height:640px; background:rgba(255,255,255,.25); border:1px solid rgba(255,255,255,.25); }
.packing-card { position:relative; isolation:isolate; min-width:0; min-height:300px; margin:0; overflow:hidden; background:var(--ink); grid-column:span 3; }
.packing-card.packing-large { grid-column:span 6; grid-row:span 2; }
.packing-photo { position:absolute; z-index:-2; inset:0; overflow:hidden; background:#1a2730; }
.packing-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(3,10,15,.04) 22%,rgba(3,10,15,.9) 100%); }
.packing-lock-card .packing-photo::after { background:linear-gradient(180deg,rgba(3,10,15,.88) 0%,rgba(3,10,15,.38) 35%,rgba(3,10,15,.03) 70%,rgba(3,10,15,.5) 100%); }
.packing-photo img { width:100%; height:100%; object-fit:cover; display:block; animation:packing-drift 16s ease-in-out infinite alternate; }
.packing-card:nth-child(even) .packing-photo img { animation-direction:alternate-reverse; }
.packing-card:hover .packing-photo img { animation-play-state:paused; }
.packing-card figcaption { position:absolute; z-index:1; left:0; right:0; bottom:0; min-height:0; padding:clamp(22px,2.6vw,36px); display:grid; align-content:end; gap:5px; color:white; }
.packing-lock-card figcaption { top:0; bottom:auto; align-content:start; }
.packing-card figcaption small { color:#a9c0ff; font-size:.6rem; letter-spacing:.16em; font-weight:700; }
.packing-card figcaption strong { font:700 clamp(1.05rem,1.5vw,1.38rem) Manrope,sans-serif; letter-spacing:-.025em; }
.packing-card figcaption span { max-width:390px; color:rgba(255,255,255,.72); font-size:.82rem; line-height:1.5; }
.packing-large figcaption strong { font-size:clamp(1.55rem,2.5vw,2.3rem); }
.packing-large figcaption span { font-size:.92rem; }
.packing-note { margin:16px 0 0; padding-top:16px; border-top:1px solid rgba(255,255,255,.2); color:rgba(255,255,255,.62); font-size:.75rem; }
.section-feature { position:relative; min-height:540px; margin:0 0 38px; overflow:hidden; background:var(--ink); color:white; }
.section-feature::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(7,16,24,.02) 30%,rgba(7,16,24,.9)); }
.section-feature img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; animation:cinematic-pan-reverse 24s ease-in-out infinite alternate; }
.section-feature figcaption { position:absolute; z-index:1; left:clamp(24px,5vw,58px); right:clamp(24px,5vw,58px); bottom:38px; display:grid; gap:6px; }
.section-feature small { color:#a9bbca; font-size:.62rem; letter-spacing:.17em; font-weight:700; }
.section-feature strong { font:700 clamp(1.45rem,3vw,2.6rem) Manrope,sans-serif; letter-spacing:-.04em; }
.section-feature span { color:#c2ccd2; max-width:660px; }

.catalog { padding-block: 120px; }
.catalog-heading { align-items: end; }
.catalog-heading > p { max-width: 390px; color: var(--muted); margin: 0 0 6px; }
.catalog-feature { min-height:610px; }
.catalog-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.catalog-group { position: relative; min-height: 340px; background: rgba(255,255,255,.35); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 34px; }
.catalog-group.catalog-primary { grid-row: span 2; background: #e9efff; }
.catalog-code { position: absolute; right: 26px; top: 25px; color: var(--blue); font: 700 .65rem Manrope, sans-serif; letter-spacing: .16em; }
.catalog-group h3 { font-size: 1.45rem; letter-spacing: -.035em; margin: 8px 0 26px; }
.catalog-group ul { margin: 0; padding: 0; list-style: none; }
.catalog-group li { color: #52616c; padding: 10px 0; border-top: 1px solid var(--line); font-size: .88rem; }

.industry-visuals { display:block; background:var(--ink); }
.visual-card { position:relative; min-height:620px; margin:0; overflow:hidden; }
.visual-card + .visual-card { border-left:1px solid rgba(255,255,255,.25); }
.visual-card::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(7,16,24,.02) 35%, rgba(7,16,24,.9)); }
.visual-card img { width:100%; height:100%; object-fit:cover; display:block; animation:cinematic-pan 25s ease-in-out infinite alternate; }
.visual-card:hover img { animation-play-state:paused; }
.visual-card figcaption { position:absolute; z-index:1; left:clamp(28px,5vw,72px); right:clamp(28px,5vw,72px); bottom:42px; color:white; display:grid; gap:6px; }
.visual-card figcaption small { color:#9fb3c1; font-size:.64rem; font-weight:700; letter-spacing:.17em; }
.visual-card figcaption strong { font:700 clamp(1.4rem,2.5vw,2.25rem) Manrope,sans-serif; letter-spacing:-.035em; }
.visual-card figcaption span { color:#b9c5cc; max-width:520px; }

.execution { background: var(--ink); color: white; padding-block: 112px; }
.execution .eyebrow { color: #8a9aa5; }
.execution-inner { display: grid; grid-template-columns: .82fr 1.18fr; gap: 90px; align-items: start; }
.execution-inner .section-heading { display: block; position: sticky; top: 40px; }
.execution-inner h2 { font-size:clamp(2.15rem,3.2vw,3.3rem); }
.execution-list { border-top: 1px solid rgba(255,255,255,.18); }
.execution-item { display: grid; grid-template-columns: 42px 1fr 1.15fr; gap: 22px; align-items: start; padding: 32px 0; border-bottom: 1px solid rgba(255,255,255,.18); }
.execution-item > span { color: #6280a2; font-size: .7rem; letter-spacing: .12em; padding-top: 6px; }
.execution-item h3 { font-size: 1.12rem; margin: 0; }
.execution-item p { color: #94a5b0; margin: 0; }

.markets { padding-block: 120px; display: grid; grid-template-columns: 1fr 1fr; gap: 110px; }
.markets-copy h2 { max-width:580px; font-size:clamp(2.15rem,3.2vw,3.3rem); line-height:1.08; letter-spacing:-.05em; }
.markets-copy > p:last-child { color: var(--muted); font-size: 1.08rem; max-width: 520px; }
.market-columns { align-self: end; display: grid; grid-template-columns: 1fr 1fr; gap: 42px; }
.market-columns small { display: block; font-size: .63rem; font-weight: 700; letter-spacing: .16em; color: var(--blue); border-bottom: 1px solid var(--line); padding-bottom: 13px; }
.market-columns ul { list-style: none; padding: 0; margin: 15px 0 0; }
.market-columns li { padding: 10px 0; border-bottom: 1px solid var(--line); font-family: Manrope, sans-serif; font-weight: 600; }

.contact { background: var(--blue); color: white; padding: 75px; display: grid; grid-template-columns: 1.15fr .85fr; gap: 80px; align-items: end; margin-bottom: 58px; }
.contact .light { color: rgba(255,255,255,.7); }.contact .light span { background: white; }
.contact h2 { margin:0; max-width:650px; font-size:clamp(2.15rem,3.35vw,3.45rem); line-height:1.07; letter-spacing:-.05em; }
.contact-side p { color: rgba(255,255,255,.78); font-size: 1.06rem; margin: 0 0 34px; }
.contact-lines { border-top:1px solid rgba(255,255,255,.48); }
.contact-lines > * { position:relative; display:grid; gap:3px; padding:15px 34px 15px 0; border-bottom:1px solid rgba(255,255,255,.35); }
.contact-lines small { color:rgba(255,255,255,.62); font-size:.6rem; letter-spacing:.14em; font-weight:700; }
.contact-lines strong { font:600 1rem Manrope,sans-serif; }
.contact-lines a > span { position:absolute; right:0; top:24px; }

.site-footer { min-height: 170px; display: grid; grid-template-columns: 1fr 1.15fr 1fr auto; gap: 38px; align-items: center; border-top: 1px solid var(--line); color: #667580; font-size: .78rem; }
.site-footer .brand { color: var(--ink); font-size: .88rem; }
.site-footer strong { display:inline-block; margin-bottom:5px; color:var(--ink); font-size:.6rem; letter-spacing:.14em; }
.site-footer a:hover { color:var(--blue); }

/* Unified full-image rhythm across every main section */
.statement.shell,
.materials.shell,
.packing.shell,
.catalog.shell,
.markets.shell,
.contact.shell,
.execution {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  width:100%;
  max-width:none;
  min-height:74svh;
  margin:0;
  padding-block:clamp(94px,9vw,118px);
  padding-inline:max(24px,calc((100% - 1180px)/2));
  color:white;
  background:var(--ink);
}
.statement.shell::before,
.materials.shell::before,
.packing.shell::before,
.catalog.shell::before,
.markets.shell::before,
.contact.shell::before,
.execution::before {
  content:"";
  position:absolute;
  z-index:-2;
  inset:-5%;
  background-position:center;
  background-size:cover;
  animation:section-pan 26s ease-in-out infinite alternate;
  will-change:transform;
}
.statement.shell::after,
.materials.shell::after,
.packing.shell::after,
.catalog.shell::after,
.markets.shell::after,
.contact.shell::after,
.execution::after {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:linear-gradient(90deg,rgba(4,11,17,.94) 0%,rgba(4,11,17,.82) 52%,rgba(4,11,17,.48)),linear-gradient(0deg,rgba(4,11,17,.64),rgba(4,11,17,.06) 62%);
}
.statement.shell::before { background-image:url("assets/carbide-production.jpg"); }
.materials.shell::before { background-image:url("assets/calcium-carbide.jpg"); }
.packing.shell::before { background-image:url("assets/carbide-drum-packing.jpg"); }
.catalog.shell::before { background-image:url("assets/ferroalloy-factory-blue-hour.jpg"); }
.execution::before { background-image:url("assets/metallurgy.jpg"); }
.markets.shell::before { background-image:url("assets/container-ship.jpg"); }
.contact.shell::before { background-image:url("assets/carbide-drum-packing.jpg"); }
.materials.shell::before,
.catalog.shell::before,
.markets.shell::before { animation-direction:alternate-reverse; }
.statement.shell { display:flex; align-items:center; border:0; }
.statement.shell p { max-width:1000px; text-shadow:0 3px 20px rgba(0,0,0,.34); }
.materials.shell,
.packing.shell,
.catalog.shell { display:flex; flex-direction:column; justify-content:center; }
.materials .eyebrow,
.packing .eyebrow,
.catalog .eyebrow,
.markets .eyebrow { color:rgba(255,255,255,.7); }
.material-card:not(.material-photo-card),
.catalog-group { background:rgba(5,14,21,.72); border-color:rgba(255,255,255,.2); backdrop-filter:blur(12px); }
.material-card:not(.material-photo-card):hover { background:rgba(11,92,255,.78); color:white; }
.material-card:not(.material-photo-card) p,
.catalog-heading > p,
.packing-note,
.catalog-group li,
.markets-copy > p:last-child { color:rgba(255,255,255,.74); }
.material-card:not(.material-photo-card) .card-number,
.material-card:not(.material-photo-card) .card-tag { color:rgba(255,255,255,.58); }
.catalog-group.catalog-primary { background:rgba(11,92,255,.72); }
.catalog-group li,
.market-columns small,
.market-columns li { border-color:rgba(255,255,255,.2); }
.catalog-code,
.market-columns small { color:#9bb7ff; }
.packing-grid { border-color:rgba(255,255,255,.22); background:rgba(255,255,255,.22); }
.packing-card { background:var(--ink); color:white; }
.markets.shell { display:grid; align-items:center; }
.contact.shell { display:grid; margin-bottom:0; }
.site-footer { background:var(--paper); }

@keyframes section-pan {
  from { transform:scale(1.02) translate3d(-.8%,0,0); }
  to { transform:scale(1.1) translate3d(.8%,-.6%,0); }
}

@keyframes cinematic-pan {
  from { transform:scale(1.03) translate3d(-1.2%,0,0); }
  to { transform:scale(1.12) translate3d(1.2%,-1%,0); }
}
@keyframes cinematic-pan-reverse {
  from { transform:scale(1.12) translate3d(1.2%,-1%,0); }
  to { transform:scale(1.03) translate3d(-1.2%,0,0); }
}
@keyframes packing-drift {
  from { transform:scale(1.01) translate3d(-.6%,0,0); }
  to { transform:scale(1.08) translate3d(.6%,-.5%,0); }
}

@media (max-width: 900px) {
  .shell, .site-header { width: min(100% - 32px, 1180px); }
  nav { display: none; }
  .hero:not(.hero-cinematic) { grid-template-columns: 1fr; gap: 48px; padding-top: 70px; }
  .hero-cinematic { min-height:850px; }
  .hero-inner { min-height:850px; }
  .trade-panel, .hero-media { min-height: 430px; }
  .industry-visuals { display:block; }
  .visual-card + .visual-card { border-left:0; border-top:1px solid rgba(255,255,255,.25); }
  .execution-inner, .markets, .carbide-inner { grid-template-columns: 1fr; gap: 55px; }
  .material-grid { grid-template-columns:repeat(2,1fr); }
  .materials-heading { display:block; }
  .materials-heading h2 { margin-top:12px; white-space:normal; }
  .catalog-grid { grid-template-columns: 1fr 1fr; }
  .packing-grid { grid-template-columns:1fr 1fr; grid-template-rows:auto; min-height:0; }
  .grades-heading { grid-template-columns:1fr; }
  .grades-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .grade-card, .grade-card:nth-child(n+5) { grid-column:auto; min-height:330px; }
  .grade-card:last-child { grid-column:span 2; }
  .packing-card { grid-column:auto; min-height:340px; }
  .packing-card.packing-large { grid-column:span 2; grid-row:auto; min-height:520px; }
  .catalog-group.catalog-primary { grid-row: auto; }
  .execution-inner .section-heading { position: static; }
  .contact { width: calc(100% - 32px); padding: 48px 34px; grid-template-columns: 1fr; gap: 40px; }
}

@media (max-width: 620px) {
  .site-header { height: 72px; }
  .header-cta { font-size: 0; }.header-cta span { font-size: 1.2rem; }
  h1 { font-size: clamp(3rem, 14vw, 4.3rem); }
  .hero:not(.hero-cinematic) { padding-block: 58px 64px; }
  .hero-cinematic { min-height:760px; }
  .hero-inner { min-height:760px; padding-block:128px 34px; }
  .hero-cinematic .hero-copy { padding-top:20px; }
  .hero-cinematic h1 { font-size:clamp(2.45rem,10.5vw,3.15rem); }
  .hero-facts { grid-template-columns:1fr; gap:12px; }
  .hero-facts div { display:flex; justify-content:space-between; }
  .about-manufacturing, .about-inner { min-height:680px; }
  .about-inner { padding-block:108px 36px; }
  .about-facts { grid-template-columns:1fr; gap:12px; margin-top:38px; }
  .about-facts div { display:flex; justify-content:space-between; gap:18px; padding-right:0; }
  .about-copy .experience-line { grid-template-columns:1fr; gap:8px; }
  .hero-lead { font-size: 1.05rem; }
  .hero-actions { display: grid; }
  .button { justify-content: space-between; }
  .trade-panel, .hero-media { margin-inline: -16px; min-height: 410px; }
  .visual-card { min-height:520px; }
  .route-data { grid-template-columns: 1fr; gap: 12px; }
  .route-data div { display: flex; justify-content: space-between; }
  .route-data small { margin: 0; }
  .statement { padding-block: 44px; }
  .materials, .markets { padding-block: 86px; }
  .carbide-focus, .catalog { padding-block: 84px; }
  .packing { padding-block:84px; }
  .packing-grid { grid-template-columns:1fr; }
  .grades-grid { grid-template-columns:1fr; }
  .grade-card, .grade-card:nth-child(n+5), .grade-card:last-child { grid-column:auto; min-height:370px; }
  .grades-heading { gap:22px; }
  .packing-heading { grid-template-columns:1fr; gap:24px; padding:0 0 26px; }
  .packing-heading > p { max-width:none; padding:22px 0 0; border-left:0; border-top:1px solid rgba(255,255,255,.25); }
  .packing-card, .packing-card.packing-large { grid-column:auto; min-height:380px; }
  .packing-card figcaption { min-height:0; }
  .section-feature, .catalog-feature { min-height:420px; }
  .material-photo-card { min-height:440px; }
  .data-grid, .catalog-grid { grid-template-columns: 1fr; }
  .yield-highlight { grid-template-columns:1fr; }
  .yield-highlight > span { grid-column:1; grid-row:auto; max-width:none; padding:8px 0 0; }
  .size-chips { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .data-grid > div { min-height: 0; padding: 24px 0; border-right: 0 !important; }
  .data-grid > div:nth-child(even) { padding-left: 0; }
  .catalog-heading > p { margin-top: 22px; }
  .catalog-group { min-height: 0; }
  .section-heading { display: block; }
  .material-grid { grid-template-columns: 1fr; }
  .material-card { min-height: 330px; padding: 30px; }
  .card-tag { left: 30px; }
  .execution { padding-block: 84px; }
  .execution-item { grid-template-columns: 34px 1fr; }
  .execution-item p { grid-column: 2; }
  .market-columns { grid-template-columns: 1fr; }
  .contact { padding: 40px 26px; }
  .contact-email { font-size: 1rem; }
  .site-footer { grid-template-columns: 1fr; padding-block: 38px; gap: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
  section::before { animation:none !important; }
  .moving-image img, .visual-card img, .packing-photo img, .material-photo, .section-feature img { animation:none !important; }
}