@font-face {
  font-family: "Manrope";
  src: url("assets/Manrope-variable.ttf") format("truetype");
  font-weight: 200 800;
  font-display: swap;
}

:root {
  --navy: #0b1a2b;
  --navy-2: #10243a;
  --blue: #2563eb;
  --aqua: #06d6a0;
  --slate: #94a3b8;
  --light: #f5f7fa;
  --white: #fff;
  --ink: #101f31;
  --line: #dce3eb;
  --shell: min(1200px, calc(100% - 48px));
  --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--light);
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
body.dialog-open { overflow: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { color: inherit; }
.shell { width: var(--shell); margin-inline: auto; }
.section { padding: 128px 0; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 12px; left: 12px; z-index: 1000; padding: 9px 14px; background: var(--white); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  right: 0;
  border-bottom: 1px solid rgba(255,255,255,.09);
  transition: background .3s ease, backdrop-filter .3s ease;
}
.site-header.scrolled { background: rgba(11,26,43,.88); backdrop-filter: blur(18px); }
.header-inner { height: 86px; display: flex; align-items: center; justify-content: space-between; }
.brand img { width: 188px; height: auto; }
.site-nav { display: flex; align-items: center; gap: 34px; color: rgba(255,255,255,.72); font-size: 13px; font-weight: 650; }
.site-nav a { transition: color .2s; }
.site-nav a:hover, .site-nav a:focus-visible { color: var(--white); }
.site-nav .nav-cta { padding: 11px 18px; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; color: var(--white); }
.site-nav .nav-cta:hover { border-color: var(--aqua); color: var(--aqua); }
.menu-button { display: none; width: 44px; height: 44px; border: 0; background: transparent; padding: 10px; }
.menu-button > span:not(.sr-only) { display: block; width: 22px; height: 1px; margin: 5px auto; background: var(--white); }

.hero { position: relative; min-height: 880px; overflow: hidden; color: var(--white); background: var(--navy); padding: 190px 0 0; }
.hero::before { content:""; position:absolute; width:660px; height:660px; top:-190px; right:-90px; border-radius:42% 58% 63% 37% / 44% 38% 62% 56%; border:1px solid rgba(255,255,255,.06); transform:rotate(18deg); }
.hero-glow { position: absolute; width: 760px; height: 760px; top: -280px; right: -180px; border-radius: 46% 54% 64% 36% / 41% 38% 62% 59%; background: radial-gradient(circle, rgba(37,99,235,.22), rgba(6,214,160,.05) 42%, transparent 68%); transform:rotate(-12deg); }
.hero-layout { position: relative; display: grid; grid-template-columns: 1.08fr .92fr; gap: 72px; align-items: center; }
.eyebrow { margin: 0 0 24px; text-transform: uppercase; letter-spacing: .19em; font-size: 11px; font-weight: 700; color: rgba(255,255,255,.72); }
.eyebrow span { display: inline-block; width: 24px; height: 2px; margin: 0 10px 3px 0; background: var(--aqua); }
h1, h2, h3, p { text-wrap: pretty; }
h1 { max-width: 760px; margin: 0; font-size: clamp(48px, 6vw, 82px); line-height: 1.03; letter-spacing: -.052em; font-weight: 700; }
h1 em, .cta-copy h2 em { color: var(--aqua); font-style: normal; }
.hero-intro { max-width: 650px; margin: 30px 0 0; color: rgba(255,255,255,.7); font-size: 18px; line-height: 1.75; }
.hero-services { display:flex; flex-wrap:wrap; gap:10px; margin:28px 0 0; padding:0; list-style:none; }
.hero-services li { padding:8px 12px; border:1px solid rgba(255,255,255,.14); border-radius:999px; color:rgba(255,255,255,.72); background:rgba(255,255,255,.035); font-size:10px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
.hero-actions { display: flex; align-items: center; gap: 34px; margin-top: 40px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 25px; border: 0; border-radius: 999px; padding: 15px 22px; font-size: 13px; font-weight: 750; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: var(--navy); background: var(--aqua); box-shadow: 0 16px 32px rgba(6,214,160,.12); }
.button-primary:hover { background: #19e9b4; box-shadow: 0 18px 38px rgba(6,214,160,.22); }
.text-link { padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.24); color: rgba(255,255,255,.82); font-size: 13px; font-weight: 650; }
.text-link span { margin-left: 10px; color: var(--aqua); }

.human-card { position:relative; min-height:500px; overflow:hidden; border-radius:32px 32px 32px 8px; color:var(--ink); background:#eef3f7; box-shadow:0 38px 90px rgba(0,0,0,.2); }
.human-note { position:absolute; z-index:4; top:28px; left:28px; padding:12px 17px; border-radius:18px 18px 18px 3px; color:var(--navy); background:var(--white); box-shadow:0 10px 30px rgba(11,26,43,.1); font-size:14px; font-weight:700; transform:rotate(-2deg); }
.human-illustration { height:365px; display:grid; place-items:center; padding:28px 20px 0; }
.human-illustration svg { width:100%; max-width:500px; overflow:visible; }
.transformation-card { min-height:0; background:#f7fafc; }
.transformation-visual { width:100%; height:auto; aspect-ratio:3 / 2; padding:0; background:#f7fafc; }
.transformation-visual img { width:100%; height:100%; object-fit:cover; object-position:center; }
.soft-shape { fill:#e2edf0; }
.table { fill:#fff; stroke:#cfdae5; stroke-width:3; }
.person { stroke-width:3; stroke-linecap:round; }
.navy-person { fill:#d8e4ec; stroke:var(--navy); }
.blue-person { fill:#dfe9ff; stroke:var(--blue); }
.head { stroke-width:3; }
.navy-head { fill:#c4ded8; stroke:var(--navy); }
.blue-head { fill:#c8d8ff; stroke:var(--blue); }
.arm { fill:none; stroke:var(--navy); stroke-width:8; stroke-linecap:round; }
.paper { fill:#fff; stroke:var(--slate); stroke-width:2; }
.idea { fill:var(--aqua); stroke:var(--navy); stroke-width:3; }
.idea-line { fill:none; stroke:var(--navy); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.human-caption { min-height:135px; display:flex; flex-direction:column; justify-content:center; padding:24px 32px 28px; color:var(--white); background:var(--blue); }
.human-caption span { margin-bottom:7px; color:rgba(255,255,255,.78); font-size:10px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.human-caption strong { max-width:400px; font-size:18px; line-height:1.4; }
.signal-head, .signal-foot { position: relative; display: flex; justify-content: space-between; align-items: center; font-size: 10px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; color: rgba(255,255,255,.55); }
.signal-status { color: var(--aqua); }
.signal-status i { display: inline-block; width: 6px; height: 6px; margin: 0 6px 1px 0; border-radius: 50%; background: var(--aqua); box-shadow: 0 0 12px var(--aqua); }
.signal-stage { position: relative; height: 352px; display: grid; place-items: center; }
.signal-mark { position: relative; z-index: 2; width: 126px; filter: drop-shadow(0 18px 26px rgba(0,0,0,.28)); animation: float 5s ease-in-out infinite; }
.orbit { position: absolute; border-radius: 50%; border: 1px solid rgba(255,255,255,.12); }
.orbit-one { width: 240px; height: 240px; }
.orbit-two { width: 320px; height: 320px; border-color: rgba(37,99,235,.22); }
.data-pill { position: absolute; z-index: 3; display: flex; align-items: center; gap: 9px; padding: 8px 12px 8px 8px; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: rgba(11,26,43,.75); color: rgba(255,255,255,.66); font-size: 10px; backdrop-filter: blur(8px); }
.data-pill b { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: rgba(37,99,235,.2); color: #8fb5ff; font-size: 9px; }
.pill-a { top: 65px; left: 8px; }
.pill-b { top: 50%; right: -2px; }
.pill-c { bottom: 55px; left: 30px; }
.signal-foot i { flex: 1; height: 1px; margin: 0 14px; background: linear-gradient(90deg, rgba(255,255,255,.12), var(--aqua), rgba(255,255,255,.12)); }
.hero-bottom { position: relative; margin-top: 98px; padding: 25px 0 30px; border-top: 1px solid rgba(255,255,255,.1); display: flex; align-items: center; justify-content: space-between; font-size: 11px; color: rgba(255,255,255,.45); }
.hero-bottom p { margin: 0; }
.scroll-hint { text-transform: uppercase; letter-spacing: .15em; }
.scroll-hint span { display: inline-block; width: 35px; height: 1px; margin: 0 10px 3px 0; background: var(--aqua); }

.statement { background: var(--light); }
.statement-grid { display: grid; grid-template-columns: 280px 1fr; gap: 70px; }
.section-index { font-size: 11px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; color: #627083; }
.section-index span { margin-right: 18px; color: var(--blue); }
.section-index.light { color: rgba(255,255,255,.46); }
.section-index.light span { color: var(--aqua); }
.kicker { margin: 0 0 18px; color: var(--blue); font-size: 12px; font-weight: 750; letter-spacing: .15em; text-transform: uppercase; }
.kicker.aqua { color: var(--aqua); }
.statement-copy h2, .possibilities h2 { max-width: 830px; margin: 0; color: var(--navy); font-size: clamp(38px, 5vw, 64px); line-height: 1.08; letter-spacing: -.045em; }
.statement-copy h2 span { color: var(--blue); }
.statement-copy > p:last-child { max-width: 780px; margin: 32px 0 0; color: #586679; font-size: 17px; }
.value-strip { margin-top: 96px; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.value-strip article { position: relative; padding: 38px 42px 42px 0; }
.value-strip article + article { padding-left: 42px; border-left: 1px solid var(--line); }
.value-number { color: var(--aqua); font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.value-strip h3 { margin: 34px 0 10px; font-size: 19px; color: var(--navy); }
.value-strip p { max-width: 290px; margin: 0; color: #6e7b8c; font-size: 13px; }

.use-case { background:#eaf1f7; }
.use-case-layout { display:grid; grid-template-columns:280px 1fr; gap:70px; }
.use-case-content { min-width:0; }
.case-message { max-width:830px; margin:0 0 55px; padding:0; border:0; color:var(--navy); font-size:clamp(38px, 5vw, 62px); font-weight:700; line-height:1.12; letter-spacing:-.045em; }
.case-flow { display:grid; grid-template-columns:repeat(4, 1fr); border-top:1px solid #cdd8e3; border-bottom:1px solid #cdd8e3; }
.case-flow article { min-height:230px; padding:30px 24px; }
.case-flow article + article { border-left:1px solid #cdd8e3; }
.case-flow article span { color:var(--blue); font-size:10px; font-weight:800; letter-spacing:.16em; }
.case-flow article h3 { margin:55px 0 10px; color:var(--navy); font-size:19px; }
.case-flow article p { margin:0; color:#637286; font-size:12px; }
.human-control { display:flex; align-items:center; gap:18px; margin-top:35px; padding:22px 26px; border-radius:16px; color:var(--navy); background:var(--white); }
.human-control > span { flex:0 0 auto; width:40px; height:40px; display:grid; place-items:center; border-radius:50%; background:var(--aqua); font-weight:900; }
.human-control p { margin:0; color:#58687b; font-size:13px; }
.human-control strong { color:var(--navy); }

.approach { color: var(--white); background: var(--navy); }
.section-heading { display: grid; grid-template-columns: 280px 1fr; gap: 70px; margin-bottom: 82px; }
.section-heading h2 { margin: 0; font-size: clamp(42px, 5vw, 66px); line-height: 1.08; letter-spacing: -.045em; }
.approach-list { border-top: 1px solid rgba(255,255,255,.12); }
.approach-row { display: grid; grid-template-columns: 280px 1fr 90px; gap: 70px; padding: 42px 0; align-items: center; border-bottom: 1px solid rgba(255,255,255,.12); transition: background .25s ease, padding .25s ease; }
.approach-row:hover { padding-left: 18px; padding-right: 18px; background: rgba(255,255,255,.025); }
.step-number { color: var(--aqua); font-size: 11px; font-weight: 750; letter-spacing: .16em; }
.step-copy span { color: #7890aa; font-size: 10px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.step-copy h3 { margin: 8px 0 8px; font-size: 25px; letter-spacing: -.025em; }
.step-copy p { max-width: 630px; margin: 0; color: rgba(255,255,255,.52); font-size: 14px; }
.step-icon { width: 66px; height: 66px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; }
.step-icon svg { width: 30px; fill: none; stroke: var(--aqua); stroke-width: 2; }

.possibilities { background: var(--white); }
.possibilities-head { display: grid; grid-template-columns: 280px 1fr; gap: 70px; }
.possibilities-head > div:last-child { max-width: 900px; }
.result-intro { max-width:760px; margin:28px 0 0; color:#617084; font-size:17px; line-height:1.75; }
.result-stage { margin-top:78px; display:grid; grid-template-columns:.8fr 1.2fr; overflow:hidden; border-radius:28px 28px 28px 8px; box-shadow:0 32px 80px rgba(11,26,43,.16); }
.result-promise { position:relative; display:flex; min-height:610px; flex-direction:column; justify-content:flex-end; padding:52px; color:var(--white); background:var(--blue); }
.result-promise::before { content:""; position:absolute; width:390px; height:390px; top:-180px; right:-170px; border:1px solid rgba(255,255,255,.2); border-radius:50%; box-shadow:0 0 0 60px rgba(255,255,255,.035), 0 0 0 120px rgba(255,255,255,.025); }
.result-promise > span { margin-bottom:20px; color:rgba(255,255,255,.68); font-size:10px; font-weight:800; letter-spacing:.17em; text-transform:uppercase; }
.result-promise h3 { max-width:470px; margin:0; font-size:clamp(38px, 4.2vw, 58px); line-height:1.04; letter-spacing:-.05em; }
.result-promise p { max-width:480px; margin:28px 0 42px; color:rgba(255,255,255,.72); font-size:15px; line-height:1.75; }
.result-promise a { width:max-content; padding-bottom:8px; border-bottom:1px solid rgba(255,255,255,.46); font-size:13px; font-weight:750; }
.result-promise a b { margin-left:18px; color:var(--aqua); }
.result-outcomes { padding:28px 52px; color:var(--white); background:var(--navy); }
.result-outcomes article { min-height:184px; display:grid; grid-template-columns:52px 1fr; gap:22px; align-items:center; border-bottom:1px solid rgba(255,255,255,.12); }
.result-outcomes article:last-child { border-bottom:0; }
.outcome-number { align-self:start; margin-top:48px; color:var(--aqua); font-size:10px; font-weight:800; letter-spacing:.15em; }
.result-outcomes p { margin:0 0 10px; color:#7890aa; font-size:10px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.result-outcomes h3 { max-width:620px; margin:0; color:var(--white); font-size:21px; font-weight:600; line-height:1.48; letter-spacing:-.015em; }
.result-principle { margin-top:30px; padding:28px 0; display:flex; align-items:center; justify-content:space-between; gap:40px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.result-principle p { max-width:520px; margin:0; color:var(--navy); font-size:14px; font-weight:650; }
.result-principle p span { display:block; margin-bottom:5px; color:var(--blue); font-size:9px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.result-principle > div { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
.result-principle > div span { padding:9px 13px; border-radius:999px; color:#536277; background:#edf2f7; font-size:10px; font-weight:700; }
.mini-flow { display: flex; align-items: center; margin: 25px auto 20px; width: 80%; }
.mini-flow div { width: 48px; height: 48px; border: 1px solid rgba(255,255,255,.36); border-radius: 50%; }
.mini-flow div.active { background: var(--aqua); border-color: var(--aqua); box-shadow: 0 0 25px rgba(6,214,160,.32); }
.mini-flow i { flex: 1; height: 1px; background: rgba(255,255,255,.35); }
.data-bars { height: 145px; display: flex; align-items: end; justify-content: center; gap: 12px; }
.data-bars i { width: 20px; border-radius: 8px 8px 2px 2px; background: #d9e0e9; }
.data-bars i:nth-child(1) { height: 32%; }
.data-bars i:nth-child(2) { height: 52%; }
.data-bars i:nth-child(3) { height: 41%; }
.data-bars i:nth-child(4) { height: 75%; background: var(--blue); }
.data-bars i:nth-child(5) { height: 92%; background: var(--aqua); }
.node-map { position: relative; height: 160px; }
.node-map::before, .node-map::after { content:""; position:absolute; height:1px; width:70%; top:50%; left:15%; background:#cad4e0; transform:rotate(18deg); }
.node-map::after { transform:rotate(-22deg); }
.node-map i { position:absolute; z-index:1; width:22px; height:22px; border:5px solid var(--light); border-radius:50%; background:var(--blue); box-shadow:0 0 0 1px #c7d1dc; }
.node-map i:nth-child(1) { left:7%; top:25%; }
.node-map i:nth-child(2) { left:35%; top:70%; background:var(--aqua); }
.node-map i:nth-child(3) { left:52%; top:12%; }
.node-map i:nth-child(4) { right:9%; top:56%; background:var(--navy); }
.node-map i:nth-child(5) { left:44%; top:46%; width:34px; height:34px; background:var(--aqua); }
.custom-software { color:var(--white); background:linear-gradient(135deg, #10243a 0%, var(--navy) 70%); }
.custom-software-layout { display:grid; grid-template-columns:280px 1fr; gap:70px; }
.custom-software .section-index { color:rgba(255,255,255,.5); }
.software-copy { max-width:850px; }
.software-copy h2 { margin:0; font-size:clamp(40px, 5vw, 62px); line-height:1.1; letter-spacing:-.045em; }
.software-text { margin-top:44px; display:grid; grid-template-columns:1fr 1fr; gap:0 45px; color:rgba(255,255,255,.62); font-size:14px; }
.software-text p { margin:0 0 24px; }
.software-principle { margin-top:30px; padding:30px 34px; border:1px solid rgba(255,255,255,.13); border-radius:18px; background:rgba(255,255,255,.05); }
.software-principle span { display:block; margin-bottom:9px; color:var(--aqua); font-size:10px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.software-principle strong { display:block; max-width:720px; font-size:20px; line-height:1.5; }
.audience-band { margin-top:76px; padding:38px 0; display:grid; grid-template-columns:.85fr 1.15fr; gap:50px; align-items:center; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.audience-band > div:first-child span { color:var(--blue); font-size:10px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.audience-band h3 { margin:8px 0 0; color:var(--navy); font-size:22px; line-height:1.35; }
.audience-tags { display:flex; flex-wrap:wrap; gap:9px; justify-content:flex-end; }
.audience-tags span { padding:9px 14px; border:1px solid #cbd5e1; border-radius:999px; color:#566579; background:var(--light); font-size:11px; font-weight:700; }

.cta-section { position: relative; overflow: hidden; padding: 120px 0; color: var(--white); background: var(--navy); }
.cta-section::before { content:""; position:absolute; left:0; right:0; top:0; height:1px; background:linear-gradient(90deg, transparent, var(--aqua), transparent); opacity:.5; }
.cta-glow { position:absolute; width:640px; height:640px; left:-210px; bottom:-340px; border-radius:50%; background:radial-gradient(circle, rgba(37,99,235,.28), transparent 68%); }
.cta-layout { position: relative; display:grid; grid-template-columns: 280px 1fr; gap:70px; align-items:center; }
.cta-mark img { width:150px; filter:drop-shadow(0 25px 35px rgba(0,0,0,.25)); }
.cta-copy { max-width:780px; }
.cta-copy h2 { margin:0; font-size:clamp(46px, 6vw, 76px); line-height:1.04; letter-spacing:-.05em; }
.cta-copy > p:not(.eyebrow) { max-width:690px; margin:28px 0 36px; color:rgba(255,255,255,.62); font-size:16px; }

.site-footer { color: rgba(255,255,255,.56); background:#07131f; }
.footer-main { min-height:190px; display:flex; align-items:center; gap:44px; border-bottom:1px solid rgba(255,255,255,.1); }
.footer-logo { width:190px; }
.footer-main p { flex:1; font-size:12px; letter-spacing:.08em; }
.footer-main a { color:var(--white); font-size:12px; font-weight:700; }
.footer-main a span { color:var(--aqua); margin-left:10px; }
.footer-bottom { min-height:80px; display:flex; align-items:center; gap:35px; font-size:10px; text-transform:uppercase; letter-spacing:.09em; }
.footer-bottom span:last-child { margin-left:auto; color:rgba(255,255,255,.34); }

.contact-dialog { width:min(630px, calc(100% - 32px)); max-height:90vh; overflow:auto; padding:48px; border:1px solid #dfe6ee; border-radius:24px; color:var(--ink); background:var(--white); box-shadow:0 40px 110px rgba(5,16,28,.4); }
.contact-dialog::backdrop { background:rgba(5,14,24,.77); backdrop-filter:blur(8px); }
.dialog-close { position:absolute; top:20px; right:20px; width:38px; height:38px; border:1px solid var(--line); border-radius:50%; background:transparent; font-size:22px; cursor:pointer; }
.contact-dialog h2 { margin:0; font-size:38px; line-height:1.1; letter-spacing:-.04em; }
.contact-dialog > p:not(.kicker) { margin:18px 0 28px; color:#667486; font-size:14px; }
.contact-dialog form { display:grid; gap:16px; }
.contact-dialog label { display:grid; gap:7px; color:#46566a; font-size:12px; font-weight:700; }
.contact-dialog input, .contact-dialog textarea { width:100%; padding:12px 14px; border:1px solid #ced8e4; border-radius:10px; background:var(--light); resize:vertical; outline:none; }
.contact-dialog input:focus, .contact-dialog textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(37,99,235,.1); }
.contact-dialog .button { justify-self:start; margin-top:8px; }
.dialog-success { padding:25px 0 10px; text-align:center; }
.dialog-success > span { width:62px; height:62px; display:grid; place-items:center; margin:0 auto 18px; border-radius:50%; color:var(--navy); background:var(--aqua); font-size:28px; }
.dialog-success h3 { margin:0; font-size:24px; }
.dialog-success p { color:#677588; }

.reveal { opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease; }
.reveal[data-delay="1"] { transition-delay:.12s; }
.reveal[data-delay="2"] { transition-delay:.24s; }
.reveal.visible { opacity:1; transform:none; }
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }

@media (max-width: 980px) {
  :root { --shell:min(100% - 38px, 820px); }
  .hero { min-height:auto; padding-top:150px; }
  .hero-layout { grid-template-columns:1fr; gap:70px; }
  .human-card { max-width:640px; width:100%; margin-inline:auto; }
  .statement-grid, .section-heading, .possibilities-head, .cta-layout, .use-case-layout, .custom-software-layout { grid-template-columns:1fr; gap:34px; }
  .value-strip { grid-template-columns:1fr; }
  .value-strip article, .value-strip article + article { padding:30px 0; border-left:0; border-bottom:1px solid var(--line); }
  .value-strip article:last-child { border-bottom:0; }
  .value-strip h3 { margin-top:16px; }
  .approach-row { grid-template-columns:70px 1fr 70px; gap:24px; }
  .result-stage { grid-template-columns:1fr; }
  .result-promise { min-height:500px; }
  .result-principle { align-items:flex-start; flex-direction:column; }
  .result-principle > div { justify-content:flex-start; }
  .case-flow { grid-template-columns:repeat(2, 1fr); }
  .case-flow article:nth-child(3) { border-left:0; border-top:1px solid #cdd8e3; }
  .case-flow article:nth-child(4) { border-top:1px solid #cdd8e3; }
  .audience-band { grid-template-columns:1fr; gap:25px; }
  .audience-tags { justify-content:flex-start; }
  .cta-mark { display:none; }
}

@media (max-width: 720px) {
  :root { --shell:calc(100% - 32px); }
  .section { padding:86px 0; }
  .header-inner { height:72px; }
  .brand img { width:155px; }
  .menu-button { display:block; }
  .site-nav { position:absolute; top:72px; left:0; right:0; display:none; padding:24px 20px 30px; flex-direction:column; align-items:flex-start; gap:22px; background:rgba(11,26,43,.98); border-top:1px solid rgba(255,255,255,.1); }
  .site-nav.open { display:flex; }
  .site-nav .nav-cta { width:100%; text-align:center; }
  .hero { padding-top:130px; }
  h1 { font-size:46px; }
  .hero-intro { font-size:16px; }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:16px; }
  .human-card { min-height:420px; }
  .human-illustration { height:310px; padding-top:40px; }
  .transformation-visual { height:auto; padding:0; }
  .human-note { top:18px; left:18px; font-size:12px; }
  .human-caption { min-height:120px; padding:20px 24px 24px; }
  .orbit-one { width:190px; height:190px; }
  .orbit-two { width:265px; height:265px; }
  .data-pill { transform:scale(.88); }
  .pill-a { left:-12px; }.pill-b{right:-15px}.pill-c{left:3px}
  .hero-bottom { margin-top:70px; }
  .hero-bottom p { display:none; }
  .statement-copy h2, .possibilities h2 { font-size:39px; }
  .value-strip { margin-top:60px; }
  .section-heading { margin-bottom:55px; }
  .approach-row { grid-template-columns:40px 1fr; gap:16px; padding:32px 0; }
  .approach-row:hover { padding-left:0; padding-right:0; }
  .step-icon { display:none; }
  .step-copy h3 { font-size:21px; }
  .result-stage { margin-top:52px; border-radius:22px 22px 22px 6px; }
  .result-promise { min-height:460px; padding:34px 28px; }
  .result-promise h3 { font-size:40px; }
  .result-outcomes { padding:8px 28px; }
  .result-outcomes article { min-height:0; grid-template-columns:38px 1fr; gap:10px; padding:30px 0; }
  .outcome-number { margin-top:4px; }
  .result-outcomes h3 { font-size:18px; }
  .case-message { margin-bottom:38px; font-size:36px; }
  .case-flow { grid-template-columns:1fr; }
  .case-flow article { min-height:0; padding:24px 0; }
  .case-flow article + article, .case-flow article:nth-child(3), .case-flow article:nth-child(4) { border-left:0; border-top:1px solid #cdd8e3; }
  .case-flow article h3 { margin:22px 0 7px; }
  .human-control { align-items:flex-start; padding:20px; }
  .software-text { grid-template-columns:1fr; gap:0; }
  .software-principle { padding:24px; }
  .cta-section { padding:92px 0; }
  .cta-copy h2 { font-size:45px; }
  .footer-main { padding:45px 0; flex-direction:column; align-items:flex-start; gap:18px; }
  .footer-main p { margin:0; }
  .footer-bottom { padding:25px 0; flex-direction:column; align-items:flex-start; gap:8px; }
  .footer-bottom span:last-child { margin:8px 0 0; }
  .contact-dialog { padding:42px 24px 28px; }
  .contact-dialog h2 { font-size:30px; }
}

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