:root {
  --black: #05090c;
  --panel: #0a1115;
  --panel-2: #0d171b;
  --steel: #111e23;
  --green: #78f7a9;
  --green-soft: #42c87a;
  --amber: #e5a63d;
  --white: #f1f7f3;
  --text: #b5c2bb;
  --muted: #77867e;
  --line: rgba(132, 241, 178, .14);
  --line-bright: rgba(132, 241, 178, .36);
  --display: "Bahnschrift Condensed", "Arial Narrow", sans-serif;
  --body: "Segoe UI Variable Text", "Segoe UI", Arial, sans-serif;
  font-family: var(--body);
  color: var(--text);
  background: var(--black);
  scroll-behavior: auto;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { scroll-padding-top: 82px; }
body { margin: 0; overflow-x: hidden; background: var(--black); }
a { color: inherit; }
img { max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
.skip-link { position: fixed; left: 16px; top: -60px; z-index: 100; padding: 12px 18px; color: var(--black); background: var(--green); font-weight: 700; text-decoration: none; }
.skip-link:focus { top: 12px; }

.site-header { height: 88px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 clamp(22px, 4.5vw, 78px); position: fixed; inset: 0 0 auto; z-index: 50; isolation: isolate; border-bottom: 1px solid rgba(136, 247, 182, .14); background: rgba(3,8,10,.985); box-shadow: 0 8px 28px rgba(0,0,0,.18); }
.brand { display: flex; align-items: center; gap: 15px; justify-self: start; color: var(--white); text-decoration: none; letter-spacing: .1em; }
.brand > span { white-space: nowrap; }
.brand img { width: 58px; height: 58px; object-fit: contain; filter: drop-shadow(0 0 15px rgba(103,248,165,.12)); }
.brand strong, .brand small { display: block; }
.brand strong { font: 700 20px/1 var(--display); }
.brand small { margin-top: 5px; color: var(--green); font: 700 12px/1 var(--body); }
nav { display: flex; align-items: center; gap: clamp(20px, 2.5vw, 42px); }
nav a { position: relative; padding: 34px 0; color: #a8b8b0; font: 700 12px/1 var(--body); letter-spacing: .13em; text-decoration: none; text-transform: uppercase; }
nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 20px; height: 1px; background: var(--green); transition: right .2s ease; }
nav a:hover, nav a:focus-visible { color: var(--white); }
nav a:hover::after, nav a:focus-visible::after { right: 0; }
.header-tools { justify-self: end; display: flex; align-items: center; gap: 28px; }
.header-cta { color: #aebdb5; font: 700 11px/1 var(--body); letter-spacing: .14em; text-decoration: none; white-space: nowrap; }
.header-cta b { font: inherit; }
.header-cta span { display: inline-block; width: 7px; height: 7px; margin-right: 9px; border-radius: 50%; background: var(--green); box-shadow: 0 0 12px var(--green); }
.language-switch { display: flex; align-items: center; gap: 7px; padding: 7px 9px; border: 1px solid var(--line); background: rgba(7,15,18,.72); }
.language-switch button { padding: 1px; color: #899990; border: 0; background: transparent; cursor: pointer; font: 700 11px/1 var(--body); letter-spacing: .1em; }
.language-switch button:hover, .language-switch button:focus-visible, .language-switch button.active { color: var(--green); }
.language-switch button.active { text-shadow: 0 0 10px rgba(120,247,169,.45); }
.language-switch > span { color: #57655d; font: 600 11px/1 var(--body); }

.hero { min-height: 100vh; position: relative; display: grid; align-items: center; overflow: hidden; border-bottom: 1px solid var(--line); background: #03070a; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: 1; opacity: .3; pointer-events: none; background-image: linear-gradient(rgba(111,255,169,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(111,255,169,.07) 1px, transparent 1px); background-size: 78px 78px; mask-image: linear-gradient(90deg, #000, transparent 66%); }
.hero::after { content: ""; position: absolute; inset: auto 0 0; height: 26%; z-index: 1; background: linear-gradient(transparent, var(--black)); pointer-events: none; }
.hero-art { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(2,6,8,.98) 0%, rgba(2,6,8,.86) 32%, rgba(2,6,8,.24) 62%, rgba(2,6,8,.05) 100%), linear-gradient(0deg, rgba(3,7,9,.92), transparent 40%), url("f16-night-ops-hero-v2.png") 65% center/cover no-repeat; transform: none; animation: none; }
.development-marker { position: absolute; right: clamp(24px, 4.5vw, 78px); top: 112px; z-index: 6; min-width: 260px; display: grid; grid-template-columns: 46px 1fr; align-items: center; gap: 14px; padding: 13px 16px; border: 1px solid rgba(229,166,61,.55); border-left: 4px solid var(--amber); background: rgba(7,13,15,.96); box-shadow: 0 14px 35px rgba(0,0,0,.35), inset 0 0 28px rgba(229,166,61,.035); }
.development-marker > span:last-child { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 5px 14px; }
.development-marker small { grid-column: 1 / -1; color: #a99878; font: 700 9px/1 var(--body); letter-spacing: .16em; }
.development-marker strong { color: var(--white); font: 700 17px/1 var(--display); letter-spacing: .06em; }
.development-marker b { padding: 5px 7px; color: #171005; background: var(--amber); font: 800 9px/1 var(--body); letter-spacing: .1em; }
.marker-icon { width: 42px; height: 42px; position: relative; display: grid; place-items: center; border: 1px solid rgba(229,166,61,.45); transform: rotate(45deg); }
.marker-icon::before, .marker-icon::after { content: ""; position: absolute; background: var(--amber); }
.marker-icon::before { width: 22px; height: 5px; border-radius: 1px; transform: rotate(-45deg); box-shadow: 0 0 10px rgba(229,166,61,.35); }
.marker-icon::after { width: 7px; height: 7px; right: 7px; bottom: 7px; }
.marker-icon i { width: 13px; height: 2px; position: absolute; left: 3px; bottom: 9px; background: rgba(229,166,61,.55); transform: rotate(-45deg); }
.hero-copy { position: relative; z-index: 3; width: min(790px, calc(100% - 48px)); margin: 86px 0 0 clamp(24px, 7.7vw, 138px); padding: 80px 0 115px; }
.eyebrow { margin: 0 0 22px; color: var(--green); font: 700 12px/1.4 var(--body); letter-spacing: .18em; text-transform: uppercase; }
.status-dot { display: inline-block; width: 7px; height: 7px; margin-right: 9px; border-radius: 50%; background: var(--green); box-shadow: 0 0 14px var(--green); }
h1 { margin-bottom: 27px; color: var(--white); font: 800 clamp(66px, 8.3vw, 132px)/.82 var(--display); letter-spacing: -.045em; text-transform: uppercase; }
h1 span, h2 span, .community h2 span { color: transparent; -webkit-text-stroke: 1px rgba(120,247,169,.78); }
.lead { max-width: 670px; color: #b3c2ba; font-size: clamp(16px, 1.55vw, 20px); line-height: 1.72; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 34px 0 0; }
.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; padding: 13px 22px; border: 1px solid var(--line-bright); border-radius: 1px; font: 700 11px/1 var(--body); letter-spacing: .11em; text-decoration: none; text-transform: uppercase; transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease; }
.button:hover, .button:focus-visible { transform: translateY(-2px); box-shadow: 0 12px 35px rgba(0,0,0,.34); }
.button.primary { color: #041009; border-color: var(--green); background: var(--green); box-shadow: 0 0 28px rgba(82,242,148,.1); }
.button.primary:hover { box-shadow: 0 0 38px rgba(82,242,148,.22); }
.button.ghost { color: #d5e0da; border-color: rgba(213,224,218,.25); background: rgba(3,8,10,.92); }
.button.outline { color: var(--green); background: transparent; }
.button.full { width: 100%; margin-top: 23px; }
.mission-status { display: flex; flex-wrap: wrap; gap: 25px; margin-top: 34px; color: #9baaa2; font: 700 11px/1 var(--body); letter-spacing: .12em; }
.mission-status b { margin-right: 7px; color: var(--amber); }
.hero-telemetry { position: absolute; right: 32px; top: 50%; z-index: 3; display: flex; gap: 30px; color: rgba(156,246,192,.62); font: 600 10px/1 var(--body); letter-spacing: .15em; writing-mode: vertical-rl; }
.scroll-cue { position: absolute; z-index: 4; left: clamp(24px, 7.7vw, 138px); bottom: 28px; display: flex; align-items: center; gap: 12px; color: #94a49b; font: 700 10px/1 var(--body); letter-spacing: .14em; text-decoration: none; }
.scroll-cue span { width: 38px; height: 1px; background: var(--green); position: relative; }
.scroll-cue span::after { content: ""; width: 5px; height: 5px; border-right: 1px solid var(--green); border-bottom: 1px solid var(--green); position: absolute; right: 0; top: -2px; transform: rotate(-45deg); }
.radar-scope { width: 300px; height: 300px; position: absolute; left: -145px; top: 22%; z-index: 2; border: 1px solid rgba(113,247,168,.12); border-radius: 50%; }
.radar-scope::before, .radar-scope::after, .radar-scope i { content: ""; position: absolute; inset: 24%; border: inherit; border-radius: inherit; }
.radar-scope::after { inset: 48%; }
.radar-scope i:nth-child(1) { inset: 50% -30%; height: 1px; border: 0; border-top: 1px solid rgba(113,247,168,.13); border-radius: 0; }
.radar-scope i:nth-child(2) { inset: -30% 50%; width: 1px; border: 0; border-left: 1px solid rgba(113,247,168,.13); border-radius: 0; }

.signal-bar { min-height: 58px; display: flex; align-items: center; justify-content: center; gap: clamp(13px, 2.5vw, 38px); padding: 15px 24px; overflow: hidden; color: #9baaa2; border-bottom: 1px solid var(--line); background: #071014; font: 700 10px/1 var(--body); letter-spacing: .15em; white-space: nowrap; }
.signal-bar i { width: 4px; height: 4px; flex: none; border-radius: 50%; background: var(--amber); box-shadow: 0 0 10px rgba(229,166,61,.5); }

.section { padding: 120px clamp(24px, 7.7vw, 138px); position: relative; }
.section-intro { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(280px, .75fr); align-items: end; gap: 8vw; margin-bottom: 60px; }
h2 { margin-bottom: 0; color: var(--white); font: 700 clamp(46px, 6vw, 82px)/.92 var(--display); letter-spacing: -.035em; text-transform: uppercase; }
.section-intro > p, .flow-heading > p:last-child { max-width: 580px; margin-bottom: 5px; color: var(--muted); font-size: 15px; line-height: 1.75; }
.news-section { overflow: hidden; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 10% 18%, rgba(56,166,104,.1), transparent 30%), radial-gradient(circle at 88% 76%, rgba(99,211,239,.08), transparent 28%), #050b0e; }
.news-section::before { content: "UPDATE / 2026"; position: absolute; right: 4vw; top: 42px; color: transparent; opacity: .48; font: 800 clamp(74px, 10vw, 170px)/1 var(--display); letter-spacing: -.04em; -webkit-text-stroke: 1px rgba(120,247,169,.08); pointer-events: none; }
.news-grid { position: relative; z-index: 1; max-width: 1400px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.news-card { min-height: 540px; position: relative; overflow: hidden; display: flex; flex-direction: column; padding: clamp(28px, 3vw, 42px); border: 1px solid var(--line-bright); background: linear-gradient(145deg, rgba(16,31,36,.96), rgba(6,13,17,.98)); box-shadow: 0 24px 55px rgba(0,0,0,.25); }
.news-card::before { content: ""; width: 150px; height: 150px; position: absolute; right: -82px; top: -82px; border: 1px solid rgba(120,247,169,.22); transform: rotate(45deg); }
.news-card.dcs-news { border-color: rgba(99,211,239,.38); background: linear-gradient(145deg, rgba(12,29,36,.98), rgba(5,13,17,.98)); }
.news-card.dcs-news::before { border-color: rgba(99,211,239,.3); }
.news-card-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.news-channel { padding: 8px 10px; color: #041009; background: var(--green); font: 800 9px/1 var(--body); letter-spacing: .14em; }
.dcs-news .news-channel { background: #63d3ef; }
.news-card time { color: #829089; font: 700 9px/1 var(--body); letter-spacing: .13em; }
.news-version-row { min-height: 58px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 22px; margin: 26px 0 30px; padding: 13px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--green); font: 700 10px/1.4 var(--body); letter-spacing: .11em; }
.dcs-news .news-version-row { color: #63d3ef; border-color: rgba(99,211,239,.16); }
.news-version-row b { color: #9baaa2; font: inherit; }
.news-version-row em { color: var(--white); font-style: normal; }
.news-card h3 { max-width: 720px; margin-bottom: 18px; color: var(--white); font: 700 clamp(30px, 3vw, 44px)/1 var(--display); text-transform: uppercase; }
.news-card > p { color: #9caaa3; font-size: 14px; line-height: 1.72; }
.news-card ul { flex: 1; display: grid; align-content: start; gap: 11px; margin: 8px 0 28px; padding: 0; list-style: none; }
.news-card li { position: relative; padding-left: 24px; color: #c0cbc5; font-size: 13px; line-height: 1.55; }
.news-card li::before { content: ""; width: 8px; height: 8px; position: absolute; left: 0; top: .48em; border: 1px solid var(--green); box-shadow: inset 0 0 0 2px #071014; background: var(--green); }
.dcs-news li::before { border-color: #63d3ef; background: #63d3ef; }
.news-card .button { width: fit-content; min-width: min(100%, 290px); }
.release-boundary { max-width: 1400px; display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 18px; margin-top: 18px; padding: 20px 24px; border: 1px solid rgba(229,166,61,.22); background: rgba(229,166,61,.045); }
.release-boundary > span { width: 38px; height: 38px; display: grid; place-items: center; color: var(--amber); border: 1px solid rgba(229,166,61,.5); font: 800 17px/1 var(--display); }
.release-boundary p { margin: 0; color: #a69f8d; font-size: 12px; line-height: 1.65; }
.release-boundary strong { color: #ddd6c4; }
.download-section { background: radial-gradient(circle at 78% 12%, rgba(56,166,104,.07), transparent 28%), #071014; border-bottom: 1px solid var(--line); }
.download-grid { max-width: 1600px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.download-card { position: relative; overflow: hidden; display: flex; flex-direction: column; padding: 24px 21px; border: 1px solid var(--line); background: linear-gradient(145deg, rgba(16,31,36,.96), rgba(7,14,18,.97)); box-shadow: 0 20px 48px rgba(0,0,0,.22); }
.download-card::before { content: ""; width: 84px; height: 84px; position: absolute; right: -43px; top: -43px; border: 1px solid rgba(119,245,168,.2); transform: rotate(45deg); }
.client-card { background: linear-gradient(145deg, rgba(24,27,27,.96), rgba(8,13,15,.98)); }
.client-card::before { border-color: rgba(229,166,61,.3); }
.dcs-card { background: linear-gradient(145deg, rgba(12,28,35,.97), rgba(6,13,17,.98)); }
.dcs-card::before { border-color: rgba(99,211,239,.34); }
.card-id { min-height: 20px; display: flex; justify-content: space-between; gap: 10px; color: #91a098; font: 700 9px/1.2 var(--body); letter-spacing: .12em; }
.version { color: var(--green); }
.client-card .version { color: var(--amber); }
.dcs-card .version { color: #63d3ef; }
.card-title { display: grid; grid-template-columns: 38px 1fr; align-items: center; gap: 11px; margin: 24px 0 14px; }
.card-title > span { color: transparent; font: 700 35px/1 var(--display); -webkit-text-stroke: 1px rgba(120,247,169,.42); }
.client-card .card-title > span { -webkit-text-stroke-color: rgba(229,166,61,.45); }
.dcs-card .card-title > span { -webkit-text-stroke-color: rgba(99,211,239,.5); }
.card-title p { margin-bottom: 5px; color: #91a098; font: 700 9px/1.2 var(--body); letter-spacing: .1em; }
.card-title h3 { margin: 0; color: var(--white); font: 700 clamp(21px, 1.7vw, 28px)/.98 var(--display); text-transform: uppercase; }
.role { min-height: 58px; color: #9caaa3; font-size: 12px; line-height: 1.55; }
.download-card ul { min-height: 130px; flex: 1; margin: 17px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.download-card li { display: grid; grid-template-columns: 25px 1fr; gap: 7px; padding: 10px 0; color: #b4c1ba; border-bottom: 1px solid rgba(125,231,168,.08); font-size: 12px; line-height: 1.4; }
.download-card li span { color: var(--green); font: 700 9px/1.5 var(--body); letter-spacing: .08em; }
.download-card li b { font: inherit; }
.client-card li span { color: var(--amber); }
.dcs-card li span { color: #63d3ef; }
.download-card .button { min-height: 50px; gap: 16px; padding: 13px 17px; font-size: 13px; font-weight: 800; line-height: 1.2; letter-spacing: .09em; }
.download-card .button.full { margin-top: 17px; }
.button.dcs { color: #041014; border-color: #63d3ef; background: #63d3ef; box-shadow: 0 0 28px rgba(99,211,239,.1); }
.dcs-card .button.outline { color: #63d3ef; border-color: rgba(99,211,239,.45); }
.file-meta { margin: 11px 0 0; color: #87978f; font: 700 8px/1 var(--body); letter-spacing: .1em; text-align: center; }
.viewer-download-heading { max-width: 1600px; display: grid; grid-template-columns: 1fr minmax(280px, .65fr); align-items: end; gap: 40px; margin-top: 58px; padding-top: 28px; border-top: 1px solid var(--line); }
.viewer-download-heading h3 { margin: 5px 0 0; color: var(--white); font: 700 clamp(30px, 3.2vw, 48px)/.96 var(--display); text-transform: uppercase; }
.viewer-download-heading > p { max-width: 620px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.viewer-download-grid { max-width: 1600px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 24px; }
.mfd-card { min-height: 475px; background: linear-gradient(145deg, rgba(13,30,32,.98), rgba(6,14,17,.98)); }
.mfd-dx9-card::before { border-color: rgba(229,166,61,.38); }
.mfd-dx9-card .version, .mfd-dx9-card li span { color: var(--amber); }
.mfd-dx9-card .card-title > span { -webkit-text-stroke-color: rgba(229,166,61,.52); }
.mfd-dx9-card .button.outline { color: var(--amber); border-color: rgba(229,166,61,.48); }
.mfd-dx11-card { box-shadow: inset 0 0 40px rgba(120,247,169,.035), 0 20px 48px rgba(0,0,0,.22); }
.mfd-gdi-card::before { border-color: rgba(99,211,239,.38); }
.mfd-gdi-card .version, .mfd-gdi-card li span { color: #63d3ef; }
.mfd-gdi-card .card-title > span { -webkit-text-stroke-color: rgba(99,211,239,.52); }
.mfd-gdi-card .button.outline { color: #63d3ef; border-color: rgba(99,211,239,.48); }
.viewer-manuals { max-width: 1600px; display: grid; grid-template-columns: minmax(280px,.58fr) minmax(560px,1.42fr); align-items: stretch; gap: clamp(24px,3vw,48px); margin-top: 30px; padding: clamp(26px,3vw,42px); overflow: hidden; position: relative; border: 1px solid rgba(120,247,169,.42); border-left: 5px solid var(--green); background: radial-gradient(circle at 0 50%, rgba(120,247,169,.12), transparent 35%), #071014; box-shadow: inset 0 0 50px rgba(120,247,169,.025), 0 18px 44px rgba(0,0,0,.18); }
.viewer-manuals::after { content: "PDF"; position: absolute; left: 22px; bottom: -20px; color: rgba(120,247,169,.035); font: 800 104px/1 var(--display); letter-spacing: -.05em; pointer-events: none; }
.viewer-manual-copy { position: relative; z-index: 1; align-self: center; }
.viewer-manual-kicker { display: block; margin-bottom: 12px; color: var(--green); font: 800 10px/1 var(--body); letter-spacing: .17em; }
.viewer-manuals h3 { margin: 0 0 14px; color: var(--white); font: 700 clamp(28px,2.7vw,42px)/.96 var(--display); text-transform: uppercase; }
.viewer-manuals p { max-width: 560px; margin: 0; color: #b8c7bf; font-size: 13px; line-height: 1.65; }
.viewer-manual-actions { display: grid; grid-template-columns: 1fr; gap: 10px; position: relative; z-index: 1; }
.viewer-manual-card { min-height: 108px; display: grid; grid-template-columns: 52px minmax(0,1fr) auto; align-items: center; gap: 17px; padding: 18px 20px; color: inherit; border: 1px solid rgba(120,247,169,.34); background: rgba(11,25,29,.96); text-decoration: none; transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.viewer-manual-card[hidden] { display: none !important; }
.viewer-manual-card:hover, .viewer-manual-card:focus-visible { transform: translateY(-2px); border-color: var(--green); background: rgba(16,36,40,.98); box-shadow: 0 14px 30px rgba(0,0,0,.28); outline: none; }
.viewer-manual-language { width: 52px; height: 52px; display: grid; place-items: center; color: #041009; background: var(--green); font: 800 18px/1 var(--display); }
.viewer-manual-card-copy { min-width: 0; }
.viewer-manual-card-copy small, .viewer-manual-card-copy strong, .viewer-manual-card-copy em { display: block; }
.viewer-manual-card-copy small { margin-bottom: 7px; color: #8ea198; font: 700 8px/1 var(--body); letter-spacing: .13em; }
.viewer-manual-card-copy strong { color: var(--white); font: 700 clamp(18px,1.35vw,23px)/1 var(--display); text-transform: uppercase; }
.viewer-manual-card-copy em { margin-top: 10px; color: var(--green); font: normal 700 9px/1 var(--body); letter-spacing: .11em; text-transform: uppercase; }
.viewer-manual-card > b { color: var(--green); font: 400 21px/1 var(--body); }
.viewer-manual-en { border-color: rgba(99,211,239,.32); }
.viewer-manual-en .viewer-manual-language { background: #63d3ef; }
.viewer-manual-en .viewer-manual-card-copy em, .viewer-manual-en > b { color: #63d3ef; }
.viewer-manual-en:hover, .viewer-manual-en:focus-visible { border-color: #63d3ef; }
.intel-note { max-width: 1280px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 26px; margin-top: 18px; padding: 20px 24px; border: 1px solid rgba(229,166,61,.2); background: rgba(229,166,61,.04); }
.intel-label { padding: 9px 11px; color: #111; background: var(--amber); font: 800 10px/1 var(--body); letter-spacing: .13em; }
.intel-note p { margin: 0; color: #9d9d90; font-size: 12px; line-height: 1.6; }
.intel-note strong { color: #d8d4c6; }
.intel-code { color: #aa9874; font: 700 10px/1 var(--body); letter-spacing: .12em; }

.microcontroller-section { --hardware-cyan: #63d3ef; position: relative; overflow: hidden; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 15% 42%, rgba(99,211,239,.09), transparent 30%), radial-gradient(circle at 82% 20%, rgba(120,247,169,.08), transparent 24%), #061014; }
.microcontroller-section::before { content: ""; position: absolute; inset: 0; opacity: .2; pointer-events: none; background-image: linear-gradient(rgba(99,211,239,.055) 1px, transparent 1px), linear-gradient(90deg, rgba(99,211,239,.055) 1px, transparent 1px); background-size: 56px 56px; mask-image: linear-gradient(90deg, #000, transparent 74%); }
.microcontroller-section > * { position: relative; z-index: 1; }
.microcontroller-stage { max-width: 1600px; display: grid; grid-template-columns: minmax(0,1.18fr) minmax(360px,.82fr); gap: 18px; align-items: stretch; }
.hardware-visual, .microcontroller-copy { border: 1px solid rgba(99,211,239,.24); background: rgba(5,13,17,.93); box-shadow: 0 28px 70px rgba(0,0,0,.28); }
.hardware-visual { min-width: 0; padding: clamp(20px,2.7vw,38px); background: linear-gradient(145deg, rgba(10,27,33,.96), rgba(4,11,15,.98)); }
.hardware-statusbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 18px; color: #8ca09a; border-bottom: 1px solid rgba(99,211,239,.15); font: 800 9px/1 var(--body); letter-spacing: .16em; }
.hardware-statusbar span { display: flex; align-items: center; gap: 9px; }
.hardware-statusbar i { width: 7px; height: 7px; display: inline-block; border-radius: 50%; background: var(--hardware-cyan); box-shadow: 0 0 14px rgba(99,211,239,.8); }
.hardware-statusbar b { color: var(--green); font: inherit; }
.hardware-route { display: grid; grid-template-columns: minmax(0,1fr) 50px minmax(0,1fr) 50px minmax(0,1fr); align-items: center; gap: 8px; margin: 24px 0; }
.hardware-route article { min-width: 0; min-height: 105px; display: flex; flex-direction: column; justify-content: center; padding: 18px; border: 1px solid rgba(99,211,239,.18); background: rgba(7,19,23,.72); }
.hardware-route article.route-core { border-color: rgba(120,247,169,.48); background: radial-gradient(circle at center, rgba(120,247,169,.1), transparent 78%), rgba(8,23,25,.95); box-shadow: inset 0 0 28px rgba(120,247,169,.035); }
.hardware-route small, .hardware-route span { overflow: hidden; color: #718b86; font: 700 7px/1.2 var(--body); letter-spacing: .13em; white-space: nowrap; text-overflow: ellipsis; }
.hardware-route strong { margin: 9px 0 7px; color: var(--white); font: 700 clamp(18px,1.55vw,25px)/1 var(--display); letter-spacing: .035em; }
.hardware-route .route-core strong { color: var(--green); }
.route-pulse { height: 1px; position: relative; background: rgba(99,211,239,.34); }
.route-pulse::before, .route-pulse::after { content: ""; position: absolute; top: 50%; transform: translateY(-50%); }
.route-pulse::before { width: 7px; height: 7px; left: calc(50% - 4px); border-radius: 50%; background: var(--hardware-cyan); box-shadow: 0 0 14px rgba(99,211,239,.8); }
.route-pulse::after { width: 6px; height: 6px; right: 0; border-top: 1px solid var(--hardware-cyan); border-right: 1px solid var(--hardware-cyan); transform: translateY(-50%) rotate(45deg); }
.controller-rack { overflow: hidden; border: 1px solid rgba(120,247,169,.3); background: #050b0e; box-shadow: inset 0 0 40px rgba(120,247,169,.025); }
.controller-rack-head, .controller-rack-foot { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 13px 17px; color: #7e918a; background: rgba(14,29,32,.86); font: 800 8px/1 var(--body); letter-spacing: .13em; }
.controller-rack-head { border-bottom: 1px solid rgba(120,247,169,.16); }
.controller-rack-head span { color: var(--white); }
.controller-rack-head b { color: var(--hardware-cyan); font: inherit; }
.controller-rack-head em { color: var(--green); font: inherit; font-style: normal; }
.controller-rack-body { display: grid; grid-template-columns: minmax(190px,.72fr) minmax(250px,1.28fr); gap: 24px; padding: 24px; }
.led-bank { align-content: center; display: grid; grid-template-columns: repeat(8,1fr); gap: 9px; padding: 20px; border: 1px solid rgba(120,247,169,.12); background: rgba(7,17,19,.82); }
.led-bank span { aspect-ratio: 1; min-width: 8px; max-width: 19px; justify-self: center; width: 100%; border: 1px solid rgba(125,148,138,.4); border-radius: 50%; background: #10191b; box-shadow: inset 0 0 4px #000; }
.led-bank span.is-on { border-color: var(--green); background: var(--green); box-shadow: 0 0 10px rgba(120,247,169,.62), inset 0 0 4px rgba(255,255,255,.6); }
.protocol-screen { min-width: 0; padding: 5px 16px; border: 1px solid rgba(99,211,239,.16); background: linear-gradient(180deg, rgba(4,13,16,.94), rgba(2,8,10,.98)); }
.protocol-screen div { min-width: 0; display: grid; grid-template-columns: minmax(90px,.35fr) minmax(0,1fr); gap: 14px; padding: 11px 0; border-bottom: 1px solid rgba(99,211,239,.09); }
.protocol-screen div:last-child { border-bottom: 0; }
.protocol-screen span { color: #66827d; font: 700 7px/1.3 var(--body); letter-spacing: .12em; }
.protocol-screen b { overflow: hidden; color: var(--hardware-cyan); font: 700 10px/1.3 Consolas, monospace; white-space: nowrap; text-overflow: ellipsis; }
.controller-rack-foot { border-top: 1px solid rgba(120,247,169,.12); color: #60746d; }
.controller-rack-foot span:last-child { color: var(--green); }
.microcontroller-copy { display: flex; flex-direction: column; padding: clamp(27px,3.2vw,48px); border-color: rgba(120,247,169,.3); background: linear-gradient(155deg, rgba(11,28,31,.98), rgba(5,12,15,.99)); }
.microcontroller-copy h3 { max-width: 520px; margin: 13px 0 18px; color: var(--white); font: 700 clamp(36px,3.5vw,56px)/.92 var(--display); text-transform: uppercase; }
.microcontroller-lead { color: #aabbb2; font-size: 13px; line-height: 1.72; }
.hardware-features { margin: 20px 0 24px; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.hardware-features li { display: grid; grid-template-columns: 34px 1fr; gap: 10px; padding: 15px 0; border-bottom: 1px solid var(--line); }
.hardware-features li > span { color: var(--hardware-cyan); font: 700 10px/1.4 var(--body); letter-spacing: .1em; }
.hardware-features b { display: block; margin-bottom: 5px; color: var(--white); font: 700 15px/1 var(--display); letter-spacing: .04em; text-transform: uppercase; }
.hardware-features p { margin: 0; color: #788c83; font-size: 11px; line-height: 1.55; }
.protocol-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: auto 0 18px; }
.protocol-tags span { padding: 7px 9px; color: #88a79e; border: 1px solid rgba(99,211,239,.22); background: rgba(99,211,239,.035); font: 800 8px/1 var(--body); letter-spacing: .11em; }
.microcontroller-copy .simulator-download { min-height: 58px; font-size: 12px; }
.microcontroller-copy .file-meta { line-height: 1.5; }
.simulator-version { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 15px 0 0; padding-top: 14px; color: #70847b; border-top: 1px solid var(--line); font: 700 8px/1 var(--body); letter-spacing: .13em; }
.simulator-version b { color: var(--green); font: inherit; }
.microcontroller-benefits { max-width: 1600px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin-top: 18px; border: 1px solid rgba(99,211,239,.17); background: rgba(99,211,239,.17); }
.microcontroller-benefits article { min-height: 150px; display: grid; grid-template-columns: 52px 1fr; align-items: start; gap: 16px; padding: 27px; background: #081317; }
.microcontroller-benefits article > span { color: transparent; font: 800 35px/1 var(--display); -webkit-text-stroke: 1px rgba(99,211,239,.6); }
.microcontroller-benefits h3 { margin: 2px 0 9px; color: var(--white); font: 700 22px/1 var(--display); text-transform: uppercase; }
.microcontroller-benefits p { margin: 0; color: #74877f; font-size: 11px; line-height: 1.6; }

.systems { background: radial-gradient(circle at 12% 34%, rgba(41,172,97,.07), transparent 30%), var(--black); border-bottom: 1px solid var(--line); }
.systems-layout { max-width: 1400px; display: grid; grid-template-columns: .86fr 1.14fr; gap: 18px; }
.system-feature { min-height: 645px; display: grid; grid-template-rows: 1fr auto; padding: clamp(28px, 3vw, 44px); border: 1px solid var(--line-bright); background: linear-gradient(180deg, rgba(15,29,33,.72), rgba(5,11,14,.92)); }
.system-feature h3, .system-grid h3, .mode-strip h3 { margin: 7px 0 9px; color: var(--white); font: 700 28px/1 var(--display); text-transform: uppercase; }
.system-feature p, .system-grid p, .mode-strip p { color: var(--muted); font-size: 13px; line-height: 1.65; }
.feature-number { margin: 0 !important; color: var(--green) !important; font: 700 9px/1 var(--body) !important; letter-spacing: .15em; }
.hud-frame { min-height: 350px; display: grid; place-content: center; place-items: center; position: relative; overflow: hidden; color: var(--green); border: 1px solid rgba(120,247,169,.14); background: radial-gradient(circle, rgba(74,222,134,.07), transparent 52%); text-shadow: 0 0 10px rgba(120,247,169,.35); }
.hud-frame::before, .hud-frame::after { content: ""; width: 24px; height: 24px; position: absolute; border-color: var(--green); opacity: .7; }
.hud-frame::before { left: 15px; top: 15px; border-left: 1px solid; border-top: 1px solid; }
.hud-frame::after { right: 15px; bottom: 15px; border-right: 1px solid; border-bottom: 1px solid; }
.hud-frame > b { font: 700 76px/.9 var(--display); letter-spacing: .08em; }
.hud-frame > small { margin-top: 10px; font: 600 8px/1 var(--body); letter-spacing: .32em; }
.hud-top, .hud-bottom { position: absolute; left: 20px; right: 20px; color: rgba(120,247,169,.6); font: 600 7px/1 var(--body); letter-spacing: .18em; }
.hud-top { top: 20px; }.hud-bottom { bottom: 20px; text-align: right; }
.hud-reticle { width: 205px; height: 205px; position: absolute; border: 1px solid rgba(120,247,169,.32); border-radius: 50%; }
.hud-reticle::before, .hud-reticle::after { content: ""; position: absolute; background: rgba(120,247,169,.34); }
.hud-reticle::before { width: 1px; height: calc(100% + 56px); left: 50%; top: -28px; }.hud-reticle::after { height: 1px; width: calc(100% + 56px); top: 50%; left: -28px; }
.system-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.system-grid article { min-height: 210px; padding: 30px; border: solid var(--line); border-width: 1px 1px 0 0; background: rgba(10,18,22,.52); transition: background .2s ease, transform .2s ease; }
.system-grid article:nth-last-child(-n+2) { border-bottom-width: 1px; }
.system-grid article:hover { z-index: 1; transform: translateY(-3px); background: rgba(15,28,32,.94); }
.module-code { color: var(--green); font: 700 10px/1 var(--body); letter-spacing: .16em; }

.data-flow { background: #081115; overflow: hidden; }
.data-flow::before { content: ""; position: absolute; inset: 0; opacity: .28; background-image: linear-gradient(rgba(107,241,164,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(107,241,164,.05) 1px, transparent 1px); background-size: 64px 64px; mask-image: radial-gradient(circle at center, #000, transparent 75%); }
.flow-heading { position: relative; z-index: 1; max-width: 800px; margin-bottom: 70px; }
.flow-heading > p:last-child { margin-top: 28px; }
.flow-diagram { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 140px 1fr 140px 1fr; align-items: center; max-width: 1400px; }
.flow-diagram article { min-height: 205px; position: relative; display: flex; flex-direction: column; justify-content: center; padding: 32px; border: 1px solid var(--line); background: rgba(7,15,18,.85); }
.flow-diagram article.active-node { border-color: var(--green); box-shadow: inset 0 0 45px rgba(65,221,127,.06), 0 0 40px rgba(65,221,127,.07); }
.node-index { position: absolute; right: 18px; top: 16px; color: transparent; font: 700 31px/1 var(--display); -webkit-text-stroke: 1px rgba(120,247,169,.32); }
.flow-diagram small { color: var(--green); font: 700 8px/1 var(--body); letter-spacing: .16em; }
.flow-diagram strong { margin: 12px 0 5px; color: var(--white); font: 700 28px/1 var(--display); text-transform: uppercase; }
.flow-diagram p { margin: 0; color: var(--muted); font-size: 11px; }
.flow-link { position: relative; height: 1px; background: rgba(120,247,169,.3); }
.flow-link::after { content: ""; width: 7px; height: 7px; position: absolute; right: 0; top: -3px; border-top: 1px solid var(--green); border-right: 1px solid var(--green); transform: rotate(45deg); }
.flow-link i { width: 8px; height: 8px; position: absolute; top: -4px; left: calc(50% - 4px); border-radius: 50%; background: var(--green); box-shadow: 0 0 15px var(--green); }
.flow-link span { position: absolute; left: 50%; top: -22px; color: #91a198; font: 700 9px/1 var(--body); letter-spacing: .13em; transform: translateX(-50%); white-space: nowrap; }
.mode-strip { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; max-width: 1400px; margin-top: 18px; border: 1px solid var(--line); }
.mode-strip article { padding: 32px; background: rgba(12,22,26,.72); }
.mode-strip article + article { border-left: 1px solid var(--line); }
.mode-strip span { color: var(--amber); font: 700 8px/1 var(--body); letter-spacing: .16em; }

.installation { background: var(--black); border-top: 1px solid var(--line); }
.steps { max-width: 1050px; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.steps li { display: grid; grid-template-columns: 80px 1fr; gap: 24px; padding: 30px 0; border-bottom: 1px solid var(--line); }
.steps li > span { width: 50px; height: 50px; display: grid; place-items: center; color: var(--green); border: 1px solid var(--line-bright); font: 700 16px/1 var(--display); }
.steps small, .update-note small { display: block; margin-bottom: 7px; color: var(--amber); font: 700 10px/1 var(--body); letter-spacing: .15em; }
.steps strong, .update-note strong { color: var(--white); font: 700 24px/1 var(--display); text-transform: uppercase; }
.steps p, .update-note p { margin: 7px 0 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
code { padding: 3px 6px; color: var(--green); background: rgba(120,247,169,.08); }
.update-note { max-width: 1050px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 25px; margin-top: 30px; padding: 25px 28px; border: 1px solid rgba(120,247,169,.24); background: linear-gradient(90deg, rgba(120,247,169,.06), transparent); }
.update-light { width: 12px; height: 12px; border-radius: 50%; background: var(--green); box-shadow: 0 0 20px var(--green); }
.status-pill { padding: 10px 13px; color: var(--green); border: 1px solid var(--line-bright); font: 700 10px/1 var(--body); letter-spacing: .12em; }

.community { min-height: 470px; position: relative; display: flex; align-items: center; justify-content: space-between; gap: 60px; overflow: hidden; padding: 90px clamp(24px, 7.7vw, 138px); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: radial-gradient(circle at 85% 50%, rgba(64,217,126,.12), transparent 25%), linear-gradient(110deg, #0b171b, #061013); }
.community > div:not(.community-grid) { max-width: 850px; position: relative; z-index: 2; }
.community h2 { margin-bottom: 22px; color: var(--white); font: 700 clamp(44px, 5vw, 70px)/.92 var(--display); text-transform: uppercase; }
.community p:not(.eyebrow) { max-width: 720px; margin-bottom: 0; color: #899b91; font-size: 14px; line-height: 1.75; }
.community .button { position: relative; z-index: 2; flex: none; }
.community-grid { position: absolute; inset: 0; opacity: .28; background-image: linear-gradient(rgba(116,243,167,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(116,243,167,.07) 1px, transparent 1px); background-size: 74px 74px; mask-image: linear-gradient(90deg, transparent, #000); }

footer { min-height: 120px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 30px; padding: 26px clamp(24px, 7.7vw, 138px); color: #87978f; background: #030709; font: 600 10px/1.7 var(--body); letter-spacing: .11em; text-align: center; }
.footer-brand { display: flex; align-items: center; gap: 12px; justify-self: start; color: var(--white); text-align: left; }
.footer-brand img { width: 42px; height: 42px; object-fit: contain; }
.footer-brand strong, .footer-brand small { display: block; }.footer-brand small { color: var(--green); }
footer p { margin: 0; }.footer-status { justify-self: end; }.footer-status i { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--green); }

.js .reveal { opacity: 1; transform: none; transition: none; }
@keyframes data-travel { from { left: 0; opacity: 0; } 15% { opacity: 1; } 85% { opacity: 1; } to { left: calc(100% - 8px); opacity: 0; } }

@media (max-width: 1320px) {
  .site-header { grid-template-columns: 1fr auto auto; column-gap: 24px; }
  .header-cta { display: none; }
  .header-tools { gap: 0; }
  nav { gap: clamp(16px, 1.8vw, 26px); }
}

@media (max-width: 1100px) {
  .site-header { grid-template-columns: 1fr auto auto; column-gap: 24px; }.header-cta { display: none; }.header-tools { gap: 0; }
  .hero-art { background-position: 57% center; }.hero-copy { margin-left: 6vw; }
  .download-grid, .news-grid, .viewer-download-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .microcontroller-stage { grid-template-columns: 1fr; }.microcontroller-copy { min-height: auto; }.microcontroller-benefits { grid-template-columns: 1fr; }
  .systems-layout { grid-template-columns: 1fr; }.system-feature { min-height: 560px; grid-template-columns: 1fr .65fr; grid-template-rows: 1fr; align-items: end; gap: 35px; }
  .flow-diagram { grid-template-columns: 1fr 70px 1fr 70px 1fr; }
  .community { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 900px) {
  .site-header { grid-template-columns: 1fr auto; }
  nav { display: none; }
}

@media (max-width: 780px) {
  html { scroll-padding-top: 66px; }.site-header { height: 66px; grid-template-columns: 1fr auto; padding-inline: 18px; }.brand img { width: 40px; height: 40px; }
  .hero { min-height: 760px; }.hero::before { opacity: .2; }.hero-art { opacity: .64; background: linear-gradient(180deg, rgba(2,6,8,.25), rgba(2,6,8,.96) 66%, #030709 100%), url("f16-night-ops-hero-v2.png") 61% top/auto 56% no-repeat; animation: none; }.development-marker { top: 82px; right: 18px; min-width: 0; grid-template-columns: 34px 1fr; padding: 10px 12px; }.marker-icon { width: 30px; height: 30px; }.development-marker strong { font-size: 14px; }.development-marker small { font-size: 8px; }
  .hero-copy { width: calc(100% - 36px); margin: 150px 18px 0; padding: 140px 0 90px; align-self: end; }.hero-copy h1 { font-size: clamp(54px, 17vw, 86px); }.lead { font-size: 15px; }.mission-status { gap: 15px; }.hero-telemetry, .radar-scope { display: none; }.scroll-cue { left: 18px; }
  .section { padding: 88px 20px; }.section-intro { grid-template-columns: 1fr; gap: 25px; margin-bottom: 44px; }.section-intro > p { margin: 0; }
  .download-grid, .news-grid, .viewer-download-grid, .system-grid, .mode-strip, .viewer-download-heading { grid-template-columns: 1fr; }.download-card ul { min-height: 0; }.mfd-card { min-height: 0; }.news-card { min-height: 0; }.viewer-download-heading { align-items: start; gap: 18px; }.viewer-manuals { grid-template-columns: 1fr; }.intel-note { grid-template-columns: 1fr; }.intel-code { display: none; }
  .hardware-route { grid-template-columns: 1fr; gap: 8px; }.route-pulse { width: 1px; height: 22px; justify-self: center; }.route-pulse::before { left: -3px; top: 50%; }.route-pulse::after { right: auto; bottom: 0; left: -3px; top: auto; transform: rotate(135deg); }.controller-rack-body { grid-template-columns: 1fr; }.led-bank { min-height: 160px; }.microcontroller-benefits article { min-height: 0; }
  .system-feature { min-height: auto; grid-template-columns: 1fr; }.hud-frame { min-height: 300px; }.system-grid article { border-width: 0 1px 1px; }
  .flow-diagram { grid-template-columns: 1fr; gap: 46px; }.flow-link { width: 1px; height: 46px; justify-self: center; }.flow-link::after { right: -3px; top: auto; bottom: 0; transform: rotate(135deg); }.flow-link i { top: calc(50% - 4px); left: -4px; }.flow-link span { left: 17px; top: 50%; transform: translateY(-50%); }.mode-strip article + article { border-left: 0; border-top: 1px solid var(--line); }
  .update-note { grid-template-columns: auto 1fr; }.status-pill { grid-column: 2; justify-self: start; }
  footer { grid-template-columns: 1fr; justify-items: center; }.footer-brand, .footer-status { justify-self: center; }
}

@media (max-width: 480px) {
  .brand { gap: 9px; }.brand strong { font-size: 17px; }.brand small { font-size: 10px; }.language-switch { gap: 5px; padding: 6px 7px; }
  .hero-actions { flex-direction: column; }.hero-actions .button { width: 100%; }.mission-status span { width: calc(50% - 8px); }.signal-bar { justify-content: flex-start; overflow: hidden; }
  .card-title { grid-template-columns: 45px 1fr; gap: 14px; }.card-title > span { font-size: 40px; }.download-card { padding: 25px 20px; }.viewer-manual-actions { grid-template-columns: 1fr; }.viewer-manual-card { min-height: 108px; grid-template-columns: 46px minmax(0,1fr) auto; padding: 16px; }.viewer-manual-language { width: 46px; height: 46px; }.news-card-header { align-items: flex-start; flex-direction: column; }.news-version-row { align-items: flex-start; flex-direction: column; }.news-card .button { width: 100%; }.release-boundary { grid-template-columns: 1fr; }.steps li { grid-template-columns: 54px 1fr; gap: 15px; }
  .hardware-visual { padding: 16px; }.hardware-statusbar, .controller-rack-head, .controller-rack-foot { align-items: flex-start; flex-direction: column; }.controller-rack-body { padding: 16px; gap: 16px; }.protocol-screen div { grid-template-columns: 1fr; gap: 5px; }.microcontroller-copy { padding: 27px 20px; }.microcontroller-benefits article { grid-template-columns: 43px 1fr; padding: 22px 18px; }
  .community { padding: 75px 20px; }.community .button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .button { transition: none; }
}