:root{
  --navy:#0a1245;
  --navy-2:#13256d;
  --blue:#1d74ff;
  --blue-soft:#eaf3ff;
  --purple:#7c3aed;
  --cyan:#18c4ff;
  --green:#10b981;
  --gold:#ffb800;
  --text:#0f172a;
  --muted:#64748b;
  --bg:#eef3fb;
  --card:#ffffff;
  --border:rgba(20,33,84,.10);
  --shadow:0 20px 50px rgba(9,15,49,.10);
  --radius:24px;
  --container:min(1180px, calc(100% - 32px));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:linear-gradient(180deg,#f1f5fb 0%, #edf2fa 100%);overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit}
.network-bg{position:fixed;inset:0;z-index:-2;background:linear-gradient(180deg,#eef3fb,#edf2f8)}
.noise{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(circle at top right, rgba(125,211,252,.08), transparent 28%),radial-gradient(circle at top left, rgba(124,58,237,.06), transparent 30%)}
.container{width:var(--container);margin:auto}
.section{padding:88px 0}
.section-sm{padding:62px 0}
.badge-pill{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border-radius:999px;background:#fff;color:#2956a3;border:1px solid rgba(41,86,163,.12);box-shadow:0 10px 24px rgba(41,86,163,.10);font-size:14px;font-weight:700}
.section-header{max-width:720px;margin:0 auto 42px;text-align:center}
.section-header h2{margin:14px 0 10px;font-size:clamp(30px,3vw,46px);line-height:1.08;color:#14306d}
.section-header p{margin:0;color:var(--muted);font-size:16px;line-height:1.7}
.topbar{position:sticky;top:0;z-index:40;background:rgba(10,18,69,.92);backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.06)}
.navbar{height:86px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{height:52px;width:auto}
.brand span{color:#fff;font-size:26px;font-weight:800;letter-spacing:-.02em}
.nav-links{display:flex;align-items:center;gap:28px}
.nav-links a{color:#dce7ff;font-size:15px;font-weight:600;transition:.2s}
.nav-links a:hover{color:#fff}
.nav-actions{display:flex;align-items:center;gap:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;cursor:pointer;border-radius:14px;padding:14px 22px;font-weight:700;transition:.22s ease;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg,#2257a5,#0e2d6f);color:#fff;box-shadow:0 16px 28px rgba(17,53,119,.22)}
.btn-secondary{background:linear-gradient(135deg,#8648ff,#5a2bcc);color:#fff;box-shadow:0 16px 28px rgba(124,58,237,.22)}
.btn-outline{background:#fff;color:#173f82;border:1px solid rgba(23,63,130,.14);box-shadow:0 12px 24px rgba(24,41,86,.06)}
.btn-wallet{background:linear-gradient(135deg,#0d4cae,#0b8b61);color:#fff}
.menu-btn{display:none;width:48px;height:48px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:#fff;align-items:center;justify-content:center;font-size:20px}
.mobile-panel{display:none;position:fixed;inset:86px 12px auto 12px;background:#fff;border-radius:22px;padding:18px;box-shadow:var(--shadow);z-index:45}
.mobile-panel a{display:block;padding:14px 10px;border-radius:12px;color:#1f376d;font-weight:700}
.mobile-panel a:hover{background:#eff5ff}
.hero{padding:92px 0 62px;position:relative}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:rgba(24,116,255,.08);color:#1b4b93;font-weight:700;font-size:14px}
.hero-copy h1{margin:18px 0 16px;font-size:clamp(38px,5vw,64px);line-height:1.02;color:#11255e;letter-spacing:-.04em}
.hero-copy p{margin:0 0 28px;color:#53637f;font-size:17px;line-height:1.8;max-width:650px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:28px}
.trust-row{display:flex;flex-wrap:wrap;gap:18px;color:#355796;font-size:15px;font-weight:700}
.trust-row span{display:flex;align-items:center;gap:8px}
.hero-visual{position:relative}
.visual-card{position:relative;background:#fff;border-radius:32px;box-shadow:0 24px 60px rgba(12,20,61,.12);padding:22px;overflow:hidden;border:1px solid rgba(18,48,109,.08)}
.visual-card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right, rgba(124,58,237,.10), transparent 28%),radial-gradient(circle at left, rgba(24,116,255,.10), transparent 32%);pointer-events:none}
.visual-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.visual-top .small-brand{display:flex;align-items:center;gap:10px;font-weight:800;color:#173f82}
.visual-top .small-brand img{width:42px;height:42px}
.status-chip{padding:9px 12px;border-radius:999px;background:#f4edff;color:#6a35d8;font-size:13px;font-weight:800}
.hero-image{border-radius:24px;height:320px;object-fit:cover;width:100%;box-shadow:0 18px 40px rgba(16,24,40,.10)}
.floating-card{position:absolute;background:#fff;border-radius:20px;padding:16px 18px;box-shadow:0 22px 40px rgba(8,18,69,.16);min-width:182px;border:1px solid rgba(18,48,109,.08)}
.floating-card .label{display:block;color:#64748b;font-size:13px;font-weight:700;margin-bottom:8px}
.floating-card strong{display:block;color:#14306d;font-size:28px;line-height:1.1}
.floating-card small{display:block;color:#16a34a;font-size:13px;font-weight:700;margin-top:6px}
.float-a{top:-22px;right:-16px}
.float-b{bottom:26px;left:-14px}
.float-c{bottom:-18px;right:18px}
.stats-strip{margin-top:26px;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.stat-box{background:#fff;border-radius:22px;padding:18px 18px;box-shadow:var(--shadow);display:flex;align-items:center;gap:14px;border:1px solid rgba(18,48,109,.07)}
.stat-box .icon{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;color:#fff;font-size:24px;flex-shrink:0}
.stat-box strong{display:block;font-size:24px;color:#16356f}
.stat-box span{display:block;color:var(--muted);font-size:14px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.card{background:#fff;border-radius:26px;padding:28px;box-shadow:var(--shadow);border:1px solid rgba(18,48,109,.07)}
.feature-card{position:relative;overflow:hidden}
.feature-card::after{content:"";position:absolute;width:180px;height:180px;border-radius:50%;right:-60px;top:-60px;background:radial-gradient(circle, rgba(34,87,165,.09), transparent 70%)}
.feature-card .icon-wrap{width:68px;height:68px;border-radius:20px;display:grid;place-items:center;margin-bottom:18px;color:#fff;font-size:28px}
.feature-card h3,.info-card h3,.faq-item h3{margin:0 0 10px;color:#17356d;font-size:22px}
.feature-card p,.info-card p,.faq-answer,.list-points li{margin:0;color:var(--muted);line-height:1.75;font-size:15px}
.about-layout{display:grid;grid-template-columns:.95fr 1.05fr;gap:34px;align-items:center}
.about-media{position:relative}
.about-media .card{padding:16px}
.about-media img{border-radius:22px;height:380px;width:100%;object-fit:cover}
.media-badge{position:absolute;left:18px;bottom:20px;background:#fff;padding:14px 18px;border-radius:18px;box-shadow:0 22px 40px rgba(15,23,42,.15)}
.media-badge strong{display:block;color:#17356d;font-size:28px}
.media-badge span{font-size:14px;color:var(--muted);font-weight:600}
.info-card h4{margin:0 0 8px;color:#17356d;font-size:18px}
.highlight-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:18px}
.highlight-item{padding:16px 18px;border-radius:18px;background:#f6f9ff;border:1px solid rgba(18,48,109,.08);display:flex;gap:12px;align-items:flex-start}
.highlight-item i{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#e3efff;color:#2152a1;font-size:18px;flex-shrink:0}
.dark-band{background:linear-gradient(180deg,#0c1548,#13296d);color:#fff;position:relative;overflow:hidden}
.dark-band::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at top right, rgba(24,196,255,.12), transparent 25%),radial-gradient(circle at bottom left, rgba(255,184,0,.10), transparent 18%)}
.dark-band .section-header h2,.dark-band .section-header p{color:#fff}
.process-card,.plan-card,.faq-item{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(10px)}
.process-card{padding:28px;border-radius:24px}
.process-step{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;background:rgba(255,255,255,.14);margin-bottom:18px;font-size:22px}
.process-card h3{margin:0 0 10px;font-size:22px}
.process-card p{margin:0;color:#d7ddf7;line-height:1.75;font-size:15px}
.list-points{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:12px}
.list-points li{display:flex;gap:10px;align-items:flex-start}
.list-points i{color:#10b981;margin-top:3px}
.plan-card{padding:28px;border-radius:26px;position:relative;overflow:hidden}
.plan-card.recommended{outline:2px solid rgba(255,184,0,.55);transform:translateY(-6px)}
.plan-card .tag{position:absolute;top:14px;right:14px;padding:8px 12px;border-radius:999px;background:#ffb800;color:#172554;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.plan-card h3{margin:0 0 8px;font-size:24px;color:#fff}
.plan-card .price{font-size:40px;font-weight:900;margin-bottom:14px}
.plan-card p{margin:0;color:#d7ddf7;line-height:1.7}
.faq-wrap{display:grid;gap:18px;max-width:920px;margin:0 auto}
.faq-item{border-radius:22px;padding:22px 24px;cursor:pointer}
.faq-item button{all:unset;display:flex;justify-content:space-between;align-items:center;width:100%;gap:18px;color:#fff;font-weight:800;font-size:18px;cursor:pointer}
.faq-answer{display:none;padding-top:14px;color:#d7ddf7}
.faq-item.active .faq-answer{display:block}
.cta-card{display:grid;grid-template-columns:1.2fr .8fr;gap:22px;align-items:center;background:linear-gradient(135deg,#fff,#f5f8ff);border:1px solid rgba(18,48,109,.07);border-radius:32px;padding:34px;box-shadow:var(--shadow)}
.cta-card h2{margin:0 0 12px;font-size:clamp(28px,4vw,44px);color:#14306d}
.cta-card p{margin:0;color:var(--muted);line-height:1.8}
.cta-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}
.footer{background:#091241;color:#dbe6ff;padding:26px 0 18px;margin-top:40px}
.footer-grid{display:grid;grid-template-columns:1.2fr repeat(3,.7fr);gap:28px}
.footer h4{margin:0 0 14px;color:#fff;font-size:18px}
.footer p,.footer a,.footer li{color:#dbe6ff;line-height:1.8;font-size:14px}
.footer ul{list-style:none;padding:0;margin:0}
.footer-bottom{display:flex;justify-content:space-between;gap:18px;align-items:center;border-top:1px solid rgba(255,255,255,.10);margin-top:22px;padding-top:16px;font-size:13px;color:#b8c7f2}
.auth-page{min-height:100vh;display:grid;place-items:center;padding:32px 16px;position:relative}
.auth-card{position:relative;width:min(100%,570px);background:rgba(255,255,255,.96);border-radius:34px;box-shadow:0 28px 70px rgba(10,18,69,.14);padding:34px 34px;border:1px solid rgba(18,48,109,.08);backdrop-filter:blur(12px)}
.auth-card.narrow{width:min(100%,520px)}
.auth-logo{display:flex;justify-content:center;margin-bottom:10px}
.auth-logo img{height:96px;width:auto}
.auth-divider{height:1px;background:rgba(17,53,109,.14);margin:16px 0 24px}
.auth-title{text-align:center;margin-bottom:20px}
.auth-title h1{margin:0 0 10px;color:#1b4a94;font-size:clamp(36px,4vw,52px);letter-spacing:-.03em}
.auth-title h2{margin:0 0 10px;color:#1b4a94;font-size:clamp(28px,4vw,48px);letter-spacing:-.03em}
.auth-title p{margin:0;color:#5f6e85;font-size:16px;line-height:1.7}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.form-group{display:flex;flex-direction:column;gap:8px}
.form-full{grid-column:1/-1}
.field-row{position:relative}
.field-row input,.field-row select{width:100%;height:56px;border-radius:16px;border:1px solid rgba(18,48,109,.12);background:#f9fbff;padding:0 52px 0 18px;color:#17356d;outline:none;transition:.2s;font-size:16px}
.field-row input:focus,.field-row select:focus{border-color:#1d74ff;box-shadow:0 0 0 4px rgba(29,116,255,.10)}
.field-row .icon{position:absolute;right:18px;top:50%;transform:translateY(-50%);color:#17356d;font-size:18px;pointer-events:none}
.country-row{display:flex;align-items:center;gap:12px;height:56px;padding:0 16px;border:1px solid rgba(18,48,109,.12);background:#f9fbff;border-radius:16px;color:#17356d}
.country-row img{width:24px;border-radius:4px}
.inline-row{display:flex;justify-content:space-between;gap:16px;align-items:center;font-size:15px;color:#4b5565;margin:10px 0 6px}
.inline-row .checkbox{display:flex;gap:10px;align-items:center}
.inline-row input[type=checkbox]{width:20px;height:20px}
.help-link{color:#1c4f9f;font-weight:700}
.auth-sep{position:relative;text-align:center;color:#93a2be;font-weight:800;font-size:13px;margin:26px 0 18px}
.auth-sep::before,.auth-sep::after{content:"";position:absolute;top:50%;width:38%;height:1px;background:rgba(18,48,109,.14)}
.auth-sep::before{left:0}.auth-sep::after{right:0}
.auth-bottom{text-align:center;color:#56657b;font-size:15px;margin-top:18px;line-height:1.8}
.auth-bottom a{color:#1c4f9f;font-weight:800}
.telegram{margin-top:6px}
.otp-row{display:grid;grid-template-columns:1fr auto;gap:12px}
.otp-row .btn{padding-inline:18px}
.back-link{display:inline-flex;align-items:center;gap:8px;margin-top:14px;color:#1c4f9f;font-weight:800}
.wallet-btn{width:100%;font-size:28px;padding:17px 18px;border-radius:16px}
.wallet-btn small{font-size:20px;font-weight:800}
.flag-inline{font-size:20px}
@media (max-width:1080px){
  .hero-grid,.about-layout,.cta-card,.footer-grid{grid-template-columns:1fr}
  .stats-strip,.grid-3{grid-template-columns:repeat(2,1fr)}
  .grid-2{grid-template-columns:1fr}
  .footer-grid{gap:22px}
}
@media (max-width:860px){
  .nav-links,.nav-actions .btn-outline{display:none}
  .menu-btn{display:inline-flex}
  .mobile-panel.show{display:block}
  .hero{padding-top:60px}
  .hero-copy h1{max-width:600px}
}
@media (max-width:720px){
  .section{padding:72px 0}
  .stats-strip,.grid-3,.highlight-list{grid-template-columns:1fr}
  .hero-actions,.trust-row,.cta-actions{flex-direction:column;align-items:flex-start}
  .floating-card{position:static;margin-top:14px}
  .hero-image{height:260px}
  .visual-card{padding:18px}
  .auth-card{padding:28px 20px;border-radius:28px}
  .form-grid{grid-template-columns:1fr}
  .otp-row{grid-template-columns:1fr}
  .auth-sep::before,.auth-sep::after{width:30%}
  .navbar{height:78px}
  .brand img{height:46px}
  .brand span{font-size:22px}
}
@media (max-width:520px){
  .container{width:min(100% - 24px, 1180px)}
  .section-header h2{font-size:30px}
  .hero-copy p,.section-header p{font-size:15px}
  .hero-copy h1{font-size:38px}
  .stat-box,.card,.cta-card,.auth-card{border-radius:20px}
  .btn{width:100%}
  .nav-actions .btn{display:none}
  .wallet-btn{font-size:22px}
  .wallet-btn small{font-size:16px}
}


/* ===== Refreshed visual theme + navigation fixes ===== */
:root{
  --navy:#06133f;
  --navy-2:#132d7a;
  --blue:#1677ff;
  --purple:#8b3dff;
  --cyan:#09c6f9;
  --green:#12b981;
  --gold:#ffbd2e;
  --bg:#eef5ff;
}
body{
  background:
    radial-gradient(circle at 8% 0%,rgba(9,198,249,.10),transparent 28%),
    radial-gradient(circle at 92% 8%,rgba(139,61,255,.09),transparent 30%),
    linear-gradient(180deg,#f6f9ff 0%,#edf4ff 55%,#f7f9ff 100%);
}
.topbar{background:linear-gradient(90deg,rgba(6,19,63,.97),rgba(20,44,121,.96) 58%,rgba(79,29,157,.94));box-shadow:0 10px 32px rgba(7,18,63,.14)}
.btn-primary{background:linear-gradient(135deg,#1478ff,#173f9d 62%,#6f34d8)}
.btn-secondary{background:linear-gradient(135deg,#9a42ff,#6130d2)}
.btn-outline{border-color:rgba(25,102,219,.18);background:rgba(255,255,255,.94)}
.hero-copy h1,.section-header h2,.about-layout h2,.cta-card h2{background:linear-gradient(90deg,#102d72,#176ee8 55%,#7d37e6);-webkit-background-clip:text;background-clip:text;color:transparent}
.badge-pill{background:linear-gradient(135deg,#ffffff,#eef6ff);border-color:rgba(22,119,255,.15)}
.card,.stat-box,.visual-card,.cta-card{border-color:rgba(42,91,177,.10);box-shadow:0 20px 52px rgba(25,58,124,.10)}
.feature-card .icon-wrap,.stat-box .icon{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 12px 24px rgba(22,77,166,.14)}
.dark-band{background:linear-gradient(135deg,#06133f 0%,#153681 56%,#51239a 100%)}
.footer{background:linear-gradient(135deg,#06113a,#102b70 64%,#4f2193)}
.hero-image{filter:saturate(1.04) contrast(1.02)}

/* Mobile menu must scroll through all items */
.mobile-panel{
  max-height:calc(100dvh - 102px);
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
  scrollbar-color:#6f7fc1 transparent;
}
.mobile-panel::-webkit-scrollbar{width:6px}
.mobile-panel::-webkit-scrollbar-thumb{background:#6f7fc1;border-radius:20px}
.mobile-panel.show{display:block}
body.menu-open{overflow:hidden;touch-action:none}

/* Back to top */
.back-to-top{
  position:fixed;
  right:22px;
  bottom:22px;
  width:52px;
  height:52px;
  border:0;
  border-radius:17px;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:18px;
  cursor:pointer;
  z-index:70;
  opacity:0;
  visibility:hidden;
  transform:translateY(16px) scale(.92);
  transition:.24s ease;
  background:linear-gradient(135deg,#1677ff,#7b35e8);
  box-shadow:0 16px 34px rgba(47,73,177,.34),inset 0 1px 0 rgba(255,255,255,.25);
}
.back-to-top.show{opacity:1;visibility:visible;transform:none}
.back-to-top:hover{transform:translateY(-3px)}

/* Small floating trust strip added to homepage */
.trust-banner{
  margin-top:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:12px 24px;
  padding:14px 20px;
  border-radius:18px;
  color:#eaf3ff;
  background:linear-gradient(90deg,#0e2e75,#194fa7,#5e29bc);
  box-shadow:0 18px 34px rgba(26,62,145,.18);
  font-size:14px;
  font-weight:700;
}
.trust-banner span{display:flex;align-items:center;gap:8px}
.trust-banner i{color:#ffcf49}

@media(max-width:860px){
  .mobile-panel{inset:78px 10px auto 10px;padding-bottom:22px}
}
@media(max-width:520px){
  .back-to-top{right:14px;bottom:14px;width:48px;height:48px;border-radius:15px}
  .trust-banner{justify-content:flex-start;padding:14px 16px}
}