:root {
  --ink: #0b0d0c;
  --ink-soft: #171a18;
  --paper: #f1f0e9;
  --paper-soft: #e7e6dd;
  --white: #fbfbf7;
  --muted: #767a72;
  --line: rgba(11, 13, 12, 0.14);
  --line-light: rgba(255, 255, 255, 0.18);
  --acid: #c8f04b;
  --font-sans: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-display: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-serif: Georgia, "Times New Roman", serif;
  --page: min(1380px, calc(100vw - 64px));
  --ease: cubic-bezier(.2, .75, .25, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--font-sans); line-height: 1.55; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
img, video { display: block; width: 100%; }
p, h1, h2, h3 { margin: 0; }
svg { stroke-width: 1.6; }
i[data-lucide] { width: 1.15em; height: 1.15em; display: inline-grid; place-items: center; flex: 0 0 auto; font-style: normal; line-height: 1; }
i[data-lucide]::before { font-family: Arial, sans-serif; font-size: 1em; font-weight: 400; }
i[data-lucide="arrow-up-right"]::before { content: "↗"; }
i[data-lucide="arrow-down-right"]::before, i[data-lucide="move-down-right"]::before { content: "↘"; }
i[data-lucide="arrow-right"]::before { content: "→"; }
i[data-lucide="chevron-right"]::before { content: "›"; }
i[data-lucide="check"]::before, i[data-lucide="shield-check"]::before { content: "✓"; }
i[data-lucide="scan-eye"]::before { content: "◉"; }
i[data-lucide="waypoints"]::before { content: "◇"; }
i[data-lucide="radio-tower"]::before { content: "⌁"; }
i[data-lucide="cctv"]::before { content: "◫"; }
i[data-lucide="cpu"]::before { content: "▦"; }
i[data-lucide="bell-ring"]::before { content: "◌"; }

.site-header { position: fixed; inset: 0 0 auto; z-index: 100; color: var(--white); transition: background .35s ease, color .35s ease, border-color .35s ease; border-bottom: 1px solid transparent; }
.site-header.scrolled { color: var(--ink); background: rgba(241, 240, 233, .92); border-color: var(--line); backdrop-filter: blur(16px); }
.nav-shell { width: var(--page); height: 86px; margin: auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.brand { display: inline-flex; align-items: center; gap: 12px; width: max-content; font-family: var(--font-display); font-size: 1.22rem; font-weight: 600; letter-spacing: -.04em; }
.brand-mark { width: 31px; height: auto; fill: none; stroke: currentColor; }
.brand-mark circle { fill: var(--acid); stroke: none; }
.desktop-nav { display: flex; align-items: center; gap: clamp(24px, 3vw, 46px); }
.desktop-nav a { position: relative; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.desktop-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -7px; height: 1px; background: currentColor; transition: right .3s var(--ease); }
.desktop-nav a:hover::after { right: 0; }
.nav-actions { display: flex; justify-content: flex-end; align-items: center; gap: 24px; }
.language-switch { display: flex; align-items: center; gap: 5px; font-size: .7rem; opacity: .7; }
.lang-option { padding: 0; border: 0; background: transparent; cursor: pointer; opacity: .5; }
.lang-option.active { opacity: 1; font-weight: 600; }
.nav-cta { display: inline-flex; align-items: center; gap: 12px; padding: 12px 17px; border: 1px solid currentColor; font-size: .76rem; letter-spacing: .04em; transition: background .25s ease, color .25s ease; }
.nav-cta svg { width: 15px; }
.nav-cta:hover { color: var(--ink); background: var(--acid); border-color: var(--acid); }
.site-header.scrolled .nav-cta:hover { color: var(--white); background: var(--ink); border-color: var(--ink); }
.menu-toggle { display: none; width: 34px; height: 34px; padding: 7px; border: 0; background: none; cursor: pointer; }
.menu-toggle span { display: block; width: 100%; height: 1px; background: currentColor; margin: 6px 0; transition: transform .25s ease; }
.menu-toggle.active span:first-child { transform: translateY(3.5px) rotate(45deg); }
.menu-toggle.active span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
.mobile-menu { display: none; }

.hero { position: relative; min-height: 780px; height: 100svh; color: var(--white); overflow: hidden; background: var(--ink); }
.hero-media { position: absolute; inset: 0; }
.hero-media video { height: 100%; object-fit: cover; object-position: center 44%; filter: saturate(.67) contrast(1.08); }
.hero-scrim { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,7,6,.94) 0%, rgba(5,7,6,.78) 34%, rgba(5,7,6,.28) 66%, rgba(5,7,6,.38) 100%), linear-gradient(0deg, rgba(5,7,6,.56), transparent 45%); }
.hero-content { position: relative; z-index: 2; width: var(--page); height: 100%; margin: auto; padding-top: max(160px, 20vh); }
.eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 32px; color: rgba(255,255,255,.68); font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; }
.eyebrow-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 0 5px rgba(200,240,75,.1); }
.hero h1 { max-width: 790px; font-family: var(--font-display); font-size: clamp(4.4rem, 7.4vw, 8.6rem); line-height: .89; letter-spacing: -.075em; font-weight: 500; }
.hero h1 em { font-family: var(--font-serif); font-weight: 400; letter-spacing: -.04em; color: var(--acid); }
.hero-copy { max-width: 610px; margin-top: 37px; color: rgba(255,255,255,.72); font-size: clamp(1rem, 1.3vw, 1.18rem); line-height: 1.7; }
.hero-actions { display: flex; align-items: center; gap: 32px; margin-top: 36px; }
.button { min-height: 52px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: space-between; gap: 38px; font-size: .78rem; letter-spacing: .05em; text-transform: uppercase; transition: transform .25s var(--ease), background .25s ease, color .25s ease; }
.button:hover { transform: translateY(-2px); }
.button svg { width: 17px; }
.button-light { color: var(--ink); background: var(--white); }
.button-light:hover { background: var(--acid); }
.text-link { display: inline-flex; align-items: center; gap: 12px; color: rgba(255,255,255,.76); font-size: .8rem; border-bottom: 1px solid rgba(255,255,255,.35); padding-bottom: 5px; }
.text-link svg { width: 15px; transition: transform .25s var(--ease); }
.text-link:hover svg { transform: translateX(4px); }
.hero-status { position: absolute; z-index: 2; right: max(32px, calc((100vw - 1380px) / 2)); bottom: 38px; display: flex; align-items: center; gap: 16px; color: rgba(255,255,255,.58); font-size: .68rem; letter-spacing: .09em; text-transform: uppercase; }
.hero-status > div:first-child { display: flex; align-items: center; gap: 9px; color: rgba(255,255,255,.83); }
.status-light { width: 6px; height: 6px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 0 4px rgba(200,240,75,.11); animation: pulse 2s infinite; }
.status-rule { width: 42px; height: 1px; background: rgba(255,255,255,.24); }
@keyframes pulse { 50% { opacity: .45; } }

.assurance-strip { background: var(--ink); color: var(--white); border-top: 1px solid var(--line-light); }
.assurance-inner { width: var(--page); margin: auto; display: grid; grid-template-columns: repeat(4, 1fr); }
.assurance-inner > div { min-height: 112px; padding: 25px 26px 22px 0; display: flex; align-items: flex-start; gap: 19px; border-right: 1px solid var(--line-light); }
.assurance-inner > div:not(:first-child) { padding-left: 26px; }
.assurance-inner > div:last-child { border-right: 0; }
.assurance-index, .case-index, .capability-number, .process-number { color: var(--muted); font-size: .64rem; letter-spacing: .12em; }
.assurance-inner p { max-width: 190px; font-size: .8rem; line-height: 1.45; letter-spacing: .02em; }

.section { width: var(--page); margin: auto; padding: 140px 0; }
.section-grid { display: grid; grid-template-columns: 1fr 3fr; gap: 40px; }
.section-kicker { display: flex; align-items: flex-start; gap: 16px; padding-top: 12px; color: var(--muted); font-size: .68rem; text-transform: uppercase; letter-spacing: .14em; }
.section-kicker span { color: var(--ink); }
.section-kicker.inline { padding: 0; margin-bottom: 34px; }
.section-kicker.light, .section-kicker.light span { color: rgba(255,255,255,.55); }
.intro-copy h2, .section-heading h2, .architecture-copy h2, .contact-content h2 { font-family: var(--font-display); font-weight: 400; letter-spacing: -.055em; }
.intro-copy h2 { max-width: 980px; font-size: clamp(2.8rem, 5.2vw, 5.6rem); line-height: 1.04; }
.intro-copy > p { max-width: 650px; margin: 38px 0 0 auto; color: #555a53; font-size: 1.05rem; line-height: 1.75; }
.capability-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 100px; background: var(--line); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.capability { min-height: 335px; padding: 36px; display: flex; flex-direction: column; justify-content: space-between; background: var(--paper); transition: background .35s ease; }
.capability:hover { background: var(--paper-soft); }
.capability > svg, .capability > i { width: 30px; height: 30px; color: #4d524b; font-size: 1.55rem; }
.capability-number { display: block; margin-bottom: 18px; }
.capability h3 { font-family: var(--font-display); font-size: 1.6rem; font-weight: 500; letter-spacing: -.04em; }
.capability p { max-width: 330px; margin-top: 14px; color: #656a62; font-size: .91rem; line-height: 1.65; }

.applications { border-top: 1px solid var(--line); }
.section-heading { display: grid; grid-template-columns: 1fr 3fr; gap: 40px; align-items: start; margin-bottom: 70px; }
.section-heading .section-kicker { margin: 15px 0 0; }
.section-heading h2 { max-width: 950px; font-size: clamp(2.6rem, 4.8vw, 5.1rem); line-height: 1.05; }
.case-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.case-card { background: var(--ink); color: var(--white); overflow: hidden; }
.case-card-large { grid-column: 1 / -1; }
.case-media { position: relative; aspect-ratio: 16 / 9; overflow: hidden; }
.case-card-large .case-media { aspect-ratio: 2.25 / 1; }
.case-media img, .case-media video { width: 100%; height: 100%; object-fit: cover; filter: saturate(.62) contrast(1.06); transition: transform 1s var(--ease), filter .6s ease; }
.case-card:hover .case-media img, .case-card:hover .case-media video { transform: scale(1.025); filter: saturate(.85) contrast(1.02); }
.case-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(7,9,8,.58), transparent 52%); }
.case-tag { position: absolute; left: 24px; top: 22px; display: inline-flex; align-items: center; gap: 9px; padding: 8px 11px; background: rgba(9,11,10,.76); backdrop-filter: blur(10px); font-size: .65rem; letter-spacing: .09em; text-transform: uppercase; }
.case-tag span { width: 5px; height: 5px; border-radius: 50%; background: var(--acid); }
.case-tag b { font-weight: 500; }
.case-body { min-height: 235px; padding: 35px 38px 38px; display: grid; grid-template-columns: 1.6fr 1fr; align-items: end; gap: 50px; }
.case-body h3 { max-width: 620px; margin-top: 17px; font-family: var(--font-display); font-size: clamp(1.8rem, 3.3vw, 3.6rem); font-weight: 400; line-height: 1.08; letter-spacing: -.05em; }
.case-body p { color: rgba(255,255,255,.58); font-size: .92rem; line-height: 1.7; }
.case-body.compact { min-height: 280px; display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
.case-body.compact h3 { margin-top: auto; padding-top: 54px; font-size: clamp(1.6rem, 2.3vw, 2.6rem); }
.case-body.compact p { max-width: 470px; margin-top: 20px; }

.architecture { width: 100%; padding: 0; background: var(--ink-soft); color: var(--white); }
.architecture-layout { width: var(--page); min-height: 770px; margin: auto; padding: 130px 0; display: grid; grid-template-columns: .92fr 1.45fr; gap: clamp(70px, 9vw, 150px); align-items: center; }
.architecture-copy h2 { max-width: 520px; font-size: clamp(3rem, 5vw, 5.4rem); line-height: .98; }
.architecture-copy > p { max-width: 560px; margin: 31px 0 35px; color: rgba(255,255,255,.6); line-height: 1.75; }
.button-accent { background: var(--acid); color: var(--ink); }
.button-accent:hover { background: var(--white); }
.architecture-diagram { border: 1px solid var(--line-light); background: rgba(255,255,255,.018); }
.diagram-label { padding: 19px 22px; border-bottom: 1px solid var(--line-light); color: rgba(255,255,255,.46); font-size: .66rem; letter-spacing: .13em; text-transform: uppercase; }
.diagram-stage { min-height: 330px; padding: 56px 35px 44px; display: flex; align-items: center; }
.diagram-node { width: 142px; flex: 0 0 142px; text-align: center; }
.node-icon { width: 88px; height: 88px; margin: 0 auto 18px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; }
.node-icon svg, .node-icon i { width: 27px; color: rgba(255,255,255,.72); font-size: 1.35rem; }
.diagram-node.active .node-icon { border-color: var(--acid); background: var(--acid); box-shadow: 0 0 50px rgba(200,240,75,.12); }
.diagram-node.active .node-icon svg, .diagram-node.active .node-icon i { color: var(--ink); }
.diagram-node > span { display: block; font-size: .83rem; }
.diagram-node small { display: block; margin-top: 4px; color: rgba(255,255,255,.36); font-size: .65rem; }
.diagram-connector { flex: 1; display: flex; align-items: center; margin: -42px -6px 0; color: rgba(255,255,255,.28); }
.diagram-connector span { width: 100%; height: 1px; background: rgba(255,255,255,.17); }
.diagram-connector svg { width: 14px; margin-left: -5px; }
.privacy-boundary { padding: 18px 22px; display: flex; align-items: center; gap: 12px; border-top: 1px solid var(--line-light); color: rgba(255,255,255,.48); font-size: .68rem; letter-spacing: .03em; }
.privacy-boundary svg, .privacy-boundary i { width: 17px; color: var(--acid); }

.section-heading.narrow { grid-template-columns: 1fr 2fr; }
.section-heading.narrow h2 { max-width: 850px; }
.process-list { border-top: 1px solid var(--line); }
.process-item { display: grid; grid-template-columns: 1fr 4fr auto; gap: 32px; align-items: center; min-height: 174px; padding: 30px 18px 30px 0; border-bottom: 1px solid var(--line); transition: padding .3s var(--ease), background .3s ease; }
.process-item:hover { padding-left: 18px; background: var(--paper-soft); }
.process-item h3 { font-family: var(--font-display); font-size: 1.45rem; font-weight: 500; letter-spacing: -.035em; }
.process-item p { margin-top: 9px; color: #666b63; font-size: .9rem; }
.process-item > svg, .process-item > i { width: 21px; color: #70746d; }

.contact { padding-top: 40px; }
.contact-panel { min-height: 570px; padding: 34px 40px 44px; display: flex; flex-direction: column; background: var(--acid); }
.contact-topline { display: flex; justify-content: space-between; padding-bottom: 25px; border-bottom: 1px solid rgba(11,13,12,.25); font-size: .67rem; letter-spacing: .13em; text-transform: uppercase; }
.contact-content { display: grid; grid-template-columns: 1.7fr .72fr; gap: 90px; align-items: end; margin-top: auto; }
.contact-content h2 { max-width: 940px; font-size: clamp(3.4rem, 6.8vw, 7.2rem); line-height: .91; }
.contact-action p { margin-bottom: 30px; font-size: .94rem; line-height: 1.7; }
.button-dark { color: var(--white); background: var(--ink); }
.button-dark:hover { background: var(--ink-soft); }

.site-footer { width: var(--page); margin: auto; padding: 25px 0 35px; }
.footer-main { min-height: 240px; display: grid; grid-template-columns: .8fr 1.2fr 1.7fr; align-items: center; gap: 50px; }
.footer-brand { font-size: 1.45rem; }
.footer-main > p { max-width: 320px; color: #686d65; font-size: .88rem; }
.footer-links { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 14px 28px; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.footer-links a { border-bottom: 1px solid transparent; }
.footer-links a:hover { border-color: currentColor; }
.footer-bottom { padding-top: 24px; display: flex; justify-content: space-between; border-top: 1px solid var(--line); color: #777b74; font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }

.reveal { opacity: 1; transform: none; }
.reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .reveal { opacity: 1; transform: none; transition: none; } .status-light { animation: none; } }

@media (max-width: 1100px) {
  :root { --page: calc(100vw - 48px); }
  .desktop-nav { display: none; }
  .nav-shell { grid-template-columns: 1fr 1fr; }
  .menu-toggle { display: block; }
  .nav-cta { display: none; }
  .mobile-menu { position: fixed; inset: 86px 0 auto; padding: 30px 24px 40px; display: flex; flex-direction: column; gap: 2px; color: var(--ink); background: var(--paper); border-top: 1px solid var(--line); transform: translateY(-120%); opacity: 0; pointer-events: none; transition: transform .4s var(--ease), opacity .25s ease; }
  .mobile-menu.active { transform: none; opacity: 1; pointer-events: auto; }
  .mobile-menu a { padding: 16px 0; border-bottom: 1px solid var(--line); font-family: var(--font-display); font-size: 1.2rem; }
  .section-grid, .section-heading { grid-template-columns: .6fr 2.4fr; }
  .architecture-layout { grid-template-columns: 1fr; }
  .architecture-copy { max-width: 720px; }
  .contact-content { grid-template-columns: 1.45fr .7fr; gap: 50px; }
  .footer-main { grid-template-columns: 1fr 1fr; }
  .footer-links { grid-column: 1 / -1; justify-content: flex-start; }
}

@media (max-width: 760px) {
  :root { --page: calc(100vw - 32px); }
  .nav-shell { height: 72px; }
  .mobile-menu { top: 72px; }
  .hero { min-height: 720px; }
  .hero-scrim { background: linear-gradient(90deg, rgba(5,7,6,.92), rgba(5,7,6,.55)), linear-gradient(0deg, rgba(5,7,6,.78), transparent 55%); }
  .hero-content { padding-top: 152px; }
  .hero h1 { font-size: clamp(3.65rem, 18vw, 5.5rem); }
  .hero-copy { max-width: 94%; font-size: .96rem; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 23px; }
  .hero-status { left: 16px; right: auto; bottom: 24px; }
  .hero-status > span:last-child, .status-rule { display: none; }
  .assurance-inner { grid-template-columns: 1fr 1fr; }
  .assurance-inner > div { min-height: 96px; padding: 20px 12px 20px 0; }
  .assurance-inner > div:not(:first-child) { padding-left: 14px; }
  .assurance-inner > div:nth-child(2) { border-right: 0; }
  .assurance-inner > div:nth-child(-n+2) { border-bottom: 1px solid var(--line-light); }
  .assurance-inner p { font-size: .7rem; }
  .section { padding: 95px 0; }
  .section-grid, .section-heading, .section-heading.narrow { grid-template-columns: 1fr; gap: 30px; }
  .section-kicker, .section-heading .section-kicker { margin: 0; }
  .intro-copy h2, .section-heading h2 { font-size: clamp(2.65rem, 12vw, 4rem); }
  .intro-copy > p { margin: 28px 0 0; }
  .capability-grid { grid-template-columns: 1fr; margin-top: 65px; }
  .capability { min-height: 260px; padding: 28px 24px; }
  .case-grid { grid-template-columns: 1fr; }
  .case-card-large { grid-column: auto; }
  .case-card-large .case-media, .case-media { aspect-ratio: 1.12 / 1; }
  .case-body, .case-body.compact { min-height: auto; padding: 28px 24px 32px; display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
  .case-body h3, .case-body.compact h3 { margin-top: 35px; padding-top: 0; font-size: 2rem; }
  .case-body p, .case-body.compact p { margin-top: 20px; }
  .architecture-layout { min-height: auto; padding: 95px 0; gap: 70px; }
  .architecture-copy h2 { font-size: clamp(3rem, 14vw, 4.4rem); }
  .architecture-diagram { overflow: hidden; }
  .diagram-stage { min-height: 520px; padding: 40px 25px; flex-direction: column; }
  .diagram-connector { width: 1px; min-height: 46px; flex-direction: column; margin: 0; }
  .diagram-connector span { width: 1px; height: 100%; }
  .diagram-connector svg { transform: rotate(90deg); margin: -5px 0 0; }
  .node-icon { width: 72px; height: 72px; margin-bottom: 12px; }
  .process-item { grid-template-columns: 42px 1fr; gap: 14px; padding-right: 0; }
  .process-item > svg, .process-item > i { display: none; }
  .contact { padding-top: 20px; }
  .contact-panel { min-height: 570px; padding: 26px 22px 30px; }
  .contact-topline span:last-child { display: none; }
  .contact-content { grid-template-columns: 1fr; gap: 35px; }
  .contact-content h2 { font-size: clamp(3rem, 15vw, 5rem); }
  .contact-action .button { width: 100%; }
  .footer-main { padding: 55px 0; grid-template-columns: 1fr; gap: 26px; }
  .footer-links { grid-column: auto; justify-content: flex-start; }
  .footer-bottom { align-items: flex-start; flex-direction: column; gap: 9px; }
}