/* Loaderhouse Coming Soon - Custom Styles */
:root {
  --lh-primary: #0d6efd;
  --lh-dark: #0b1424;
  --lh-muted: #6c757d;
  --lh-bg: #f8fafc;
}

html, body {
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, 'Helvetica Neue', Arial, 'Noto Sans', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
  scroll-behavior: smooth;
}

/* Hero Section */
.bg-gradient {
  background: radial-gradient(1200px 600px at 10% 10%, rgba(13, 110, 253, 0.15), transparent),
              linear-gradient(180deg, #ffffff 0%, #f4f7fb 100%);
}

.hero-illustration {
  position: relative;
}
.hero-illustration .glow {
  position: absolute;
  inset: -40px;
  background: radial-gradient(600px 260px at 50% 40%, rgba(13, 110, 253, 0.25), rgba(13, 110, 253, 0) 60%);
  filter: blur(20px);
  z-index: 0;
}
.hero-illustration .hero-logo {
  position: relative;
  z-index: 1;
  width: 220px;
  height: 220px;
  opacity: 0.95;
}

.shape-bottom {
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 40px;
  background: linear-gradient(180deg, rgba(244,247,251,1) 0%, rgba(244,247,251,0) 100%);
  pointer-events: none;
}

/* Countdown */
.countdown-card {
  border-radius: 14px;
}
#countdown {
  display: flex;
  gap: 0.75rem;
}
#countdown .unit {
  background: #fff;
  border: 1px solid rgba(13, 110, 253, 0.12);
  border-radius: 10px;
  padding: 10px 14px;
  min-width: 80px;
  text-align: center;
}
#countdown .value {
  display: block;
  font-weight: 700;
  font-size: 1.4rem;
  color: var(--lh-dark);
}
#countdown .label {
  display: block;
  font-size: 0.75rem;
  color: var(--lh-muted);
  letter-spacing: .02em;
  text-transform: uppercase;
}

/* Features */
.feature-card {
  background: #fff;
  border-radius: 14px;
}
.icon-wrap {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  font-size: 1.2rem;
}

/* CTA icons in contact */
.icon-cta {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-size: 1.25rem;
}

/* Footer */
footer a {
  text-decoration: none;
}
footer a:hover {
  color: var(--lh-primary) !important;
}

/* Utilities */
.section-title {
  margin-bottom: .5rem;
}

/* Responsive tweaks */
@media (max-width: 575.98px) {
  #countdown .unit { min-width: 68px; padding: 8px 10px; }
  .hero-illustration .hero-logo { width: 160px; height: 160px; }
}
