:root {
  --ink: #101417;
  --ink-soft: #1b2429;
  --paper: #f4f6f5;
  --white: #ffffff;
  --mist: #dce4e5;
  --cyan: #25a8c0;
  --cyan-deep: #00486f;
  --signal: #cbe63c;
  --line: rgba(16, 20, 23, 0.14);
  --muted: #617077;
  --max: 1240px;
  --header-h: 78px;
}

* { box-sizing: border-box; }
html { overflow-x: hidden; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); }
body {
  margin: 0;
  overflow-x: hidden;
  color: var(--ink);
  background: var(--paper);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
}
body.menu-open { overflow: hidden; }
img { display: block; width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; letter-spacing: 0; }
button { cursor: pointer; }
.skip-link { position: fixed; left: 12px; top: -100px; z-index: 1000; background: var(--white); padding: 12px 16px; }
.skip-link:focus { top: 12px; }
.scroll-progress { position: fixed; inset: 0 0 auto; z-index: 120; height: 3px; pointer-events: none; }
.scroll-progress span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--cyan), var(--signal)); box-shadow: 0 0 14px rgba(37,168,192,.6); }
.section { position: relative; padding: 124px 0; }
.section-shell { width: min(calc(100% - 48px), var(--max)); margin-inline: auto; }
.eyebrow { color: var(--cyan-deep); font-size: 12px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  color: var(--white);
  border-bottom: 1px solid rgba(255,255,255,.18);
  transition: background .35s ease, color .35s ease, box-shadow .35s ease;
}
.site-header.scrolled { color: var(--ink); background: rgba(255,255,255,.97); box-shadow: 0 8px 28px rgba(16,20,23,.08); }
.header-inner { height: var(--header-h); width: min(calc(100% - 48px), var(--max)); margin: auto; display: flex; align-items: center; gap: 42px; }
.brand { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.brand-plate { width: 106px; height: 58px; display: grid; place-items: center; transition: transform .3s ease; }
.brand:hover .brand-plate { transform: translateY(-1px); }
.brand-plate img { width: 100%; height: 100%; object-fit: contain; filter: brightness(0) invert(1); transition: filter .3s ease; }
.brand-copy { display: grid; line-height: 1; }
.brand-copy small { font-size: 9px; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; }
.site-header.scrolled .brand-plate img { filter: none; }
.desktop-nav { display: flex; align-items: center; justify-content: center; gap: 34px; margin-left: auto; }
.desktop-nav a { position: relative; font-size: 14px; font-weight: 600; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; bottom: -8px; width: 100%; height: 2px; background: var(--cyan); transform: scaleX(0); transform-origin: right; transition: transform .25s ease; }
.desktop-nav a:hover::after { transform: scaleX(1); transform-origin: left; }
.header-contact { min-height: 42px; display: inline-flex; align-items: center; gap: 8px; padding: 0 16px; border: 1px solid currentColor; font-size: 13px; font-weight: 750; }
.header-contact svg { width: 16px; }
.menu-toggle { display: none; width: 44px; height: 44px; border: 0; background: transparent; color: inherit; align-items: center; justify-content: center; }
.mobile-menu { position: fixed; inset: var(--header-h) 0 0; background: var(--ink); color: var(--white); padding: 38px 24px; }
.mobile-menu a { display: block; padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.14); font-size: 24px; font-weight: 650; }

.hero { min-height: 860px; height: 100svh; color: var(--white); display: flex; align-items: center; overflow: hidden; background: var(--ink); }
.hero-media, .hero-media img, .hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-media { overflow: hidden; }
.hero-media img { --pointer-x: 0px; --pointer-y: 0px; object-fit: cover; object-position: center; animation: heroDrift 16s ease-out both; }
.hero-shade { background: linear-gradient(90deg, rgba(5,17,25,.9) 0%, rgba(5,25,38,.66) 42%, rgba(5,17,25,.07) 74%), linear-gradient(0deg, rgba(5,17,25,.66), transparent 46%); }
.bubble-field { position: absolute; inset: 0; opacity: .22; background-image: radial-gradient(circle, rgba(255,255,255,.9) 0 1px, transparent 1.5px); background-size: 32px 32px; mask-image: linear-gradient(to top, black, transparent 55%); animation: bubbles 14s linear infinite; }
.hero-content { position: relative; z-index: 2; width: min(calc(100% - 48px), var(--max)); margin: 32px auto 0; }
.hero-kicker { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 26px; color: var(--signal); font-size: 12px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.hero-kicker::before { content: ""; width: 32px; height: 1px; background: currentColor; }
.hero h1 { margin: 0; max-width: 920px; font-size: clamp(52px, 6.7vw, 104px); line-height: .98; font-weight: 650; letter-spacing: 0; }
.hero h1 span { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.72); }
.hero-lead { max-width: 650px; margin: 30px 0 0; color: rgba(255,255,255,.78); font-size: 20px; line-height: 1.6; }
.hero-actions { display: flex; gap: 12px; margin-top: 34px; }
.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 0 22px; border: 1px solid transparent; font-size: 14px; font-weight: 780; transition: transform .2s ease, background .2s ease, color .2s ease; }
.button:hover { transform: translateY(-2px); }
.button svg { width: 18px; }
.button-primary { color: #081013; background: var(--signal); }
.button-primary:hover { background: var(--white); }
.button-ghost { color: var(--white); border-color: rgba(255,255,255,.45); background: rgba(255,255,255,.05); backdrop-filter: blur(7px); }
.button-ghost:hover { background: var(--white); color: var(--ink); }
.button-dark { color: var(--white); background: var(--ink); }
.hero-status { position: absolute; z-index: 3; right: max(24px, calc((100% - var(--max))/2)); bottom: 48px; display: flex; border-top: 1px solid rgba(255,255,255,.25); }
.hero-status div { width: 150px; padding: 14px 12px 0 0; }
.hero-status span { color: var(--cyan); font-size: 11px; font-weight: 800; }
.hero-status p { margin: 5px 0 0; font-size: 12px; font-weight: 650; }
.scroll-cue { position: absolute; z-index: 3; bottom: 40px; left: max(24px, calc((100% - var(--max))/2)); width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.4); animation: bob 2s ease-in-out infinite; }
.scroll-cue svg { width: 17px; }

.intro { background: var(--white); }
.intro-grid { display: grid; grid-template-columns: 1fr 3fr; gap: 54px; align-items: start; }
.intro-statement h2 { max-width: 1010px; margin: 0; font-size: clamp(40px, 4.6vw, 68px); line-height: 1.1; font-weight: 570; }
.intro-statement p { max-width: 760px; margin: 34px 0 0 auto; color: var(--muted); font-size: 18px; line-height: 1.75; }
.benefits { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 88px; border-top: 1px solid var(--line); }
.benefit { min-height: 240px; padding: 32px 26px 24px 0; border-right: 1px solid var(--line); }
.benefit + .benefit { padding-left: 26px; }
.benefit:last-child { border-right: 0; }
.benefit svg { width: 26px; color: var(--cyan-deep); }
.benefit h3 { margin: 48px 0 12px; font-size: 20px; }
.benefit p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }

.signals { color: var(--white); background: #092c3d; overflow: hidden; }
.signals::before { content: ""; position: absolute; inset: 0; opacity: .16; background-image: linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(90deg, transparent, black 70%); pointer-events: none; }
.signals-grid { position: relative; display: grid; grid-template-columns: 1.18fr .82fr; gap: clamp(60px, 8vw, 126px); align-items: center; }
.signals .eyebrow { color: var(--signal); }
.signals-copy h2 { max-width: 790px; margin: 18px 0 28px; font-size: clamp(38px, 4.2vw, 62px); line-height: 1.08; font-weight: 580; }
.signals-lead { max-width: 720px; margin: 0; color: rgba(255,255,255,.64); font-size: 17px; line-height: 1.75; }
.signal-list { margin-top: 50px; border-top: 1px solid rgba(255,255,255,.18); }
.signal-row { min-height: 104px; display: grid; grid-template-columns: 42px 1fr 30px; gap: 18px; align-items: center; border-bottom: 1px solid rgba(255,255,255,.18); }
.signal-row > span { color: var(--cyan); font-size: 11px; font-weight: 800; }
.signal-row strong, .signal-row small { display: block; }
.signal-row strong { font-size: 17px; }
.signal-row small { margin-top: 7px; color: rgba(255,255,255,.52); font-size: 12px; line-height: 1.5; }
.signal-row svg { width: 21px; color: rgba(255,255,255,.52); transition: transform .25s ease, color .25s ease; }
.signal-row:hover svg { color: var(--signal); transform: translateX(4px); }
.signal-monitor { position: relative; padding: 32px; border: 1px solid rgba(255,255,255,.22); background: rgba(5,20,28,.72); box-shadow: 0 36px 90px rgba(0,0,0,.24); overflow: hidden; }
.signal-monitor::after { content: ""; position: absolute; inset: 0; border-top: 1px solid rgba(104,232,231,.7); transform: translateY(-100%); animation: monitorScan 5s ease-in-out infinite; pointer-events: none; }
.monitor-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 22px; border-bottom: 1px solid rgba(255,255,255,.14); color: rgba(255,255,255,.55); font-size: 11px; font-weight: 750; text-transform: uppercase; }
.monitor-head svg { width: 18px; color: var(--signal); }
.monitor-state { padding: 34px 0 30px; }
.monitor-state small, .monitor-state strong { display: block; }
.monitor-state small { color: var(--cyan); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.monitor-state strong { margin-top: 9px; font-size: clamp(24px, 2.3vw, 34px); font-weight: 580; }
.monitor-state p { margin: 15px 0 0; color: rgba(255,255,255,.56); font-size: 13px; line-height: 1.65; }
.flow-system { padding: 28px 0 24px; border-block: 1px solid rgba(255,255,255,.14); }
.flow-line { position: relative; height: 2px; margin: 0 8px 17px; background: rgba(255,255,255,.14); overflow: hidden; }
.flow-line span { position: absolute; inset: 0 auto 0 -35%; width: 35%; background: linear-gradient(90deg, transparent, var(--signal), transparent); animation: flowPulse 2.4s linear infinite; }
.flow-nodes { display: grid; grid-template-columns: repeat(4, 1fr); color: rgba(255,255,255,.5); font-size: 9px; text-align: center; text-transform: uppercase; }
.flow-nodes span { position: relative; padding-top: 12px; }
.flow-nodes span::before { content: ""; position: absolute; left: calc(50% - 3px); top: -21px; width: 6px; height: 6px; border-radius: 50%; background: var(--signal); box-shadow: 0 0 0 4px rgba(104,232,231,.1); }
.monitor-bars { display: grid; gap: 15px; padding: 27px 0; }
.monitor-bars div { display: grid; grid-template-columns: 105px 1fr; gap: 16px; align-items: center; color: rgba(255,255,255,.52); font-size: 10px; }
.monitor-bars i { display: block; height: 5px; background: rgba(255,255,255,.1); overflow: hidden; }
.monitor-bars i::after { content: ""; display: block; width: 0; height: 100%; background: var(--cyan); transition: width 1.15s cubic-bezier(.2,.7,.2,1) .25s; }
.signal-monitor.visible .monitor-bars i::after { width: var(--level); }
.monitor-action { display: flex; align-items: center; justify-content: space-between; min-height: 54px; padding: 0 16px; color: var(--ink); background: var(--signal); font-size: 13px; font-weight: 800; }
.monitor-action svg { width: 17px; }

.services { padding-bottom: 0; }
.section-heading { display: grid; grid-template-columns: 1.8fr 1fr; gap: 80px; align-items: end; margin-bottom: 68px; }
.section-heading h2 { max-width: 780px; margin: 14px 0 0; font-size: clamp(38px, 4.3vw, 64px); line-height: 1.08; font-weight: 580; }
.section-heading > p { margin: 0; color: var(--muted); line-height: 1.7; }
.service-showcase { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(420px, .65fr); min-height: 650px; background: var(--white); }
.service-showcase + .service-showcase { margin-top: 2px; }
.service-reverse { grid-template-columns: minmax(420px, .65fr) minmax(0, 1.35fr); }
.service-reverse .service-image { order: 2; }
.service-image { position: relative; overflow: hidden; min-height: 560px; }
.service-image > img:first-child { height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.service-showcase:hover .service-image > img:first-child { transform: scale(1.025); }
.image-label { position: absolute; left: 24px; bottom: 24px; min-width: 220px; padding: 16px 18px; background: rgba(255,255,255,.92); backdrop-filter: blur(12px); }
.image-label span, .image-label small { display: block; }
.image-label span { font-size: 13px; font-weight: 780; }
.image-label small { margin-top: 5px; color: var(--muted); font-size: 11px; text-transform: uppercase; }
.service-copy { padding: 74px clamp(34px, 5vw, 84px); align-self: center; }
.service-number { color: var(--cyan-deep); font-size: 13px; font-weight: 850; }
.service-copy h3 { margin: 20px 0 24px; font-size: clamp(30px, 3vw, 47px); line-height: 1.08; font-weight: 600; }
.service-copy > p { color: var(--muted); line-height: 1.75; }
.check-list { display: grid; gap: 13px; margin: 30px 0 34px; padding: 24px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); list-style: none; }
.check-list li { display: flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 650; }
.check-list svg { width: 17px; color: var(--cyan-deep); }
.service-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 23px; }
.service-tags span { padding: 7px 9px; border: 1px solid var(--line); color: #4d5a5f; font-size: 10px; font-weight: 750; text-transform: uppercase; }
.text-link { display: inline-flex; align-items: center; gap: 9px; padding-bottom: 6px; border-bottom: 1px solid currentColor; font-size: 14px; font-weight: 780; }
.text-link svg { width: 16px; transition: transform .2s ease; }
.text-link:hover svg { transform: translate(3px, -3px); }

.measurement { background: var(--white); }
.measurement-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); }
.measurement-item { min-width: 0; min-height: 350px; padding: 28px 25px 26px; border-right: 1px solid var(--line); }
.measurement-item:last-child { border-right: 0; }
.measurement-item > span { color: var(--cyan-deep); font-size: 10px; font-weight: 850; }
.measurement-item svg { display: block; width: 27px; margin: 58px 0 26px; color: #08728e; }
.measurement-item h3 { margin: 0 0 13px; font-size: 22px; }
.measurement-item p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.measurement-item small { display: block; margin-top: 25px; padding-top: 18px; border-top: 1px solid var(--line); color: #3f4d52; font-size: 10px; font-weight: 750; text-transform: uppercase; }

.decision { background: #edf2f1; }
.decision-table-wrap { overflow-x: auto; border-top: 1px solid rgba(16,20,23,.24); }
.decision-table { width: 100%; min-width: 820px; border-collapse: collapse; table-layout: fixed; }
.decision-table th, .decision-table td { padding: 25px 28px; border-right: 1px solid rgba(16,20,23,.14); border-bottom: 1px solid rgba(16,20,23,.16); text-align: left; vertical-align: top; }
.decision-table th:last-child, .decision-table td:last-child { border-right: 0; }
.decision-table thead th { height: 110px; vertical-align: bottom; color: var(--muted); font-size: 14px; font-weight: 720; }
.decision-table thead th:first-child { width: 22%; font-size: 11px; text-transform: uppercase; }
.decision-table thead .recommended { color: var(--white); background: #073d5c; }
.decision-table thead .recommended span { display: block; margin-bottom: 8px; color: var(--signal); font-size: 9px; text-transform: uppercase; }
.decision-table tbody th { font-size: 12px; font-weight: 800; text-transform: uppercase; }
.decision-table tbody td { color: var(--muted); font-size: 14px; line-height: 1.65; }
.decision-table tbody td:nth-child(2) { background: rgba(255,255,255,.7); color: #26343a; }
.deliverables { display: grid; grid-template-columns: .7fr 1.3fr; gap: 90px; margin-top: 100px; padding-top: 78px; border-top: 1px solid rgba(16,20,23,.18); }
.deliverables-intro h3 { margin: 16px 0 0; font-size: clamp(30px, 3.2vw, 46px); line-height: 1.12; font-weight: 580; }
.deliverables-grid { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid rgba(16,20,23,.2); }
.deliverable { position: relative; min-width: 0; padding: 25px 22px 10px; border-right: 1px solid rgba(16,20,23,.16); }
.deliverable:nth-child(even) { border-right: 0; }
.deliverable:nth-child(n+3) { padding-top: 35px; border-top: 1px solid rgba(16,20,23,.16); }
.deliverable > span { color: var(--cyan-deep); font-size: 10px; font-weight: 850; }
.deliverable svg { display: block; width: 24px; margin: 42px 0 24px; color: #073d5c; }
.deliverable h4 { margin: 0 0 13px; font-size: 17px; }
.deliverable p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }

.process { color: var(--white); background: var(--ink); overflow: hidden; }
.process-watermark { position: absolute; right: -70px; top: -70px; width: 530px; height: auto; opacity: .035; filter: grayscale(1) brightness(4); pointer-events: none; }
.section-heading.light .eyebrow { color: var(--signal); }
.section-heading.light > p { color: rgba(255,255,255,.55); }
.process-steps { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); margin: 88px 0 0; padding: 0; list-style: none; }
.process-steps::before { content: ""; position: absolute; left: 4%; right: 4%; top: 60px; height: 1px; background: rgba(255,255,255,.18); }
.process-steps li { position: relative; padding-right: 36px; }
.step-index { display: block; color: var(--cyan); font-size: 11px; font-weight: 800; }
.step-icon { position: relative; width: 58px; height: 58px; display: grid; place-items: center; margin: 28px 0 36px; border: 1px solid rgba(255,255,255,.32); background: var(--ink); }
.step-icon svg { width: 23px; }
.process-steps h3 { margin: 0 0 13px; font-size: 24px; }
.process-steps p { margin: 0; color: rgba(255,255,255,.56); font-size: 14px; line-height: 1.7; }

.machining { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(520px, .92fr); color: var(--white); background: #151b1e; overflow: hidden; }
.machining-media { position: relative; min-height: 900px; overflow: hidden; }
.machining-media > img:first-child { width: 100%; height: 100%; object-fit: cover; object-position: 52% center; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.machining:hover .machining-media > img:first-child { transform: scale(1.018); }
.machining-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(7,14,18,.7), transparent 42%); pointer-events: none; }
.machining-media-label { position: absolute; z-index: 3; left: 34px; bottom: 32px; padding-left: 14px; border-left: 2px solid var(--signal); }
.machining-media-label span, .machining-media-label small { display: block; }
.machining-media-label span { font-size: 13px; font-weight: 800; }
.machining-media-label small { margin-top: 5px; color: rgba(255,255,255,.62); font-size: 10px; text-transform: uppercase; }
.machining-copy { align-self: center; padding: 92px clamp(40px, 6vw, 94px); }
.machining .eyebrow { color: var(--signal); }
.machining-copy h2 { max-width: 650px; margin: 18px 0 27px; font-size: clamp(42px, 4.7vw, 72px); line-height: 1.04; font-weight: 580; }
.machining-lead { max-width: 690px; margin: 0; color: rgba(255,255,255,.64); font-size: 17px; line-height: 1.75; }
.machining-specs { margin-top: 46px; border-top: 1px solid rgba(255,255,255,.18); }
.machining-spec { min-height: 130px; display: grid; grid-template-columns: 36px minmax(0,1fr) auto; gap: 18px; align-items: center; border-bottom: 1px solid rgba(255,255,255,.18); }
.machining-spec > span { color: var(--cyan); font-size: 10px; font-weight: 850; }
.machining-spec h3 { margin: 0 0 7px; font-size: 17px; }
.machining-spec p { margin: 0; color: rgba(255,255,255,.52); font-size: 12px; line-height: 1.55; }
.machining-spec > strong { color: var(--signal); font-size: 16px; text-align: right; white-space: nowrap; }
.machining-spec > strong small { color: rgba(255,255,255,.52); font-size: 10px; font-weight: 650; }
.machining-options { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 28px; }
.machining-options span { padding: 7px 9px; border: 1px solid rgba(255,255,255,.2); color: rgba(255,255,255,.68); font-size: 9px; font-weight: 750; text-transform: uppercase; }
.machining-cta { margin-top: 32px; }

.project-brief { padding: 70px 0; color: var(--white); background: #0a7690; }
.brief-grid { display: grid; grid-template-columns: 1fr 1.2fr auto; gap: 54px; align-items: center; }
.project-brief .eyebrow { color: #b9ffed; }
.brief-copy h2 { max-width: 520px; margin: 13px 0 0; font-size: clamp(28px, 3vw, 43px); line-height: 1.1; font-weight: 580; }
.brief-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(255,255,255,.35); }
.brief-list li { min-height: 62px; display: flex; gap: 10px; align-items: center; border-bottom: 1px solid rgba(255,255,255,.35); font-size: 12px; font-weight: 700; }
.brief-list span { color: #b9ffed; font-size: 9px; font-weight: 800; }
.brief-action { white-space: nowrap; }

.audience { background: var(--white); }
.audience-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 110px; align-items: start; }
.audience-copy { position: sticky; top: 130px; }
.audience-copy h2 { margin: 18px 0 26px; font-size: clamp(40px, 4.4vw, 62px); line-height: 1.07; font-weight: 580; }
.audience-copy > p { margin: 0 0 34px; color: var(--muted); font-size: 17px; line-height: 1.75; }
.audience-list { border-top: 1px solid var(--line); }
.audience-item { min-height: 126px; display: grid; grid-template-columns: 48px 1fr 34px; gap: 20px; align-items: center; border-bottom: 1px solid var(--line); }
.audience-item span { color: var(--cyan-deep); font-size: 12px; font-weight: 800; }
.audience-item h3 { margin: 0; font-size: clamp(21px, 2vw, 29px); font-weight: 580; }
.audience-item svg { width: 24px; color: var(--muted); transition: transform .25s ease, color .25s ease; }
.audience-item:hover svg { color: var(--cyan-deep); transform: translateX(5px); }

.insights { background: var(--paper); }
.insight-grid { display: grid; grid-template-columns: 1.45fr .75fr; grid-template-rows: repeat(2, minmax(320px, 1fr)); gap: 14px; }
.insight-item { position: relative; width: 100%; min-width: 0; min-height: 0; margin: 0; overflow: hidden; background: var(--ink-soft); }
.insight-main { grid-row: 1 / span 2; }
.insight-item > img:first-child { width: 100%; max-width: 100%; min-width: 0; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.2,.7,.2,1), filter .5s ease; }
.insight-item::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(5,17,25,.75), transparent 48%); pointer-events: none; }
.insight-item:hover > img:first-child { transform: scale(1.035); filter: saturate(.9) contrast(1.04); }
.insight-item figcaption { position: absolute; z-index: 2; left: 24px; right: 24px; bottom: 22px; color: var(--white); }
.insight-item figcaption span, .insight-item figcaption small { display: block; }
.insight-item figcaption span { font-size: 16px; font-weight: 780; }
.insight-item figcaption small { margin-top: 5px; color: rgba(255,255,255,.68); font-size: 11px; }
.insight-capability, .insight-economy { padding: 26px; }
.insight-capability::after, .insight-economy::after { display: none; }
.insight-capability { color: var(--white); background: #073d5c; }
.capability-head, .economy-head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 19px; border-bottom: 1px solid rgba(255,255,255,.2); font-size: 10px; font-weight: 780; text-transform: uppercase; }
.capability-head svg { width: 18px; color: var(--signal); }
.insight-capability ol { display: grid; gap: 0; margin: 20px 0 72px; padding: 0; list-style: none; }
.insight-capability li { min-height: 59px; display: grid; grid-template-columns: 35px 1fr; align-items: center; border-bottom: 1px solid rgba(255,255,255,.14); }
.insight-capability li span { color: var(--cyan); font-size: 9px; }
.insight-capability li strong { font-size: 12px; font-weight: 700; }
.insight-economy { color: var(--ink); background: var(--white); }
.economy-head { border-color: var(--line); }
.economy-head small { color: var(--cyan-deep); font-size: 9px; }
.economy-chart { position: relative; height: 190px; margin: 14px 0 6px; padding: 8px 0 0 10px; }
.economy-chart svg { width: 100%; height: 100%; overflow: visible; }
.chart-lines line { stroke: #dfe6e6; stroke-width: 1; }
.chart-axis { stroke: #8b989c; stroke-width: 1.2; }
.chart-path { fill: none; stroke-width: 4; stroke-linecap: round; stroke-dasharray: 620; stroke-dashoffset: 620; transition: stroke-dashoffset 1.5s cubic-bezier(.2,.7,.2,1) .2s; }
.insight-economy.visible .chart-path { stroke-dashoffset: 0; }
.chart-path-rising { stroke: #ed8b00; }
.chart-path-controlled { stroke: #08728e; transition-delay: .55s; }
.chart-savings { fill: rgba(37,168,192,.16); opacity: 0; transform: scaleX(.02); transform-box: fill-box; transform-origin: left center; transition: opacity .7s ease .8s, transform 1.1s cubic-bezier(.2,.7,.2,1) .8s; }
.insight-economy.visible .chart-savings { opacity: 1; transform: scaleX(1); }
.chart-marker { stroke: #101417; stroke-width: 1.5; stroke-dasharray: 5 5; opacity: 0; transition: opacity .45s ease .65s; }
.chart-marker-point { fill: var(--white); stroke: #08728e; stroke-width: 4; opacity: 0; transition: opacity .35s ease .72s; }
.insight-economy.visible .chart-marker, .insight-economy.visible .chart-marker-point { opacity: .75; }
.axis-label { position: absolute; z-index: 2; color: #718086; font-size: 8px; text-transform: uppercase; }
.axis-y { left: -7px; top: 28px; transform: rotate(-90deg); transform-origin: right top; }
.axis-x { right: 4px; bottom: 0; }
.chart-event-label { position: absolute; z-index: 2; left: 50%; top: 3px; padding: 4px 6px; color: var(--ink); background: rgba(255,255,255,.92); font-size: 7px; font-weight: 800; text-transform: uppercase; transform: translateX(-42%); }
.chart-effect-label { position: absolute; z-index: 2; right: 14%; top: 45%; color: #08728e; font-size: 8px; font-weight: 850; text-transform: uppercase; }
.economy-legend { display: grid; grid-template-columns: 1fr; gap: 7px; margin-top: 3px; color: #536168; font-size: 9px; }
.economy-legend span { display: flex; align-items: center; gap: 6px; }
.economy-legend i { width: 18px; height: 3px; background: #ed8b00; }
.economy-legend span:nth-child(2) i { background: #08728e; }
.insight-capability figcaption, .insight-economy figcaption { left: 26px; right: 26px; }
.insight-economy figcaption { color: var(--ink); }
.insight-economy figcaption small { color: var(--muted); }
.legacy-archive { margin-top: 24px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.legacy-archive summary { min-height: 64px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; color: var(--muted); font-size: 11px; font-weight: 750; text-transform: uppercase; list-style: none; }
.legacy-archive summary::-webkit-details-marker { display: none; }
.legacy-archive summary svg { width: 17px; transition: transform .25s ease; }
.legacy-archive[open] summary svg { transform: rotate(45deg); }
.legacy-archive > div { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding: 0 0 24px; }
.legacy-archive img { min-width: 0; border: 1px solid var(--line); }

.faq { background: #e8edec; }
.faq-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: 110px; }
.faq-intro { position: sticky; top: 130px; align-self: start; }
.faq-intro h2 { margin: 17px 0 22px; font-size: clamp(38px, 4vw, 58px); line-height: 1.08; font-weight: 580; }
.faq-intro > p { color: var(--muted); line-height: 1.7; }
.faq-intro .text-link { margin-top: 18px; }
.accordion details { border-top: 1px solid rgba(16,20,23,.24); }
.accordion details:last-child { border-bottom: 1px solid rgba(16,20,23,.24); }
.accordion summary { min-height: 92px; display: flex; align-items: center; justify-content: space-between; gap: 30px; cursor: pointer; font-size: 19px; font-weight: 670; list-style: none; }
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary svg { flex: 0 0 auto; width: 20px; transition: transform .25s ease; }
.accordion details[open] summary svg { transform: rotate(45deg); }
.accordion details p { max-width: 700px; margin: -8px 50px 30px 0; color: var(--muted); line-height: 1.75; }

.contact { color: var(--white); background: #073d5c; overflow: hidden; }
.contact-backdrop { position: absolute; inset: 0; opacity: .18; background-image: linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px); background-size: 56px 56px; mask-image: linear-gradient(90deg, transparent 10%, black 80%); }
.contact-grid { position: relative; display: grid; grid-template-columns: .85fr 1.15fr; gap: 110px; }
.contact .eyebrow { color: var(--signal); }
.contact-copy h2 { margin: 18px 0 26px; font-size: clamp(42px, 4.6vw, 68px); line-height: 1.05; font-weight: 580; }
.contact-copy > p { max-width: 520px; color: rgba(255,255,255,.66); font-size: 17px; line-height: 1.7; }
.contact-prep { display: grid; gap: 10px; margin: 26px 0 0; padding: 22px 0; border-block: 1px solid rgba(255,255,255,.15); list-style: none; }
.contact-prep li { display: flex; align-items: center; gap: 10px; color: rgba(255,255,255,.72); font-size: 12px; }
.contact-prep svg { width: 15px; color: var(--signal); }
.contact-person { display: flex; align-items: center; gap: 14px; margin-top: 34px; }
.person-initials { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.45); font-size: 12px; font-weight: 800; }
.contact-person strong, .contact-person span { display: block; }
.contact-person span { margin-top: 4px; color: rgba(255,255,255,.55); font-size: 12px; }
.contact-person-secondary { margin-top: 30px; padding-top: 30px; border-top: 1px solid rgba(255,255,255,.15); }
.direct-links { display: grid; gap: 14px; margin-top: 34px; }
.direct-links a { display: flex; align-items: center; gap: 14px; width: fit-content; }
.direct-links svg { width: 20px; color: var(--signal); }
.direct-links span, .direct-links small { display: block; }
.direct-links span { font-size: 15px; font-weight: 700; }
.direct-links small { margin-bottom: 3px; color: rgba(255,255,255,.5); font-size: 10px; font-weight: 650; text-transform: uppercase; }
.contact-form { padding: 42px; color: var(--ink); background: var(--white); box-shadow: 0 32px 80px rgba(0,0,0,.18); }
.form-trap { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.contact-form label { display: grid; gap: 8px; margin-bottom: 19px; color: #344148; font-size: 12px; font-weight: 750; }
.contact-form input:not([type="checkbox"]), .contact-form select, .contact-form textarea { width: 100%; min-height: 48px; padding: 12px 13px; color: var(--ink); border: 1px solid #cdd5d5; border-radius: 0; background: #f9fbfa; outline: none; transition: border .2s ease, box-shadow .2s ease; }
.contact-form textarea { resize: vertical; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color: var(--cyan-deep); box-shadow: 0 0 0 3px rgba(40,196,216,.16); }
.contact-form.was-validated input:not([type="checkbox"]):invalid,
.contact-form.was-validated select:invalid,
.contact-form.was-validated textarea:invalid { border-color: #c84d21; box-shadow: 0 0 0 3px rgba(200,77,33,.12); }
.contact-form.was-validated input[type="checkbox"]:invalid { outline: 2px solid #c84d21; outline-offset: 2px; }
.contact-form .consent { display: flex; grid-template-columns: auto 1fr; align-items: flex-start; gap: 10px; color: var(--muted); font-weight: 500; line-height: 1.5; }
.consent input { margin: 3px 0 0; accent-color: var(--cyan-deep); }
.form-submit { width: 100%; border: 0; }
.form-submit:disabled { cursor: wait; opacity: .72; transform: none; }
.form-note { margin: 11px 0 0; color: #7a878c; font-size: 10px; text-align: center; }
.form-route { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: -5px 0 22px; padding: 13px 14px; color: #344148; background: #eef4f3; border-left: 3px solid var(--cyan-deep); }
.form-route span { color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.form-route strong { font-size: 11px; line-height: 1.4; text-align: right; }
.form-result[hidden] { display: none; }
.form-result { margin-top: 18px; padding: 20px; color: var(--white); background: #073d5c; border-left: 3px solid var(--signal); }
.form-result.is-error { color: var(--ink); background: #fff1e5; border-left-color: #c84d21; }
.form-result.is-success { background: #075545; border-left-color: var(--signal); }
.form-result-copy span, .form-result-copy strong { display: block; }
.form-result-copy span { color: var(--cyan); font-size: 9px; font-weight: 850; text-transform: uppercase; }
.form-result.is-error .form-result-copy span { color: #9a3a19; }
.form-result-copy strong { margin-top: 7px; font-size: 12px; line-height: 1.55; }
.form-result-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 17px; }
.form-result-actions[hidden] { display: none; }
.form-result-actions .button { min-width: 0; padding: 0 13px; font-size: 11px; text-decoration: none; }
.form-result .button-ghost { border-color: rgba(255,255,255,.42); }

.site-footer { color: var(--white); background: var(--ink); }
.footer-main { min-height: 190px; display: grid; grid-template-columns: 1fr 1fr auto; gap: 60px; align-items: center; }
.footer-main > p { max-width: 470px; margin: 0; color: rgba(255,255,255,.5); font-size: 14px; line-height: 1.6; }
.footer-logo-panel { width: 205px; display: block; }
.footer-logo-panel img { width: 100%; height: auto; filter: brightness(0) invert(1); }
.footer-top { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.35); }
.footer-top svg { width: 18px; }
.footer-legal { min-height: 64px; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.44); font-size: 11px; }
.footer-legal div { display: flex; gap: 25px; }
.footer-legal a:hover { color: var(--white); }

.contact-rail { position: fixed; z-index: 80; right: 26px; top: 50%; display: grid; gap: 7px; opacity: 0; transform: translate(20px,-50%); pointer-events: none; transition: opacity .3s ease, transform .3s ease; }
.show-contact-tools .contact-rail { opacity: 1; transform: translate(0,-50%); pointer-events: auto; }
.contact-rail a { position: relative; width: 46px; height: 46px; display: grid; place-items: center; color: var(--white); background: #073d5c; box-shadow: 0 8px 20px rgba(0,0,0,.16); }
.contact-rail svg { width: 18px; }
.contact-rail a::before { content: attr(data-tooltip); position: absolute; right: 54px; padding: 7px 9px; color: var(--white); background: var(--ink); font-size: 10px; white-space: nowrap; opacity: 0; transform: translateX(5px); transition: opacity .2s ease, transform .2s ease; pointer-events: none; }
.contact-rail a:hover::before, .contact-rail a:focus-visible::before { opacity: 1; transform: none; }
.mobile-contact-bar { display: none; }

.reveal { opacity: 0; transform: translateY(28px); transition: opacity .75s ease, transform .75s cubic-bezier(.2,.7,.2,1); }
.reveal.visible { opacity: 1; transform: none; }
.image-reveal { clip-path: inset(0); }
.image-reveal img { opacity: .88; transform: scale(1.025); transition: opacity .8s ease, transform 1.05s cubic-bezier(.25,.75,.2,1); }
.image-reveal.visible img { opacity: 1; transform: scale(1); }

@keyframes heroDrift { from { transform: translate3d(var(--pointer-x), var(--pointer-y), 0) scale(1.08); } to { transform: translate3d(var(--pointer-x), var(--pointer-y), 0) scale(1); } }
@keyframes bubbles { from { background-position: 0 0; } to { background-position: 0 -160px; } }
@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(7px); } }
@keyframes flowPulse { to { left: 100%; } }
@keyframes monitorScan { 0%, 12% { transform: translateY(-100%); opacity: 0; } 30% { opacity: .42; } 72% { opacity: .15; } 88%, 100% { transform: translateY(520px); opacity: 0; } }

@media (max-width: 1050px) {
  .desktop-nav, .header-contact { display: none; }
  .menu-toggle { display: flex; margin-left: auto; }
  .benefits { grid-template-columns: 1fr 1fr; }
  .benefit:nth-child(2) { border-right: 0; }
  .benefit:nth-child(n+3) { border-top: 1px solid var(--line); }
  .service-showcase, .service-reverse { grid-template-columns: 1fr 1fr; }
  .service-copy { padding: 54px 36px; }
  .measurement-grid { grid-template-columns: repeat(2, 1fr); }
  .measurement-item:nth-child(2) { border-right: 0; }
  .measurement-item:nth-child(n+3) { border-top: 1px solid var(--line); }
  .machining { grid-template-columns: 1fr 1fr; }
  .machining-copy { padding: 70px 38px; }
  .audience-grid, .faq-grid, .contact-grid { gap: 60px; }
  .signals-grid { gap: 50px; }
  .deliverables { grid-template-columns: 1fr; gap: 50px; }
  .brief-grid { grid-template-columns: 1fr 1.3fr; }
  .brief-action { grid-column: 1 / -1; width: fit-content; }
  .contact-rail { display: none; }
}

@media (max-width: 780px) {
  :root { --header-h: 68px; }
  .section { padding: 82px 0; }
  .section-shell, .header-inner, .hero-content { width: min(calc(100% - 32px), var(--max)); }
  .hero { min-height: 720px; height: 100svh; }
  .hero-media img { object-position: 62% center; }
  .hero-shade { background: linear-gradient(90deg, rgba(8,13,16,.9), rgba(8,13,16,.44)), linear-gradient(0deg, rgba(8,13,16,.75), transparent 55%); }
  .hero h1 { font-size: clamp(44px, 13vw, 68px); }
  .hero-lead { font-size: 17px; line-height: 1.55; }
  .hero-actions { flex-direction: column; align-items: stretch; max-width: 380px; }
  .hero-status { left: 16px; right: 16px; bottom: 24px; }
  .hero-status div { flex: 1; width: auto; }
  .scroll-cue { display: none; }
  .intro-grid, .section-heading, .signals-grid, .audience-grid, .faq-grid, .contact-grid { grid-template-columns: 1fr; gap: 36px; }
  .intro-statement h2, .section-heading h2, .audience-copy h2, .faq-intro h2, .contact-copy h2 { font-size: 40px; }
  .intro-statement p { margin-left: 0; font-size: 16px; }
  .benefits { grid-template-columns: 1fr; margin-top: 58px; }
  .benefit, .benefit + .benefit { min-height: auto; padding: 28px 0; border-right: 0; border-top: 1px solid var(--line); }
  .benefit h3 { margin-top: 25px; }
  .signals-copy h2 { font-size: 40px; }
  .signals-lead { font-size: 15px; }
  .signal-list { margin-top: 36px; }
  .signal-row { min-height: 96px; grid-template-columns: 32px 1fr 24px; gap: 12px; }
  .signal-monitor { padding: 22px; }
  .service-showcase, .service-reverse { display: flex; flex-direction: column; min-height: auto; }
  .service-reverse .service-image { order: 0; }
  .service-image { min-height: 390px; aspect-ratio: 4 / 3; }
  .service-copy { padding: 46px 24px 58px; }
  .measurement-grid { grid-template-columns: 1fr; }
  .measurement-item, .measurement-item:nth-child(2) { min-height: auto; padding: 28px 0; border-right: 0; border-top: 1px solid var(--line); }
  .measurement-item svg { margin: 28px 0 20px; }
  .section-heading { margin-bottom: 44px; }
  .process-steps { grid-template-columns: 1fr; gap: 44px; margin-top: 52px; }
  .process-steps::before { left: 28px; right: auto; top: 20px; bottom: 20px; width: 1px; height: auto; }
  .process-steps li { padding-left: 82px; padding-right: 0; }
  .step-icon { position: absolute; left: 0; top: 2px; margin: 0; }
  .step-index { margin-bottom: 10px; }
  .process-watermark { width: 220px; right: 0; top: 10px; }
  .decision { overflow: hidden; }
  .decision-table-wrap { width: min(calc(100% - 32px), var(--max)); padding: 0; overflow: visible; }
  .decision-table { min-width: 0; table-layout: auto; }
  .decision-table thead { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
  .decision-table, .decision-table tbody, .decision-table tr, .decision-table th, .decision-table td { display: block; width: 100%; }
  .decision-table tbody { display: grid; gap: 18px; }
  .decision-table tbody tr { border: 1px solid rgba(16,20,23,.18); }
  .decision-table th, .decision-table td { padding: 18px 20px; border-right: 0; }
  .decision-table tbody th { background: #dfe6e5; }
  .decision-table tbody td { position: relative; padding-top: 43px; }
  .decision-table tbody td::before { position: absolute; left: 20px; top: 16px; color: var(--cyan-deep); font-size: 9px; font-weight: 850; text-transform: uppercase; }
  .decision-table tbody td:nth-child(2)::before { content: "Regeneration pr\00fc fen"; }
  .decision-table tbody td:nth-child(3)::before { content: "Austausch pr\00fc fen"; color: var(--muted); }
  .deliverables { margin-top: 70px; padding-top: 58px; }
  .deliverables-grid { grid-template-columns: 1fr; }
  .deliverable { padding: 26px 0; border-right: 0; border-bottom: 1px solid rgba(16,20,23,.16); }
  .deliverable svg { margin: 24px 0 18px; }
  .machining { display: flex; flex-direction: column; }
  .machining-media { min-height: 0; aspect-ratio: 4 / 3; }
  .machining-copy { padding: 66px 16px 82px; }
  .machining-copy h2 { font-size: 40px; }
  .machining-spec { grid-template-columns: 28px minmax(0,1fr); padding: 22px 0; }
  .machining-spec > strong { grid-column: 2; text-align: left; }
  .machining-media-label { left: 18px; bottom: 24px; }
  .brief-grid { grid-template-columns: 1fr; gap: 34px; }
  .brief-list { grid-template-columns: repeat(2, 1fr); }
  .brief-action { grid-column: auto; width: 100%; }
  .audience-copy, .faq-intro { position: static; }
  .audience-item { grid-template-columns: 38px 1fr 28px; }
  .contact-form { padding: 28px 20px; }
  .form-route { align-items: flex-start; flex-direction: column; gap: 5px; }
  .form-route strong { text-align: left; }
  .form-result-actions { grid-template-columns: 1fr; }
  .insight-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; gap: 10px; }
  .insight-main { grid-row: auto; }
  .insight-item { min-height: 0; aspect-ratio: 4 / 3; }
  .insight-capability, .insight-economy { min-height: 410px; aspect-ratio: auto; }
  .legacy-archive > div { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .footer-main { grid-template-columns: 1fr auto; gap: 28px; padding-block: 42px; }
  .footer-main > p { grid-column: 1 / -1; order: 3; }
  body { padding-bottom: 62px; }
  .mobile-contact-bar { position: fixed; z-index: 90; inset: auto 0 0; min-height: 62px; display: flex; align-items: center; justify-content: space-between; padding: 0 20px; color: var(--ink); background: var(--signal); box-shadow: 0 -8px 24px rgba(0,0,0,.14); font-size: 13px; font-weight: 800; transform: translateY(100%); transition: transform .3s ease; }
  .show-contact-tools .mobile-contact-bar { transform: none; }
  .mobile-contact-bar svg { width: 18px; }
}

@media (max-width: 480px) {
  .brand-plate { width: 82px; height: 48px; }
  .brand-copy small { display: none; }
  .footer-logo-panel { width: 150px; }
  .hero-kicker { max-width: 310px; font-size: 10px; }
  .hero h1 { font-size: 43px; }
  .hero-status p { font-size: 10px; }
  .image-label { left: 14px; bottom: 14px; }
  .accordion summary { font-size: 16px; }
  .footer-legal { align-items: flex-start; flex-direction: column; justify-content: center; gap: 10px; padding-block: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .image-reveal { clip-path: none; }
}
