/* ===== InboundQ landing page — purple brand ===== */
html { scroll-behavior: smooth; }

/* Brand accent: violet/indigo to match the logo */
:root {
  --iq-grad: linear-gradient(135deg, #7c3aed, #4f46e5);
  --iq-grad-soft: linear-gradient(135deg, #8b5cf6, #6366f1);
}

/* Nav */
.nav-link { font-size: 0.95rem; font-weight: 500; color: rgb(71 85 105); transition: color .15s; }
.nav-link:hover { color: rgb(124 58 237); }
.dark .nav-link { color: rgb(148 163 184); }
.dark .nav-link:hover { color: rgb(167 139 250); }
.mobile-link { padding: 0.55rem 0.25rem; font-weight: 500; color: rgb(51 65 85); border-radius: 0.5rem; }
.mobile-link:hover { background: rgb(245 243 255); }
.dark .mobile-link { color: rgb(203 213 225); }
.dark .mobile-link:hover { background: rgba(76,29,149,0.25); }

/* Buttons */
.btn-primary {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: 0.7rem 1.2rem; border-radius: 0.7rem; font-weight: 600;
  color: #fff; background: var(--iq-grad);
  box-shadow: 0 8px 22px -8px rgba(124, 58, 237, 0.7); transition: transform .12s, box-shadow .12s;
}
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 12px 28px -8px rgba(124, 58, 237, 0.85); }
.btn-outline {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: 0.7rem 1.2rem; border-radius: 0.7rem; font-weight: 600;
  color: rgb(91 33 182); background: #fff; border: 1.5px solid rgb(196 181 253); transition: background .12s, border-color .12s;
}
.btn-outline:hover { background: rgb(245 243 255); border-color: rgb(167 139 250); }
.dark .btn-outline { color: rgb(196 181 253); background: transparent; border-color: rgba(139,92,246,0.5); }
.dark .btn-outline:hover { background: rgba(76,29,149,0.25); }
.btn-glass {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: 0.7rem 1.2rem; border-radius: 0.7rem; font-weight: 600;
  color: #fff; background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.35);
  backdrop-filter: blur(6px); transition: background .15s;
}
.btn-glass:hover { background: rgba(255,255,255,0.22); }
.btn-light {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: 0.7rem 1.2rem; border-radius: 0.7rem; font-weight: 700;
  color: rgb(76 29 149); background: #fff; transition: transform .12s;
}
.btn-light:hover { transform: translateY(-1px); }

/* Hero video */
.hero-video {
  position: absolute; inset: 0; height: 100%; width: 100%; object-fit: cover; z-index: 0;
}
.hero-overlay {
  position: absolute; inset: 0; z-index: 1;
  background:
    linear-gradient(180deg, rgba(46,16,101,0.55), rgba(30,12,71,0.78)),
    linear-gradient(110deg, rgba(76,29,149,0.85) 0%, rgba(49,46,129,0.55) 55%, rgba(20,10,40,0.35) 100%);
}
.badge {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: 0.35rem 0.85rem; border-radius: 999px; font-size: 0.8rem; font-weight: 600;
  color: #fff; background: rgba(255,255,255,0.14); border: 1px solid rgba(255,255,255,0.3); backdrop-filter: blur(4px);
}
.dot { height: .5rem; width: .5rem; border-radius: 999px; background: #c4b5fd; box-shadow: 0 0 0 3px rgba(196,181,253,.3); }

/* Sections */
.section-eyebrow { font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgb(124 58 237); }
.dark .section-eyebrow { color: rgb(167 139 250); }
.section-title { margin-top: .5rem; font-size: 2rem; font-weight: 800; letter-spacing: -0.02em; color: rgb(15 23 42); }
.dark .section-title { color: #fff; }
.section-sub { margin-top: .8rem; font-size: 1.05rem; color: rgb(71 85 105); }
.dark .section-sub { color: rgb(148 163 184); }

/* Card grid */
.card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); gap: 1.25rem; }

/* Cards */
.feature-card, .step-card, .price-card, .quote-card {
  border-radius: 1rem; border: 1px solid rgb(226 232 240); background: #fff; padding: 1.5rem;
  transition: border-color .15s, box-shadow .15s, transform .15s;
}
.dark .feature-card, .dark .step-card, .dark .price-card, .dark .quote-card {
  border-color: rgba(91,33,182,0.35); background: rgba(30,16,54,0.6);
}
.feature-card:hover { border-color: rgb(196 181 253); box-shadow: 0 14px 32px -16px rgba(124,58,237,0.45); transform: translateY(-2px); }
.dark .feature-card:hover { border-color: rgba(139,92,246,0.6); }
.feature-icon { display: inline-flex; align-items: center; justify-content: center; height: 2.75rem; width: 2.75rem; border-radius: .75rem; color: rgb(124 58 237); background: rgb(245 243 255); }
.dark .feature-icon { color: rgb(196 181 253); background: rgba(124,58,237,0.18); }
.feature-title { margin-top: 1rem; font-size: 1.1rem; font-weight: 700; color: rgb(15 23 42); }
.dark .feature-title { color: #fff; }
.feature-text { margin-top: .4rem; font-size: 0.95rem; line-height: 1.55; color: rgb(71 85 105); }
.dark .feature-text { color: rgb(148 163 184); }

/* Steps */
.step-num { display: inline-flex; align-items: center; justify-content: center; height: 2.5rem; width: 2.5rem; border-radius: 999px; font-weight: 800; color: #fff; background: var(--iq-grad); }

/* Quotes */
.quote-grid { display: grid; gap: 1.25rem; }
.quote-card p { font-size: 1.05rem; font-weight: 500; color: rgb(30 41 59); line-height: 1.5; }
.dark .quote-card p { color: rgb(226 232 240); }
.quote-card footer { margin-top: .8rem; font-size: 0.85rem; color: rgb(124 58 237); font-weight: 600; }
.dark .quote-card footer { color: rgb(167 139 250); }

/* Lists */
.audience-list { display: flex; flex-direction: column; gap: .6rem; }
.audience-list li { position: relative; padding-left: 1.6rem; font-size: 0.95rem; color: rgb(51 65 85); }
.dark .audience-list li { color: rgb(203 213 225); }
.audience-list li::before {
  content: ""; position: absolute; left: 0; top: .15rem; height: 1.05rem; width: 1.05rem; border-radius: 999px;
  background: rgb(245 243 255) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='3'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/0.7rem no-repeat;
}
.dark .audience-list li::before { background-color: rgba(124,58,237,0.2); }

/* Pricing */
.price-card { display: flex; flex-direction: column; position: relative; }
.price-card--featured { border-color: rgb(139 92 246); box-shadow: 0 18px 44px -20px rgba(124,58,237,0.55); }
.dark .price-card--featured { border-color: rgb(139 92 246); background: rgba(49,27,98,0.55); }
.price-flag { position: absolute; top: -0.7rem; right: 1.25rem; padding: .25rem .75rem; border-radius: 999px; font-size: .7rem; font-weight: 700; color: #fff; background: var(--iq-grad); }
.price-name { font-size: 0.95rem; font-weight: 700; color: rgb(124 58 237); }
.dark .price-name { color: rgb(167 139 250); }
.price-amount { margin-top: .4rem; font-size: 1.9rem; font-weight: 800; color: rgb(15 23 42); }
.dark .price-amount { color: #fff; }
.price-period { font-size: 0.95rem; font-weight: 500; color: rgb(100 116 139); }

/* Form */
.form-input {
  flex: 1; padding: 0.75rem 1rem; border-radius: 0.7rem; font-size: 0.95rem;
  border: 1px solid rgba(255,255,255,0.4); background: rgba(255,255,255,0.95); color: rgb(15 23 42); outline: none; transition: box-shadow .15s;
}
.form-input:focus { box-shadow: 0 0 0 3px rgba(196,181,253,0.6); }

/* CTA background */
.cta-bg { position: absolute; inset: 0; z-index: 0; background: linear-gradient(135deg, #5b21b6, #4338ca 60%, #6d28d9); }
.cta-bg::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(circle at 20% 20%, rgba(255,255,255,0.18), transparent 40%),
              radial-gradient(circle at 80% 80%, rgba(255,255,255,0.12), transparent 45%);
}

/* Footer */
.footer-head { font-size: 0.8rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: rgb(100 116 139); }
.footer-link { display: block; margin-top: .6rem; font-size: 0.95rem; color: rgb(71 85 105); transition: color .15s; }
.footer-link:hover { color: rgb(124 58 237); }
.dark .footer-link { color: rgb(148 163 184); }
.dark .footer-link:hover { color: rgb(167 139 250); }
