:root{--navy:#020c24;--navy2:#061735;--blue:#087cff;--blue2:#164dff;--purple:#7629ed;--text:#07152f;--muted:#65738d;--line:#dce6f5;--bg:#f7faff;--white:#fff;--green:#20c45a}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"Cairo",Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.75}a{text-decoration:none;color:inherit}.container{width:min(1180px,92%);margin:auto}.section{padding:78px 0}.title{text-align:center;font-size:34px;line-height:1.3;margin:0 0 12px;font-weight:900}.subtitle{text-align:center;color:var(--muted);max-width:760px;margin:0 auto 36px}.accent{color:var(--blue)}
header{height:78px;background:rgba(2,12,36,.95);position:sticky;top:0;z-index:1000;border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(14px)}.nav{height:100%;display:flex;align-items:center;justify-content:space-between;gap:25px;direction:ltr}.logo img{height:66px;width:108px;object-fit:contain;mix-blend-mode:screen}.menu{display:flex;gap:25px;align-items:center;color:#fff;font-size:14px;font-weight:700;direction:rtl}.menu a:hover{color:#55a6ff}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:12px;padding:12px 23px;font-weight:800;border:1px solid transparent;cursor:pointer}.btn-primary{background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;box-shadow:0 10px 28px rgba(8,124,255,.24)}.btn-outline{border-color:#9eb4d7;color:#fff;background:transparent}.menu-toggle{display:none;color:#fff;font-size:24px}
.hero{min-height:590px;color:#fff;position:relative;overflow:hidden;background:radial-gradient(circle at 18% 35%,rgba(27,100,255,.25),transparent 34%),linear-gradient(110deg,#02091b 0%,#041531 55%,#02091b 100%)}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,9,27,.1),rgba(2,9,27,.42)),repeating-linear-gradient(90deg,transparent 0 72px,rgba(47,115,255,.035) 73px)}.hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;min-height:510px;gap:45px}.hero-copy h1{font-size:49px;line-height:1.35;margin:0 0 12px;font-weight:900}.hero-copy h1 span{color:#3e91ff}.hero-copy p{font-size:19px;color:#d8e4f8;margin:0 0 24px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.trust{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.trust span{background:rgba(9,36,78,.72);border:1px solid rgba(111,166,255,.35);padding:9px 13px;border-radius:10px;font-size:13px}.server-art{height:360px;position:relative;display:flex;align-items:end;justify-content:center;gap:14px;direction:ltr}.rack{width:95px;height:300px;border-radius:9px;background:linear-gradient(145deg,#07162c,#020814);border:1px solid #1d4d8d;box-shadow:0 0 30px rgba(0,104,255,.25),inset 0 0 20px #02060d;padding:12px 9px;transform:perspective(500px) rotateY(-5deg)}.rack:nth-child(2){height:340px}.rack:nth-child(3){height:275px}.unit{height:18px;margin:7px 0;border:1px solid #183d70;border-radius:3px;background:#061021;position:relative}.unit:after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:#0b8cff;right:7px;top:5px;box-shadow:0 0 8px #0b8cff}.hero-strip{position:relative;z-index:3;background:#fff;color:var(--text);border-radius:18px 18px 0 0;box-shadow:0 -10px 30px rgba(0,0,0,.13);display:grid;grid-template-columns:repeat(4,1fr);padding:18px 25px}.strip-item{text-align:center;border-left:1px solid var(--line);font-weight:800}.strip-item:last-child{border:0}.strip-item i{color:var(--blue);font-size:22px;margin-left:7px}
.features{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}.feature{background:#fff;border:1px solid #e4ebf5;border-radius:16px;padding:26px 17px;text-align:center;box-shadow:0 8px 28px rgba(22,56,104,.06)}.feature i{font-size:35px;color:#438fff;margin-bottom:13px}.feature h3{font-size:16px;margin:0 0 5px}.feature p{font-size:13px;color:var(--muted);margin:0}
.hosting{background:#fff}.hosting-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:55px;align-items:center}.dashboard{background:linear-gradient(145deg,#071b42,#0a3676);border-radius:22px;padding:22px;box-shadow:0 25px 50px rgba(7,39,89,.22);color:#fff;direction:ltr}.dash-top{font-weight:900;font-size:20px;margin-bottom:18px}.dash-body{display:grid;grid-template-columns:120px 1fr;gap:14px}.dash-side{background:#061633;border-radius:12px;padding:12px;font-size:11px}.dash-side div{padding:8px 2px;border-bottom:1px solid rgba(255,255,255,.08)}.charts{display:grid;grid-template-columns:1fr 1fr;gap:10px}.chart{height:100px;background:linear-gradient(180deg,#f9fbff,#e7f0ff);border-radius:10px;position:relative;overflow:hidden}.chart:after{content:"";position:absolute;left:10%;right:10%;bottom:20%;height:35%;border-top:3px solid #3186ff;border-radius:50%;transform:skewY(-12deg)}.hosting-copy h2{font-size:35px;margin:0 0 5px}.hosting-copy>p{color:var(--muted)}.check-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px 20px;margin-top:25px}.check{font-size:14px;font-weight:700}.check i{color:var(--blue);margin-left:7px}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.plan{background:#fff;border:1px solid #dce6f4;border-radius:18px;padding:28px;box-shadow:0 10px 35px rgba(18,54,104,.07);position:relative}.plan.popular{background:linear-gradient(160deg,#164fdc,#062d89);color:#fff;transform:translateY(-10px);box-shadow:0 18px 45px rgba(14,72,200,.25)}.badge{position:absolute;top:0;left:0;background:var(--purple);color:#fff;padding:6px 14px;border-radius:0 18px 0 14px;font-size:12px;font-weight:800}.plan h3{font-size:23px;margin:0}.price{font-size:34px;font-weight:900;direction:ltr;text-align:right}.plan ul{list-style:none;padding:0;margin:18px 0}.plan li{padding:5px 0;font-size:14px}.plan li:before{content:"✓";color:#2584ff;font-weight:900;margin-left:8px}.plan.popular li:before{color:#6fb6ff}.plan .btn{width:100%;margin-top:8px}.plan:not(.popular) .btn-outline{color:var(--blue);border-color:var(--blue)}
.management{background:linear-gradient(135deg,#020a1e,#061c42);color:#fff}.management .subtitle{color:#b9c8e0}.mgmt-wrap{display:grid;grid-template-columns:1fr 1.55fr;gap:28px;align-items:start}.mgmt-pricing{display:grid;grid-template-columns:1fr;gap:16px;position:sticky;top:100px}.mgmt-price{border:1px solid #2a5c9d;border-radius:20px;padding:26px;background:radial-gradient(circle at 50% 15%,rgba(120,43,237,.22),transparent 40%),#07142c;text-align:center;position:relative}.mgmt-price.featured{border:2px solid #287cff;box-shadow:0 15px 40px rgba(0,105,255,.18)}.mgmt-price .price-badge{position:absolute;top:-12px;right:50%;transform:translateX(50%);background:#1478ff;padding:5px 15px;border-radius:30px;font-size:12px;font-weight:800}.mgmt-price .big{font-size:58px;font-weight:900;line-height:1;direction:ltr;margin-top:10px;text-shadow:0 0 25px rgba(94,139,255,.35)}.mgmt-price h3{font-size:20px;margin:15px 0 5px}.mgmt-price p{color:#b9c8e0;font-size:13px;margin:5px 0 18px}.mgmt-price .btn{width:100%}.mgmt-groups{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.mgmt-card{border:1px solid #254f86;border-radius:16px;padding:20px;background:rgba(7,25,56,.78)}.mgmt-card h3{color:#75a9ff;margin:0 0 12px;font-size:17px}.mgmt-card ul{margin:0;padding:0;list-style:none}.mgmt-card li{font-size:12.5px;padding:4px 0;color:#e8eef8}.mgmt-card li:before{content:"✓";color:#25d16f;font-weight:900;margin-left:7px}.mgmt-card.wide{grid-column:1/-1}.mgmt-card.wide ul{columns:2;column-gap:25px}
.vps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.vps-card{background:#fff;border:1px solid #dfe7f3;border-radius:17px;text-align:center;padding:28px}.cube{width:70px;height:70px;margin:0 auto 16px;border:3px solid #83a9df;border-radius:15px;transform:rotate(30deg);display:grid;place-items:center;color:#2c75db;font-size:25px}.vps-card h3{color:#075bd0;margin:5px}.why{background:#03142f;color:#fff;padding:60px 0}.why-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}.why-item{text-align:center}.why-item i{font-size:31px;color:#2684ff}.why-item h4{margin:8px 0 3px}.why-item p{font-size:12px;color:#b7c5dc;margin:0}
.cta{margin:45px auto;background:linear-gradient(110deg,#1767e8,#1242bd);color:#fff;border-radius:22px;padding:35px 45px;display:flex;align-items:center;justify-content:space-between;gap:25px}.cta h2{margin:0;font-size:28px}.cta p{margin:5px 0 0;color:#dbe8ff}.cta .btn{background:#fff;color:#0d55d5}
footer{background:#020d24;color:#fff;padding:45px 0 20px}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:45px}.footer-brand img{width:125px;height:85px;object-fit:contain;mix-blend-mode:screen}.footer-brand p,footer li{color:#b8c5d9;font-size:13px}.footer-grid h4{margin-top:0}.footer-grid ul{list-style:none;padding:0}.social-links{display:flex;gap:10px;margin-top:16px;direction:ltr}.social-links a{width:38px;height:38px;border-radius:10px;border:1px solid #24446f;display:grid;place-items:center;color:#fff;background:#071936;transition:.25s}.social-links a:hover{background:#1478ff;border-color:#1478ff;transform:translateY(-3px)}
.copyright{text-align:center;color:#8291aa;border-top:1px solid #152641;padding-top:18px;margin-top:28px;font-size:12px}.whatsapp{position:fixed;right:22px;bottom:22px;width:60px;height:60px;border-radius:50%;background:#20c45a;color:#fff;display:grid;place-items:center;font-size:31px;z-index:999;box-shadow:0 8px 24px rgba(32,196,90,.38);border:4px solid #fff}
@media(max-width:1100px) and (min-width:901px){.plans{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.menu{display:none}.menu-toggle{display:block}.hero-grid,.hosting-grid,.mgmt-wrap{grid-template-columns:1fr}.hero-grid{padding:55px 0}.hero-copy h1{font-size:38px}.server-art{display:none}.hero-strip{grid-template-columns:1fr 1fr;gap:15px}.strip-item{border:0}.features{grid-template-columns:repeat(2,1fr)}.plans,.vps-grid{grid-template-columns:1fr}.plan.popular{transform:none}.mgmt-pricing{position:static;grid-template-columns:1fr 1fr}.mgmt-groups{grid-template-columns:1fr}.mgmt-card.wide{grid-column:auto}.mgmt-card.wide ul{columns:1}.why-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.cta{flex-direction:column;text-align:center}}
@media(max-width:600px){.mgmt-pricing{grid-template-columns:1fr}.mgmt-price .big{font-size:50px}}
@media(max-width:560px){.section{padding:55px 0}.title{font-size:27px}.hero-copy h1{font-size:31px}.hero-strip{grid-template-columns:1fr}.features,.check-grid,.why-grid,.footer-grid{grid-template-columns:1fr}.logo img{width:90px}.cta{margin-inline:4%;padding:28px 20px}}
