:root{
  --bg:#05060f;
  --bg-alt:#0a0c1e;
  --panel:#0e1128;
  --panel-border:rgba(139,124,255,0.16);
  --purple:#8b5cf6;
  --blue:#3b82f6;
  --cyan:#22d3ee;
  --text:#e7e9f7;
  --muted:#8d92b8;
  --muted-2:#5f6488;
  --grad: linear-gradient(90deg,var(--purple),var(--blue) 55%,var(--cyan));
  --radius:18px;
  --header-h:64px;
  --bottomnav-h:64px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:'Inter',system-ui,sans-serif;
  overflow-x:hidden;
  min-height:100vh;
  position:relative;
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
}
h1,h2,h3,.font-display{font-family:'Orbitron',sans-serif;}
.mono{font-family:'JetBrains Mono',monospace;}
a{color:inherit; text-decoration:none;}
button{font-family:inherit; cursor:pointer;}
img,svg{display:block;}
.container{max-width:1240px; margin:0 auto; padding:0 20px;}

/* ---------- Cosmic background ---------- */
#stars{position:fixed; inset:0; z-index:0; pointer-events:none;}
.bg-glow{position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(60% 45% at 82% 6%, rgba(139,92,246,0.16), transparent 60%),
    radial-gradient(55% 40% at 8% 30%, rgba(34,211,238,0.10), transparent 60%),
    radial-gradient(70% 55% at 50% 100%, rgba(59,130,246,0.10), transparent 60%);
}
.hex-field{position:absolute; inset:0; opacity:0.35; pointer-events:none;
  background-image:
    linear-gradient(120deg, transparent 48%, rgba(139,124,255,0.05) 49%, rgba(139,124,255,0.05) 51%, transparent 52%);
  background-size:60px 104px;
}

/* ---------- Header ---------- */
header{
  position:sticky; top:0; z-index:100;
  height:var(--header-h);
  display:flex; align-items:center;
  background:rgba(5,6,15,0.72);
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--panel-border);
  transition:box-shadow .3s ease, border-color .3s ease;
}
header.scrolled{box-shadow:0 8px 30px -12px rgba(0,0,0,0.6); border-bottom-color:rgba(139,124,255,0.3);}
.header-inner{width:100%; display:flex; align-items:center; justify-content:space-between; gap:12px;}
.brand{display:flex; align-items:center; gap:10px;}
.brand-mark{width:34px; height:34px; filter:drop-shadow(0 0 8px rgba(139,92,246,0.55));}
.brand-text{display:flex; flex-direction:column; line-height:1;}
.brand-text .name{font-size:16px; font-weight:800; letter-spacing:0.5px; color:#fff;}
.brand-text .sub{font-size:9.5px; font-weight:700; letter-spacing:3px; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; margin-top:2px;}

nav.desktop-nav{display:none;}
nav.desktop-nav ul{display:flex; gap:30px; list-style:none;}
nav.desktop-nav a{font-size:14.5px; font-weight:600; color:var(--muted); position:relative; padding:6px 0; transition:color .2s;}
nav.desktop-nav a:hover, nav.desktop-nav a.active{color:#fff;}
nav.desktop-nav a.active::after{content:''; position:absolute; left:0; right:0; bottom:-4px; height:2px; background:var(--grad); border-radius:2px;}

.header-actions{display:flex; align-items:center; gap:8px;}
.icon-btn{
  width:38px; height:38px; border-radius:12px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.03); border:1px solid var(--panel-border); color:var(--text);
  position:relative; transition:border-color .2s, background .2s;
}
.icon-btn:hover{border-color:rgba(139,124,255,0.5); background:rgba(139,92,246,0.08);}
.icon-btn svg{width:19px; height:19px;}
.dot{position:absolute; top:7px; right:7px; width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 8px var(--cyan);}
.btn{
  display:inline-flex; align-items:center; gap:6px; justify-content:center;
  padding:11px 20px; border-radius:12px; font-size:14px; font-weight:700; border:1px solid transparent;
  white-space:nowrap; transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.btn:active{transform:scale(0.97);}
.btn-primary{background:var(--grad); color:#fff; box-shadow:0 0 0 rgba(139,92,246,0); }
.btn-primary:hover{box-shadow:0 6px 24px -6px rgba(139,92,246,0.65);}
.btn-outline{background:rgba(255,255,255,0.02); border-color:rgba(139,124,255,0.4); color:#fff;}
.btn-outline:hover{border-color:var(--cyan); box-shadow:0 0 18px -4px rgba(34,211,238,0.4);}
.btn-ghost{background:transparent; border-color:var(--panel-border); color:var(--muted);}
.btn-ghost:hover{color:#fff; border-color:rgba(139,124,255,0.5);}
.btn-disabled{background:rgba(255,255,255,0.03); border-color:rgba(139,124,255,0.18); color:var(--muted-2); cursor:not-allowed;}
.btn-block{width:100%;}
.btn svg{width:15px; height:15px;}

.hamburger{display:flex; width:38px; height:38px; border-radius:12px; align-items:center; justify-content:center; background:rgba(255,255,255,0.03); border:1px solid var(--panel-border);}
.hamburger span{display:block; width:17px; height:2px; background:#fff; position:relative; border-radius:2px;}
.hamburger span::before,.hamburger span::after{content:''; position:absolute; left:0; width:17px; height:2px; background:#fff; border-radius:2px; transition:transform .25s ease;}
.hamburger span::before{top:-6px;}
.hamburger span::after{top:6px;}
.hamburger.open span{background:transparent;}
.hamburger.open span::before{transform:translateY(6px) rotate(45deg);}
.hamburger.open span::after{transform:translateY(-6px) rotate(-45deg);}

/* mobile drawer */
.drawer-overlay{position:fixed; inset:0; background:rgba(3,4,10,0.6); backdrop-filter:blur(3px); z-index:150; opacity:0; pointer-events:none; transition:opacity .25s ease;}
.drawer-overlay.active{opacity:1; pointer-events:auto;}
.drawer{
  position:fixed; top:0; left:0; bottom:0; width:78%; max-width:320px; z-index:160;
  background:linear-gradient(160deg,#0b0d22,#070813); border-right:1px solid var(--panel-border);
  transform:translateX(-100%); transition:transform .3s cubic-bezier(.4,0,.2,1);
  display:flex; flex-direction:column; padding:22px 22px 26px;
}
.drawer.active{transform:translateX(0);}
.drawer-close{align-self:flex-end; width:34px; height:34px; border-radius:10px; background:rgba(255,255,255,0.04); border:1px solid var(--panel-border); display:flex; align-items:center; justify-content:center;}
.drawer-brand{display:flex; align-items:center; gap:10px; margin:18px 0 30px;}
.drawer-nav{display:flex; flex-direction:column; gap:4px;}
.drawer-nav a{padding:13px 10px; border-radius:10px; font-size:15.5px; font-weight:600; color:var(--muted); display:flex; align-items:center; gap:12px; transition:background .2s, color .2s;}
.drawer-nav a:hover, .drawer-nav a.active{color:#fff; background:rgba(139,92,246,0.1);}
.drawer-nav a svg{width:18px; height:18px; opacity:0.8;}
.drawer-foot{margin-top:auto; padding-top:20px; border-top:1px solid var(--panel-border);}
.drawer-social{display:flex; gap:10px; margin-top:14px;}

/* notification popover */
.notif-pop{
  position:absolute; top:48px; right:0; width:260px; background:var(--panel); border:1px solid var(--panel-border);
  border-radius:14px; padding:18px; box-shadow:0 20px 50px -12px rgba(0,0,0,0.6);
  opacity:0; pointer-events:none; transform:translateY(-6px); transition:all .2s ease; z-index:120;
}
.notif-pop.active{opacity:1; pointer-events:auto; transform:translateY(0);}
.notif-pop .n-icon{width:36px; height:36px; border-radius:10px; background:rgba(139,92,246,0.12); display:flex; align-items:center; justify-content:center; margin-bottom:10px;}
.notif-pop .n-icon svg{width:18px; height:18px; color:var(--cyan);}
.notif-pop h4{font-size:13.5px; margin-bottom:4px;}
.notif-pop p{font-size:12px; color:var(--muted); line-height:1.5;}

/* ---------- Section shells ---------- */
section{position:relative; z-index:1; padding:64px 0;}
.eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:11.5px; font-weight:700; letter-spacing:3px; color:var(--cyan); text-transform:uppercase; margin-bottom:14px;}
.eyebrow::before{content:''; width:20px; height:2px; background:var(--grad); border-radius:2px;}
.section-title{font-size:clamp(26px,6vw,42px); font-weight:800; margin-bottom:14px; letter-spacing:0.5px;}
.section-lead{color:var(--muted); font-size:15.5px; max-width:640px; line-height:1.7; margin-bottom:38px;}

/* ---------- Hero ---------- */
.hero{padding-top:56px; padding-bottom:20px; overflow:hidden;}
.hero-grid{display:grid; grid-template-columns:1fr; gap:34px; align-items:center;}
.hero-grid > *{min-width:0;}
.hero-badge{display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border-radius:999px; border:1px solid rgba(139,124,255,0.35); background:rgba(139,92,246,0.06); font-size:11.5px; font-weight:700; letter-spacing:2px; color:var(--muted); margin-bottom:22px;}
.hero-badge .pulse{width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 8px var(--cyan); animation:pulse 2s infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:0.35;}}
.hero h1{font-size:clamp(38px,10vw,56px); font-weight:900; line-height:1.02; letter-spacing:0.5px; color:#fff; text-shadow:0 0 40px rgba(139,92,246,0.25);}
.hero .headline{font-size:clamp(20px,5vw,28px); font-weight:800; margin-top:18px; line-height:1.35;}
.hero .headline .g1{background:linear-gradient(90deg,var(--cyan),var(--blue)); -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero .headline .g2{background:linear-gradient(90deg,var(--purple),#c084fc); -webkit-background-clip:text; background-clip:text; color:transparent;}
.hero p.desc{color:var(--muted); font-size:15.5px; line-height:1.75; margin-top:18px; max-width:480px;}
.hero-cta{display:flex; flex-wrap:wrap; gap:14px; margin-top:30px;}
.hero-social{display:flex; align-items:center; gap:14px; margin-top:32px; flex-wrap:wrap;}
.hero-social .label{font-size:12.5px; color:var(--muted-2); font-weight:600;}
.social-row{display:flex; gap:8px; flex-wrap:wrap;}
.social-chip{display:flex; align-items:center; gap:7px; padding:7px 12px 7px 9px; border-radius:999px; background:rgba(255,255,255,0.03); border:1px solid var(--panel-border); font-size:12.5px; font-weight:600; color:var(--muted); transition:all .2s;}
.social-chip:hover{color:#fff; border-color:rgba(139,124,255,0.5); background:rgba(139,92,246,0.08);}
.social-chip svg{width:15px; height:15px;}
.social-chip .verify{width:12px; height:12px; color:var(--blue);}

.hero-visual{position:relative; display:flex; align-items:center; justify-content:center; min-height:280px;}
.hero-visual .shield{width:min(80vw,360px); height:auto; filter:drop-shadow(0 0 50px rgba(139,92,246,0.45)); animation:float 6s ease-in-out infinite;}
@keyframes float{0%,100%{transform:translateY(0px);}50%{transform:translateY(-14px);}}
.orbit-ring{position:absolute; border:1px solid rgba(139,124,255,0.18); border-radius:50%; animation:spin 40s linear infinite;}
.orbit-ring.r1{width:110%; height:110%; }
.orbit-ring.r2{width:135%; height:135%; border-style:dashed; animation-duration:70s; animation-direction:reverse;}
@keyframes spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}

/* ---------- Products ---------- */
.products-grid{display:grid; grid-template-columns:1fr; gap:18px;}
.product-card{
  position:relative; padding:26px 22px; border-radius:var(--radius);
  background:linear-gradient(160deg, rgba(255,255,255,0.035), rgba(255,255,255,0.008));
  border:1px solid var(--panel-border); overflow:hidden; transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.product-card::before{content:''; position:absolute; inset:0; opacity:0; transition:opacity .3s; pointer-events:none;
  background:radial-gradient(240px 180px at 20% 0%, rgba(139,92,246,0.16), transparent 70%);}
.product-card:hover{transform:translateY(-4px); border-color:rgba(139,124,255,0.4); box-shadow:0 18px 40px -18px rgba(139,92,246,0.35);}
.product-card:hover::before{opacity:1;}
.product-top{display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:16px;}
.product-icon{width:56px; height:56px; border-radius:16px; display:flex; align-items:center; justify-content:center; font-family:'Orbitron',sans-serif; font-weight:800; font-size:24px; position:relative; overflow:hidden;}
.product-icon.img-icon{background:rgba(255,255,255,0.03); border:1.5px solid var(--panel-border); padding:0;}
.product-icon.img-icon img{width:100%; height:100%; object-fit:cover; border-radius:14px;}
.product-icon.zx{background:rgba(139,92,246,0.08); border:1.5px solid rgba(139,92,246,0.5); color:#fff; box-shadow:0 0 22px -4px rgba(139,92,246,0.55) inset;}
.product-icon.lp{background:rgba(34,211,238,0.08); border:1.5px solid rgba(34,211,238,0.5); color:#fff; box-shadow:0 0 22px -4px rgba(34,211,238,0.55) inset;}
.product-icon.st{background:rgba(192,132,252,0.08); border:1.5px solid rgba(192,132,252,0.5); color:#fff; box-shadow:0 0 22px -4px rgba(192,132,252,0.55) inset;}
.tag{font-size:10.5px; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; padding:5px 10px; border-radius:999px; border:1px solid;}
.tag.live{color:var(--cyan); border-color:rgba(34,211,238,0.4); background:rgba(34,211,238,0.06);}
.tag.soon{color:#c084fc; border-color:rgba(192,132,252,0.4); background:rgba(192,132,252,0.06);}
.product-card h3{font-size:20px; font-weight:800; display:flex; align-items:center; gap:6px; margin-bottom:2px;}
.product-card h3 svg{width:15px; height:15px; color:var(--blue);}
.product-cat{font-size:12px; font-weight:700; color:var(--purple); margin-bottom:10px; letter-spacing:0.5px;}
.product-card p{font-size:14px; color:var(--muted); line-height:1.65; margin-bottom:20px; min-height:66px;}
.product-domain{font-size:11.5px; color:var(--muted-2); margin-top:-12px; margin-bottom:16px;}

/* ---------- About ---------- */
.values-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:14px;}
.value-card{padding:22px 18px; border-radius:16px; background:rgba(255,255,255,0.025); border:1px solid var(--panel-border); text-align:left; transition:border-color .2s, transform .2s;}
.value-card:hover{border-color:rgba(139,124,255,0.4); transform:translateY(-3px);}
.value-icon{width:42px; height:42px; border-radius:12px; background:rgba(139,92,246,0.1); border:1px solid rgba(139,124,255,0.3); display:flex; align-items:center; justify-content:center; margin-bottom:14px;}
.value-icon svg{width:20px; height:20px; color:var(--cyan);}
.value-card h4{font-size:15.5px; font-weight:800; margin-bottom:6px;}
.value-card p{font-size:13px; color:var(--muted); line-height:1.6;}

.about-panel{margin-top:38px; padding:26px; border-radius:var(--radius); background:linear-gradient(150deg,rgba(139,92,246,0.07),rgba(34,211,238,0.03)); border:1px solid var(--panel-border);}
.about-panel h3{font-size:18px; font-weight:800; margin-bottom:10px;}
.about-panel p{font-size:14.5px; color:var(--muted); line-height:1.75;}
.stack-line{display:flex; flex-wrap:wrap; gap:8px; margin-top:18px;}
.stack-pill{font-size:12px; font-weight:700; padding:6px 12px; border-radius:999px; background:rgba(255,255,255,0.03); border:1px solid var(--panel-border); color:var(--muted);}

/* ---------- Business ---------- */
.biz-grid{display:grid; grid-template-columns:1fr; gap:14px; margin-bottom:30px;}
.biz-card{display:flex; align-items:center; gap:16px; padding:18px 18px; border-radius:16px; background:rgba(255,255,255,0.025); border:1px solid var(--panel-border); transition:border-color .2s, background .2s;}
.biz-card:hover{border-color:rgba(139,124,255,0.45); background:rgba(139,92,246,0.05);}
.biz-icon{flex-shrink:0; width:44px; height:44px; border-radius:12px; background:rgba(59,130,246,0.1); border:1px solid rgba(59,130,246,0.3); display:flex; align-items:center; justify-content:center;}
.biz-icon svg{width:20px; height:20px; color:var(--blue);}
.biz-info{flex:1; min-width:0;}
.biz-info h4{font-size:14.5px; font-weight:700; margin-bottom:3px;}
.biz-info p{font-size:12.5px; color:var(--muted); line-height:1.5;}
.biz-info a.mail{font-size:12px; color:var(--cyan); font-weight:600; margin-top:4px; display:inline-block;}
.biz-arrow{width:18px; height:18px; color:var(--muted-2); flex-shrink:0;}

.cta-banner{padding:30px 24px; border-radius:var(--radius); background:linear-gradient(120deg,rgba(139,92,246,0.16),rgba(34,211,238,0.06)); border:1px solid rgba(139,124,255,0.3); text-align:center;}
.cta-banner h3{font-size:20px; font-weight:800; margin-bottom:8px;}
.cta-banner p{font-size:14px; color:var(--muted); margin-bottom:20px;}

/* ---------- Support ---------- */
.support-grid{display:grid; grid-template-columns:1fr; gap:16px;}
.support-card{padding:24px 20px; border-radius:var(--radius); border:1px solid var(--panel-border); background:rgba(255,255,255,0.025);}
.support-card .biz-icon{margin-bottom:14px;}
.support-card h4{font-size:16px; font-weight:800; margin-bottom:8px;}
.support-card p{font-size:13.5px; color:var(--muted); line-height:1.65; margin-bottom:14px;}
.faq-note{margin-top:30px; padding:18px 20px; border-radius:14px; background:rgba(34,211,238,0.05); border:1px solid rgba(34,211,238,0.25); font-size:13.5px; color:var(--muted); line-height:1.7;}
.faq-note strong{color:var(--cyan);}

/* ---------- Contact ---------- */
.contact-grid{display:grid; grid-template-columns:1fr; gap:12px;}
.contact-cat{padding:18px 18px; border-radius:14px; background:rgba(255,255,255,0.025); border:1px solid var(--panel-border); transition:border-color .2s;}
.contact-cat:hover{border-color:rgba(139,124,255,0.4);}
.contact-cat .cc-top{display:flex; align-items:center; gap:10px; margin-bottom:8px;}
.contact-cat .cc-icon{width:32px; height:32px; border-radius:9px; background:rgba(139,92,246,0.1); border:1px solid rgba(139,124,255,0.3); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.contact-cat .cc-icon svg{width:15px; height:15px; color:var(--purple);}
.contact-cat h4{font-size:13.5px; font-weight:800; letter-spacing:0.3px;}
.contact-cat .cc-mails{display:flex; flex-direction:column; gap:3px; margin-left:42px;}
.contact-cat a{font-size:12.5px; color:var(--muted); font-family:'JetBrains Mono',monospace; transition:color .2s;}
.contact-cat a:hover{color:var(--cyan);}

.lopaostab-block{margin-top:36px; padding:24px; border-radius:var(--radius); border:1px solid rgba(34,211,238,0.25); background:rgba(34,211,238,0.03);}
.lopaostab-block h3{font-size:16px; font-weight:800; margin-bottom:4px; display:flex; align-items:center; gap:8px;}
.lopaostab-block .ico{width:26px; height:26px; border-radius:8px; background:rgba(34,211,238,0.15); display:flex; align-items:center; justify-content:center; font-family:'Orbitron'; font-weight:800; font-size:13px; color:var(--cyan);}
.lopaostab-block > p{font-size:13px; color:var(--muted); margin-bottom:18px;}
.lp-mail-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px 16px;}
.lp-mail-grid a{font-size:12.5px; font-family:'JetBrains Mono',monospace; color:var(--muted); word-break:break-all; transition:color .2s;}
.lp-mail-grid a:hover{color:var(--cyan);}

/* ---------- Footer ---------- */
footer{position:relative; z-index:1; border-top:1px solid var(--panel-border); padding:50px 0 28px; margin-top:30px; background:linear-gradient(180deg,transparent,rgba(139,92,246,0.03));}
.footer-grid{display:grid; grid-template-columns:1fr; gap:32px; margin-bottom:36px;}
.footer-brand p{font-size:13.5px; color:var(--muted); line-height:1.7; margin:14px 0 18px; max-width:320px;}
.footer-social{display:flex; gap:10px;}
.f-icon-btn{width:36px; height:36px; border-radius:10px; background:rgba(255,255,255,0.03); border:1px solid var(--panel-border); display:flex; align-items:center; justify-content:center; transition:all .2s;}
.f-icon-btn:hover{border-color:var(--purple); color:var(--cyan);}
.f-icon-btn svg{width:16px; height:16px;}
.footer-col h5{font-size:12px; font-weight:800; letter-spacing:2px; text-transform:uppercase; color:var(--muted-2); margin-bottom:16px;}
.footer-col ul{list-style:none; display:flex; flex-direction:column; gap:11px;}
.footer-col a{font-size:13.5px; color:var(--muted); transition:color .2s;}
.footer-col a:hover{color:var(--cyan);}
.newsletter-box{padding:20px; border-radius:16px; background:rgba(255,255,255,0.025); border:1px solid var(--panel-border);}
.newsletter-box p{font-size:12.5px; color:var(--muted); line-height:1.6; margin-bottom:14px;}
.nl-form{display:flex; gap:8px;}
.nl-form input{flex:1; min-width:0; padding:11px 13px; border-radius:10px; background:rgba(255,255,255,0.03); border:1px solid var(--panel-border); color:#fff; font-size:13px;}
.nl-form input:focus{outline:none; border-color:var(--purple);}
.nl-form button{width:42px; border-radius:10px; background:var(--grad); border:none; display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.nl-form button svg{width:16px; height:16px; color:#fff;}
.nl-status{font-size:12px; color:var(--cyan); margin-top:10px; display:none;}
.nl-status.show{display:block;}
.footer-bottom{padding-top:22px; border-top:1px solid var(--panel-border); display:flex; flex-direction:column; gap:14px; align-items:center; text-align:center;}
.footer-bottom .legal-links{display:flex; flex-wrap:wrap; gap:16px; justify-content:center;}
.footer-bottom .legal-links a{font-size:12.5px; color:var(--muted-2);}
.footer-bottom .legal-links a:hover{color:var(--cyan);}
.footer-bottom .copyright{font-size:12px; color:var(--muted-2);}

/* ---------- Mobile bottom nav ---------- */
.bottom-nav{
  position:fixed; left:0; right:0; bottom:0; z-index:90; height:var(--bottomnav-h);
  display:flex; background:rgba(8,9,22,0.92); backdrop-filter:blur(16px);
  border-top:1px solid var(--panel-border);
  padding-bottom:env(safe-area-inset-bottom);
}
.bottom-nav a{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; color:var(--muted-2); font-size:10.5px; font-weight:700; position:relative; transition:color .2s;}
.bottom-nav a svg{width:20px; height:20px;}
.bottom-nav a.active{color:var(--cyan);}
.bottom-nav a.active svg{filter:drop-shadow(0 0 6px var(--cyan));}
.bottom-nav a.active::before{content:''; position:absolute; top:0; left:50%; transform:translateX(-50%); width:24px; height:2px; background:var(--grad); border-radius:2px;}

/* toast */
.toast{position:fixed; bottom:calc(var(--bottomnav-h) + 18px); left:50%; transform:translateX(-50%) translateY(20px); z-index:300; background:var(--panel); border:1px solid rgba(139,124,255,0.4); color:#fff; padding:12px 20px; border-radius:12px; font-size:13.5px; font-weight:600; opacity:0; pointer-events:none; transition:all .3s ease; box-shadow:0 12px 30px -10px rgba(0,0,0,0.6); white-space:nowrap;}
.toast.show{opacity:1; transform:translateX(-50%) translateY(0);}

body{padding-bottom:var(--bottomnav-h);}

/* ---------- Desktop breakpoint ---------- */
@media(min-width:900px){
  body{padding-bottom:0;}
  .bottom-nav{display:none;}
  .hamburger{display:none;}
  nav.desktop-nav{display:block;}
  header .icon-btn.mobile-only{display:none;}
  .hero-grid{grid-template-columns:1.1fr 0.9fr; gap:20px;}
  .hero{padding-top:80px;}
  .hero-visual .shield{width:100%; max-width:560px;}
  .products-grid{grid-template-columns:repeat(3,1fr);}
  .values-grid{grid-template-columns:repeat(4,1fr);}
  .biz-grid{grid-template-columns:repeat(2,1fr);}
  .support-grid{grid-template-columns:repeat(3,1fr);}
  .contact-grid{grid-template-columns:repeat(3,1fr);}
  .footer-grid{grid-template-columns:1.3fr 0.8fr 0.8fr 1.1fr;}
  section{padding:96px 0;}
}
@media(min-width:600px) and (max-width:899px){
  .values-grid{grid-template-columns:repeat(4,1fr);}
  .support-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:400px){
  .lp-mail-grid{grid-template-columns:1fr;}
}
:focus-visible{outline:2px solid var(--cyan); outline-offset:2px; border-radius:4px;}

/* ZIMIGUARD SECTION */
.zg-panel{margin-top:10px; padding:36px; border-radius:var(--radius); background:linear-gradient(150deg,rgba(139,92,246,0.08),rgba(34,211,238,0.04)); border:1px solid var(--panel-border); display:flex; flex-wrap:wrap; gap:32px; align-items:flex-start;}
.zg-icon-wrap{width:96px; height:96px; border-radius:22px; overflow:hidden; border:1.5px solid rgba(139,124,255,0.4); box-shadow:0 0 30px -6px rgba(139,92,246,0.5); flex-shrink:0;}
.zg-icon-wrap img{width:100%; height:100%; object-fit:cover;}
.zg-body{flex:1; min-width:240px;}
.zg-body h3{font-size:24px; font-weight:800; display:flex; align-items:center; gap:10px; margin-bottom:6px;}
.zg-body .product-domain{margin:0 0 14px;}
.zg-body p.zg-desc{font-size:14.5px; color:var(--muted); line-height:1.75; margin-bottom:22px; max-width:560px;}
.zg-social-label{font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--muted-2); margin-bottom:10px;}
.zg-social-row{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px;}
.zg-notice{padding:16px 18px; border-radius:14px; background:rgba(192,132,252,0.06); border:1px solid rgba(192,132,252,0.3); font-size:13px; color:var(--muted); line-height:1.7;}
.zg-notice strong{color:#c084fc;}
