@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@0,600;0,700;1,600;1,700&display=swap');

:root { --ink:#182037; --muted:#61708b; --cream:#fff9ef; --paper:rgba(255,255,255,.64); --line:rgba(35,48,77,.13); --blue:#1768ff; --pink:#fc268f; --purple:#783bff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); font-family:Manrope,Arial,sans-serif; background:#e7f6ff; overflow-x:hidden; }
body::before { content:""; position:fixed; inset:0; z-index:-3; background:linear-gradient(148deg,#edfaff 0%,#e5e0ff 39%,#fff0df 72%,#f9d3e3 100%); }
.aurora { position:fixed; width:48vw; height:48vw; z-index:-2; border-radius:50%; filter:blur(75px); opacity:.42; pointer-events:none; }
.aurora-one { background:#32c4e6; top:8%; left:-18%; }.aurora-two { background:#a568ff; top:18%; right:-20%; }.aurora-three { background:#ffba52; bottom:-25%; left:25%; }
.announcement { min-height:34px; display:flex; justify-content:center; align-items:center; gap:8px; background:linear-gradient(90deg,#1768ff,#832df4 48%,#fc168f); color:white; font-size:12px; font-weight:700; letter-spacing:.01em; }
.announcement a { color:white; text-underline-offset:3px; }
.site-header { width:min(1120px,calc(100% - 40px)); margin:25px auto 0; min-height:66px; display:flex; align-items:center; gap:28px; padding:10px 14px 10px 20px; border:1px solid rgba(255,255,255,.74); border-radius:999px; background:rgba(255,255,255,.46); backdrop-filter:blur(20px); box-shadow:0 14px 35px rgba(47,71,110,.14); position:relative; z-index:5; }
.brand { display:inline-flex; align-items:center; gap:8px; color:var(--ink); text-decoration:none; font-size:22px; font-weight:800; letter-spacing:-.06em; }
.brand img { width:38px; height:38px; object-fit:contain; border-radius:0; box-shadow:none; }
.chat-stage { position:relative; padding-top:76px; }
.hero-mascot { position:absolute; z-index:2; width:178px; height:178px; object-fit:contain; border-radius:0; right:20px; top:-48px; box-shadow:none; transform:rotate(-2deg); }
.section-mascot { display:block; object-fit:contain; border-radius:0; box-shadow:none; }
.notification-mascot { width:96px; height:96px; margin:0 0 24px; }
.thinking-mascot { width:88px; height:88px; margin:-62px 0 18px auto; }
.site-nav { margin-left:auto; display:flex; align-items:center; gap:23px; }.site-nav a { color:#2a3650; font-size:13px; font-weight:700; text-decoration:none; }.site-nav a:hover { color:var(--blue); }.nav-cta { padding:12px 18px; border-radius:999px; color:white!important; background:linear-gradient(105deg,var(--blue),var(--pink)); box-shadow:0 9px 20px rgba(111,69,222,.3); }.menu-toggle { display:none; margin-left:auto; border:0; background:transparent; color:var(--ink); font:700 13px Manrope; }
.section-shell { width:min(1120px,calc(100% - 40px)); margin:0 auto; }
.hero { min-height:690px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:54px; padding:90px 30px 70px; }
.eyebrow { margin:0 0 15px; color:#476183; font:500 11px 'DM Mono',monospace; letter-spacing:.13em; }
h1,h2,h3,p { margin-top:0; } h1,h2,h3 { letter-spacing:-.055em; line-height:1.03; }
h1 { max-width:650px; margin-bottom:24px; font-size:clamp(47px,6vw,78px); font-weight:800; }.hero h1 em,.spaces h2 em,.closing h2 em { font-family:Playfair Display,serif; font-weight:600; }
.hero-text { max-width:530px; color:#42506c; font-size:18px; line-height:1.7; }.hero-actions { display:flex; flex-wrap:wrap; gap:13px; margin-top:29px; }.button { display:inline-flex; align-items:center; justify-content:center; gap:18px; min-height:52px; padding:0 20px; border:1px solid rgba(37,48,79,.15); border-radius:999px; background:rgba(255,255,255,.56); color:#26334c; font:700 14px Manrope; text-decoration:none; cursor:pointer; box-shadow:0 9px 20px rgba(50,67,111,.09); }.button span { font-size:20px; line-height:0; }.button.primary { border:0; color:#fff; background:linear-gradient(100deg,#1266ff 0%,#7845ff 48%,#fc168f 100%); box-shadow:0 14px 26px rgba(117,49,219,.3); }.button.quiet:hover,.button:not(.primary):hover { background:white; }.micro-copy { margin:15px 0 0; color:#65728d; font-size:12px; }
.chat-stage { transform:rotate(1.4deg); }.chat-label { display:inline-flex; align-items:center; gap:8px; margin:0 0 8px 18px; color:#3a4a68; font:500 11px 'DM Mono',monospace; }.status-dot { width:8px; height:8px; border-radius:50%; background:#2ecc85; box-shadow:0 0 0 4px rgba(46,204,133,.14); }.chat-window { padding:27px 25px 20px; border:1px solid rgba(255,255,255,.82); border-radius:30px; background:rgba(255,255,255,.62); backdrop-filter:blur(24px); box-shadow:0 30px 55px rgba(51,69,116,.22); }.chat-day { width:max-content; margin:0 auto 16px; padding:5px 10px; border-radius:99px; background:rgba(41,58,83,.08); color:#60708a; font-size:10px; }.message { width:max-content; max-width:87%; margin:9px 0; padding:12px 14px; border-radius:15px; font-size:13px; line-height:1.45; box-shadow:0 3px 8px rgba(59,65,90,.06); }.message.mine { margin-left:auto; border-bottom-right-radius:4px; background:#d4ffd9; }.message.short { font-size:11px; font-weight:800; }.message.mello { border-bottom-left-radius:4px; background:#fff; }.message.mello strong,.message.mello span,.message.mello small { display:block; }.message.mello span { margin-top:5px; color:#475571; }.message.mello small { margin-top:9px; color:#66738c; font-size:10px; }.message.confirmation { color:#1a6b4a; font-weight:700; }.chat-caption { margin:12px 18px 0; color:#586981; font-size:12px; transform:rotate(-1.4deg); }
.problem { padding:100px 0; }.section-intro { display:flex; align-items:end; justify-content:space-between; gap:50px; margin-bottom:35px; }.section-intro h2,.flow h2,.spaces h2,.privacy h2,.plans h2,.closing h2 { max-width:820px; margin:0; font-size:clamp(35px,4.2vw,58px); }.section-intro h2 em { font-family:Playfair Display,serif; font-weight:600; }.problem-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.glass-card { border:1px solid rgba(255,255,255,.78); background:rgba(255,255,255,.5); box-shadow:0 20px 40px rgba(59,78,112,.11); backdrop-filter:blur(17px); }.problem-card { min-height:235px; padding:27px; border-radius:23px; }.card-number { display:block; margin-bottom:38px; color:#6883ac; font:500 12px 'DM Mono',monospace; }.problem-card h3 { margin-bottom:10px; font-size:23px; }.problem-card p { margin:0; color:#52617b; font-size:14px; line-height:1.6; }
.flow { display:grid; grid-template-columns:.9fr 1.1fr; gap:80px; align-items:center; padding:90px 8%; border-radius:38px; background:linear-gradient(126deg,rgba(20,103,255,.95),rgba(119,67,235,.88) 55%,rgba(248,82,168,.88)); color:white; box-shadow:0 25px 55px rgba(77,55,174,.22); }.flow .eyebrow { color:#dbe6ff; }.flow-copy p:last-child { max-width:430px; margin:22px 0 0; color:#eff4ff; line-height:1.65; }.flow-steps { display:grid; gap:12px; }.flow-step { display:flex; align-items:center; gap:17px; padding:16px; border:1px solid rgba(255,255,255,.28); border-radius:18px; background:rgba(255,255,255,.12); }.step-icon { flex:0 0 36px; height:36px; display:grid; place-items:center; border-radius:12px; background:rgba(255,255,255,.92); color:#3f3fba; font-weight:800; }.flow-step strong { font-size:17px; }.flow-step p { margin:2px 0 0; color:#dfe8ff; font-size:12px; }
.channels { display:grid; grid-template-columns:.9fr 1.1fr; gap:65px; align-items:center; padding:120px 5% 105px; }.channels-copy>p:not(.eyebrow) { max-width:490px; margin:22px 0 0; color:#52617b; line-height:1.7; }.channels h2 em { font-family:Playfair Display,serif; font-weight:600; }.channel-legend { display:flex; flex-wrap:wrap; gap:9px; margin-top:23px; }.channel-legend span { display:inline-flex; align-items:center; gap:7px; padding:8px 10px; border:1px solid rgba(71,83,114,.12); border-radius:999px; background:rgba(255,255,255,.56); color:#57657d; font-size:11px; font-weight:700; }.live-dot,.planned-dot { width:8px; height:8px; border-radius:50%; }.live-dot { background:#26b678; box-shadow:0 0 0 4px rgba(38,182,120,.15); }.planned-dot { background:#8a93a7; }
.channel-orbit { min-height:410px; position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.75); border-radius:35px; background:radial-gradient(circle at 50% 50%,rgba(66,211,232,.25),transparent 23%),linear-gradient(145deg,#142861,#4737aa 57%,#d255a5); box-shadow:0 25px 50px rgba(61,55,139,.22); }.channel-orbit::before { content:""; position:absolute; inset:0; opacity:.55; background-image:radial-gradient(rgba(255,255,255,.7) 1px,transparent 1px); background-size:24px 24px; mask-image:linear-gradient(to bottom,transparent,black 25%,black 75%,transparent); }.orbit-ring { position:absolute; top:50%; left:50%; border:1px dashed rgba(255,255,255,.45); border-radius:50%; transform:translate(-50%,-50%); }.ring-a { width:300px; height:220px; animation:slow-spin 17s linear infinite; }.ring-b { width:230px; height:330px; animation:slow-spin 22s linear infinite reverse; }.mello-hub { position:absolute; z-index:2; top:50%; left:50%; width:110px; height:110px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.85); border-radius:50%; background:linear-gradient(135deg,#1fd9e8,#516dff 55%,#fb4cb3); box-shadow:0 0 0 12px rgba(255,255,255,.12),0 15px 28px rgba(5,16,62,.45); color:#fff; transform:translate(-50%,-50%); }.mello-hub span { font:700 55px Playfair Display,serif; line-height:.7; }.mello-hub small { margin-top:-41px; font-size:9px; font-weight:700; white-space:nowrap; }
.channel-node { position:absolute; z-index:2; display:flex; align-items:center; gap:7px; padding:8px 10px 8px 8px; border:1px solid rgba(255,255,255,.74); border-radius:13px; background:rgba(255,255,255,.9); box-shadow:0 10px 17px rgba(16,22,70,.18); color:#33415f; font-size:11px; font-weight:800; animation:float 5s ease-in-out infinite; }.channel-node b { width:25px; height:25px; display:grid; place-items:center; border-radius:8px; color:white; font-size:15px; }.channel-node small { margin-left:1px; padding:3px 5px; border-radius:6px; background:#e9ecf3; color:#78849b; font:500 7px 'DM Mono',monospace; }.whatsapp { top:45px; left:50%; transform:translateX(-50%); }.whatsapp b { background:#25c36a; }.whatsapp small { background:#dff8e9; color:#238557; }.telegram { top:93px; left:42px; animation-delay:-2.2s; }.telegram b { background:#339fd9; }.gmail { right:32px; top:132px; animation-delay:-1s; }.gmail b { background:#e45a52; }.chrome { bottom:46px; right:67px; animation-delay:-2.8s; }.chrome b { background:conic-gradient(#eb4d42 0 33%,#f8d14b 0 66%,#27a65e 0); }.slack { bottom:54px; left:46px; animation-delay:-3.9s; }.slack b { background:#7854d8; }.signal { position:absolute; z-index:1; padding:7px 10px; border:1px solid rgba(255,255,255,.46); border-radius:11px; background:rgba(255,255,255,.18); color:rgba(255,255,255,.88); font-size:9px; transform:rotate(-6deg); animation:signal 7s ease-in-out infinite; }.signal-one { top:26%; left:22%; }.signal-two { top:30%; right:13%; transform:rotate(8deg); animation-delay:-2s; }.signal-three { bottom:24%; left:30%; transform:rotate(5deg); animation-delay:-4s; }
@keyframes slow-spin { to { transform:translate(-50%,-50%) rotate(360deg); } } @keyframes float { 50% { margin-top:-8px; } } @keyframes signal { 50% { opacity:.55; transform:translateY(-7px) rotate(-2deg); } }
.spaces { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:90px; padding:130px 6% 115px; }.spaces-visual { height:355px; position:relative; border-radius:34px; overflow:hidden; background:linear-gradient(148deg,#172c6a,#403fb6 50%,#e267bd); box-shadow:0 25px 50px rgba(62,55,141,.23); }.spaces-visual::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 23% 15%,rgba(43,219,231,.7),transparent 25%),radial-gradient(circle at 85% 76%,rgba(255,190,82,.72),transparent 25%); }.orbit { position:absolute; width:280px; height:280px; border:1px solid rgba(255,255,255,.32); border-radius:50%; }.orbit-one { top:39px; left:75px; }.orbit-two { top:79px; left:113px; transform:scale(.73); }.space-core { width:104px; height:104px; position:absolute; z-index:2; top:126px; left:calc(50% - 52px); display:grid; place-items:center; border:1px solid rgba(255,255,255,.8); border-radius:50%; background:linear-gradient(135deg,#49e2ef,#8360ff 55%,#ff77b9); box-shadow:0 0 0 13px rgba(255,255,255,.12),0 18px 32px rgba(10,13,69,.4); color:#fff; }.space-core span { font:700 49px Playfair Display,serif; line-height:.8; }.space-core small { margin-top:-39px; font-size:10px; }.space-pill { position:absolute; z-index:2; display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid rgba(255,255,255,.65); border-radius:14px; background:rgba(255,255,255,.88); color:#2f3d60; box-shadow:0 12px 20px rgba(16,22,68,.18); font-size:12px; font-weight:800; }.space-pill b { width:23px; height:23px; display:grid; place-items:center; border-radius:8px; background:#e7eeff; color:#4167d7; }.space-pill small { color:#7a879d; font-size:9px; font-weight:600; }.home { top:45px; left:30px; }.office { right:22px; top:79px; }.personal { bottom:42px; left:42px; }.spaces-copy p:not(.eyebrow) { margin:22px 0 0; color:#52617c; line-height:1.7; }.spaces-copy .note { padding-left:14px; border-left:2px solid #ff5aaf; color:#60708d; font-size:13px; }
.privacy { display:grid; grid-template-columns:1.12fr .88fr; gap:35px; align-items:center; padding:90px 7%; border-radius:36px; background:rgba(255,251,244,.58); box-shadow:0 25px 55px rgba(88,80,104,.09); }.privacy-panel p:not(.eyebrow) { max-width:620px; margin:20px 0; color:#4d5c77; line-height:1.7; }.privacy-points { display:flex; flex-wrap:wrap; gap:9px; margin:25px 0; }.privacy-points span { padding:8px 10px; border-radius:99px; background:rgba(255,255,255,.7); color:#40516f; font-size:11px; font-weight:700; }.text-link { color:#245ee9; font-size:13px; font-weight:800; text-decoration:none; }.control-card { padding:18px; border-radius:24px; }.control-card-top { display:flex; align-items:center; gap:9px; margin:3px 0 16px; color:#5b6a85; font:500 10px 'DM Mono',monospace; letter-spacing:.08em; }.lock { display:grid; place-items:center; width:26px; height:26px; border-radius:8px; background:linear-gradient(135deg,#1066f5,#8d4dff); color:#fff; }.control-row { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:14px 5px; border-top:1px solid var(--line); }.control-row b,.control-row small { display:block; }.control-row b { color:#30415e; font-size:13px; }.control-row small { margin-top:3px; color:#7a879c; font-size:10px; }.control-row>span { color:#4165c8; font-size:10px; font-weight:800; }.control-row .connected { color:#168454; }
.plans { padding:125px 0; }.plans-heading { text-align:center; }.plans-heading h2 { margin:0 auto; }.plans-heading p:last-child { margin:17px auto 0; color:#62708b; }.plan-grid { max-width:870px; display:grid; grid-template-columns:1fr 1fr; gap:18px; margin:40px auto 0; }.plan-card { min-height:360px; display:flex; flex-direction:column; padding:30px; border-radius:26px; }.plan-card.featured { color:#fff; background:linear-gradient(145deg,#174ece,#793bdc 54%,#f3389a); box-shadow:0 24px 42px rgba(106,50,187,.3); }.plan-kicker { margin-bottom:22px; color:#6681a7; font:500 10px 'DM Mono',monospace; letter-spacing:.12em; }.featured .plan-kicker { color:#e6eaff; }.plan-card h3 { margin-bottom:11px; font-size:29px; }.plan-card>p:not(.plan-kicker) { margin-bottom:18px; color:#54637c; font-size:13px; line-height:1.6; }.featured>p:not(.plan-kicker) { color:#f3ecff; }.plan-card ul { flex:1; margin:0 0 26px; padding:0; list-style:none; }.plan-card li { margin:9px 0; color:#52617a; font-size:12px; }.plan-card li::before { content:"✓"; margin-right:8px; color:#2d77e8; }.featured li { color:#fff; }.featured li::before { color:#ffbbdd; }.plan-button { width:100%; }.plans-footnote { margin:16px auto 0; color:#6b7891; font-size:11px; text-align:center; }
.closing { padding:135px 10% 155px; text-align:center; }.closing h2 { margin:0 auto; }.closing>p:not(.eyebrow) { max-width:610px; margin:22px auto 0; color:#53627c; line-height:1.7; }.closing .hero-actions { justify-content:center; }
.site-footer { width:min(1120px,calc(100% - 40px)); display:grid; grid-template-columns:1.2fr 1fr auto; gap:30px; align-items:end; margin:0 auto 30px; padding:32px; border-top:1px solid rgba(65,80,107,.15); }.site-footer p { margin:9px 0 0; color:#63718a; font-size:12px; }.footer-links { display:grid; grid-template-columns:repeat(2,max-content); gap:10px 26px; }.footer-links a { color:#4d5d78; font-size:12px; text-decoration:none; }.site-footer small { color:#76839a; font-size:10px; white-space:nowrap; }.toast { position:fixed; left:50%; bottom:25px; z-index:10; max-width:min(460px,calc(100% - 36px)); padding:14px 18px; border:1px solid rgba(255,255,255,.8); border-radius:15px; background:rgba(24,32,55,.91); box-shadow:0 14px 30px rgba(15,20,41,.23); color:white; font-size:13px; opacity:0; pointer-events:none; transform:translate(-50%,18px); transition:.25s ease; }.toast.show { opacity:1; transform:translate(-50%,0); }
@media (max-width:820px) { .site-header { margin-top:14px; }.menu-toggle { display:block; }.site-nav { position:absolute; top:76px; left:0; right:0; display:none; flex-direction:column; align-items:stretch; gap:4px; padding:13px; border:1px solid rgba(255,255,255,.75); border-radius:24px; background:rgba(244,249,255,.95); box-shadow:0 20px 35px rgba(45,55,94,.15); }.site-nav.open { display:flex; }.site-nav a { padding:11px 12px; }.hero,.channels,.spaces,.privacy { grid-template-columns:1fr; }.hero { min-height:auto; padding:75px 4% 80px; }.chat-stage { max-width:500px; width:100%; margin:0 auto; }.problem-grid { grid-template-columns:1fr; }.flow { grid-template-columns:1fr; gap:35px; padding:60px 7%; }.channels { gap:35px; padding:85px 4%; }.spaces { gap:42px; padding:90px 4%; }.privacy { padding:60px 7%; }.site-footer { grid-template-columns:1fr 1fr; }.site-footer small { grid-column:1/-1; }.spaces-visual { order:2; } }
@media (max-width:560px) { .announcement { min-height:38px; font-size:10px; }.site-header,.section-shell { width:calc(100% - 28px); }.site-header { padding-left:15px; }.brand { font-size:20px; }.hero { padding:55px 2px 60px; gap:42px; } h1 { font-size:45px; }.hero-text { font-size:16px; }.button { min-height:49px; font-size:12px; }.section-intro { display:block; }.problem,.plans { padding:75px 0; }.flow { border-radius:25px; }.channels { padding:70px 0; }.channel-orbit { min-height:355px; }.channel-node { padding:7px; }.channel-node span { display:none; }.channel-node small { margin:0; }.telegram { left:25px; }.gmail { right:22px; }.chrome { right:48px; }.slack { left:30px; }.signal { font-size:8px; }.spaces-visual { height:315px; }.space-pill small { display:none; }.home { left:17px; }.office { right:12px; }.personal { left:20px; }.plan-grid { grid-template-columns:1fr; }.closing { padding:85px 3% 95px; }.site-footer { grid-template-columns:1fr; padding:26px 4px; }.footer-links { grid-template-columns:1fr 1fr; }.site-footer small { grid-column:auto; }.chat-window { padding:20px 16px 14px; }.message { font-size:12px; } }

.legal-page { min-height:100vh; }
.legal-header { margin-bottom:76px; }
.legal-shell { width:min(860px,calc(100% - 40px)); margin:0 auto; padding:20px 0 100px; }
.legal-shell h1 { max-width:none; margin-bottom:10px; font-size:clamp(48px,7vw,78px); }
.legal-updated { color:#64728c; font:500 12px 'DM Mono',monospace; }
.legal-lead { margin:30px 0 52px; padding:24px 27px; border:1px solid rgba(255,255,255,.78); border-radius:23px; background:rgba(255,255,255,.54); box-shadow:0 18px 40px rgba(50,67,111,.09); color:#40506c; font-size:18px; line-height:1.75; }
.legal-shell section { padding:30px 0; border-top:1px solid rgba(65,80,107,.15); }
.legal-shell section h2 { margin-bottom:13px; font-size:28px; }
.legal-shell section p,.legal-shell section li { color:#485872; font-size:15px; line-height:1.8; }
.legal-shell a { color:#245ee9; font-weight:700; }
.legal-shell .button { color:white; }
.legal-footer { margin-top:0; }
.support-shell { min-height:650px; }
.support-card { margin-bottom:15px; padding:30px!important; border:1px solid rgba(255,255,255,.8)!important; border-radius:25px; background:rgba(255,255,255,.5); box-shadow:0 20px 40px rgba(59,78,112,.11); }
@media (max-width:820px) { .legal-nav { display:flex; position:static; flex-direction:row; padding:0; border:0; background:transparent; box-shadow:none; }.legal-header .menu-toggle { display:none; } }
@media (max-width:620px) { .legal-header { border-radius:24px; }.legal-nav a:not(.nav-cta) { display:none; }.legal-shell { width:calc(100% - 28px); padding-bottom:70px; }.legal-shell h1 { font-size:46px; }.legal-lead { padding:20px; font-size:16px; }.legal-shell section h2 { font-size:24px; } }