:root {
  --black: #08090b;
  --black-2: #101114;
  --panel: #15171b;
  --white: #f5f5f7;
  --paper: #fbfbfd;
  --text: #1d1d1f;
  --muted: #86868b;
  --muted-dark: #a1a1a6;
  --teal: #129699;
  --teal-bright: #48d6d2;
  --highlight: #d9fffc;
  --line-dark: rgba(255,255,255,.1);
  --line-light: rgba(0,0,0,.1);
  --max: 1200px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: #101c1d; }
body { margin: 0; overflow-x: hidden; color: var(--white); background: linear-gradient(145deg, #192021 0%, #102627 100%); font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", Arial, sans-serif; line-height: 1.5; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
::selection { color: #fff; background: var(--teal); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.skip-link { position: fixed; z-index: 100; top: -5rem; left: 1rem; padding: .75rem 1rem; color: var(--black); background: var(--white); border-radius: 10px; }
.skip-link:focus { top: 1rem; }

.site-header { position: fixed; z-index: 50; top: 0; left: 0; right: 0; height: 64px; display: flex; align-items: center; justify-content: space-between; padding: 0 max(24px, calc((100vw - var(--max))/2)); background: rgba(15,28,29,.74); border-bottom: 1px solid transparent; backdrop-filter: saturate(180%) blur(20px); transition: border-color .25s ease; }
.site-header.scrolled { border-bottom-color: var(--line-dark); }
.brand { display: flex; align-items: center; gap: 1rem; }
.brand img { width: 145px; }
.brand span { padding-left: 1rem; border-left: 1px solid var(--line-dark); color: #9b9ba0; font-size: .7rem; font-weight: 500; letter-spacing: .04em; }
.main-nav { display: flex; align-items: center; gap: 1.7rem; color: #c7c7cc; font-size: .74rem; font-weight: 500; }
.main-nav a { transition: color .2s ease; }
.main-nav a:hover { color: #fff; }
.main-nav .nav-contact { padding: .55rem .9rem; color: var(--black); background: var(--white); border-radius: 999px; }
.main-nav .nav-contact:hover { color: var(--black); background: #e9e9ed; }
.nav-toggle { display: none; padding: .5rem; border: 0; background: none; }
.nav-toggle span { display: block; width: 22px; height: 1px; margin: 6px 0; background: #fff; }

.hero { min-height: max(760px,100svh); position: relative; isolation: isolate; display: flex; align-items: center; padding: 150px max(24px,calc((100vw - var(--max))/2)) 120px; overflow: hidden; text-align: left; background-image: linear-gradient(90deg,rgba(6,17,19,.98) 0%,rgba(8,22,24,.92) 38%,rgba(8,20,22,.6) 72%,rgba(8,18,20,.38) 100%),url('assets/hero-server.jpg'); background-size: cover; background-position: center; }
.hero::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(180deg,rgba(4,11,12,.18),transparent 55%,rgba(7,19,20,.72)); }
.eyebrow { margin: 0 0 1.3rem; color: var(--teal-bright); font-size: .78rem; font-weight: 600; letter-spacing: .01em; }
.hero-copy { width: 100%; max-width: 970px; position: relative; z-index: 2; margin: 0; padding: 54px 0; }
.hero h1 { margin: 0; font-size: clamp(4rem,7.5vw,7.4rem); line-height: .98; letter-spacing: -.065em; font-weight: 650; }
.hero h1 span { background: linear-gradient(100deg, #fff 0%, var(--highlight) 18%, var(--teal-bright) 58%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-copy > p:not(.eyebrow) { max-width: 650px; margin: 2rem 0 0; color: #c0c7c8; font-size: clamp(1.05rem,1.65vw,1.3rem); line-height: 1.55; text-shadow: 0 2px 18px rgba(0,0,0,.55); }
.hero-actions { display: flex; justify-content: flex-start; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: .55rem; padding: 0 1.25rem; border-radius: 999px; font-size: .9rem; font-weight: 600; transition: transform .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); }
.button.primary { color: #fff; background: var(--teal); }
.button.primary:hover { background: #18a7aa; }
.button.secondary { color: #e8e8ed; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); }

.platform { max-width: 1120px; min-height: 630px; margin: 110px auto 0; position: relative; overflow: hidden; text-align: left; background: rgba(18,19,24,.78); border: 1px solid rgba(255,255,255,.13); border-radius: 30px; box-shadow: 0 70px 160px rgba(0,0,0,.56), 0 0 120px rgba(62,165,165,.08); backdrop-filter: blur(18px); }
.platform::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 74% 40%, rgba(72,214,210,.12), transparent 30%); }
.platform-bar { min-height: 56px; display: flex; align-items: center; justify-content: space-between; padding: 0 24px; border-bottom: 1px solid var(--line-dark); color: #8d8d93; font-size: .74rem; }
.platform-brand { color: #d6d6da; font-weight: 600; }
.platform-state { display: flex; align-items: center; gap: .5rem; }
.platform-state i { width: 6px; height: 6px; background: var(--teal-bright); border-radius: 50%; box-shadow: 0 0 12px rgba(72,214,210,.8); }
.platform-canvas { min-height: 515px; display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 4rem; padding: 64px 74px; }
.platform-intro small { color: #7b7b82; font-size: .75rem; }
.platform-intro h2 { margin: 1rem 0 0; color: #f5f5f7; font-size: clamp(2.8rem, 5vw, 5rem); line-height: 1.02; letter-spacing: -.055em; font-weight: 580; }
.stack { position: relative; }
.stack::before { content: ''; position: absolute; z-index: 0; left: 30px; top: 42px; bottom: 42px; width: 1px; background: linear-gradient(#fff, var(--teal-bright)); }
.stack article { position: relative; z-index: 1; min-height: 74px; display: grid; grid-template-columns: 44px 1fr; gap: .8rem; align-items: center; margin: 8px 0; padding: 0 18px; background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.09); border-radius: 14px; box-shadow: 0 8px 20px rgba(0,0,0,.12); }
.stack article span { color: var(--teal-bright); font-size: .66rem; font-weight: 650; }
.stack strong { display: block; font-size: .92rem; }
.stack small { display: block; margin-top: 3px; color: #77777d; font-size: .72rem; }
.platform-foot { min-height: 58px; display: flex; align-items: center; justify-content: center; gap: 3rem; padding: 0 24px; border-top: 1px solid var(--line-dark); color: #6f6f75; font-size: .7rem; }

.intro-section { padding: 170px 24px 140px; color: var(--text); background: linear-gradient(145deg, #fff 0%, #f7fcfc 48%, #eaf8f7 100%); }
.section-copy { max-width: var(--max); margin: 0 auto; }
.section-copy h2 { margin: 0; font-size: clamp(3rem, 6.6vw, 6.5rem); line-height: 1.02; letter-spacing: -.065em; font-weight: 620; }
.section-copy h2 span { color: var(--teal); }
.section-copy > p:last-child { max-width: 620px; margin: 2rem 0 0 auto; color: #6e6e73; font-size: 1.12rem; }
.intro-section .eyebrow { color: var(--teal); }
.continuity { max-width: var(--max); display: flex; align-items: center; gap: 1rem; margin: 100px auto 0; color: #6e6e73; font-size: .76rem; }
.continuity i { flex: 1; height: 1px; position: relative; background: #d1d1d6; }
.continuity i::after { content: ''; position: absolute; right: -1px; top: -3px; width: 7px; height: 7px; background: var(--teal); border-radius: 50%; }

.two-worlds { padding: 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; background: linear-gradient(145deg, #fff 0%, #edf9f8 100%); }
.world { min-height: 950px; position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; padding: clamp(2rem, 5vw, 5rem); border-radius: 32px; }
.world-head { display: flex; justify-content: space-between; color: #8f8f94; font-size: .72rem; font-weight: 600; }
.world-copy { margin-top: auto; }
.world-copy h2 { margin: 0; font-size: clamp(3rem, 5.5vw, 5.7rem); line-height: .98; letter-spacing: -.065em; font-weight: 620; }
.world-copy > p:last-child { max-width: 560px; margin: 1.6rem 0 3rem; color: #747479; font-size: 1.04rem; }
.world ul { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line-light); }
.world li { padding: 1rem 0; border-bottom: 1px solid var(--line-light); color: #4d4d52; font-size: .88rem; }
.world-network { color: var(--text); background: linear-gradient(145deg, #f8fafa 0%, #e8f6f5 100%); }
.world-network::before { content: ''; position: absolute; z-index: -1; left: 50%; top: 15%; width: 480px; height: 480px; transform: translateX(-50%); border: 1px solid rgba(18,150,153,.18); border-radius: 50%; box-shadow: 0 0 0 70px rgba(18,150,153,.025), 0 0 0 140px rgba(18,150,153,.018); }
.world-network .eyebrow { color: var(--teal); }
.world-hosting { color: #f5f5f7; background: radial-gradient(circle at 72% 20%, rgba(255,255,255,.08), transparent 34%), linear-gradient(150deg, #1d2224 0%, #112728 100%); }
.world-hosting .world-head { color: #6f6f76; }
.world-hosting .world-copy > p:last-child { color: #a0a0a7; }
.world-hosting ul { border-color: var(--line-dark); }
.world-hosting li { color: #c2c2c7; border-color: var(--line-dark); }
.world-glow { position: absolute; z-index: -1; left: 50%; top: 8%; width: 620px; height: 620px; transform: translateX(-50%); background: radial-gradient(circle, rgba(72,214,210,.25), rgba(18,150,153,.1) 38%, transparent 69%); filter: blur(12px); }
.price-note { display: flex; justify-content: space-between; align-items: center; margin-top: 1.8rem; color: var(--teal-bright); }
.price-note strong { font-size: 1rem; }
.price-note span { color: #6f6f75; font-size: .75rem; }

.network-build { height: 430vh; position: relative; color: #f5f5f7; background: radial-gradient(circle at 20% 12%, rgba(255,255,255,.09), transparent 30%), linear-gradient(150deg, #1b2022 0%, #102728 100%); --network-progress: 0%; --display-shift: 120px; --display-tilt: 8deg; }
.network-sticky { height: 100vh; position: sticky; top: 0; display: grid; grid-template-rows: minmax(260px,.72fr) minmax(430px,1.28fr); align-items: center; padding: 88px max(24px, calc((100vw - var(--max))/2)) 24px; overflow: hidden; }
.network-sticky::before { content: ''; position: absolute; width: 1000px; height: 620px; left: 50%; bottom: -220px; transform: translateX(-50%); background: radial-gradient(ellipse, rgba(72,214,210,.18), rgba(18,150,153,.07) 42%, transparent 70%); filter: blur(20px); }
.network-copy { width: 100%; max-width: 1100px; min-height: 260px; position: relative; align-self: end; }
.network-copy > .eyebrow { position: absolute; left: 50%; top: 0; transform: translateX(-50%); white-space: nowrap; }
.network-messages { min-height: 230px; position: relative; }
.network-message { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; opacity: 0; transform: translateY(30px); pointer-events: none; transition: opacity .55s ease, transform .7s cubic-bezier(.22,1,.36,1); }
.network-message.is-active { opacity: 1; transform: none; }
.network-message > span { margin-bottom: .7rem; color: #65656c; font-size: .7rem; font-weight: 600; }
.network-message h2 { margin: 0; font-size: clamp(3.2rem, 5.4vw, 5.6rem); line-height: .96; letter-spacing: -.06em; font-weight: 620; }
.network-message h2 em { color: transparent; font-style: normal; background: linear-gradient(100deg, #fff 0%, var(--highlight) 18%, var(--teal-bright) 58%); -webkit-background-clip: text; background-clip: text; }
.network-message p { max-width: 560px; margin: 1rem 0 0; color: #96969d; font-size: 1rem; }
.network-progress { height: 2px; position: absolute; left: 15%; right: 15%; bottom: 0; overflow: hidden; background: rgba(255,255,255,.08); }
.network-progress i { display: block; width: var(--network-progress); height: 100%; background: linear-gradient(90deg,#fff,var(--teal-bright)); }

.screens-scene { width: 100%; max-width: 1320px; min-height: 450px; position: relative; align-self: start; display: flex; justify-content: center; align-items: center; gap: 72px; perspective: 1600px; }
.network-halo { position: absolute; width: 900px; height: 500px; left: 50%; top: 50%; transform: translate(-50%,-50%); opacity: .7; background: radial-gradient(ellipse, rgba(40,180,178,.15), transparent 68%); filter: blur(18px); }
.display { width: min(43%,540px); position: relative; z-index: 3; transition: transform .12s linear; }
.display-a { transform: translateX(var(--display-shift)) rotateY(var(--display-tilt)); transform-origin: right center; }
.display-b { transform: translateX(calc(0px - var(--display-shift))) rotateY(calc(0deg - var(--display-tilt))); transform-origin: left center; }
.display-frame { height: 330px; position: relative; overflow: hidden; background: linear-gradient(145deg,#171a20,#0e1014); border: 6px solid #24262b; border-bottom-width: 12px; border-radius: 18px; box-shadow: 0 35px 70px rgba(0,0,0,.48), inset 0 0 0 1px rgba(255,255,255,.05); }
.display-frame::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(115deg,rgba(255,255,255,.035),transparent 24%); }
.display-top { height: 48px; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; border-bottom: 1px solid rgba(255,255,255,.08); }
.display-top strong { font-size: .76rem; }
.site-state { opacity: .25; color: #67dfa8; font-size: .62rem; transition: opacity .5s ease; }
.network-canvas { height: 220px; position: relative; }
.net-core { position: absolute; z-index: 2; left: 50%; top: 50%; width: 58px; height: 58px; display: grid; place-items: center; opacity: 0; transform: translate(-50%,-50%) scale(.7); color: #aef3ef; background: rgba(35,151,153,.14); border: 1px solid rgba(72,214,210,.5); border-radius: 16px; font-size: .7rem; font-weight: 650; box-shadow: 0 0 35px rgba(72,214,210,.1); transition: opacity .55s ease, transform .75s cubic-bezier(.22,1,.36,1); }
.net-node { position: absolute; z-index: 2; display: flex; align-items: center; gap: 7px; opacity: 0; transform: scale(.7); color: #7f8087; font-size: .58rem; transition: opacity .55s ease, transform .7s cubic-bezier(.22,1,.36,1); }
.net-node i { width: 10px; height: 10px; background: #252932; border: 1px solid #5a606c; border-radius: 3px; }
.node-wan { left: 8%; top: 47%; }.node-lan { right: 9%; top: 24%; }.node-wifi { right: 10%; bottom: 18%; }
.net-lines { position: absolute; inset: 0; opacity: 0; transition: opacity .6s ease .12s; }
.net-lines i { position: absolute; left: 50%; top: 50%; width: 36%; height: 1px; transform-origin: left center; background: linear-gradient(90deg,rgba(255,255,255,.58),rgba(72,214,210,.4)); }
.net-lines i:nth-child(1) { transform: rotate(180deg); }.net-lines i:nth-child(2) { transform: rotate(-27deg); }.net-lines i:nth-child(3) { transform: rotate(29deg); }
.display-stats { height: 50px; display: flex; align-items: center; gap: 18px; padding: 0 18px; opacity: 0; border-top: 1px solid rgba(255,255,255,.07); color: #777980; font-size: .55rem; transition: opacity .5s ease; }
.display-stats span { display: flex; align-items: center; gap: 5px; }
.display-stats i { width: 5px; height: 5px; background: var(--teal-bright); border-radius: 50%; }
.display-stand { height: 70px; position: relative; }
.display-stand::before { content: ''; position: absolute; left: 50%; top: 0; width: 75px; height: 52px; transform: translateX(-50%); background: linear-gradient(90deg,#181a1e,#36383d 50%,#181a1e); clip-path: polygon(34% 0,66% 0,76% 100%,24% 100%); }
.display-stand i { position: absolute; left: 50%; bottom: 8px; width: 150px; height: 8px; transform: translateX(-50%); background: linear-gradient(90deg,#141519,#3a3b40 50%,#141519); border-radius: 50%; box-shadow: 0 8px 14px rgba(0,0,0,.45); }
.site-link { width: 310px; height: 2px; position: absolute; z-index: 2; left: 50%; top: 50%; opacity: 0; transform: translate(-50%,-40px) scaleX(.15); background: linear-gradient(90deg,#fff,var(--teal-bright)); box-shadow: 0 0 16px rgba(72,214,210,.55); transition: opacity .5s ease, transform .8s cubic-bezier(.22,1,.36,1); }
.site-link::before,.site-link::after { content: ''; position: absolute; width: 8px; height: 8px; top: -3px; background: #b9ffff; border-radius: 50%; box-shadow: 0 0 12px rgba(72,214,210,.8); }
.site-link::before { left: -3px; }.site-link::after { right: -3px; }
.site-link i { position: absolute; inset: -3px 0; background: repeating-linear-gradient(90deg,transparent 0 15px,rgba(255,255,255,.8) 16px 18px,transparent 19px 29px); animation: networkFlow 1.3s linear infinite; }
.site-link span { position: absolute; left: 50%; top: -28px; transform: translateX(-50%); color: #7f929b; font-size: .55rem; }
@keyframes networkFlow { to { background-position: 30px 0; } }
.core-server { width: 116px; height: 265px; position: absolute; z-index: 2; left: 50%; top: 50%; opacity: .12; transform: translate(-50%,60px) scale(.82); transform-origin: center bottom; transition: opacity .65s ease, transform 1s cubic-bezier(.22,1,.36,1); filter: drop-shadow(0 30px 35px rgba(0,0,0,.55)); }
.server-top { height: 18px; margin: 0 7px -4px; background: linear-gradient(145deg,#4b4f56,#1c1f24); clip-path: polygon(8% 0,92% 0,100% 100%,0 100%); }
.server-face { height: 244px; position: relative; padding: 28px 15px; background: linear-gradient(105deg,#15181d 0%,#34383f 45%,#16191e 100%); border: 1px solid #454951; border-radius: 7px 7px 13px 13px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.03); }
.server-label { display: block; margin-bottom: 22px; color: #aeb3ba; font-size: .48rem; font-weight: 700; letter-spacing: .14em; }
.server-face > i { width: 5px; height: 5px; display: inline-block; margin-right: 5px; background: var(--teal-bright); border-radius: 50%; box-shadow: 0 0 8px rgba(72,214,210,.8); }
.server-face > i:nth-of-type(2) { background: #5fe1a4; }
.server-face > i:nth-of-type(3) { opacity: .35; }
.server-slots { display: grid; gap: 7px; margin-top: 25px; }
.server-slots b { height: 16px; position: relative; background: repeating-linear-gradient(90deg,#0e1013 0 5px,#272b31 5px 7px); border: 1px solid #3b3f46; border-radius: 3px; }
.server-slots b::after { content: ''; width: 3px; height: 3px; position: absolute; right: 6px; top: 5px; background: #5fe1a4; border-radius: 50%; }
.server-face small { position: absolute; left: 15px; bottom: 15px; color: #676c74; font-size: .38rem; letter-spacing: .1em; }
.network-ready { position: absolute; z-index: 5; left: 50%; bottom: 12px; display: flex; align-items: center; gap: 8px; padding: 10px 14px; opacity: 0; transform: translate(-50%,20px); color: #d7ece7; background: rgba(12,23,22,.9); border: 1px solid rgba(72,214,210,.22); border-radius: 999px; white-space: nowrap; font-size: .62rem; box-shadow: 0 12px 30px rgba(0,0,0,.35); transition: opacity .5s ease, transform .65s cubic-bezier(.22,1,.36,1); }
.network-ready i { width: 7px; height: 7px; background: #5fe1a4; border-radius: 50%; box-shadow: 0 0 9px rgba(95,225,164,.8); }
.network-build[data-stage="1"] .net-core,.network-build[data-stage="1"] .net-node,.network-build[data-stage="1"] .net-lines,
.network-build[data-stage="2"] .net-core,.network-build[data-stage="2"] .net-node,.network-build[data-stage="2"] .net-lines,
.network-build[data-stage="3"] .net-core,.network-build[data-stage="3"] .net-node,.network-build[data-stage="3"] .net-lines { opacity: 1; }
.network-build[data-stage="1"] .net-core,.network-build[data-stage="2"] .net-core,.network-build[data-stage="3"] .net-core { transform: translate(-50%,-50%) scale(1); }
.network-build[data-stage="1"] .net-node,.network-build[data-stage="2"] .net-node,.network-build[data-stage="3"] .net-node { transform: scale(1); }
.network-build[data-stage="1"] .core-server,.network-build[data-stage="2"] .core-server,.network-build[data-stage="3"] .core-server { opacity: 1; transform: translate(-50%,-55px) scale(1); }
.network-build[data-stage="2"] .site-link,.network-build[data-stage="3"] .site-link { opacity: 1; transform: translate(-50%,-40px) scaleX(1); }
.network-build[data-stage="2"] .display-stats,.network-build[data-stage="3"] .display-stats { opacity: 1; }
.network-build[data-stage="3"] .site-state { opacity: 1; }
.network-build[data-stage="3"] .network-ready { opacity: 1; transform: translate(-50%,0); }

.hosting-build { height: 430vh; position: relative; color: #f5f5f7; background: radial-gradient(circle at 78% 18%, rgba(255,255,255,.09), transparent 31%), linear-gradient(145deg, #1c2123 0%, #102728 100%); --phone-lift: 80px; --phone-tilt: -10deg; --phone-scale: .88; --build-progress: 0%; }
.build-sticky { height: 100vh; position: sticky; top: 0; display: grid; grid-template-columns: minmax(0,.86fr) minmax(560px,1.14fr); gap: 4vw; align-items: center; padding: 86px max(24px, calc((100vw - var(--max))/2)); overflow: hidden; }
.build-sticky::before { content: ''; position: absolute; width: 760px; height: 760px; right: -220px; top: 50%; transform: translateY(-50%); background: radial-gradient(circle, rgba(72,214,210,.17), rgba(18,150,153,.08) 40%, transparent 68%); filter: blur(14px); }
.build-copy { min-height: 520px; display: flex; position: relative; flex-direction: column; justify-content: center; }
.build-copy > .eyebrow { position: absolute; top: 0; }
.build-messages { min-height: 390px; position: relative; }
.build-message { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; opacity: 0; transform: translateY(35px); pointer-events: none; transition: opacity .55s ease, transform .7s cubic-bezier(.22,1,.36,1); }
.build-message.is-active { opacity: 1; transform: none; }
.build-message > span { margin-bottom: 1.2rem; color: #696970; font-size: .7rem; font-weight: 600; }
.build-message h2 { margin: 0; font-size: clamp(3.4rem, 6vw, 6.2rem); line-height: .95; letter-spacing: -.065em; font-weight: 620; }
.build-message h2 em { color: transparent; font-style: normal; background: linear-gradient(100deg, #fff 0%, var(--highlight) 18%, var(--teal-bright) 58%); -webkit-background-clip: text; background-clip: text; }
.build-message p { max-width: 520px; margin: 1.6rem 0 0; color: #96969d; font-size: 1.05rem; }
.build-progress { height: 2px; position: absolute; left: 0; right: 25%; bottom: 0; overflow: hidden; background: rgba(255,255,255,.09); }
.build-progress i { display: block; width: var(--build-progress); height: 100%; background: linear-gradient(90deg, #fff, var(--teal-bright)); transition: width .08s linear; }

.phone-scene { min-height: 680px; position: relative; display: flex; justify-content: center; align-items: flex-end; gap: 0; padding-bottom: 35px; }
.phone-glow { position: absolute; width: 620px; height: 580px; background: radial-gradient(ellipse, rgba(72,214,210,.24), rgba(18,150,153,.08) 43%, transparent 70%); filter: blur(20px); opacity: .8; }
.phone { width: 244px; height: 492px; position: relative; z-index: 3; margin-left: -70px; padding: 7px; transform: perspective(1200px) rotateY(var(--phone-tilt)) translateY(var(--phone-lift)) scale(var(--phone-scale)); transform-origin: center bottom; background: linear-gradient(145deg,#55565c,#18191d 18%,#050506 72%,#424349); border: 1px solid #5d5e63; border-radius: 42px; box-shadow: 0 45px 100px rgba(0,0,0,.65), inset 0 0 0 1px rgba(255,255,255,.08); transition: transform .1s linear; }
.web-display { width: min(480px,72%); position: relative; z-index: 2; transform: perspective(1300px) rotateY(4deg) translateY(18px); transform-origin: center bottom; }
.web-display-frame { padding: 7px; background: linear-gradient(145deg,#4d5057,#15171b 20%,#08090b 75%,#3b3e44); border: 1px solid #565a61; border-radius: 18px; box-shadow: 0 45px 90px rgba(0,0,0,.6); }
.web-browser-bar { height: 30px; display: flex; align-items: center; gap: 6px; padding: 0 11px; color: #74777e; background: #181a1f; border-radius: 11px 11px 0 0; font-size: .45rem; }
.web-browser-bar i { width: 5px; height: 5px; background: #4a4d54; border-radius: 50%; }
.web-browser-bar span { min-width: 150px; margin: 0 auto; padding: 4px 14px; text-align: center; background: #101216; border-radius: 999px; }
.web-screen { height: 300px; overflow: hidden; color: #171719; background: #eeeae3; border-radius: 0 0 11px 11px; }
.client-screenshot { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center top; }
.stimming-screenshot { object-position: center top; }
.web-screen .demo-site { min-height: 100%; padding: 0 22px 20px; }
.web-screen .demo-nav { min-height: 38px; }
.web-screen .demo-hero { display: grid; grid-template-columns: .78fr 1.22fr; grid-template-rows: auto 1fr; gap: 6px 20px; padding: 22px 0 12px; }
.web-screen .demo-hero small { grid-column: 1; }
.web-screen .demo-hero h3 { grid-column: 1; margin: 4px 0 0; font-size: 2rem; line-height: .9; }
.web-screen .demo-image { grid-column: 2; grid-row: 1 / span 2; height: 125px; }
.web-screen .demo-services { padding: 8px 0; }
.web-screen .demo-text { padding: 10px 0; }
.web-screen .demo-footer { min-height: 30px; }
.web-display-stand { height: 65px; position: relative; }
.web-display-stand::before { content: ''; width: 74px; height: 48px; position: absolute; left: 50%; top: 0; transform: translateX(-50%); background: linear-gradient(90deg,#17191d,#393c42 50%,#17191d); clip-path: polygon(34% 0,66% 0,76% 100%,24% 100%); }
.web-display-stand i { width: 145px; height: 8px; position: absolute; left: 50%; bottom: 7px; transform: translateX(-50%); background: linear-gradient(90deg,#121317,#3b3e44 50%,#121317); border-radius: 50%; box-shadow: 0 8px 14px rgba(0,0,0,.45); }
.phone-hardware { position: absolute; z-index: 5; left: 50%; top: 14px; width: 70px; height: 20px; transform: translateX(-50%); background: #050506; border-radius: 999px; }
.phone-hardware span { position: absolute; right: 9px; top: 7px; width: 6px; height: 6px; background: #152137; border-radius: 50%; box-shadow: inset 0 0 2px #5974a8; }
.phone-screen { height: 100%; position: relative; overflow: hidden; color: #171719; background: #eeeae3; border-radius: 34px; }
.demo-status { height: 38px; display: flex; justify-content: space-between; align-items: center; padding: 0 19px; color: #222; font-size: .52rem; font-weight: 650; }
.phone .client-screenshot { height: calc(100% - 38px); object-position: left top; }
.stimming-mobile-screenshot { object-position: center top; }
.phone .demo-site { min-height: calc(100% - 38px); padding: 0 13px 55px; }
.build-layer { opacity: 0; transform: translateY(18px) scale(.98); transition: opacity .65s ease, transform .75s cubic-bezier(.22,1,.36,1); }
.hosting-build[data-stage="1"] .layer-nav,.hosting-build[data-stage="1"] .layer-hero,
.hosting-build[data-stage="2"] .layer-nav,.hosting-build[data-stage="2"] .layer-hero,
.hosting-build[data-stage="3"] .layer-nav,.hosting-build[data-stage="3"] .layer-hero { opacity: 1; transform: none; }
.hosting-build[data-stage="2"] .layer-services,.hosting-build[data-stage="2"] .layer-text,
.hosting-build[data-stage="3"] .layer-services,.hosting-build[data-stage="3"] .layer-text { opacity: 1; transform: none; }
.hosting-build[data-stage="3"] .layer-footer { opacity: 1; transform: none; }
.demo-nav { min-height: 38px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(0,0,0,.11); }
.demo-nav strong { font-size: .65rem; letter-spacing: .12em; }
.demo-nav span { font-size: .6rem; }
.demo-hero { padding: 20px 0 12px; }
.demo-hero small { color: #8a7667; font-size: .55rem; text-transform: uppercase; letter-spacing: .08em; }
.demo-hero h3 { margin: 8px 0 12px; font: 500 1.75rem/.9 Georgia, serif; letter-spacing: -.055em; }
.demo-image { height: 112px; position: relative; overflow: hidden; background: linear-gradient(145deg,#9f8b79 0%,#d4c2aa 41%,#68665e 42%,#aba48e 70%,#393d39 71%); border-radius: 3px; }
.demo-image::before { content: ''; position: absolute; width: 110px; height: 110px; right: 22px; top: 34px; background: rgba(242,233,214,.48); border-radius: 50%; }
.demo-image i { position: absolute; left: 28px; bottom: 0; width: 78px; height: 92px; background: rgba(65,60,52,.62); border-radius: 70px 70px 0 0; }
.demo-services { display: grid; grid-template-columns: repeat(3,1fr); gap: 6px; padding: 12px 0; border-bottom: 1px solid rgba(0,0,0,.12); }
.demo-services span { font-size: .55rem; }
.demo-text { padding: 10px 0; }
.demo-text strong { font: 500 .92rem Georgia, serif; }
.demo-text p { max-width: 230px; margin: 7px 0 0; color: #77716b; font-size: .6rem; }
.demo-footer { min-height: 40px; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; color: #f5f2ec; background: #252821; font-size: .62rem; }
.demo-online { position: absolute; left: 50%; bottom: 13px; display: flex; align-items: center; gap: 7px; padding: 8px 12px; opacity: 0; transform: translate(-50%,20px); color: #d8eee9; background: rgba(12,23,22,.92); border: 1px solid rgba(72,214,210,.24); border-radius: 999px; white-space: nowrap; font-size: .58rem; box-shadow: 0 8px 24px rgba(0,0,0,.25); transition: opacity .5s ease .25s, transform .6s cubic-bezier(.22,1,.36,1) .25s; }
.hosting-build[data-stage="3"] .demo-online { opacity: 1; transform: translate(-50%,0); }
.demo-online i { width: 6px; height: 6px; background: #5fe1a4; border-radius: 50%; box-shadow: 0 0 9px rgba(95,225,164,.8); }
.phone-caption { position: absolute; left: 50%; bottom: -2px; display: flex; gap: 1rem; transform: translateX(-50%); color: #606067; font-size: .65rem; white-space: nowrap; }

.about-section { min-height: 860px; display: grid; grid-template-columns: 1.12fr .88fr; gap: clamp(4rem,9vw,9rem); align-items: center; padding: 150px max(24px,calc((100vw - var(--max))/2)); color: var(--text); background: radial-gradient(circle at 88% 12%,rgba(72,214,210,.16),transparent 28%),linear-gradient(145deg,#fff 0%,#f5fbfb 48%,#e7f7f6 100%); }
.about-heading .eyebrow { color: var(--teal); }
.about-heading h2 { margin: 0; font-size: clamp(3.5rem,6.5vw,6.8rem); line-height: .97; letter-spacing: -.065em; font-weight: 620; }
.about-heading h2 span { color: var(--teal); }
.about-story { padding-top: 2.1rem; border-top: 1px solid rgba(18,150,153,.24); }
.about-story > p { margin: 0 0 1.5rem; color: #626268; font-size: 1.05rem; line-height: 1.72; }
.about-story > p:first-child { color: #35353a; font-size: 1.16rem; }
.about-expertise { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 2.4rem; }
.about-expertise span { padding: .55rem .8rem; color: #376b6b; background: rgba(255,255,255,.72); border: 1px solid rgba(18,150,153,.16); border-radius: 999px; font-size: .78rem; font-weight: 600; }

.personal-section { min-height: 760px; position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: 1fr; align-items: center; padding: 150px max(24px, calc((100vw - var(--max))/2)); background: radial-gradient(circle at 50% 50%, rgba(255,255,255,.07), transparent 32%), linear-gradient(145deg, #1b2022 0%, #102728 100%); }
.personal-orbit { position: absolute; z-index: -1; left: -220px; top: 50%; width: 760px; height: 760px; transform: translateY(-50%); border: 1px solid rgba(72,214,210,.16); border-radius: 50%; box-shadow: 0 0 0 110px rgba(18,150,153,.025), 0 0 0 220px rgba(18,150,153,.015); }
.personal-orbit::after { content: ''; position: absolute; inset: 22%; background: radial-gradient(circle, rgba(72,214,210,.23), transparent 67%); border-radius: 50%; filter: blur(25px); }
.personal-orbit i { position: absolute; width: 8px; height: 8px; background: var(--teal-bright); border-radius: 50%; box-shadow: 0 0 16px rgba(72,214,210,.8); }
.personal-orbit i:nth-child(1) { right: 9%; top: 28%; }.personal-orbit i:nth-child(2) { right: 2%; bottom: 34%; }.personal-orbit i:nth-child(3) { left: 50%; bottom: 0; }
.personal-copy { max-width: 900px; margin: 0 auto; text-align: center; }
.personal-copy h2 { margin: 0; font-size: clamp(3.3rem, 6.4vw, 6.6rem); line-height: 1; letter-spacing: -.065em; font-weight: 620; }
.personal-copy h2 span { color: var(--teal-bright); }
.personal-copy > p:last-child { max-width: 660px; margin: 2rem auto 0; color: #9d9da3; font-size: 1.05rem; }
.contact { min-height: 900px; display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(4rem,8vw,8rem); align-items: center; padding: 130px max(24px, calc((100vw - var(--max))/2)); color: var(--text); background: linear-gradient(145deg, #fff 0%, #f6fcfb 42%, #e7f7f6 100%); }
.contact .eyebrow { color: var(--teal); }
.contact h2 { margin: 0; font-size: clamp(4rem, 7vw, 7.4rem); line-height: .94; letter-spacing: -.07em; font-weight: 620; }
.contact-copy > p:not(.eyebrow) { max-width: 520px; margin: 2rem 0 0; color: #6e6e73; font-size: 1.05rem; }
.contact-direct { margin-top: 3rem; border-top: 1px solid rgba(0,0,0,.12); }
.contact-direct > a { display: block; padding: 1.15rem 0; border-bottom: 1px solid rgba(0,0,0,.12); }
.contact-direct small { display: block; margin-bottom: .3rem; color: #85858b; font-size: .72rem; }
.contact-direct strong { color: var(--teal); font-size: clamp(.88rem,1.4vw,1.02rem); font-weight: 600; }
.contact-direct address { margin-top: 1.4rem; color: #85858b; font-size: .78rem; font-style: normal; }
.contact-form { display: grid; gap: 1.15rem; padding: clamp(1.5rem,4vw,3rem); background: rgba(255,255,255,.82); border: 1px solid rgba(18,150,153,.12); border-radius: 28px; box-shadow: 0 30px 80px rgba(18,100,100,.1); }
.form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.contact-form label { display: grid; gap: .48rem; color: #4c4c51; font-size: .82rem; font-weight: 600; }
.contact-form input,.contact-form textarea { width: 100%; min-height: 50px; padding: .8rem .9rem; color: var(--text); background: #fff; border: 1px solid #cfdada; border-radius: 10px; font: inherit; outline: none; transition: border-color .2s ease,box-shadow .2s ease; }
.contact-form textarea { min-height: 140px; resize: vertical; }
.contact-form input:focus,.contact-form textarea:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(18,150,153,.12); }
.contact-form .hp-field { display: none; }
.contact-form .check-row { grid-template-columns: auto 1fr; align-items: start; gap: .7rem; color: #68686d; font-size: .72rem; font-weight: 400; line-height: 1.5; }
.contact-form .check-row input { width: 17px; min-height: 17px; margin: .15rem 0 0; accent-color: var(--teal); }
.contact-form .check-row a { color: var(--teal); text-decoration: underline; }
.contact-form button { min-height: 56px; display: flex; align-items: center; justify-content: space-between; padding: 0 1.2rem; color: #fff; background: var(--text); border: 0; border-radius: 12px; font-weight: 650; cursor: pointer; }
.contact-form button span { color: var(--teal-bright); }
.form-status { padding: .9rem 1rem; color: #1d6448; background: #e5f7ee; border: 1px solid #b9e4cf; border-radius: 10px; font-size: .82rem; }
.form-status.error { color: #8d2f2f; background: #fff0f0; border-color: #efcaca; }

footer { min-height: 150px; display: grid; grid-template-columns: 1fr auto 1fr; gap: 3rem; align-items: center; padding: 36px max(24px, calc((100vw - var(--max))/2)); border-top: 1px solid var(--line-dark); background: linear-gradient(145deg, #182021 0%, #102627 100%); }
.footer-meta { display: grid; gap: .65rem; justify-self: start; }
.footer-meta > span { color: #5f5f65; font-size: .7rem; }
.footer-brand { display: flex; align-items: center; gap: .8rem; width: fit-content; justify-self: end; }
.footer-brand .footer-bird { width: 44px; height: 44px; flex: 0 0 auto; }
.footer-brand .footer-wordmark { width: 150px; }
footer p { margin: 0; color: #7c7c82; font-size: .8rem; }
footer p strong { color: #d1d1d6; font-weight: 600; }
footer nav { display: flex; gap: 1.4rem; justify-self: center; color: #a1a1a6; font-size: .75rem; }

.reveal { opacity: 0; transform: translateY(22px); transition: opacity .8s cubic-bezier(.22,1,.36,1), transform .8s cubic-bezier(.22,1,.36,1); }
.reveal.is-visible { opacity: 1; transform: none; }

.legal-page { color: var(--text); background: var(--paper); }
.legal-page .site-header { position: relative; background: var(--black); }
.legal-main { max-width: 1040px; min-height: 70vh; margin: auto; padding: 110px 24px; }
.legal-main .back { color: var(--teal); font-size: .78rem; }
.legal-main h1 { margin: 2.2rem 0 5rem; font-size: clamp(3.5rem, 8vw, 7.5rem); line-height: .95; letter-spacing: -.065em; font-weight: 620; }
.legal-grid { display: grid; grid-template-columns: .75fr 2fr; gap: 3rem; padding: 2.4rem 0; border-top: 1px solid #d2d2d7; }
.legal-grid h2 { margin: 0; font-size: 1rem; }
.legal-grid p { margin-top: 0; color: #6e6e73; }
.legal-grid a { color: var(--teal); text-decoration: underline; }
.legal-page footer { color: var(--white); }

@media (max-width: 980px) {
  .hero { min-height: 760px; background-position: 62% center; }
  .platform-canvas { grid-template-columns: 1fr; gap: 3rem; padding: 48px; }
  .two-worlds { grid-template-columns: 1fr; }
  .world { min-height: 780px; }
  .network-sticky { grid-template-rows: minmax(260px,.68fr) minmax(390px,1.32fr); }
  .display-frame { height: 285px; }
  .network-canvas { height: 175px; }
  .screens-scene { min-height: 400px; }
  .build-sticky { grid-template-columns: minmax(0,.8fr) minmax(430px,1.2fr); gap: 2rem; }
  .phone { width: 220px; height: 445px; border-radius: 40px; }
  .phone-screen { border-radius: 33px; }
  .phone-scene { min-height: 620px; }
  .demo-image { height: 145px; }
  .about-section { grid-template-columns: 1fr; gap: 4rem; }
  .personal-section, .contact { grid-template-columns: 1fr; }
  .personal-section { gap: 5rem; }
  .contact { gap: 5rem; }
  footer { grid-template-columns: 1fr auto 1fr; }
}

@media (max-width: 760px) {
  .site-header { padding: 0 18px; background: rgba(15,28,29,.96); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .brand img { width: 138px; }
  .brand span { display: none; }
  .nav-toggle { z-index: 2; display: block; }
  .main-nav { position: fixed; inset: 0; width: 100vw; height: 100dvh; min-height: 100svh; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; justify-content: center; gap: 2rem; padding: 80px 34px 34px; background: rgba(8,9,11,.98); font-size: 1.2rem; transform: translateX(100%); transition: transform .3s ease; }
  .main-nav.open { transform: none; }
  .main-nav .nav-contact { color: var(--black); }
  .hero { padding: 140px 18px 90px; }
  .hero { min-height: 700px; background-image: linear-gradient(90deg,rgba(6,17,19,.96),rgba(8,22,24,.8) 60%,rgba(8,18,20,.55)),url('assets/hero-server.jpg'); background-position: 66% center; }
  .hero-copy { padding: 26px 0; }
  .hero h1 { font-size: clamp(3.6rem, 16vw, 5.4rem); }
  .hero-copy > p:not(.eyebrow) { font-size: 1.03rem; }
  .platform { min-height: 0; margin-top: 75px; border-radius: 20px; }
  .platform-bar, .platform-foot { padding: 0 15px; }
  .platform-state { display: none; }
  .platform-canvas { padding: 36px 18px; }
  .platform-intro h2 { font-size: 2.8rem; }
  .platform-foot { justify-content: flex-start; gap: 1.3rem; overflow-x: auto; white-space: nowrap; }
  .intro-section { padding: 110px 20px 90px; }
  .section-copy h2 { font-size: clamp(3rem, 14vw, 4.6rem); }
  .section-copy > p:last-child { margin-left: 0; }
  .continuity { margin-top: 65px; overflow-x: auto; padding-bottom: .7rem; }
  .continuity span { flex: 0 0 auto; }.continuity i { flex: 0 0 42px; }
  .two-worlds { padding: 8px; gap: 8px; }
  .world { min-height: 720px; padding: 30px 24px; border-radius: 24px; }
  .world-copy h2 { font-size: clamp(3rem, 14vw, 4.4rem); }
  .network-build { height: 390vh; }
  .network-sticky { min-height: 100svh; height: 100svh; grid-template-rows: 245px minmax(0,1fr); padding: 82px 10px 12px; }
  .network-copy { min-height: 220px; }
  .network-copy > .eyebrow { font-size: .68rem; }
  .network-messages { min-height: 190px; }
  .network-message h2 { font-size: clamp(2.45rem, 10.7vw, 3.35rem); }
  .network-message p { max-width: 350px; margin-top: .75rem; padding: 0 15px; font-size: .8rem; }
  .network-message > span { display: none; }
  .network-progress { left: 8%; right: 8%; }
  .screens-scene { min-height: 370px; align-self: center; gap: 5px; }
  .display { width: 49%; }
  .display-frame { height: 180px; border-width: 3px; border-bottom-width: 7px; border-radius: 9px; }
  .display-top { height: 31px; padding: 0 7px; }
  .display-top strong { font-size: .48rem; }.site-state { font-size: .4rem; }
  .network-canvas { height: 118px; }
  .net-core { width: 37px; height: 37px; border-radius: 9px; font-size: .48rem; }
  .net-node { gap: 3px; font-size: .38rem; }
  .net-node i { width: 6px; height: 6px; }
  .display-stats { height: 27px; gap: 7px; padding: 0 6px; font-size: .36rem; }
  .display-stats i { width: 3px; height: 3px; }
  .display-stand { height: 50px; }
  .display-stand::before { width: 50px; height: 34px; }
  .display-stand i { width: 90px; height: 6px; bottom: 10px; }
  .site-link { width: 72px; transform: translate(-50%,-29px) scaleX(.15); }
  .network-build[data-stage="2"] .site-link,.network-build[data-stage="3"] .site-link { transform: translate(-50%,-29px) scaleX(1); }
  .site-link span { top: -20px; font-size: .4rem; }
  .core-server { width: 72px; height: 178px; }
  .server-top { height: 12px; }
  .server-face { height: 164px; padding: 15px 9px; }
  .server-label { margin-bottom: 8px; font-size: .3rem; }
  .server-slots { gap: 4px; margin-top: 10px; }
  .server-slots b { height: 9px; }
  .server-face small { left: 9px; bottom: 8px; font-size: .26rem; }
  .network-build[data-stage="1"] .core-server,.network-build[data-stage="2"] .core-server,.network-build[data-stage="3"] .core-server { transform: translate(-50%,-72px) scale(1); }
  .network-ready { bottom: 17px; padding: 7px 10px; font-size: .5rem; }
  .hosting-build { height: 390vh; }
  .build-sticky { min-height: 100svh; height: 100svh; grid-template-columns: 1fr; grid-template-rows: minmax(220px,.7fr) minmax(0,1.3fr); gap: 0; padding: 84px 18px 18px; }
  .build-sticky::before { right: -440px; width: 700px; height: 700px; }
  .build-copy { min-height: 0; height: 220px; align-self: start; }
  .build-copy > .eyebrow { top: 0; font-size: .7rem; }
  .build-messages { min-height: 165px; margin-top: 28px; }
  .build-message h2 { font-size: clamp(2.45rem, 10.5vw, 3.25rem); }
  .build-message p { max-width: 350px; margin-top: .8rem; font-size: .82rem; }
  .build-message > span { display: none; }
  .build-progress { right: 0; }
  .phone-scene { min-height: 0; align-self: end; padding-bottom: 20px; }
  .web-display { width: 235px; transform: perspective(1300px) rotateY(4deg) translateY(10px); }
  .web-screen { height: 205px; }
  .web-screen .demo-site { padding: 0 12px 10px; }
  .web-screen .demo-hero { gap: 4px 10px; padding: 12px 0 7px; }
  .web-screen .demo-hero h3 { font-size: 1.25rem; }
  .web-screen .demo-image { height: 78px; }
  .web-screen .demo-text { display: none; }
  .web-display-stand { height: 46px; }
  .web-display-stand::before { width: 55px; height: 34px; }
  .web-display-stand i { width: 100px; height: 6px; }
  .phone { width: 158px; height: 320px; margin-left: -52px; border-radius: 29px; }
  .phone-screen { border-radius: 23px; }
  .phone-hardware { top: 10px; width: 50px; height: 14px; }
  .phone-hardware span { top: 7px; width: 6px; height: 6px; }
  .phone-hardware span { right: 6px; top: 5px; width: 4px; height: 4px; }
  .phone .demo-status { height: 28px; padding: 0 12px; font-size: .38rem; }
  .phone .client-screenshot { height: calc(100% - 28px); }
  .phone .demo-site { min-height: calc(100% - 28px); padding: 0 9px 40px; }
  .phone .demo-nav { min-height: 27px; }
  .phone .demo-nav strong,.phone .demo-nav span { font-size: .4rem; }
  .phone .demo-hero { padding: 10px 0 6px; }
  .phone .demo-hero small { font-size: .36rem; }
  .phone .demo-hero h3 { margin: 4px 0 6px; font-size: 1.1rem; }
  .phone .demo-image { height: 70px; }
  .phone .demo-image i { width: 48px; height: 56px; }
  .phone .demo-services { padding: 5px 0; }
  .phone .demo-services span { font-size: .34rem; }
  .phone .demo-text { padding: 6px 0; }
  .phone .demo-text strong { font-size: .58rem; }
  .phone .demo-text p { font-size: .36rem; }
  .phone .demo-footer { min-height: 22px; font-size: .4rem; }
  .phone .demo-online { bottom: 8px; padding: 5px 8px; font-size: .38rem; }
  .phone-caption { display: none; }
  .about-section { min-height: auto; gap: 3rem; padding: 110px 20px; }
  .about-heading h2 { font-size: clamp(3rem,14vw,4.6rem); }
  .about-story { padding-top: 1.5rem; }
  .about-story > p,.about-story > p:first-child { font-size: 1rem; }
  .personal-section { min-height: auto; padding: 120px 20px; }
  .personal-orbit { left: -500px; }
  .personal-copy h2 { font-size: clamp(3rem, 14vw, 4.5rem); }
  .contact { min-height: auto; padding: 110px 20px; }
  .contact h2 { font-size: clamp(3.6rem, 15vw, 5rem); }
  .form-grid { grid-template-columns: 1fr; }
  .contact-form { padding: 1.25rem; border-radius: 20px; }
  footer { min-height: 0; grid-template-columns: 1fr; gap: 1.7rem; align-items: start; padding: 38px 24px; }
  footer nav { justify-self: start; }
  .footer-brand { justify-self: start; }
  .legal-grid { grid-template-columns: 1fr; gap: .9rem; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; animation: none !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .hosting-build { height: auto; }
  .build-sticky { min-height: 900px; position: relative; }
  .build-layer,.demo-online { opacity: 1; transform: none; }
  .network-build { height: auto; }
  .network-sticky { min-height: 900px; position: relative; }
  .net-core,.net-node,.net-lines,.site-link,.display-stats,.site-state,.network-ready { opacity: 1; }
}
