html { scroll-behavior: smooth; }
body { font-family: 'Roboto', sans-serif; color: #3a3a4a; }
section[id] { scroll-margin-top: 80px; }

.chip { display: inline-block; padding: 5px 22px; border-radius: 6px; background: #ece2f6; color: #6a2c91; font-size: 15px; font-weight: 500; }
.heading { font-family: 'Poppins', sans-serif; font-weight: 700; color: #000; line-height: 1.2; }
.heading span { font-weight: 300; }
.btn-pill { display: inline-flex; align-items: center; gap: 10px; height: 52px; padding: 0 30px; border-radius: 999px; border: 2px solid #6a2c91; font-family: 'Poppins', sans-serif; font-size: 15px; font-weight: 600; color: #000; white-space: nowrap; transition: background-color .2s, color .2s; }
.btn-pill:hover, .btn-pill.solid { background: #6a2c91; color: #fff; }
.btn-pill.solid:hover { background: #55207a; border-color: #55207a; }

.mock { background: #fff; border-radius: 8px; box-shadow: 0 12px 30px rgba(40,10,70,.12); }
.mock-head { display: flex; justify-content: space-between; align-items: center; font-size: 11px; font-weight: 700; color: #555; }
.dots::after { content: '\22EE'; color: #bbb; font-size: 14px; }

/* Scroll reveal (only when JS is available) */
.js .reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s ease-out, transform .8s ease-out; }
.js .reveal.in { opacity: 1; transform: none; }
.js .reveal.d1 { transition-delay: .15s; }
.js .reveal.d2 { transition-delay: .3s; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js .reveal { opacity: 1; transform: none; transition: none; }
}

/* Forms and long-form text on the sub-pages */
.field { width: 100%; height: 52px; padding: 0 18px; border-radius: 8px; background: #fff; border: 2px solid #ece2f6; font-size: 15px; color: #000; outline: none; transition: border-color .2s; }
textarea.field { height: auto; padding: 14px 18px; }
.field:focus { border-color: #6a2c91; }
.label { display: block; margin-bottom: 6px; font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 600; color: #000; }
.prose h2 { font-family: 'Poppins', sans-serif; font-size: 22px; font-weight: 700; color: #000; margin: 40px 0 12px; }
.prose p, .prose li { font-size: 16px; line-height: 1.75; }
.prose p { margin-bottom: 14px; }
.prose ul { list-style: disc; padding-left: 22px; margin-bottom: 14px; }
.prose a { color: #6a2c91; text-decoration: underline; }

/* Header call-to-action shrinks on phones so logo, button and menu fit */
@media (max-width: 767px) {
  .btn-pill.nav-cta { height: 40px; padding: 0 16px; font-size: 13px; }
}

/* Cookie consent banner (built in js/analytics.js) */
.cookie-banner { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 60; max-width: 720px; margin: 0 auto; padding: 20px 24px; display: flex; flex-wrap: wrap; align-items: center; gap: 16px; background: #fff; border: 2px solid #ece2f6; border-radius: 16px; box-shadow: 0 30px 60px rgba(40,10,70,.25); }
.cookie-banner p { flex: 1 1 280px; font-size: 14px; line-height: 1.6; color: #3a3a4a; }
.cookie-banner a { color: #6a2c91; text-decoration: underline; }
.cookie-actions { display: flex; gap: 10px; }
.cookie-actions .btn-pill { height: 44px; padding: 0 22px; font-size: 14px; }