/* /assets/css/style.css
   Main visual styles — day (blue) + dark support
*/

/* Variables */
:root {
  --sky-500: #0ea5e9;
  --sky-600: #0284c7;
  --bg: #ffffff;
  --card: #f6fbff;
}
:root.dark {
  --bg: #071026;
  --card: #071827;
}

/* Base body */
html,body{height:100%;margin:0;font-family:Inter, Poppins, system-ui, -apple-system, 'Segoe UI', Roboto;}
body{background:linear-gradient(180deg,#e8f9ff 0%, var(--bg) 60%);color:#0f172a;transition:background .25s, color .25s;}
:root.dark body{background:linear-gradient(180deg,#031027 0%, var(--bg) 60%); color:#e6eef8;}

/* Splash */
.splash{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#ffffff,#e8f9ff);z-index:99999;transition:opacity .4s ease;}
.splash-inner{text-align:center}
.splash-logo{height:56px;margin-bottom:10px}
.splash-title{font-weight:800;font-size:24px;color:var(--sky-600)}
.splash-sub{color:#64748b}

/* Nav */
.nav-glass{position:fixed;top:0;left:0;width:100%;backdrop-filter:blur(8px);background:rgba(255,255,255,0.82);border-bottom:1px solid rgba(14,165,233,0.06);transition:background .25s;}
:root.dark .nav-glass{background:rgba(3,7,18,0.6);border-bottom:1px solid rgba(255,255,255,0.04);}

/* Buttons */
.btn-main{background:linear-gradient(90deg,#0077ff,#0099ff,#00c6ff);color:white;font-weight:600;box-shadow:0 10px 30px rgba(3,132,252,0.14);transition:transform .15s}
.btn-main:hover{transform:translateY(-2px);}

/* Card gradient */
.card-grad{background:linear-gradient(145deg,var(--card),var(--bg));border-radius:12px;border:1px solid rgba(0,150,255,0.06);padding:18px;}

/* Hero image */
.hero-img{width:100%;max-width:640px;animation:floatY 4s ease-in-out infinite;border-radius:12px}
@keyframes floatY{0%{transform:translateY(0)}50%{transform:translateY(-12px)}100%{transform:translateY(0)}}

/* Stats */
.stat-num{font-weight:700;font-size:18px;color:var(--sky-600)}
.stat-label{font-size:12px;color:#64748b}

/* Spark canvas */
.spark-canvas{position:fixed;inset:0;z-index:-1;pointer-events:none}

/* Offers */
.offer-card{border-radius:12px;overflow:hidden;background:linear-gradient(180deg,#ffffff,#f7fbff);border:1px solid rgba(2,132,199,0.06)}

/* Responsive helpers */
@media (max-width:768px){
  .logo-dark{display:none}
}

/* Dark adjustments */
:root.dark .splash{background:linear-gradient(180deg,#071026,#021021)}
:root.dark .splash-title{color:#fff}
:root.dark .splash-sub{color:#94a3b8}