/* vpscloud.vip — concept-02 */
:root { --bg:#060812; --panel:#0c1122; --panel-2:#101831; --line:rgba(202,225,255,.13); --text:#f6f8ff; --muted:#93a3bf; --cyan:#66e6ee; --cyan-2:#16b7dd; --violet:#a98cf7; --pink:#ef79d6; --green:#6ee5ad; --max:1170px; }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body { min-width:320px; margin:0; overflow-x:hidden; color:var(--text); background:var(--bg); font-family:"Manrope",system-ui,sans-serif; font-size:15px; font-weight:600; line-height:1.55; }
    body::before { content:""; position:fixed; inset:0; z-index:-2; pointer-events:none; background:radial-gradient(58rem 34rem at 5% -8%,rgba(60,164,217,.17),transparent 69%),radial-gradient(53rem 35rem at 104% 12%,rgba(169,140,247,.16),transparent 69%),radial-gradient(42rem 25rem at 47% 100%,rgba(239,121,214,.09),transparent 70%),var(--bg); }
    body::after { content:""; position:fixed; z-index:-1; width:44rem; height:28rem; right:-20rem; top:32%; pointer-events:none; border-radius:50%; background:radial-gradient(ellipse,rgba(69,226,241,.09),transparent 68%); filter:blur(22px); }
    a { color:inherit; text-decoration:none; }
    button { font:inherit; }
    .wrap { width:min(var(--max),calc(100% - 48px)); margin:0 auto; }
    .svg-defs { position:absolute; overflow:hidden; width:0; height:0; }
    .icon { width:20px; height:20px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.7; }
    .micro { color:#95a9c6; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }

    .notice { min-height:33px; border-bottom:1px solid rgba(204,230,255,.07); color:#a6b8d0; font-size:11px; }
    .notice .wrap { display:flex; align-items:center; justify-content:center; gap:10px; min-height:33px; }
    .notice b { color:#e9f5ff; } .notice i { width:5px; height:5px; border-radius:50%; background:var(--cyan); box-shadow:0 0 10px var(--cyan); }
    .header { position:sticky; top:0; z-index:20; padding:12px 0 0; }
    .header-inner { min-height:63px; display:flex; align-items:center; gap:20px; padding:0 14px 0 16px; border:1px solid var(--line); border-radius:18px; background:rgba(9,13,28,.76); box-shadow:0 13px 35px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.055); backdrop-filter:blur(19px); }
    .brand { display:inline-flex; align-items:center; gap:10px; margin-right:auto; font-family:"Geologica",sans-serif; font-size:17px; font-weight:800; letter-spacing:-.06em; }
    .brand-mark { width:34px; height:34px; display:grid; place-items:center; position:relative; overflow:hidden; color:#07121e; border-radius:11px; background:linear-gradient(135deg,#79eff5,#55b8eb 50%,#c09cff); box-shadow:inset 0 1px 0 rgba(255,255,255,.65); }
    .brand-mark::before { content:""; position:absolute; width:24px; height:4px; top:3px; left:-3px; border-radius:99px; background:rgba(255,255,255,.47); transform:rotate(-35deg); }
    .brand-mark .icon { position:relative; width:20px; height:20px; stroke-width:2; }
    .nav { display:flex; align-items:center; gap:24px; }
    .nav a { color:#adbed5; font-size:11px; font-weight:800; transition:color .2s; }
    .nav a:hover { color:#fff; }
    .header-actions { display:flex; align-items:center; gap:8px; }
    .button { min-height:40px; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:0 15px; border:1px solid transparent; border-radius:11px; cursor:pointer; font-size:11px; font-weight:800; letter-spacing:.01em; transition:transform .2s,background .2s,border-color .2s,box-shadow .2s; }
    .button:hover { transform:translateY(-2px); }
    .button-primary { color:#06131b; background:linear-gradient(105deg,#7af1f5,#64d7ec 53%,#c2a2f6); box-shadow:0 10px 22px rgba(51,204,231,.18); }
    .button-primary .arrow { display:grid; place-items:center; width:16px; height:16px; color:#08313a; border-radius:50%; background:rgba(255,255,255,.5); font-size:13px; line-height:1; }
    .button-ghost { color:#d5e2f2; border-color:rgba(204,230,255,.15); background:rgba(255,255,255,.035); }
    .button-ghost:hover { border-color:rgba(204,230,255,.28); background:rgba(255,255,255,.075); }
    .menu-button { display:none; width:38px; height:38px; border:1px solid var(--line); border-radius:10px; color:white; background:rgba(255,255,255,.04); cursor:pointer; }
    .menu-button span { display:block; width:17px; height:2px; margin:4px auto; border-radius:5px; background:white; }
    .mobile { display:none; margin-top:7px; padding:8px; border:1px solid var(--line); border-radius:16px; background:#0c1122; box-shadow:0 20px 35px rgba(0,0,0,.25); }
    .mobile.open { display:grid; gap:5px; }
    .mobile a { padding:11px 12px; border-radius:10px; color:#cbd8e9; font-size:13px; font-weight:750; background:rgba(255,255,255,.03); }

    .hero { padding:70px 0 27px; }
    .hero-frame { position:relative; overflow:hidden; min-height:545px; display:grid; grid-template-columns:.92fr 1.08fr; gap:36px; padding:51px; border:1px solid var(--line); border-radius:31px; background:linear-gradient(115deg,rgba(16,25,51,.86),rgba(11,16,36,.67) 60%,rgba(25,20,57,.55)); box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 26px 56px rgba(0,0,0,.17); }
    .hero-frame::before { content:""; position:absolute; width:590px; height:590px; left:-395px; bottom:-390px; border:1px solid rgba(97,229,241,.15); border-radius:50%; box-shadow:0 0 0 49px rgba(97,229,241,.02),0 0 0 104px rgba(97,229,241,.012); }
    .hero-frame::after { content:""; position:absolute; width:520px; height:300px; right:-265px; top:-212px; border:1px solid rgba(206,162,255,.14); border-radius:50%; transform:rotate(20deg); }
    .hero-copy { position:relative; z-index:2; display:flex; flex-direction:column; align-items:flex-start; }
    .eyebrow { display:inline-flex; align-items:center; gap:8px; padding:6px 9px; color:#c4fcff; border:1px solid rgba(102,230,238,.18); border-radius:99px; background:rgba(102,230,238,.07); font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
    .eyebrow i { width:6px; height:6px; border-radius:50%; background:var(--green); box-shadow:0 0 0 4px rgba(110,229,173,.09); }
    h1,h2,h3,p { margin-top:0; }
    h1 { max-width:570px; margin:23px 0 20px; font-family:"Unbounded",sans-serif; font-size:clamp(35px,4vw,60px); font-weight:600; letter-spacing:-.075em; line-height:1.12; }
    h1 em { color:transparent; background:linear-gradient(106deg,#a4fbff,#66e6ee 45%,#d7a9fd); background-clip:text; -webkit-background-clip:text; font-style:normal; }
    .hero-copy > p { max-width:480px; color:#aabbd3; line-height:1.7; }
    .hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin:27px 0 31px; }
    .button-large { min-height:49px; padding:0 19px; border-radius:13px; }
    .hero-foot { width:100%; max-width:484px; display:flex; align-items:center; gap:14px; padding-top:19px; border-top:1px solid rgba(205,230,255,.10); }
    .avatar-stack { display:flex; padding-left:5px; } .avatar { width:27px; height:27px; margin-left:-5px; display:grid; place-items:center; border:2px solid #111a33; border-radius:50%; color:#d8faff; background:linear-gradient(135deg,#246174,#20578a); font-family:ui-monospace,monospace; font-size:8px; font-weight:900; }
    .avatar:nth-child(2){background:linear-gradient(135deg,#6a4a93,#2b5986)} .avatar:nth-child(3){background:linear-gradient(135deg,#79614d,#437d71)}
    .hero-foot span { color:#96a9c5; font-size:11px; line-height:1.35; } .hero-foot strong { color:#e3edf9; }

    .route-panel { position:relative; z-index:2; overflow:hidden; min-height:421px; border:1px solid rgba(194,230,255,.16); border-radius:24px; background:linear-gradient(155deg,rgba(22,51,79,.76),rgba(12,17,39,.82) 57%,rgba(26,16,57,.74)); box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 18px 36px rgba(0,0,0,.15); }
    .route-panel::before { content:""; position:absolute; width:420px; height:420px; top:-243px; right:-180px; background:radial-gradient(circle,rgba(86,231,243,.18),transparent 67%); }
    .route-top { position:relative; z-index:4; display:flex; align-items:center; justify-content:space-between; padding:17px 18px; border-bottom:1px solid rgba(210,237,255,.09); }
    .route-title { display:flex; align-items:center; gap:8px; font-family:"Geologica",sans-serif; font-size:13px; font-weight:750; letter-spacing:-.04em; }
    .route-title-mark { width:27px; height:27px; display:grid; place-items:center; overflow:hidden; position:relative; border:1px solid rgba(102,230,238,.20); border-radius:9px; color:#9ef8ff; background:rgba(102,230,238,.1); }
    .route-title-mark .icon { width:16px; height:16px; stroke-width:1.9; }
    .route-title-mark::after { content:""; position:absolute; width:17px; height:3px; top:2px; left:1px; border-radius:9px; background:rgba(255,255,255,.3); transform:rotate(-35deg); }
    .live { display:flex; align-items:center; gap:6px; color:#8eeec2; font-family:ui-monospace,monospace; font-size:9px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
    .live i { width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 0 4px rgba(110,229,173,.08),0 0 9px rgba(110,229,173,.7); animation:live 1.7s ease-in-out infinite; }
    .route-world { position:absolute; inset:47px 0 70px; }
    .globe { position:absolute; z-index:1; width:198px; height:198px; top:44px; left:50%; border:1px solid rgba(117,224,243,.38); border-radius:50%; background:radial-gradient(circle at 35% 29%,rgba(200,253,255,.24),rgba(69,197,224,.12) 29%,rgba(83,91,173,.13) 56%,rgba(9,15,34,.3) 70%); box-shadow:inset 15px 7px 30px rgba(184,250,255,.17),inset -21px -17px 35px rgba(47,13,91,.24),0 0 46px rgba(54,212,235,.16); transform:translateX(-50%); animation:globe 5.2s ease-in-out infinite; }
    .globe::before,.globe::after { content:""; position:absolute; border:1px solid rgba(163,239,251,.18); border-radius:50%; } .globe::before { inset:22px -8px; } .globe::after { top:-1px; bottom:-1px; left:48px; right:48px; }
    .routes { position:absolute; inset:0; z-index:2; width:100%; height:100%; overflow:visible; }
    .route-node { position:absolute; z-index:3; display:inline-flex; align-items:center; gap:5px; padding:5px 7px; border:1px solid rgba(205,238,255,.17); border-radius:7px; color:#e5effc; background:rgba(11,23,47,.79); box-shadow:0 8px 18px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.08); font-size:9px; font-weight:800; }
    .route-node::before { content:""; width:5px; height:5px; border-radius:50%; background:var(--cyan); box-shadow:0 0 9px var(--cyan); } .route-node.pink::before { background:var(--pink); box-shadow:0 0 9px var(--pink); }
    .n-amsterdam { left:15%; top:42px; } .n-frankfurt { left:37%; top:91px; } .n-istanbul { right:19%; top:129px; } .n-singapore { right:8%; bottom:15px; }
    .route-bottom { position:absolute; z-index:4; right:13px; bottom:12px; left:13px; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
    .route-stat { padding:10px; border:1px solid rgba(210,237,255,.10); border-radius:11px; background:rgba(9,15,34,.66); backdrop-filter:blur(10px); } .route-stat span { display:block; color:#8b9ebc; font-size:9px; } .route-stat b { display:block; margin-top:2px; color:#eaf6ff; font-family:"Geologica",sans-serif; font-size:12px; letter-spacing:-.04em; }
    .route-stat b.cyan { color:#9af8ff; }
    @keyframes globe { 0%,100% { transform:translateX(-50%) scale(1); filter:brightness(1) saturate(100%); } 50% { transform:translateX(-50%) scale(1.035); filter:brightness(1.09) saturate(117%); } }
    @keyframes live { 0%,100% { transform:scale(1); box-shadow:0 0 0 4px rgba(110,229,173,.08),0 0 9px rgba(110,229,173,.7); } 50% { transform:scale(1.2); box-shadow:0 0 0 7px rgba(110,229,173,.01),0 0 14px rgba(110,229,173,.95); } }

    .data-rail { position:absolute; right:51px; bottom:0; left:51px; z-index:3; display:grid; grid-template-columns:repeat(4,1fr); border:1px solid rgba(205,230,255,.11); border-bottom:0; border-radius:17px 17px 0 0; background:rgba(7,12,28,.53); backdrop-filter:blur(12px); }
    .metric { min-height:77px; padding:15px 18px; border-right:1px solid rgba(205,230,255,.10); } .metric:last-child { border:0; } .metric b { display:block; font-family:"Geologica",sans-serif; font-size:17px; letter-spacing:-.06em; } .metric span { display:block; margin-top:3px; color:#91a4bf; font-family:ui-monospace,monospace; font-size:8px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }

    .band { padding:103px 0; } .band-head { max-width:610px; } .band-head h2 { margin:11px 0 13px; font-family:"Geologica",sans-serif; font-size:clamp(32px,3.5vw,47px); font-weight:800; letter-spacing:-.065em; line-height:1.06; } .band-head p { margin:0; color:var(--muted); }
    .advantage-layout { display:grid; grid-template-columns:.79fr 1.21fr; gap:80px; align-items:start; }
    .advantage-intro { position:sticky; top:99px; } .advantage-intro .line { width:57px; height:1px; margin:26px 0; background:linear-gradient(90deg,var(--cyan),transparent); } .advantage-intro .small-link { display:inline-flex; align-items:center; gap:8px; color:#a7f5fb; font-size:12px; font-weight:800; } .advantage-intro .small-link b { font-size:18px; }
    .benefits { border-top:1px solid var(--line); } .benefit { position:relative; display:grid; grid-template-columns:54px 54px 1fr auto; gap:17px; align-items:center; min-height:119px; padding:18px 0; border-bottom:1px solid var(--line); transition:padding .2s; } .benefit:hover { padding-left:8px; }
    .benefit-number { color:#657695; font-family:ui-monospace,monospace; font-size:10px; font-weight:800; } .benefit-icon { width:45px; height:45px; display:grid; place-items:center; overflow:hidden; position:relative; border:1px solid rgba(116,229,240,.2); border-radius:13px; color:#a2f7ff; background:linear-gradient(145deg,rgba(102,230,238,.15),rgba(102,230,238,.045)); } .benefit-icon::after { content:""; position:absolute; width:27px; height:4px; top:2px; left:1px; border-radius:10px; background:rgba(255,255,255,.28); transform:rotate(-35deg); } .benefit-icon .icon { position:relative; width:21px; height:21px; z-index:1; } .benefit:nth-child(2) .benefit-icon { color:#d5c4ff; border-color:rgba(169,140,247,.25); background:linear-gradient(145deg,rgba(169,140,247,.17),rgba(169,140,247,.04)); } .benefit:nth-child(3) .benefit-icon { color:#ffc3ee; border-color:rgba(239,121,214,.25); background:linear-gradient(145deg,rgba(239,121,214,.17),rgba(239,121,214,.04)); } .benefit:nth-child(4) .benefit-icon { color:#a7f3c9; border-color:rgba(110,229,173,.22); background:linear-gradient(145deg,rgba(110,229,173,.16),rgba(110,229,173,.04)); }
    .benefit h3 { margin:0 0 4px; font-family:"Geologica",sans-serif; font-size:16px; letter-spacing:-.035em; } .benefit p { margin:0; color:#93a5c0; font-size:12px; } .benefit-arrow { color:#7590af; font-size:20px; transition:transform .2s,color .2s; } .benefit:hover .benefit-arrow { color:#b4f7fb; transform:translateX(4px); }

    .platform-band { position:relative; overflow:hidden; padding:88px 0; border-top:1px solid rgba(205,230,255,.07); border-bottom:1px solid rgba(205,230,255,.07); background:linear-gradient(103deg,rgba(11,27,50,.58),rgba(26,13,54,.36)); } .platform-band::after { content:""; position:absolute; width:390px; height:390px; right:-162px; top:-230px; border:1px solid rgba(239,121,214,.13); border-radius:50%; box-shadow:0 0 0 44px rgba(239,121,214,.018),0 0 0 90px rgba(239,121,214,.012); }
    .platform-top { display:flex; justify-content:space-between; gap:30px; align-items:end; margin-bottom:29px; } .platform-top .band-head { max-width:620px; } .platform-top .band-head h2 { margin-bottom:0; } .platform-note { max-width:255px; margin:0; color:#9caec8; font-size:12px; }
    .platforms { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; } .platform { min-height:181px; padding:20px; position:relative; overflow:hidden; border:1px solid var(--line); border-radius:20px; background:linear-gradient(145deg,rgba(19,33,63,.77),rgba(10,16,34,.68)); transition:transform .2s,border-color .2s; } .platform:hover { transform:translateY(-5px); border-color:rgba(124,231,241,.29); } .platform::after { content:attr(data-code); position:absolute; right:13px; bottom:-14px; color:rgba(191,225,255,.055); font-family:"Unbounded",sans-serif; font-size:86px; font-weight:700; } .platform-icon { width:43px; height:43px; display:grid; place-items:center; margin-bottom:34px; position:relative; border:1px solid rgba(205,230,255,.16); border-radius:13px; color:#b5f9da; background:rgba(110,229,173,.1); } .platform-icon .icon { width:22px; height:22px; fill:currentColor; stroke:none; } .platform:nth-child(2) .platform-icon { color:#aaeefa; background:rgba(102,230,238,.11); } .platform:nth-child(3) .platform-icon { color:#e1d8ff; background:rgba(169,140,247,.12); } .platform h3 { margin:0; position:relative; font-family:"Geologica",sans-serif; font-size:17px; letter-spacing:-.04em; } .platform span { position:relative; color:#96a9c4; font-size:11px; } .platform .download { position:absolute; z-index:2; right:19px; bottom:17px; color:#a6f2f9; font-size:11px; font-weight:800; }

    .pricing { padding:104px 0; } .center-head { max-width:650px; margin:0 auto 38px; text-align:center; } .center-head h2 { margin:10px 0 11px; font-family:"Geologica",sans-serif; font-size:clamp(32px,3.5vw,46px); letter-spacing:-.065em; } .center-head p { margin:0; color:var(--muted); }
    .price-board { position:relative; display:grid; grid-template-columns:repeat(5,1fr); gap:8px; padding:8px; border:1px solid var(--line); border-radius:26px; background:rgba(255,255,255,.025); box-shadow:inset 0 1px 0 rgba(255,255,255,.05); } .price-board::before { content:""; position:absolute; width:32%; height:1px; top:-1px; left:34%; background:linear-gradient(90deg,transparent,var(--cyan),transparent); }
    .tariff { min-height:239px; display:flex; flex-direction:column; padding:20px 15px 14px; border:1px solid transparent; border-radius:18px; background:transparent; cursor:pointer; transition:transform .2s,border-color .2s,background .2s; } .tariff:hover { transform:translateY(-4px); border-color:rgba(183,236,255,.18); background:rgba(255,255,255,.035); } .tariff.active { border-color:rgba(102,230,238,.58); background:rgba(102,230,238,.065); box-shadow:inset 0 0 0 2px rgba(102,230,238,.06); } .tariff.featured { border-color:rgba(239,121,214,.30); background:linear-gradient(160deg,rgba(239,121,214,.17),rgba(90,39,117,.38) 58%,rgba(20,22,53,.71)); } .tariff .tag { align-self:flex-start; margin-bottom:11px; padding:4px 7px; color:#ffd7f4; border:1px solid rgba(255,194,240,.18); border-radius:99px; background:rgba(239,121,214,.13); font-family:ui-monospace,monospace; font-size:8px; font-weight:800; letter-spacing:.06em; } .tariff h3 { margin:0; color:#c8d6e8; font-family:"Geologica",sans-serif; font-size:14px; letter-spacing:-.04em; } .tariff .price { margin:9px 0 5px; font-family:"Geologica",sans-serif; font-size:29px; font-weight:800; letter-spacing:-.075em; } .tariff p { min-height:32px; margin:0; color:#8fa2be; font-size:10px; } .tariff .button { width:100%; min-height:37px; margin-top:auto; padding:0 7px; font-size:10px; } .pay-foot { margin:16px 0 0; color:#8699b5; text-align:center; font-size:11px; } .pay-foot b { color:#c5d8ee; }

    .faq { padding:95px 0; border-top:1px solid rgba(205,230,255,.07); } .faq-layout { display:grid; grid-template-columns:.78fr 1.22fr; gap:78px; } .faq-info { padding:26px; align-self:start; border:1px solid var(--line); border-radius:23px; background:linear-gradient(145deg,rgba(20,33,65,.62),rgba(11,17,37,.48)); } .faq-info h2 { margin:10px 0 12px; font-family:"Geologica",sans-serif; font-size:38px; letter-spacing:-.065em; } .faq-info p { color:#9db0cb; font-size:13px; } .faq-info .button { margin-top:13px; } .questions { display:grid; gap:8px; } details { border:1px solid var(--line); border-radius:15px; background:rgba(255,255,255,.025); } details[open] { border-color:rgba(102,230,238,.24); background:rgba(19,33,61,.56); } summary { min-height:58px; position:relative; display:flex; align-items:center; padding:13px 48px 13px 17px; cursor:pointer; list-style:none; font-family:"Geologica",sans-serif; font-size:13px; font-weight:700; letter-spacing:-.025em; } summary::-webkit-details-marker{display:none} summary::after { content:"+"; position:absolute; right:16px; color:#9ef4fb; font-family:"Manrope"; font-size:20px; font-weight:400; transition:transform .2s; } details[open] summary::after { transform:rotate(45deg); } details p { margin:-2px 17px 17px; color:#97a9c4; font-size:12px; line-height:1.65; }
    .closing { padding:0 0 76px; } .closing-box { position:relative; overflow:hidden; display:flex; justify-content:space-between; align-items:center; gap:25px; padding:44px; border:1px solid rgba(130,233,243,.22); border-radius:27px; background:linear-gradient(105deg,rgba(16,66,88,.9),rgba(46,22,80,.84)); box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 23px 45px rgba(0,0,0,.17); } .closing-box::before { content:""; width:330px; height:330px; position:absolute; right:-145px; top:-228px; border:1px solid rgba(181,252,255,.22); border-radius:50%; box-shadow:0 0 0 34px rgba(151,240,255,.03),0 0 0 73px rgba(151,240,255,.015); } .closing-box h2 { max-width:590px; margin:0 0 8px; position:relative; font-family:"Geologica",sans-serif; font-size:39px; letter-spacing:-.06em; line-height:1.08; } .closing-box p { margin:0; position:relative; color:#c0d1e3; } .closing-actions { position:relative; display:flex; gap:9px; flex-shrink:0; }
    footer { padding:26px 0; border-top:1px solid rgba(205,230,255,.07); color:#8295af; font-size:11px; } .footer-row { display:flex; align-items:center; justify-content:space-between; gap:15px; } .footer-name { display:inline-flex; align-items:center; gap:7px; color:#cad9eb; font-family:"Geologica",sans-serif; font-weight:800; } .footer-name i { width:6px; height:6px; border-radius:50%; background:var(--cyan); box-shadow:0 0 8px var(--cyan); } .footer-links { display:flex; gap:16px; } .footer-links a:hover { color:white; }
    .modal { position:fixed; inset:0; z-index:50; display:grid; place-items:center; padding:19px; opacity:0; pointer-events:none; background:rgba(3,5,13,.72); backdrop-filter:blur(8px); transition:opacity .2s; } .modal.open{opacity:1;pointer-events:auto} .modal-card { width:min(405px,100%); padding:25px; border:1px solid rgba(190,231,255,.18); border-radius:21px; background:#0e1630; box-shadow:0 30px 80px rgba(0,0,0,.45); transform:translateY(12px) scale(.98); transition:transform .2s; } .modal.open .modal-card{transform:none} .modal-close { float:right; width:31px; height:31px; color:#d8e6f7; border:1px solid var(--line); border-radius:9px; background:rgba(255,255,255,.04); cursor:pointer; font-size:19px; } .modal-card h3{margin:15px 0 7px;font-family:"Geologica",sans-serif;font-size:22px;letter-spacing:-.05em}.modal-card p{color:#a6b7cf;font-size:13px}.modal-line{display:flex;justify-content:space-between;align-items:center;margin:19px 0;padding:13px;border:1px solid rgba(102,230,238,.17);border-radius:12px;background:rgba(102,230,238,.06);font-size:12px}.modal-line b{font-family:"Geologica",sans-serif;font-size:17px}.modal-card .button{width:100%}
    @media(max-width:950px){ .nav{display:none}.menu-button{display:block}.header-actions .button-ghost{display:none}.hero-frame{grid-template-columns:1fr;padding:39px}.hero-copy{align-items:center;text-align:center}.hero-copy>p{margin-inline:auto}.hero-foot{justify-content:center}.route-panel{width:min(590px,100%);justify-self:center}.data-rail{position:relative;right:auto;bottom:auto;left:auto;margin-top:27px;border-bottom:1px solid var(--line);border-radius:16px}.hero-frame{padding-bottom:29px}.advantage-layout,.faq-layout{grid-template-columns:1fr;gap:35px}.advantage-intro{position:static}.platform-top{align-items:start;flex-direction:column}.price-board{grid-template-columns:repeat(3,1fr)}.faq-info{max-width:510px}.closing-box{align-items:flex-start;flex-direction:column}.closing-actions{flex-wrap:wrap} }
    @media(max-width:620px){ .wrap{width:min(var(--max),calc(100% - 28px))}.notice .wrap{font-size:9px}.header{padding-top:7px}.header-inner{min-height:56px;padding:0 9px 0 11px;border-radius:15px}.brand{font-size:15px}.brand-mark{width:30px;height:30px}.header-actions .button-primary{display:none}.hero{padding-top:42px}.hero-frame{min-height:0;padding:27px 17px 17px;border-radius:23px}.hero-frame::before{left:-450px}.hero-copy>p{font-size:13px}.hero-actions{width:100%;margin:22px 0 24px}.hero-actions .button{width:100%}h1{margin:19px 0 16px;font-size:clamp(30px,9.8vw,41px);line-height:1.16}.hero-foot{gap:9px;text-align:left}.route-panel{min-height:379px;border-radius:19px}.route-world{inset:47px 0 70px}.globe{width:181px;height:181px;top:47px}.n-amsterdam{left:4%;top:38px}.n-frankfurt{left:28%;top:91px}.n-istanbul{right:11%;top:127px}.n-singapore{right:1%;bottom:14px}.data-rail{grid-template-columns:1fr 1fr;gap:0;margin-top:20px}.metric{min-height:66px;padding:11px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.metric:nth-child(2),.metric:last-child{border-right:0}.metric:nth-child(n+3){border-bottom:0}.band{padding:70px 0}.band-head h2,.center-head h2{font-size:31px}.benefit{grid-template-columns:30px 45px 1fr auto;gap:10px;min-height:101px}.benefit p{font-size:11px}.platform-band{padding:64px 0}.platforms{grid-template-columns:1fr}.platform{min-height:140px}.platform-icon{margin-bottom:22px}.pricing{padding:70px 0}.center-head{margin-bottom:27px}.price-board{grid-template-columns:1fr 1fr;padding:6px;border-radius:20px}.tariff{min-height:206px;padding:17px 12px 12px}.tariff.featured{grid-column:span 2}.tariff .price{font-size:25px}.faq{padding:68px 0}.faq-info{padding:21px}.faq-info h2{font-size:32px}.closing{padding-bottom:60px}.closing-box{padding:28px 21px;border-radius:22px}.closing-box h2{font-size:30px}.closing-actions{width:100%}.closing-actions .button{width:100%}.footer-row{flex-direction:column;text-align:center}.footer-links{justify-content:center;flex-wrap:wrap} }
    @media(prefers-reduced-motion:reduce){ *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important} }

    /* Refinement — убрали декоративный шум, оставили типографику, воздух и сеть как единственный hero-акцент. */
    .notice { display:none; }
    .header { padding:0; border-bottom:1px solid rgba(205,230,255,.08); background:rgba(6,8,18,.72); backdrop-filter:blur(16px); }
    .header-inner { min-height:68px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; backdrop-filter:none; }
    .hero { padding:80px 0 40px; }
    .hero-frame { min-height:0; padding:0; gap:66px; border:0; border-radius:0; background:transparent; box-shadow:none; }
    .hero-frame::before, .hero-frame::after, .route-panel::before, .platform-band::after, .closing-box::before { display:none; }
    .hero-copy { justify-content:center; min-height:401px; }
    .hero-copy > p { max-width:455px; color:#aebdd2; }
    .hero-foot { display:none; }
    .hero-actions { margin:28px 0 0; }
    .route-panel { min-height:401px; border-radius:20px; background:linear-gradient(145deg,rgba(18,39,67,.66),rgba(9,14,31,.78)); box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 18px 38px rgba(0,0,0,.14); }
    .route-top { padding:16px 17px; }
    .data-rail { position:relative; right:auto; bottom:auto; left:auto; grid-column:1 / -1; margin-top:3px; border:0; border-radius:0; background:transparent; backdrop-filter:none; }
    .metric { min-height:0; padding:17px 0 0; border:0; }
    .metric:not(:last-child) { border-right:0; }
    .metric b { font-size:16px; }
    .metric span { margin-top:1px; }
    .band { padding:92px 0; }
    .advantage-layout { gap:64px; }
    .advantage-intro .line { display:none; }
    .advantage-intro .small-link { margin-top:22px; }
    .benefit { grid-template-columns:36px 48px 1fr; gap:15px; min-height:108px; }
    .benefit-arrow { display:none; }
    .benefit:hover { padding-left:0; }
    .platform-band { padding:82px 0; border-color:rgba(205,230,255,.07); background:transparent; }
    .platform { min-height:167px; border-radius:16px; background:rgba(14,21,43,.58); box-shadow:none; }
    .platform::after { display:none; }
    .platform-icon { margin-bottom:27px; }
    .pricing { padding:92px 0; }
    .price-board { gap:12px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
    .price-board::before { display:none; }
    .tariff { min-height:226px; padding:19px 16px 14px; border-color:var(--line); border-radius:16px; background:rgba(14,21,43,.50); }
    .tariff:hover { transform:translateY(-3px); border-color:rgba(183,236,255,.26); background:rgba(20,30,58,.66); }
    .tariff.featured { background:linear-gradient(160deg,rgba(239,121,214,.12),rgba(48,30,85,.42)); }
    .faq { padding:86px 0; background:transparent; }
    .faq-info { padding:0; border:0; border-radius:0; background:transparent; }
    .closing-box { padding:43px; border-radius:20px; background:linear-gradient(105deg,rgba(17,53,75,.82),rgba(30,21,62,.74)); box-shadow:none; }
    @media(max-width:950px){
      .hero { padding-top:59px; }
      .hero-frame { gap:33px; }
      .hero-copy { min-height:0; }
      .data-rail { margin-top:0; }
      .advantage-intro { position:static; }
    }
    @media(max-width:620px){
      .header-inner { min-height:58px; }
      .hero { padding:46px 0 32px; }
      .hero-frame { gap:28px; }
      .route-panel { min-height:379px; }
      .data-rail { margin-top:0; }
      .metric { padding:13px 0 0; }
      .metric:nth-child(n) { border:0; }
      .band { padding:66px 0; }
      .advantage-layout { gap:29px; }
      .benefit { grid-template-columns:28px 45px 1fr; gap:9px; }
      .platform-band { padding:65px 0; }
      .pricing { padding:68px 0; }
      .tariff { min-height:205px; }
      .faq { padding:64px 0; }
      .closing-box { padding:28px 21px; }
    }

    /* Panel polish — чуть более выразительные поверхности, но без возврата визуального шума. */
    .route-panel { border-color:rgba(183,229,255,.20); background:linear-gradient(145deg,rgba(22,47,76,.74),rgba(10,15,34,.86)); box-shadow:0 21px 44px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.09),inset 0 -1px 0 rgba(103,218,239,.055); }
    .route-panel::after { content:""; position:absolute; width:42%; height:1px; top:0; left:29%; background:linear-gradient(90deg,transparent,rgba(141,241,247,.7),transparent); }
    .route-stat { border-color:rgba(210,237,255,.14); background:linear-gradient(135deg,rgba(20,36,66,.76),rgba(9,15,33,.72)); }
    .benefits { display:grid; gap:10px; border:0; }
    .benefit { min-height:111px; padding:18px 19px; overflow:hidden; border:1px solid rgba(205,230,255,.11); border-radius:16px; background:linear-gradient(145deg,rgba(19,31,60,.56),rgba(10,16,34,.46)); box-shadow:inset 0 1px 0 rgba(255,255,255,.045); }
    .benefit::before { content:""; position:absolute; width:80px; height:80px; top:-56px; right:-46px; border:1px solid rgba(116,229,240,.15); border-radius:50%; box-shadow:0 0 0 12px rgba(116,229,240,.018); }
    .benefit:hover { border-color:rgba(141,241,247,.27); background:linear-gradient(145deg,rgba(24,43,78,.69),rgba(11,20,42,.60)); }
    .platforms { gap:14px; }
    .platform { min-height:176px; padding:22px; border-color:rgba(205,230,255,.13); background:linear-gradient(145deg,rgba(20,34,65,.70),rgba(10,16,34,.62)); box-shadow:inset 0 1px 0 rgba(255,255,255,.06); }
    .platform::before { content:""; position:absolute; width:50px; height:1px; top:0; left:20px; background:linear-gradient(90deg,transparent,rgba(141,241,247,.52),transparent); }
    .platform:nth-child(3)::before { background:linear-gradient(90deg,transparent,rgba(218,190,255,.52),transparent); }
    .platform:hover { background:linear-gradient(145deg,rgba(24,43,78,.83),rgba(12,21,46,.70)); box-shadow:0 14px 26px rgba(0,0,0,.13),inset 0 1px 0 rgba(255,255,255,.08); }
    .price-board { gap:10px; padding:7px; border:1px solid rgba(205,230,255,.11); border-radius:22px; background:rgba(255,255,255,.022); box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }
    .tariff { min-height:232px; border-color:rgba(205,230,255,.08); background:rgba(10,16,34,.30); }
    .tariff.featured { border-color:rgba(239,121,214,.30); background:linear-gradient(160deg,rgba(239,121,214,.16),rgba(66,38,105,.45) 60%,rgba(14,19,45,.68)); box-shadow:inset 0 1px 0 rgba(255,255,255,.09); }
    .tariff.active { border-color:rgba(102,230,238,.58); background:rgba(102,230,238,.07); }
    .faq-info { padding:25px; border:1px solid rgba(205,230,255,.11); border-radius:19px; background:linear-gradient(145deg,rgba(19,31,60,.55),rgba(10,16,34,.39)); box-shadow:inset 0 1px 0 rgba(255,255,255,.05); }
    details { border-color:rgba(205,230,255,.11); background:linear-gradient(145deg,rgba(17,28,55,.48),rgba(10,16,34,.36)); }
    details[open] { border-color:rgba(102,230,238,.28); background:linear-gradient(145deg,rgba(21,42,74,.68),rgba(11,20,42,.58)); }
    /* LF cards + SEO tunnels (concept02 never loads satellite-theme.css) */
    .vc2-lf { padding:48px 0 12px; }
    .vc2-lf-grid { display:grid; gap:12px; grid-template-columns:repeat(3,minmax(0,1fr)); }
    .vc2-lf-card {
      min-height:148px; display:flex; flex-direction:column; gap:8px;
      padding:20px 18px; border:1px solid rgba(205,230,255,.11); border-radius:16px;
      background:linear-gradient(145deg,rgba(19,31,60,.56),rgba(10,16,34,.46));
      box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
    }
    .vc2-lf-card h3 { margin:0; font-family:"Geologica",sans-serif; font-size:16px; font-weight:800; letter-spacing:-.03em; }
    .vc2-lf-card p { margin:0; flex:1; color:var(--muted); font-size:13px; font-weight:600; line-height:1.5; }
    .vc2-lf-card .small-link { margin-top:4px; color:var(--cyan); font-size:12px; font-weight:800; }
    .vc2-lf-card .small-link:hover { color:#fff; }
    .sat-seo-tunnels {
      margin:28px 0 8px; padding:22px 20px; border:1px solid rgba(205,230,255,.11); border-radius:18px;
      background:linear-gradient(145deg,rgba(17,28,55,.48),rgba(10,16,34,.36));
    }
    .sat-seo-tunnels .sat-section__head { margin-bottom:14px; text-align:left; }
    .sat-seo-tunnels .sat-eyebrow, .sat-seo-tunnels .micro {
      display:inline-block; margin-bottom:6px; color:#95a9c6; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
      font-size:10px; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
    }
    .sat-seo-tunnels h2 { margin:0 0 6px; font-family:"Geologica",sans-serif; font-size:20px; font-weight:800; letter-spacing:-.04em; }
    .sat-seo-tunnels__intro { margin:0 0 14px; color:var(--muted); font-size:13px; max-width:52rem; }
    .sat-seo-tunnels__list {
      display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none;
    }
    .sat-seo-tunnels__list a {
      display:inline-flex; align-items:center; min-height:36px; padding:0 13px;
      border:1px solid rgba(204,230,255,.14); border-radius:999px;
      background:rgba(255,255,255,.035); color:#d5e2f2; font-size:12px; font-weight:750;
      transition:border-color .2s, background .2s, color .2s;
    }
    .sat-seo-tunnels__list a:hover { border-color:rgba(102,230,238,.35); background:rgba(102,230,238,.08); color:#fff; }
    @media(max-width:900px){ .vc2-lf-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
    @media(max-width:620px){ .vc2-lf-grid { grid-template-columns:1fr; } .sat-seo-tunnels { padding:18px 14px; } }

    .vc2-mcta { display:none; position:fixed; z-index:40; left:0; right:0; bottom:0; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); border-top:1px solid rgba(205,230,255,.12); background:rgba(6,8,18,.92); backdrop-filter:blur(14px); }
    .vc2-mcta .button { width:100%; min-height:48px; }
    @media(max-width:620px){ .vc2-mcta { display:block; } body.vc2 { padding-bottom:72px; } }
    @media(max-width:620px){
      .benefits { gap:8px; }
      .benefit { min-height:100px; padding:15px 14px; }
      .platform { min-height:144px; padding:19px; }
      .price-board { gap:7px; padding:6px; border-radius:18px; }
      .tariff { min-height:207px; }
      .faq-info { padding:21px; }
    }