:root{
  --bg:#0d0f12; --muted:#b6bbc5; --brand:#8a2be2; --brand2:#ff4f86; --card:#1a1d22;
}
html,body{background:var(--bg);}
.site-topbar{height:64px;background:#000;}
.brand-name{font-size:1.4rem;letter-spacing:0.5px}
.brand-mark{width:28px;height:28px;border-radius:6px;background:conic-gradient(from 45deg,#f59e0b,#22c55e,#6366f1,#ef4444);}
.hero{position:relative;min-height:calc(100vh - 64px - 64px);display:flex;align-items:center;justify-content:center;}
.hero::before{content:"";position:absolute;inset:0;background:url('https://images.unsplash.com/photo-1519389950473-47ba0277781c?q=80&w=1920&auto=format&fit=crop') center/cover no-repeat;filter:grayscale(0.2) brightness(0.5);}
.hero .overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(13,15,18,.6),rgba(13,15,18,.7));}
.hero .content{position:relative;z-index:2;text-align:center;color:#fff}
.hero .welcome{font-weight:800;font-size:clamp(2rem,6vw,4.5rem);letter-spacing:2px}
.hero .subtitle{color:var(--muted);font-size:clamp(1rem,2vw,1.25rem)}
.hero .split{display:grid;grid-template-columns:1fr 1px 1fr;gap:2rem;align-items:center;margin-top:2rem}
.hero .divider{width:1px;height:220px;background:#fff;opacity:.5;justify-self:center}
.cta-card{background:var(--card);border-radius:14px;padding:8px 10px 8px 14px;display:inline-flex;align-items:center;gap:16px;box-shadow:0 6px 0 rgba(0,0,0,.35)}
.cta-card .cta{border:none;border-radius:12px;padding:14px 28px;font-weight:700;letter-spacing:1px}
.cta-download{background:#b57bff;color:#181a1f}
.cta-subscribe{background:#ff7aa5;color:#181a1f}
.cta-icon{width:42px;height:42px;border-radius:10px;background:#fff;display:grid;place-items:center;box-shadow:0 6px 0 rgba(0,0,0,.35)}
.helper{text-shadow:0 2px 4px rgba(0,0,0,.6)}
.counter{font-size:clamp(2rem,5vw,3.25rem);font-weight:800}
.counter.left{color:#c084fc}
.counter.right{color:#ff7aa5}
.site-footer{border-top:1px solid #262a30;background:#0b0d10}
/* Responsive tweaks for mobile */
@media (max-width: 767.98px){
  .site-topbar{height:56px;padding-left:.75rem;padding-right:.75rem}
  .hero{min-height:auto;padding:48px 0}
  .hero .content{padding-left:.75rem;padding-right:.75rem}
  .hero .split{grid-template-columns:1fr;gap:1.25rem;margin-top:1.25rem}
  .hero .divider{display:none!important}
  .cta-card{width:100%;justify-content:space-between;padding:10px 12px}
  .cta-card .cta{flex:1;padding:12px 16px}
  .cta-icon{width:38px;height:38px}
  .helper{font-size:.95rem}
  .counter{font-size:clamp(1.5rem,7vw,2.25rem)}
}
/* Fix horizontal overflow */
body{overflow-x:hidden}

/* Topbar responsiveness to avoid overflow */
@media (max-width: 767.98px){
  .site-topbar{flex-wrap:wrap;row-gap:.25rem}
  .site-topbar .brand{flex:1 1 100%}
  .site-topbar .contact{flex:1 1 100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
  .site-topbar .contact a{overflow:hidden;text-overflow:ellipsis;max-width:100%}
}
/* Global box sizing to avoid overflow from padding */
*,*::before,*::after{box-sizing:border-box}

/* Constrain cards/buttons to container width */
.cta-card{max-width:100%}

/* Extra safety to avoid horizontal scroll from hero */
.hero,.hero .content{overflow-x:hidden}

/* Strengthen small-screen behavior */
@media (max-width: 767.98px){
  .cta-card{display:flex}
}