:root {
  --ink: #f5f7fb;
  --muted: #aeb6c6;
  --muted-strong: #c9cfda;
  --canvas: #07090d;
  --canvas-soft: #0b0e14;
  --panel: #10141d;
  --panel-light: #151b26;
  --line: rgba(201, 214, 235, 0.14);
  --line-strong: rgba(201, 214, 235, 0.24);
  --blue: #7ea8ff;
  --blue-bright: #b8cbff;
  --blue-deep: #0a67f6;
  --cyan: #79d5ff;
  --radius: 28px;
  --shell: min(1240px, calc(100vw - 80px));
  --header-height: 72px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

* { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-height) + 24px);
  background: var(--canvas);
}

body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  background: var(--canvas);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", sans-serif;
  font-size: 16px;
  line-height: 1.5;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.menu-open { overflow: hidden; }

::selection { background: var(--blue); color: #07112b; }

a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { color: inherit; }

.skip-link {
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 200;
  padding: 10px 14px;
  border-radius: 10px;
  background: white;
  color: #07112b;
  transform: translateY(-160%);
  transition: transform .2s ease;
}

.skip-link:focus { transform: translateY(0); }

.scroll-progress {
  position: fixed;
  inset: 0 0 auto;
  z-index: 180;
  height: 2px;
  pointer-events: none;
  overflow: hidden;
}

.scroll-progress span {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, #42bfff, #7597ff 58%, #c6d5ff);
  box-shadow: 0 0 18px rgba(92, 151, 255, .7);
  transform: scaleX(var(--scroll-progress, 0));
  transform-origin: left;
  will-change: transform;
}

:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 4px;
}

.shell { width: var(--shell); margin: 0 auto; }
.section { padding: 148px 0; }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  border-bottom: 1px solid transparent;
  transition: background .35s ease, border-color .35s ease, backdrop-filter .35s ease;
}

.site-header.is-scrolled,
.site-header.menu-active {
  background: rgba(7, 9, 13, .78);
  border-color: var(--line);
  backdrop-filter: blur(22px) saturate(140%);
  -webkit-backdrop-filter: blur(22px) saturate(140%);
}

.nav-shell {
  width: var(--shell);
  height: var(--header-height);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 32px;
}

.brand { display: inline-flex; align-items: center; gap: 12px; width: fit-content; }
.brand-name { font-size: 13px; font-weight: 760; letter-spacing: .12em; }

.brand-mark {
  position: relative;
  width: 27px;
  height: 25px;
  display: block;
  transform: skewX(-12deg);
}

.brand-mark span { position: absolute; left: 0; height: 7px; border-radius: 2px; }
.brand-mark span:first-child { top: 2px; width: 26px; background: linear-gradient(90deg, #08a2ff, var(--blue)); }
.brand-mark span:last-child { top: 13px; left: 7px; width: 19px; background: linear-gradient(90deg, #2055e8, #a9bcff); }
.brand-mark::after { content: ""; position: absolute; inset: -8px; border-radius: 50%; background: radial-gradient(circle, rgba(88, 157, 255, .22), transparent 64%); opacity: 0; transform: scale(.65); transition: opacity .35s ease, transform .35s ease; }
.brand:hover .brand-mark::after { opacity: 1; transform: scale(1); }

.desktop-nav { display: flex; align-items: center; gap: 30px; }
.desktop-nav a { color: var(--muted); font-size: 13px; font-weight: 560; transition: color .2s ease; }
.desktop-nav a:hover, .desktop-nav a.is-active { color: white; }

.nav-cta {
  justify-self: end;
  padding: 10px 16px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  font-size: 13px;
  font-weight: 650;
  transition: background .2s ease, border-color .2s ease;
}

.nav-cta:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.4); }
.menu-button, .mobile-nav { display: none; }

.hero {
  position: relative;
  min-height: 100svh;
  padding: calc(var(--header-height) + 96px) 0 34px;
  display: flex;
  flex-direction: column;
  isolation: isolate;
  overflow: hidden;
}

.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -3;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(to bottom, black, transparent 82%);
}

.hero-glow {
  position: absolute;
  z-index: -2;
  width: 900px;
  height: 700px;
  right: -170px;
  top: -120px;
  background: radial-gradient(ellipse, rgba(36, 103, 255, .23), rgba(14, 49, 119, .07) 52%, transparent 72%);
  filter: blur(20px);
}

.hero-orbit { position: absolute; z-index: -1; border: 1px solid rgba(134, 171, 255, .11); border-radius: 50%; pointer-events: none; }
.hero-orbit-one { width: 820px; height: 820px; right: -350px; top: -30px; }
.hero-orbit-two { width: 570px; height: 570px; right: -220px; top: 96px; }

.hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(380px, .85fr);
  align-items: center;
  gap: clamp(54px, 8vw, 130px);
  flex: 1;
}

.eyebrow, .section-index, .card-kicker, .region-label {
  margin: 0;
  color: var(--blue-bright);
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.eyebrow { display: flex; align-items: center; gap: 10px; }
.eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 5px rgba(126,168,255,.1); }

.hero h1 {
  margin: 28px 0 30px;
  max-width: 780px;
  font-size: clamp(56px, 7vw, 104px);
  line-height: .94;
  letter-spacing: -.065em;
  font-weight: 680;
}

.hero h1 em { color: var(--blue-bright); font-style: normal; font-weight: inherit; }
.hero-line { display: block; overflow: hidden; margin-bottom: -.04em; padding-bottom: .04em; }
.hero-line > span,
.hero-line > em { display: block; transform: none; }
.js .hero-copy .hero-line > span,
.js .hero-copy .hero-line > em { transform: translateY(112%); transition: transform 1.05s var(--ease); }
.js .hero-copy.is-visible .hero-line > span,
.js .hero-copy.is-visible .hero-line > em { transform: translateY(0); }
.js .hero-copy.is-visible .hero-line:nth-child(2) > em { transition-delay: .09s; }
.hero-summary { max-width: 700px; margin: 0; color: var(--muted-strong); font-size: clamp(18px, 1.6vw, 22px); line-height: 1.55; letter-spacing: -.018em; }
.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 42px; }

.button {
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  padding: 0 22px;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 680;
  position: relative;
  overflow: hidden;
  transform: translate3d(var(--mag-x, 0px), var(--mag-y, 0px), 0);
  transition: transform .25s var(--ease), background .25s ease, color .25s ease, border-color .25s ease, box-shadow .3s ease;
}

.button::before { content: ""; position: absolute; inset: -1px; background: linear-gradient(110deg, transparent 28%, rgba(255,255,255,.44) 48%, transparent 68%); transform: translateX(-130%); transition: transform .8s var(--ease); pointer-events: none; }
.button:hover { transform: translate3d(var(--mag-x, 0px), calc(var(--mag-y, 0px) - 2px), 0); }
.button:hover::before { transform: translateX(130%); }
.button > span { position: relative; transition: transform .3s var(--ease); }
.button:hover > span { transform: translate(2px, -2px); }
.button-primary { color: #06132f; background: linear-gradient(135deg, #d1dcff, #81aaff); box-shadow: 0 12px 44px rgba(49, 108, 255, .18); }
.button-primary:hover { background: linear-gradient(135deg, #e4eaff, #9ebcff); box-shadow: 0 18px 54px rgba(49, 108, 255, .28); }
.button-quiet { color: var(--muted-strong); border: 1px solid var(--line-strong); background: rgba(255,255,255,.02); }
.button-quiet:hover { color: white; border-color: rgba(255,255,255,.34); background: rgba(255,255,255,.06); }

.hero-system {
  position: relative;
  min-height: 570px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(145deg, rgba(18, 24, 36, .75), rgba(9, 12, 18, .45));
  box-shadow: 0 40px 120px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.05);
  overflow: hidden;
  transform-style: preserve-3d;
  will-change: transform;
}

.system-topline { display: flex; justify-content: space-between; padding: 22px 24px; border-bottom: 1px solid var(--line); color: var(--muted); font: 600 10px/1.2 "SFMono-Regular", Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; }
.system-core { position: relative; height: 365px; display: grid; place-items: center; overflow: hidden; }
.system-core::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle, rgba(39,94,218,.16), transparent 62%); }
.core-ring { position: absolute; border: 1px solid rgba(149, 180, 255, .16); border-radius: 50%; }
.ring-one { width: 286px; height: 286px; }
.ring-two { width: 206px; height: 206px; border-style: dashed; animation: rotate 32s linear infinite; }
.ring-three { width: 118px; height: 118px; border-color: rgba(149, 180, 255, .32); }
.core-axis { position: absolute; background: rgba(149, 180, 255, .11); }
.axis-x { width: 80%; height: 1px; }
.axis-y { height: 80%; width: 1px; }
.core-pulse { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: #b9cbff; box-shadow: 0 0 0 10px rgba(126,168,255,.08), 0 0 40px #377dff; }
.core-pulse::before, .core-pulse::after { content: ""; position: absolute; inset: -1px; border: 1px solid rgba(171, 199, 255, .46); border-radius: 50%; animation: pulse-wave 3.2s ease-out infinite; }
.core-pulse::after { animation-delay: 1.6s; }
.core-label { position: relative; transform: translateY(62px); color: var(--muted); text-align: center; font: 650 9px/1.4 "SFMono-Regular", Consolas, monospace; letter-spacing: .16em; }

.system-steps { margin: 0; padding: 0 24px 20px; list-style: none; }
.system-steps li { display: grid; grid-template-columns: 34px 1fr; align-items: center; gap: 10px; min-height: 42px; border-top: 1px solid var(--line); }
.system-steps span { color: var(--blue); font: 600 10px/1 "SFMono-Regular", Consolas, monospace; }
.system-steps strong { font-size: 12px; font-weight: 540; color: var(--muted-strong); }

.hero-foot { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; padding-top: 34px; border-top: 1px solid var(--line); }
.hero-foot p { margin: 0; color: var(--muted); font: 560 10px/1.4 "SFMono-Regular", Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; }
.hero-foot p:nth-child(2) { text-align: center; }
.hero-foot p:last-child { text-align: right; }

@keyframes rotate { to { transform: rotate(360deg); } }
@keyframes pulse-wave { 0% { opacity: .7; transform: scale(1); } 75%, 100% { opacity: 0; transform: scale(8); } }

.statement { background: #f2f4f8; color: #111622; }
.statement-grid { display: grid; grid-template-columns: 200px 1fr; gap: 40px; }
.statement .section-index { color: #375b9c; }
.statement h2 { margin: -12px 0 42px; max-width: 980px; font-size: clamp(44px, 6.2vw, 84px); line-height: 1.02; letter-spacing: -.055em; font-weight: 660; }
.statement h2 span { color: #667fa9; }
.statement-grid > div > p { max-width: 700px; margin: 0; color: #4d586b; font-size: 20px; line-height: 1.65; }

.section-heading { display: grid; grid-template-columns: 1.1fr .9fr; gap: 80px; align-items: end; margin-bottom: 68px; }
.section-heading h2, .method h2, .region h2, .contact h2 { margin: 22px 0 0; font-size: clamp(44px, 5.2vw, 72px); line-height: 1.04; letter-spacing: -.05em; font-weight: 650; }
.section-heading > p { max-width: 480px; margin: 0; color: var(--muted); font-size: 18px; line-height: 1.65; }

.capabilities { background: var(--canvas-soft); }
.capability-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.capability-card { position: relative; min-height: 570px; padding: 30px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--line); border-radius: var(--radius); background: linear-gradient(145deg, rgba(21,27,38,.92), rgba(12,15,22,.94)); overflow: hidden; transform-style: preserve-3d; will-change: transform; }
.capability-card::before { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; background: radial-gradient(520px circle at var(--spot-x, 50%) var(--spot-y, 50%), rgba(104, 158, 255, .16), transparent 44%); opacity: 0; transition: opacity .4s ease; pointer-events: none; }
.capability-card::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: inherit; box-shadow: inset 0 1px rgba(255,255,255,.04); pointer-events: none; }
.capability-featured { grid-row: span 2; min-height: 1160px; }
.card-number { position: relative; z-index: 2; color: #7f8ba0; font: 600 11px/1 "SFMono-Regular", Consolas, monospace; letter-spacing: .12em; }
.card-copy { position: relative; z-index: 2; max-width: 510px; }
.card-copy h3 { margin: 15px 0 18px; max-width: 540px; font-size: clamp(32px, 3.2vw, 50px); line-height: 1.06; letter-spacing: -.045em; font-weight: 620; }
.card-copy > p:last-child { margin: 0; max-width: 490px; color: var(--muted); font-size: 17px; line-height: 1.65; }

.terrain-visual { position: absolute; inset: 60px 20px 290px; transform: perspective(900px) rotateX(58deg) rotateZ(-24deg); transform-style: preserve-3d; }
.terrain-visual span { position: absolute; inset: calc(var(--i, 0) * 9%); border: 1px solid rgba(121, 175, 255, calc(.26 - var(--i, 0) * .035)); border-radius: 40% 56% 44% 52%; }
.terrain-visual span:nth-child(1) { --i: 0; }
.terrain-visual span:nth-child(2) { --i: 1; transform: translateZ(25px); }
.terrain-visual span:nth-child(3) { --i: 2; transform: translateZ(50px); }
.terrain-visual span:nth-child(4) { --i: 3; transform: translateZ(75px); }
.terrain-visual span:nth-child(5) { --i: 4; transform: translateZ(100px); }
.terrain-visual i { position: absolute; width: 12px; height: 12px; top: 40%; left: 52%; border-radius: 50%; background: #b4c8ff; box-shadow: 0 0 0 18px rgba(90,135,255,.12), 0 0 70px #126dff; }

.power-visual { position: absolute; inset: 45px 30px 245px; border-radius: 20px; background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 34px 34px; mask-image: linear-gradient(black, transparent); }
.power-visual::before, .power-visual::after { content: ""; position: absolute; inset: 24% 10%; border-top: 1px solid rgba(124,168,255,.46); transform: skewY(-13deg); box-shadow: 0 32px rgba(124,168,255,.22), 0 64px rgba(124,168,255,.11); }
.power-visual::after { inset: 42% 14%; transform: skewY(17deg); border-color: rgba(107,216,255,.7); box-shadow: none; }
.power-visual span { position: absolute; left: 62%; top: 38%; width: 9px; height: 9px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 28px var(--cyan); }

.handover-visual { position: absolute; inset: 50px 60px 260px; display: flex; justify-content: center; align-items: center; }
.handover-visual span { width: 34%; aspect-ratio: 1; border: 1px solid rgba(128,171,255,.24); background: rgba(73,113,199,.06); transform: rotate(45deg); margin: -5%; box-shadow: inset 0 0 40px rgba(31,90,220,.06); }
.handover-visual span:nth-child(2) { border-color: rgba(128,171,255,.55); background: rgba(73,113,199,.12); }

.method { background: #f2f4f8; color: #111622; }
.method-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(70px, 10vw, 150px); align-items: start; }
.method-intro { position: sticky; top: calc(var(--header-height) + 52px); }
.method .section-index { color: #375b9c; }
.method-intro > p:nth-of-type(2) { max-width: 460px; margin: 30px 0; color: #526074; font-size: 18px; line-height: 1.65; }
.text-link { display: inline-flex; gap: 12px; align-items: center; padding-bottom: 5px; border-bottom: 1px solid #9aa9c2; color: #244f9b; font-size: 14px; font-weight: 700; }
.method-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid rgba(16,22,34,.16); }
.method-list { position: relative; --method-progress: 0; }
.method-list::after { content: ""; position: absolute; left: 0; top: 0; width: 2px; height: 100%; background: linear-gradient(#4d79ca, #7ca2eb); transform: scaleY(var(--method-progress)); transform-origin: top; transition: transform .18s linear; }
.method-list li { min-height: 205px; display: grid; grid-template-columns: 52px 1fr auto; gap: 28px; align-items: start; padding: 36px 0 36px 18px; border-bottom: 1px solid rgba(16,22,34,.16); transition: background .45s ease, padding-left .45s var(--ease); }
.method-list li.is-current { padding-left: 28px; background: linear-gradient(90deg, rgba(64, 104, 177, .07), transparent 62%); }
.method-number { color: #5a6f93; font: 650 11px/1.5 "SFMono-Regular", Consolas, monospace; }
.method-list h3 { margin: -8px 0 12px; font-size: 32px; letter-spacing: -.035em; }
.method-list h3 { transition: color .35s ease, transform .45s var(--ease); }
.method-list li.is-current h3 { color: #234f9c; transform: translateX(4px); }
.method-list p { max-width: 510px; margin: 0; color: #596578; line-height: 1.65; }
.method-tag { padding: 7px 10px; border: 1px solid rgba(34,68,125,.22); border-radius: 999px; color: #405c89; font: 650 9px/1 "SFMono-Regular", Consolas, monospace; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }

.region { position: relative; min-height: 920px; display: flex; align-items: center; overflow: hidden; }
.region-backdrop { position: absolute; inset: -6% 0; pointer-events: none; will-change: transform; }
.region-backdrop::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 72% 48%, rgba(28,86,203,.16), transparent 38%), linear-gradient(90deg, var(--canvas) 0%, rgba(7,9,13,.58) 52%, var(--canvas) 100%); }
.region-grid { position: absolute; width: 820px; height: 820px; right: -80px; top: 50%; transform: translateY(-50%) perspective(800px) rotateX(58deg) rotateZ(-24deg); background-image: linear-gradient(rgba(114,157,246,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(114,157,246,.12) 1px, transparent 1px); background-size: 58px 58px; mask-image: radial-gradient(circle, black, transparent 67%); }
.region-line { position: absolute; z-index: 1; right: 8%; top: 50%; width: 570px; height: 1px; background: linear-gradient(90deg, transparent, rgba(108,158,255,.7), transparent); transform-origin: right; }
.region-line::after { content: ""; position: absolute; top: -1px; width: 90px; height: 3px; border-radius: 50%; background: linear-gradient(90deg, transparent, rgba(183,211,255,.9), transparent); filter: blur(.2px); animation: signal-travel 4.8s ease-in-out infinite; }
.line-b::after { animation-delay: -2.4s; }
.line-a { transform: rotate(-17deg); }
.line-b { transform: rotate(26deg); }
.region-node { position: absolute; z-index: 2; width: 8px; height: 8px; border-radius: 50%; background: #9fbaff; box-shadow: 0 0 0 9px rgba(85,131,237,.09), 0 0 30px #397cff; }
.region-node { animation: node-breathe 3.4s ease-in-out infinite; }
.node-b { animation-delay: -.9s; }
.node-c { animation-delay: -1.8s; }
.node-a { right: 22%; top: 31%; }
.node-b { right: 10%; top: 55%; }
.node-c { right: 32%; top: 69%; }
@keyframes signal-travel { 0% { left: -5%; opacity: 0; } 20% { opacity: 1; } 80% { opacity: 1; } 100% { left: 95%; opacity: 0; } }
@keyframes node-breathe { 0%, 100% { transform: scale(.82); opacity: .68; } 50% { transform: scale(1.18); opacity: 1; } }
.region-content { position: relative; z-index: 3; }
.region-content > * { max-width: 750px; }
.region-label { margin-top: 86px; color: #6e7f9c; }
.region h2 { margin-top: 18px; font-size: clamp(52px, 7vw, 96px); }
.region h2 span { color: var(--blue-bright); }
.region-content > p:nth-of-type(3) { max-width: 650px; margin: 34px 0 50px; color: var(--muted); font-size: 19px; line-height: 1.7; }
.region-principles { max-width: 710px; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); }
.region-principles div { padding: 24px 20px 0 0; }
.region-principles span { color: var(--blue); font: 650 10px/1 "SFMono-Regular", Consolas, monospace; }
.region-principles p { margin: 12px 0 0; color: var(--muted-strong); font-size: 13px; }

.contact { padding-bottom: 100px; background: var(--canvas-soft); }
.contact-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(60px, 9vw, 130px); }
.contact-copy > p:nth-of-type(2) { max-width: 500px; margin: 30px 0 48px; color: var(--muted); font-size: 18px; line-height: 1.7; }
.direct-email { display: inline-flex; flex-direction: column; gap: 5px; padding-bottom: 12px; border-bottom: 1px solid var(--line-strong); }
.direct-email span { color: #748096; font: 600 9px/1.5 "SFMono-Regular", Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; }
.direct-email strong { color: var(--blue-bright); font-size: clamp(17px, 1.8vw, 22px); font-weight: 580; }

.contact-form { padding: clamp(28px, 4vw, 50px); border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.form-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.field { margin-bottom: 27px; }
.field label { display: block; margin-bottom: 9px; color: var(--muted-strong); font-size: 12px; font-weight: 620; }
.field input, .field textarea { width: 100%; padding: 15px 16px; border: 1px solid var(--line-strong); border-radius: 12px; background: rgba(255,255,255,.025); color: white; transition: background .2s ease, border-color .2s ease, box-shadow .2s ease; }
.field textarea { min-height: 126px; resize: vertical; }
.field input:hover, .field textarea:hover { border-color: rgba(201,214,235,.38); }
.field input:focus, .field textarea:focus { outline: none; border-color: var(--blue); background: rgba(255,255,255,.04); box-shadow: 0 0 0 4px rgba(126,168,255,.1); }
.form-submit-row { display: flex; align-items: center; gap: 22px; }
.form-note { max-width: 260px; margin: 0; color: #7f899b; font-size: 11px; line-height: 1.45; }
.form-status { min-height: 20px; margin: 16px 0 0; color: var(--blue-bright); font-size: 13px; }

.site-footer { padding: 72px 0 28px; background: #05070a; border-top: 1px solid var(--line); }
.footer-top { display: flex; justify-content: space-between; gap: 50px; align-items: center; padding-bottom: 58px; }
.footer-brand { display: flex; gap: 16px; align-items: center; }
.footer-brand img { width: 54px; height: 54px; object-fit: cover; border-radius: 13px; }
.footer-brand div { display: flex; flex-direction: column; gap: 4px; }
.footer-brand strong { font-size: 14px; letter-spacing: .1em; }
.footer-brand span { color: #778196; font-size: 11px; }
.footer-top > p { max-width: 390px; margin: 0; color: #7f899a; text-align: right; font-size: 14px; }
.footer-bottom { display: flex; justify-content: space-between; gap: 30px; padding-top: 26px; border-top: 1px solid var(--line); color: #6f7888; font-size: 11px; }
.footer-bottom p { margin: 0; }
.footer-bottom div { display: flex; gap: 24px; }
.footer-bottom button, .footer-bottom a { padding: 0; border: 0; background: transparent; color: #8e98a9; cursor: pointer; font-size: 11px; }
.footer-bottom button:hover, .footer-bottom a:hover { color: white; }

.legal-dialog { width: min(600px, calc(100vw - 32px)); padding: 0; border: 1px solid var(--line-strong); border-radius: 20px; background: #111620; color: white; box-shadow: 0 40px 120px rgba(0,0,0,.65); }
.legal-dialog::backdrop { background: rgba(2,4,8,.74); backdrop-filter: blur(8px); }
.dialog-bar { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; border-bottom: 1px solid var(--line); }
.dialog-bar p { margin: 0; font-weight: 650; }
.dialog-bar button { width: 36px; height: 36px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: transparent; color: var(--muted); cursor: pointer; font-size: 22px; }
.dialog-content { padding: 26px 24px 30px; }
.dialog-content p { margin: 0; color: var(--muted-strong); line-height: 1.75; }

[data-reveal] { opacity: 1; transform: none; }
.js [data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.js [data-reveal].is-visible { opacity: 1; transform: none; }
[data-parallax] { transform: translate3d(0, var(--parallax-y, 0px), 0); will-change: transform; }
[data-tilt] { --tilt-x: 0deg; --tilt-y: 0deg; transform: perspective(1100px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); transition: opacity .8s var(--ease), transform .22s ease-out, border-color .35s ease, box-shadow .35s ease; }
.js [data-reveal][data-tilt] { opacity: 0; transform: translateY(28px) perspective(1100px) rotateX(0deg) rotateY(0deg); }
.js [data-reveal][data-tilt].is-visible { opacity: 1; transform: perspective(1100px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); }

@media (hover: hover) and (pointer: fine) {
  .capability-card:hover { border-color: rgba(145, 179, 255, .34); box-shadow: 0 34px 90px rgba(0,0,0,.24); }
  .capability-card:hover::before { opacity: 1; }
  .hero-system:hover { border-color: rgba(145, 179, 255, .3); box-shadow: 0 48px 130px rgba(0,0,0,.42), 0 0 70px rgba(41,98,218,.08), inset 0 1px rgba(255,255,255,.06); }
}

@media (max-width: 1040px) {
  :root { --shell: min(100% - 48px, 900px); }
  .desktop-nav { display: none; }
  .nav-shell { grid-template-columns: 1fr auto auto; }
  .menu-button { width: 42px; height: 42px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: rgba(255,255,255,.03); display: grid; place-content: center; gap: 5px; cursor: pointer; }
  .menu-button span { display: block; width: 16px; height: 1px; background: white; transition: transform .25s ease; }
  .menu-button[aria-expanded="true"] span:first-child { transform: translateY(3px) rotate(45deg); }
  .menu-button[aria-expanded="true"] span:last-child { transform: translateY(-3px) rotate(-45deg); }
  .mobile-nav { width: var(--shell); margin: 0 auto; padding: 20px 0 28px; flex-direction: column; gap: 2px; }
  .mobile-nav:not([hidden]) { display: flex; }
  .mobile-nav a { padding: 13px 0; border-bottom: 1px solid var(--line); color: var(--muted-strong); font-size: 15px; }
  .hero-layout { grid-template-columns: 1fr; padding-top: 60px; }
  .hero-system { min-height: 500px; max-width: 680px; width: 100%; }
  .system-core { height: 310px; }
  .capability-card { min-height: 530px; }
  .capability-featured { min-height: 1080px; }
  .method-layout, .contact-layout { grid-template-columns: 1fr; }
  .method-intro { position: static; }
  .contact-copy { max-width: 720px; }
}

@media (max-width: 720px) {
  :root { --shell: calc(100% - 32px); --header-height: 64px; --radius: 22px; }
  .section { padding: 96px 0; }
  .nav-cta { display: none; }
  .nav-shell { grid-template-columns: 1fr auto; }
  .hero { min-height: auto; padding-top: calc(var(--header-height) + 68px); }
  .hero-layout { padding-top: 0; gap: 64px; }
  .hero h1 { margin-top: 24px; font-size: clamp(48px, 15vw, 72px); }
  .hero-summary { font-size: 17px; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .button { width: 100%; }
  .hero-system { min-height: 470px; border-radius: 20px; }
  .system-core { height: 280px; }
  .ring-one { width: 230px; height: 230px; }
  .ring-two { width: 166px; height: 166px; }
  .ring-three { width: 96px; height: 96px; }
  .hero-foot { grid-template-columns: 1fr; margin-top: 60px; gap: 12px; }
  .hero-foot p, .hero-foot p:nth-child(2), .hero-foot p:last-child { text-align: left; }
  .statement-grid { grid-template-columns: 1fr; gap: 52px; }
  .statement h2 { margin-top: 0; font-size: 46px; }
  .statement-grid > div > p { font-size: 17px; }
  .section-heading { grid-template-columns: 1fr; gap: 28px; margin-bottom: 46px; }
  .section-heading h2, .method h2, .contact h2 { font-size: 46px; }
  .capability-grid { grid-template-columns: 1fr; }
  .capability-card, .capability-featured { min-height: 610px; grid-row: auto; padding: 24px; }
  .terrain-visual { inset: 60px 10px 260px; }
  .card-copy h3 { font-size: 36px; }
  .method-list li { grid-template-columns: 36px 1fr; min-height: 0; }
  .method-tag { display: none; }
  .region { min-height: 850px; }
  .region-grid { right: -430px; opacity: .75; }
  .region-content > * { max-width: 100%; }
  .region-label { margin-top: 64px; }
  .region h2 { font-size: 52px; }
  .region-principles { grid-template-columns: 1fr; }
  .region-principles div { display: grid; grid-template-columns: 35px 1fr; align-items: center; padding-top: 18px; }
  .region-principles p { margin: 0; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .form-submit-row { align-items: flex-start; flex-direction: column; }
  .contact-form { padding: 24px 20px; }
  .footer-top, .footer-bottom { align-items: flex-start; flex-direction: column; }
  .footer-top > p { text-align: left; }
  .footer-bottom div { flex-wrap: wrap; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  [data-reveal] { opacity: 1; transform: none; }
  [data-parallax], [data-tilt], .js [data-reveal][data-tilt], .js [data-reveal][data-tilt].is-visible { transform: none !important; }
  .scroll-progress { display: none; }
}
