/*
 * pages/home.css
 * Tenor Analytics — Home page specific styles
 */

/* Hero */
#hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  padding-top: var(--nav-height);
}
#wave-canvas {
  position: absolute;
  inset: 0; width: 100%; height: 100%;
  pointer-events: none;
}
.hero-content {
  position: relative; z-index: 2;
  max-width: 760px;
  padding: var(--sp-20) 0 var(--sp-24);
}
.hero-headline { margin-bottom: var(--sp-6); }
.hero-sub {
  font-size: 1.12rem; color: var(--text-2);
  line-height: 1.75; max-width: 600px;
  margin-bottom: var(--sp-10);
}
.hero-cta { display: flex; flex-wrap: wrap; gap: var(--sp-4); margin-bottom: var(--sp-12); }

/* Tool cards */
.tool-card { position: relative; }
.tool-badge { position: absolute; top: var(--sp-4); right: var(--sp-4); }
.tool-price {
  font-size: 1.1rem; font-weight: 800;
  background: var(--grad-primary);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Security split */
.security-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-16);
  align-items: center;
}
.security-list {
  display: flex; flex-direction: column;
  gap: var(--sp-5); margin-top: var(--sp-2);
}

/* Responsive */
@media (max-width: 900px) {
  .security-split { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .hero-content { padding: var(--sp-16) 0 var(--sp-20); }
  .hero-cta { flex-direction: column; }
  .hero-cta .btn { width: 100%; }
}