@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@500;700;800&display=swap');

:root { color-scheme: dark; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: #000; color: #fff; font-family: 'Manrope', sans-serif; }
.construction-page { position: relative; display: grid; min-height: 100vh; place-items: center; overflow: hidden; isolation: isolate; background: #000; }
.construction-page::before, .construction-page::after { display: none; }
.brand-lockup { position: relative; z-index: 1; display: flex; width: min(700px, 92vw); flex-direction: column; align-items: center; text-align: center; animation: appear 1.2s cubic-bezier(.2,.8,.2,1) both; }
.brand-lockup::before { position: absolute; top: 7%; left: 50%; width: min(560px, 90vw); height: min(560px, 90vw); border: 1px solid rgba(159,232,112,.08); border-radius: 50%; content: ''; pointer-events: none; transform: translateX(-50%); box-shadow: inset 0 0 55px rgba(32,216,209,.05), 0 0 35px rgba(45,109,255,.05); animation: outer-breath 8s ease-in-out infinite; }
.brand-lockup::after { position: absolute; top: 20%; left: 50%; width: 76%; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent); content: ''; opacity: 0; pointer-events: none; transform: translate(-50%, -50%) rotate(-24deg); filter: blur(1px); animation: lens-sweep 7s ease-in-out 1.5s infinite; }
.logo-universe { position: relative; display: grid; width: min(540px, 84vw); aspect-ratio: 1; place-items: center; }
.logo-universe::before { position: absolute; width: 48%; height: 48%; border-radius: 50%; background: #a6ff46; box-shadow: 0 0 34px 11px rgba(159,232,112,.24), 0 0 94px 36px rgba(0,218,213,.13), 0 0 170px 70px rgba(31,70,255,.1); content: ''; filter: blur(22px); animation: heartbeat 5s ease-in-out infinite; }
.logo-universe { filter: drop-shadow(0 0 28px rgba(32,216,209,.1)); }
.logo-universe::after { position: absolute; width: 66%; height: 66%; border: 1px solid rgba(143,255,223,.18); border-radius: 50%; content: ''; animation: breathe 7s ease-in-out infinite; }
.logo-universe > img { position: relative; z-index: 2; display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; mix-blend-mode: screen; filter: contrast(1.08) saturate(1.18) drop-shadow(0 0 18px rgba(42,220,255,.16)); animation: levitate 6s ease-in-out infinite; }
.orbit { position: absolute; z-index: 3; border: 1px solid; border-radius: 50%; pointer-events: none; }
.orbit-one { width: 104%; height: 37%; border-color: rgba(159,232,112,.42) transparent rgba(38,218,207,.42) transparent; transform: rotate(-28deg); animation: orbit-spin 15s linear infinite; }
.orbit-two { width: 106%; height: 49%; border-color: transparent rgba(42,122,255,.45) transparent rgba(159,232,112,.25); transform: rotate(54deg); animation: orbit-spin-reverse 19s linear infinite; }
.orbit-three { width: 112%; height: 72%; border-color: rgba(32,216,209,.24) transparent transparent transparent; transform: rotate(25deg); animation: orbit-spin 24s linear infinite; }
.particle { position: absolute; z-index: 4; width: 5px; height: 5px; border-radius: 50%; background: var(--particle-color, #9fe870); box-shadow: 0 0 12px 3px var(--particle-color, #9fe870); animation: drift 4s ease-in-out infinite; }
.particle-one { --particle-color:#9fe870; top:16%; left:25%; animation-delay:-1s; }.particle-two { --particle-color:#20d8d1; top:34%; right:9%; width:3px; height:3px; animation-delay:-2.5s; }.particle-three { --particle-color:#2d6dff; right:18%; bottom:17%; animation-delay:-.5s; }.particle-four { --particle-color:#fff; bottom:22%; left:14%; width:3px; height:3px; animation-delay:-3s; }.particle-five { --particle-color:#d7ff85; top:11%; right:35%; width:3px; height:3px; animation-delay:-1.7s; }.particle-six { --particle-color:#19c7ff; bottom:8%; left:42%; width:4px; height:4px; animation-delay:-3.4s; }
.wordmark { display: block; align-self: center; width: min(500px, 82vw); height: auto; margin-top: clamp(34px, 4.5vw, 58px); filter: contrast(1.08) brightness(1.15) drop-shadow(0 0 16px rgba(255,255,255,.16)); }
.brand-lockup p { margin: 21px 0 0; color: #9fe870; text-shadow: 0 0 16px rgba(159,232,112,.6); font-size: clamp(12px, 1.8vw, 17px); font-weight: 700; letter-spacing: .32em; text-indent: .32em; animation: text-pulse 4s ease-in-out infinite; }
.instagram-link { display: inline-flex; align-items: center; gap: 9px; margin-top: 22px; color: #dfeae7; font-size: clamp(12px, 1.5vw, 15px); font-weight: 500; letter-spacing: .08em; transition: color .25s ease, transform .25s ease, filter .25s ease; }
.instagram-link svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.instagram-link svg circle:last-child { fill: currentColor; stroke: none; }
.instagram-link:hover { color: #9fe870; transform: translateY(-2px); filter: drop-shadow(0 0 8px rgba(159,232,112,.55)); }
.whatsapp-link { display: inline-flex; align-items: center; gap: 9px; margin-top: 13px; color: #dfeae7; font-size: clamp(12px, 1.5vw, 15px); font-weight: 500; letter-spacing: .08em; transition: color .25s ease, transform .25s ease, filter .25s ease; }
.whatsapp-link svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.6; }
.whatsapp-link:hover { color: #59e391; transform: translateY(-2px); filter: drop-shadow(0 0 8px rgba(89,227,145,.55)); }
.founder-block { display: flex; align-items: center; gap: 18px; margin-top: 34px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.09); color: #dfeae7; font-size: clamp(11px, 1.4vw, 14px); }
.founder-name { letter-spacing: .04em; }.founder-name span { margin-left: 8px; color: #718281; font-family: 'Manrope', sans-serif; font-size: .75em; letter-spacing: .12em; text-transform: uppercase; }
.founder-instagram { display: inline-flex; align-items: center; gap: 7px; color: #94a6a3; font-size: .9em; transition: color .25s ease, filter .25s ease; }.founder-instagram svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }.founder-instagram svg circle:last-child { fill: currentColor; stroke: none; }.founder-instagram:hover { color: #9fe870; filter: drop-shadow(0 0 8px rgba(159,232,112,.5)); }
.company-data { margin-top: 18px; color: #536462; font-family: 'Manrope', sans-serif; font-size: 10px; letter-spacing: .08em; }.company-data span { margin: 0 7px; color: #9fe870; }
.glow { display: none; }
@keyframes appear { from { opacity: 0; transform: translateY(18px) scale(.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes heartbeat { 0%,100% { transform: scale(.78); opacity:.55; } 50% { transform: scale(1.05); opacity:.9; } }
@keyframes outer-breath { 0%,100% { transform: translateX(-50%) scale(.94); opacity:.35; } 50% { transform: translateX(-50%) scale(1.05); opacity:.85; } }
@keyframes lens-sweep { 0%,58%,100% { top: 18%; opacity:0; } 65% { top: 78%; opacity:.75; } 72% { top: 90%; opacity:0; } }
@keyframes breathe { 0%,100% { transform: scale(.94); opacity:.45; } 50% { transform: scale(1.08); opacity:.9; } }
@keyframes levitate { 0%,100% { transform: translateY(0) rotate(0) scale(1.14); } 50% { transform: translateY(-8px) rotate(1deg) scale(1.14); } }
@keyframes orbit-spin { to { transform: rotate(332deg); } } @keyframes orbit-spin-reverse { to { transform: rotate(-306deg); } }
@keyframes drift { 0%,100% { transform: translate(0,0) scale(.75); opacity:.45; } 50% { transform: translate(8px,-14px) scale(1.3); opacity:1; } }
@keyframes text-pulse { 0%,100% { opacity:.72; letter-spacing:.32em; } 50% { opacity:1; letter-spacing:.37em; } }
@keyframes sky-turn { to { transform: rotate(360deg); } } @keyframes float-glow { 0%,100% { transform: translate(0,0); } 50% { transform: translate(35px,-25px); } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; } }
@media (max-width: 520px) { .logo-universe { width: min(390px, 88vw); }.wordmark { width: min(330px, 80vw); margin-top: 32px; }.brand-lockup p { letter-spacing: .2em; text-indent: .2em; }.founder-block { flex-direction: column; gap: 10px; margin-top: 28px; padding-top: 16px; }.founder-name span { display: block; margin: 7px 0 0; }.company-data { max-width: 290px; line-height: 1.7; } }

.platform-page { position: relative; min-height: 100vh; overflow: hidden; isolation: isolate; padding: 5vh 0 7vh; background: radial-gradient(circle at 50% 13%, rgba(35, 103, 98, .18), transparent 28%), #000; }
.platform-page::before { position: absolute; inset: 0; z-index: -1; background: linear-gradient(115deg, transparent 0 48%, rgba(159, 232, 112, .04) 49%, transparent 50%), radial-gradient(circle at 15% 80%, rgba(45, 109, 255, .09), transparent 28%); content: ''; pointer-events: none; }
.platform-page .brand-lockup { width: min(1120px, 92vw); }
.platform-page .logo-universe { width: min(290px, 52vw); }
.platform-page .wordmark { width: min(340px, 70vw); margin-top: 18px; }
.hero-kicker { margin: 20px 0 0 !important; font-size: 11px !important; letter-spacing: .28em !important; }
.platform-page h1 { max-width: 780px; margin: 24px auto 0; color: #f3fbf8; font-size: clamp(34px, 6vw, 72px); line-height: .98; letter-spacing: -.055em; text-wrap: balance; }
.hero-copy { max-width: 620px; margin: 24px auto 0 !important; color: #9aa9a5; font-size: clamp(14px, 1.8vw, 18px); line-height: 1.65; letter-spacing: 0 !important; text-shadow: none !important; animation: none !important; }
.catalog-link { display: inline-flex; align-items: center; gap: 12px; margin-top: 28px; padding: 12px 18px; border: 1px solid rgba(159, 232, 112, .42); border-radius: 999px; color: #dff7d0; font-size: 13px; font-weight: 800; letter-spacing: .04em; transition: background .25s ease, transform .25s ease; }
.catalog-link:hover { background: rgba(159, 232, 112, .1); transform: translateY(-2px); }
.catalog-link span { color: #9fe870; font-size: 18px; }
.solutions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; width: 100%; margin-top: 62px; text-align: left; }
.solution-card { min-height: 190px; padding: 24px; border: 1px solid rgba(255,255,255,.1); border-radius: 18px; background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.025)); box-shadow: inset 0 1px 0 rgba(255,255,255,.05); transition: border-color .25s ease, transform .25s ease, background .25s ease; }
.solution-card:hover { border-color: rgba(159,232,112,.45); background: linear-gradient(145deg, rgba(159,232,112,.1), rgba(255,255,255,.035)); transform: translateY(-4px); }
.solution-card.featured { border-color: rgba(32,216,209,.45); background: linear-gradient(145deg, rgba(32,216,209,.12), rgba(255,255,255,.035)); }
.solution-status { display: inline-block; font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.live-status { color: #9fe870; }.discovery-status { color: #7eaaa6; }
.solution-card h2 { margin: 16px 0 9px; color: #f5fffb; font-size: 22px; letter-spacing: -.03em; }.solution-card p { min-height: 52px; margin: 0; color: #a7b8b3; font-size: 13px; line-height: 1.55; }.solution-stack { display: block; margin-top: 20px; color: #6b8983; font-size: 10px; letter-spacing: .06em; }
.solution-action { display: inline-flex; align-items: center; gap: 8px; margin-top: 22px; color: #dff7d0; font-size: 11px; font-weight: 800; letter-spacing: .04em; }.solution-action span { color: #9fe870; font-size: 16px; }.solution-action:hover { color: #fff; }
.product-flow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 14px; text-align: left; }.product-flow > div { padding: 18px 20px; border-top: 1px solid rgba(32,216,209,.28); background: rgba(255,255,255,.025); }.flow-index { display: block; color: #20d8d1; font-family: monospace; font-size: 10px; letter-spacing: .12em; }.product-flow strong { display: block; margin-top: 12px; color: #f5fffb; font-size: 14px; }.product-flow p { margin: 7px 0 0; color: #78908b; font-size: 12px; line-height: 1.5; }
.platform-note { display: flex; gap: 20px; align-items: baseline; margin-top: 24px; padding: 18px 20px; border-left: 2px solid #9fe870; background: rgba(159,232,112,.045); text-align: left; }.platform-note strong { color: #dff7d0; font-size: 12px; white-space: nowrap; }.platform-note span { color: #78908b; font-size: 12px; line-height: 1.55; }
.platform-page .founder-block { margin-top: 52px; }
@media (max-width: 680px) { .solutions, .product-flow { grid-template-columns: 1fr; margin-top: 44px; }.solution-card { min-height: 0; }.platform-note { display: block; }.platform-note span { display: block; margin-top: 8px; }.platform-page { padding-top: 2vh; } }