.navbar{position:sticky;top:0;z-index:1000;background:rgba(15,12,41,0.95);backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,0.05);padding:0 20px}
.nav-container{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:65px}
.nav-logo{font-size:22px;font-weight:800;text-decoration:none;background:linear-gradient(135deg, #43cea2, #185a9d);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;white-space:nowrap}
.nav-menu{list-style:none;display:flex;gap:5px;margin:0;padding:0}
.nav-link{display:block;padding:10px 18px;color:#b0b0d0;text-decoration:none;font-size:15px;font-weight:600;border-radius:10px;transition:0.3s;white-space:nowrap}
.nav-link:hover{color:white;background:rgba(255,255,255,0.05)}

/* ﺯﺭ ﺎﻠﻫﺎﻤﺑﺮﻏﺭ */
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:5px}
.hamburger span{display:block;width:25px;height:2px;background:white;border-radius:2px;transition:0.3s}
.hamburger.active span:nth-child(1){transform:rotate(45deg) translate(5px, 5px)}
.hamburger.active span:nth-child(2){opacity:0}
.hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(5px, -5px)}

/* ════════════ ﺖﺟﺍﻮﺑ ﺎﻠﻫﺎﺘﻓ ════════════ */
@media (max-width:700px){.hamburger{display:flex}
    .nav-menu{position:fixed;top:65px;left:-100%;width:250px;height:calc(100vh - 65px);background:rgba(15, 12, 41, 0.98);backdrop-filter:blur(20px);flex-direction:column;padding:20px;gap:5px;transition:0.4s ease;border-right:1px solid rgba(255,255,255,0.05)}
    .nav-menu.active{left:0}
    .nav-link{padding:14px 18px;font-size:16px;border-radius:12px}
}

*{margin:0;padding:0;box-sizing:border-box}

body{font-family:'Segoe UI',Tahoma,sans-serif;background:#0f0c29;color:white;line-height:1.6}

.container{max-width:1200px;margin:0 auto;padding:0 20px}

.hero{text-align:center;padding:60px 20px 40px;background:linear-gradient(180deg, rgba(67,206,162,0.1) 0%, transparent 100%)}
.hero .logo{font-size:48px;font-weight:900;background:linear-gradient(135deg, #43cea2, #185a9d);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero h1{font-size:28px;margin:15px 0}
.hero p{color:#b0b0d0;font-size:18px;max-width:600px;margin:0 auto}

.st{text-align:center;font-size:28px;margin:50px 0 30px;position:relative}
.st::after{content:'';display:block;width:60px;height:3px;background:#43cea2;margin:10px auto;border-radius:3px}

.services-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:25px;margin-bottom:50px}

.sc{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);border-radius:16px;padding:30px 25px;text-align:center;transition:0.3s}
.sc:hover{transform:translateY(-5px);border-color:#43cea2;background:rgba(67,206,162,0.05)}
.sc .i{font-size:40px;margin-bottom:15px}
.sc h3{font-size:18px;margin-bottom:10px;color:#43cea2}
.sc p{font-size:14px;color:#b0b0d0}

.features{list-style:none;text-align:right;margin-bottom:25px}
.features li{padding:8px 0;color:#c0c0d0;font-size:13px;border-bottom:1px solid rgba(255,255,255,0.03)}
.features li:last-child{border-bottom:none}

.btn-subscribe{width:100%;padding:12px;border:1px solid rgba(255,255,255,0.2);border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;transition:0.3s;color:white;background:transparent;font-family:inherit}
.btn-subscribe:hover{background:rgba(255,255,255,0.1)}

.why-us{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:25px;margin-bottom:50px}
.wc{background:rgba(255,255,255,0.03);border-radius:16px;padding:25px;text-align:center;border:1px solid rgba(255,255,255,0.05)}
.wc .n{font-size:36px;font-weight:900;color:#43cea2}
.wc p{color:#b0b0d0;font-size:14px;margin-top:10px}

.cta{text-align:center;padding:50px 20px;background:rgba(67,206,162,0.05);border-radius:20px;margin-bottom:50px}
.cta h2{font-size:24px;margin-bottom:10px}
.cta p{color:#b0b0d0;margin-bottom:20px}
.btn-cta{padding:14px 40px;background:linear-gradient(135deg, #43cea2, #185a9d);color:white;border:none;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;font-family:inherit;transition:0.3s}
.btn-cta:hover{box-shadow:0 10px 30px rgba(67,206,162,0.3);transform:translateY(-2px)}

.g{text-align:center;color:#8888aa;font-size:14px;padding-bottom:40px}

@media (max-width:900px){.hero .logo{font-size:36px}
    .hero h1{font-size:22px}}

@media (max-width:550px){.services-grid{grid-template-columns:1fr;max-width:350px;margin:0 auto 40px}
    .why-us{grid-template-columns:1fr 1fr}
    .hero .logo{font-size:30px}
    .hero h1{font-size:20px}
    .hero p{font-size:16px}
    .st{font-size:22px}
    .toggle-container{gap:10px}
    .badge-save{font-size:10px;padding:3px 8px}}

*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Segoe UI', Tahoma, sans-serif;background:linear-gradient(135deg, #0f0c29, #302b63, #24243e);min-height:100vh;padding:40px 20px}
.header{text-align:center;margin-bottom:50px}
.header .logo{font-size:42px;font-weight:900;background:linear-gradient(135deg,#43cea2,#185a9d);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:10px}
.header .subtitle{color:#b0b0d0;font-size:18px;letter-spacing:1px}

.toggle-container{display:flex;justify-content:center;align-items:center;gap:15px;margin-bottom:50px}
.toggle-label{color:#b0b0d0;font-size:16px;font-weight:600}
.toggle-label.active{color:white;font-weight:700}
.toggle-switch{position:relative;width:60px;height:30px;background:#43cea2;border-radius:30px;cursor:pointer;transition:0.3s}
.toggle-switch::after{content:'';position:absolute;width:24px;height:24px;border-radius:50%;background:white;top:3px;left:3px;transition:0.3s}
.toggle-switch.yearly::after{left:33px}
.badge-save{background:#ff6b6b;color:white;padding:4px 10px;border-radius:20px;font-size:12px;font-weight:700}

.pg{display:grid;grid-template-columns:repeat(4, 1fr);gap:25px;max-width:1200px;margin:0 auto}

.pc{background:rgba(255,255,255,0.05);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.1);border-radius:20px;padding:35px 25px;text-align:center;transition:0.4s;position:relative;overflow:hidden}
.pc:hover{transform:translateY(-10px);border-color:rgba(255,255,255,0.3);box-shadow:0 20px 50px rgba(0,0,0,0.3)}

.pc.featured{background:rgba(67,206,162,0.1);border:2px solid #43cea2;transform:scale(1.05)}
.pc.featured:hover{transform:scale(1.05) translateY(-10px)}
.pc.featured::before{content:'👑 الأكثر اختياراً';position:absolute;top:15px;left:-30px;background:linear-gradient(135deg, #ffd700, #ffaa00);color:#333;padding:6px 40px;font-size:12px;font-weight:700;transform:rotate(-45deg)}

.pn{font-size:22px;font-weight:800;color:white;margin-bottom:5px}
.pd{font-size:13px;color:#8888aa;margin-bottom:25px}

.pr{margin-bottom:25px;direction:rtl;unicode-bidi:bidi-override}
.pr .c{font-size:20px;color:#8888aa;vertical-align:top}
.pr .amount{font-size:55px;font-weight:900;color:white;line-height:1}
.pr .period{font-size:14px;color:#8888aa}
.pr .old-price{text-decoration:line-through;color:#ff6b6b;font-size:14px;margin-top:5px}

.features{list-style:none;text-align:right;margin-bottom:30px}
.features li{padding:10px 0;color:#c0c0d0;font-size:14px;border-bottom:1px solid rgba(255,255,255,0.05);display:flex;align-items:center;gap:10px}
.features li:last-child{border-bottom:none}
.features .ic{font-size:16px;min-width:24px;text-align:center}
.i{color:#43cea2}
.ir{color:#ff5252}
.is{color:#ffd700}

.btn-subscribe{width:100%;padding:14px;border:2px solid rgba(255,255,255,0.2);border-radius:12px;font-size:16px;font-weight:700;font-family:inherit;cursor:pointer;transition:0.3s;color:white;background:transparent}
.btn-subscribe:hover{background:rgba(255,255,255,0.1);border-color:white}

.pc.featured .btn-subscribe{background:linear-gradient(135deg, #43cea2, #185a9d);border:none;color:white}
.pc.featured .btn-subscribe:hover{box-shadow:0 10px 30px rgba(67,206,162,0.3)}

.pc.free .amount{color:#43cea2}
.pc.free .btn-subscribe{background:rgba(67,206,162,0.2);border-color:#43cea2;color:#43cea2}

.gu{text-align:center;margin-top:50px;color:#8888aa;font-size:14px;display:flex;align-items:center;justify-content:center;gap:10px}
.gu .sh{font-size:24px}

@media (max-width:1000px){.pg{grid-template-columns:repeat(2, 1fr)} .pc.featured{transform:scale(1)}}
@media (max-width:600px){.pg{grid-template-columns:1fr} .header .logo{font-size:30px}}

@keyframes twinkle{0%, 100%{opacity:0.3}50%{opacity:1}}
.stars{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:-1}
.s{position:absolute;color:white;animation:twinkle 2s infinite;font-size:10px}
.s:nth-child(odd){color:#ffd700}
.s:nth-child(even){color:#c0c0d0}
.s:nth-child(3n){color:#667eea}
.s:nth-child(5n){color:white}






/* only for Choosen form Design */
.icard{background:white;border-radius:16px;padding:25px;box-shadow:0 4px 20px rgba(0,0,0,0.06);margin:20px auto;display:block;width:min(98%,360px)}
.icard table{margin:0 auto}

.i2 .l{font-weight:600;color:#e65100;font-size:14px;display:flex;align-items:center;gap:6px;margin-bottom:6px}
.i2 input{width:100%;padding:12px 15px;border:none;border-bottom:3px solid #ffcc80;font-size:15px;font-family:inherit;background:#fff8f0;border-radius:8px 8px 0 0;transition:0.3s}
.i2 input:focus{outline:none;border-bottom-color:#e65100;background:white}
.i3{width:100%;padding:12px 15px;border:none;border-bottom:3px solid #ffcc80;font-size:15px;font-family:inherit;background:#fff8f0;border-radius:8px 8px 0 0;transition:0.3s}

.r{text-align:right}

table{--color:red}
th,td{background:transparent;color:white}
.a{color:white;text-align:center}
.u{color:white;font-weight:700}

.top-left{position:fixed;top:2;left:50px}

strong.b{text-align:center;margin:15px auto;display:block}