/* Larger first screen, with quiet geometry and a compact branded navigation. */
.header { background:#f9f8f2dc; border-bottom:1px solid #315f4914; box-shadow:0 2px 24px #264c3d06; transition:box-shadow .3s,background .3s; }
.header.is-scrolled { background:#faf9f3f5; box-shadow:0 5px 30px #264c3d0d; }
.nav.wrap { width:calc(100% - 80px); max-width:1480px; height:88px; }
.nav .brand :is(img,.brand-logo) { width:180px; height:auto; aspect-ratio:718/184; object-fit:contain; }
.nav-links { gap:4px; padding:6px; background:#e5ebe13d; border:1px solid #385f4914; border-radius:999px; font-size:15px; font-weight:500; }
.nav-links a { position:relative; padding:9px 17px; border-radius:999px; line-height:1.5; transition:background .25s,color .25s,box-shadow .25s; }
.nav-links a:hover { opacity:1; background:#ffffffa8; }
.nav-links a[aria-current="location"] { color:#fcfcf5; background:#294e41; box-shadow:0 3px 8px #294e4115; }
.mobile-nav a[aria-current="location"] { color:#294e41; font-weight:600; }
.platform-overview { min-height:calc(100svh - 88px); padding:66px 0 54px; background:radial-gradient(ellipse at 76% 40%,#d8e6d9bd,transparent 48%),radial-gradient(ellipse at 26% 91%,#e6dcc77a,transparent 49%),#f7f5ee; }
.platform-overview::before,.platform-overview::after,.real-device-showcase::before { content:none; }
.overview-wrap.overview-layout { position:relative; z-index:2; width:calc(100% - 80px); max-width:1480px; grid-template-columns:minmax(0,.92fr) minmax(0,1.5fr); gap:24px; }
.overview-copy .overview-kicker { display:flex; align-items:center; gap:11px; font-size:13px; font-weight:550; letter-spacing:.08em; margin-bottom:24px; color:#68846d; }
.overview-copy .overview-kicker::before { content:""; width:8px; height:8px; background:#5ca88d; border-radius:50%; box-shadow:0 0 0 5px #5ca88d13; }
.overview-copy h1 { font-size:clamp(42px,3.7vw,58px); line-height:1.27; letter-spacing:-.045em; font-weight:550; color:#244739; }
.overview-key::after { height:9px; inset:auto -3px 5px; background:linear-gradient(90deg,#a8c9aa26,#a8c9aa99,#a8c9aa26); }
.overview-copy .overview-intro { font-size:19px; line-height:1.9; margin-top:29px; color:#667d65; }
.overview-actions { margin-top:32px; }
.overview-story-link { gap:18px; font-size:15px; font-weight:500; color:#365c48; padding:10px 1px; border-bottom:1px solid #6e937647; }
.overview-story-link span { display:grid; place-items:center; width:27px; height:27px; border:1px solid #63856a4d; border-radius:50%; font-size:16px; }
.real-device-showcase { width:103%; max-width:none; margin-left:-3%; aspect-ratio:1.5; }
.real-laptop-screen img,.real-phone-screen img { object-fit:cover; object-position:top; }
.hero-geometry { position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:1; }
.hero-geometry i { position:absolute; display:block; }
.hero-orbit { border:1px solid #577c6229; border-radius:50%; width:730px; height:730px; left:46%; top:calc(50% - 390px); transform:rotate(-20deg); }
.hero-orbit-inner { border:1px solid #79997d22; border-radius:50%; width:540px; height:540px; left:55%; top:calc(50% - 280px); }
.hero-disc { width:160px; height:160px; border-radius:50%; right:4%; top:7%; background:linear-gradient(140deg,#d0dfc89c,#e7ece16b); box-shadow:inset 0 0 0 1px #fafbf580; }
.hero-tile { width:116px; height:116px; border-radius:26px; right:12%; bottom:13%; transform:rotate(23deg); background:linear-gradient(140deg,#dfcdbd80,#ece4d680); border:1px solid #ffffff9c; }
.hero-grid { width:116px; height:92px; left:4%; bottom:11%; background:radial-gradient(circle,#5a7d6136 1.4px,transparent 1.8px) 0 0/17px 17px; mask-image:linear-gradient(135deg,#000,transparent); }
.hero-spark { width:38px; height:38px; background:linear-gradient(#668b713b,#668b713b) center/1px 100% no-repeat,linear-gradient(#668b713b,#668b713b) center/100% 1px no-repeat; transform:rotate(20deg); left:43%; top:11%; }
.hero-tiny-ring { width:20px; height:20px; border:4px solid #789c7436; border-radius:50%; left:48%; bottom:17%; }
.hero-horizon { height:1px; width:42%; left:58%; bottom:16%; background:linear-gradient(90deg,transparent,#58786029,transparent); }
@media(min-width:1600px) { .real-device-showcase { width:106%; } }
@media(max-width:1180px) {
 .nav.wrap,.overview-wrap.overview-layout { width:calc(100% - 64px); }
 .nav .brand :is(img,.brand-logo) { width:165px; }
 .nav-links a { padding:8px 12px; }
 .nav-links { font-size:14px; }
 .overview-wrap.overview-layout { grid-template-columns:minmax(0,.94fr) minmax(0,1.25fr); gap:20px; }
 .overview-copy h1 { font-size:43px; }
 .overview-copy .overview-intro { font-size:17px; }
 .hero-orbit { left:44%; }
}
@media(max-width:900px) {
 .nav.wrap { height:78px; width:calc(100% - 48px); }
 .nav-links { display:none; }
 .menu-toggle { width:44px; height:44px; border-radius:50%; background:#edf1e7; border-color:#54776036; margin-left:auto; }
 .mobile-nav { width:calc(100% - 48px); padding:6px 0 20px; }
 .mobile-nav a { border-radius:9px; padding:10px 15px; font-size:16px; }
 .mobile-nav a[aria-current="location"] { background:#e7eee2; }
 .platform-overview { min-height:calc(100svh - 78px); padding:50px 0 42px; }
 .overview-wrap.overview-layout { display:block; width:calc(100% - 48px); }
 .overview-copy { max-width:620px; }
 .overview-copy h1 { font-size:48px; }
 .overview-copy .overview-intro { font-size:19px; margin-top:25px; }
 .real-device-showcase { width:106%; max-width:760px; margin:20px 0 0 -3%; }
 .hero-orbit { width:660px; height:660px; left:22%; top:41%; }
 .hero-orbit-inner { left:35%; top:51%; }
 .hero-disc { width:110px; height:110px; top:49%; right:-35px; }
 .hero-tile { right:14%; bottom:8%; width:95px; height:95px; }
 .hero-spark { left:auto; right:15%; top:11%; }
 .hero-grid { left:1%; bottom:7%; }
}
@media(max-width:640px) {
 .nav.wrap { width:calc(100% - 36px); height:76px; }
 .nav .brand :is(img,.brand-logo) { width:152px; height:auto; }
 .mobile-nav { width:calc(100% - 36px); }
 .platform-overview { min-height:calc(100svh - 76px); padding:46px 0 35px; }
 .overview-wrap.overview-layout { width:calc(100% - 40px); }
 .overview-copy .overview-kicker { font-size:11px; margin-bottom:21px; }
 .overview-copy h1 { font-size:clamp(32px,8.7vw,43px); line-height:1.3; }
 .overview-copy .overview-intro { font-size:16px; line-height:1.9; margin-top:22px; }
 .overview-actions { margin-top:23px; }
 .overview-story-link { font-size:14px; }
 .real-device-showcase { width:110%; margin:26px 0 0 -5%; }
 .hero-orbit { width:430px; height:430px; left:5%; top:48%; }
 .hero-orbit-inner { width:300px; height:300px; left:25%; top:57%; }
 .hero-disc { width:84px; height:84px; top:51%; right:-23px; }
 .hero-tile { width:70px; height:70px; right:11%; bottom:11%; }
 .hero-grid { width:75px; height:58px; background-size:13px 13px; left:-10px; bottom:6%; }
 .hero-spark { width:26px; height:26px; right:10%; top:5%; }
 .hero-tiny-ring { display:none; }
}
@media(prefers-reduced-motion:reduce) { .header,.nav-links a { transition:none; } }

/* V48: brand introduction, a three-character logo story, quiet moving geometry. */
.overview-name { display:inline-block; color:#193d36; font-size:clamp(56px,4.8vw,72px); letter-spacing:-.06em; margin-bottom:9px; }
.brand-logo { display:block; flex:none; aspect-ratio:718/184; overflow:visible; }
.logo-dot { fill:none; stroke:#67c6b3; stroke-width:11; stroke-linecap:round; }
.logo-limbs,.logo-pull,.logo-call,.logo-boost { fill:none; stroke:#67c6b3; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }
.logo-runner { transform-origin:0 0; }
.logo-runner-1 { animation:brand-story-1 20s cubic-bezier(.35,0,.25,1) infinite; }
.logo-runner-2 { animation:brand-story-2 20s cubic-bezier(.35,0,.25,1) infinite; }
.logo-runner-3 { animation:brand-story-3 20s cubic-bezier(.35,0,.25,1) infinite; }
.logo-limbs-1 { animation:brand-limbs-1 20s linear infinite; }
.logo-limbs-2 { animation:brand-limbs-2 20s linear infinite; }
.logo-limbs-3 { animation:brand-limbs-3 20s linear infinite; }
.logo-leg { transform-origin:0 9px; animation:brand-stride .24s ease-in-out infinite alternate; }
.logo-leg-right { animation-delay:-.24s; }
.logo-pull { animation:brand-pull 20s linear infinite; }
.logo-boost { animation:brand-boost 20s linear infinite; }
.logo-call { animation:brand-call 20s linear infinite; }
@keyframes brand-stride { from {transform:rotate(-20deg)} to {transform:rotate(20deg)} }
@keyframes brand-limbs-1 { 0%,23%{opacity:1} 24%,100%{opacity:0} }
@keyframes brand-limbs-2 { 0%,27.5%{opacity:1} 29%,100%{opacity:0} }
@keyframes brand-limbs-3 { 0%,32%{opacity:1} 33%,100%{opacity:0} }
@keyframes brand-pull { 0%,18.5%{opacity:0} 19.5%,21.5%{opacity:1} 23.5%,100%{opacity:0} }
@keyframes brand-boost { 0%,13%{opacity:0} 14.5%,15.5%{opacity:.9} 17%,100%{opacity:0} }
@keyframes brand-call { 0%,25%{opacity:0} 26%,27.5%{opacity:1} 29%,100%{opacity:0} }
@keyframes brand-story-1 {
 0% {transform:translate(-306.5px,30px) rotate(-10deg) scale(1,1);opacity:0}
 0.9% {transform:translate(-306.5px,30px) rotate(-10deg) scale(1,1);opacity:1}
 6% {transform:translate(-38px,30px) rotate(12deg) scale(1,1);opacity:1}
 8.5% {transform:translate(-5px,30px) rotate(-4deg) scale(1,1);opacity:1}
 10% {transform:translate(-1px,12px) rotate(-13deg) scale(1,1);opacity:1}
 11.25% {transform:translate(-2px,26px) rotate(8deg) scale(1,1);opacity:1}
 12.75% {transform:translate(0px,34px) rotate(5deg) scale(1,1);opacity:1}
 14% {transform:translate(-2px,26px) rotate(0deg) scale(1.05,0.94);opacity:1}
 16.25% {transform:translate(0px,-8px) rotate(-8deg) scale(1,1.08);opacity:1}
 17.75% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 19.5% {transform:translate(0px,1px) rotate(12deg) scale(1,1);opacity:1}
 21.5% {transform:translate(0px,-4px) rotate(8deg) scale(1,1);opacity:1}
 23.5% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 33% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 34.75% {transform:translate(0px,-14px) rotate(0deg) scale(1,1.15);opacity:1}
 35.6% {transform:translate(0px,2px) rotate(0deg) scale(1.08,0.92);opacity:1}
 37.5% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 96.5% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 98% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:0}
 100% {transform:translate(-306.5px,30px) rotate(-10deg) scale(1,1);opacity:0}
}
@keyframes brand-story-2 {
 0% {transform:translate(-329px,35px) rotate(0deg) scale(1,1);opacity:0}
 3.2% {transform:translate(-329px,35px) rotate(0deg) scale(1,1);opacity:0}
 3.5% {transform:translate(-329px,35px) rotate(0deg) scale(1,1);opacity:1}
 9.25% {transform:translate(-38px,40px) rotate(-8deg) scale(1,1);opacity:1}
 11.75% {transform:translate(-22px,43px) rotate(-14deg) scale(1,1);opacity:1}
 14.25% {transform:translate(-23px,46px) rotate(-7deg) scale(1.1,0.85);opacity:1}
 15.75% {transform:translate(-23px,34px) rotate(0deg) scale(1,1.2);opacity:1}
 17.25% {transform:translate(-16px,27px) rotate(-12deg) scale(1,1);opacity:1}
 19.75% {transform:translate(-2px,20px) rotate(-12deg) scale(1,1);opacity:1}
 22.5% {transform:translate(0px,-3px) rotate(0deg) scale(1,1);opacity:1}
 24% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 25.5% {transform:translate(0px,0px) rotate(28deg) scale(1,1);opacity:1}
 27.75% {transform:translate(4px,-3px) rotate(20deg) scale(1,1);opacity:1}
 29.5% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 33% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 34.75% {transform:translate(0px,-14px) rotate(0deg) scale(1,1.15);opacity:1}
 35.6% {transform:translate(0px,2px) rotate(0deg) scale(1.08,0.92);opacity:1}
 37.5% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 96.5% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 98% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:0}
 100% {transform:translate(-329px,35px) rotate(0deg) scale(1,1);opacity:0}
}
@keyframes brand-story-3 {
 0% {transform:translate(-353.5px,30px) rotate(0deg) scale(1,1);opacity:0}
 5.25% {transform:translate(-353.5px,30px) rotate(0deg) scale(1,1);opacity:0}
 5.5% {transform:translate(-353.5px,30px) rotate(0deg) scale(1,1);opacity:1}
 11% {transform:translate(-160px,28px) rotate(20deg) scale(1,1);opacity:1}
 18% {transform:translate(0px,30px) rotate(-8deg) scale(1,1);opacity:1}
 23.25% {transform:translate(65px,30px) rotate(-12deg) scale(1,1);opacity:1}
 25.25% {transform:translate(92px,29px) rotate(36deg) scale(1,1);opacity:1}
 27% {transform:translate(80px,30px) rotate(-18deg) scale(1,1);opacity:1}
 28.5% {transform:translate(32px,27px) rotate(-20deg) scale(1,1);opacity:1}
 31% {transform:translate(0px,18px) rotate(-15deg) scale(1,1);opacity:1}
 32.5% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 33% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 34.75% {transform:translate(0px,-14px) rotate(0deg) scale(1,1.15);opacity:1}
 35.6% {transform:translate(0px,2px) rotate(0deg) scale(1.08,0.92);opacity:1}
 37.5% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 96.5% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:1}
 98% {transform:translate(0px,0px) rotate(0deg) scale(1,1);opacity:0}
 100% {transform:translate(-353.5px,30px) rotate(0deg) scale(1,1);opacity:0}
}

.hero-geometry::before,.hero-geometry::after { content:""; position:absolute; pointer-events:none; border-radius:50%; }
.hero-geometry::before { width:700px; height:600px; left:38%; top:-7%; background:radial-gradient(ellipse,#b8dac62b,transparent 68%); animation:hero-glow 19s ease-in-out infinite alternate; }
.hero-geometry::after { width:500px; height:420px; right:1%; bottom:-9%; background:radial-gradient(ellipse,#e1cbbd2b,transparent 68%); animation:hero-glow 23s -8s ease-in-out infinite alternate-reverse; }
.hero-orbit { animation:hero-orbit-drift 23s ease-in-out infinite alternate; }
.hero-orbit-inner { animation:hero-inner-drift 27s -7s ease-in-out infinite alternate; }
.hero-disc { animation:hero-disc-float 15s -3s ease-in-out infinite alternate; }
.hero-tile { animation:hero-tile-float 18s -6s ease-in-out infinite alternate; }
.hero-grid { animation:hero-grid-breathe 10s -2s ease-in-out infinite alternate; }
.hero-spark { animation:hero-spark-turn 17s -4s ease-in-out infinite alternate; }
.hero-tiny-ring { animation:hero-ring-float 12s -5s ease-in-out infinite alternate; }
.hero-horizon { animation:hero-horizon-breathe 14s -6s ease-in-out infinite alternate; transform-origin:right; }
@keyframes hero-glow { from{transform:translate(-12px,8px) scale(.97);opacity:.55} to{transform:translate(18px,-14px) scale(1.06);opacity:1} }
@keyframes hero-orbit-drift { from{transform:translate(-8px,8px) rotate(-23deg)} to{transform:translate(10px,-12px) rotate(-17deg)} }
@keyframes hero-inner-drift { from{transform:translate(10px,-8px) rotate(-4deg)} to{transform:translate(-12px,14px) rotate(4deg)} }
@keyframes hero-disc-float { from{transform:translate(0,6px) scale(.98)} to{transform:translate(-8px,-13px) scale(1.025)} }
@keyframes hero-tile-float { from{transform:translate(0,5px) rotate(21deg)} to{transform:translate(7px,-12px) rotate(28deg)} }
@keyframes hero-grid-breathe { from{transform:translateY(3px);opacity:.55} to{transform:translateY(-3px);opacity:1} }
@keyframes hero-spark-turn { from{transform:rotate(14deg)} to{transform:rotate(72deg)} }
@keyframes hero-ring-float { from{transform:translateY(4px)} to{transform:translateY(-7px)} }
@keyframes hero-horizon-breathe { from{transform:scaleX(.8);opacity:.35} to{transform:scaleX(1.03);opacity:.9} }
.site-motion-paused .brand-logo *,.site-motion-paused .hero-geometry i,.site-motion-paused .hero-geometry::before,.site-motion-paused .hero-geometry::after,
.hero-motion-paused .hero-geometry i,.hero-motion-paused .hero-geometry::before,.hero-motion-paused .hero-geometry::after { animation-play-state:paused; }
@media(max-width:640px) { .overview-name {font-size:clamp(46px,12vw,62px);margin-bottom:7px;} }
@media(prefers-reduced-motion:reduce) {
 .brand-logo *,.hero-geometry i,.hero-geometry::before,.hero-geometry::after {animation:none!important;}
 .logo-runner {opacity:1;transform:none;}
 .logo-limbs,.logo-pull,.logo-boost,.logo-call {opacity:0;}
}
