html { scroll-behavior: smooth; }
body { font-family: 'Poppins', system-ui, sans-serif; color: #0F2A4E; background: #ffffff; -webkit-font-smoothing: antialiased; }
.display { font-family: 'Playfair Display', Georgia, serif; }

.grad-text {
  background: linear-gradient(90deg,#FF3D68 0%, #1A4275 70%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* Ring decorations */
.ring-deco {
  position: absolute; border-radius: 9999px; pointer-events: none;
  background: conic-gradient(from 0deg, transparent 0deg, transparent 180deg, var(--c1) 270deg, transparent 360deg);
  -webkit-mask: radial-gradient(circle, transparent 55%, #000 56%, #000 100%);
          mask: radial-gradient(circle, transparent 55%, #000 56%, #000 100%);
  filter: blur(.3px); opacity: .55;
}
.ring-mint { --c1: #7AE3AA; }
.ring-pink { --c1: #FF3D68; }
.ring-sky  { --c1: #4DA1F7; }

/* Subtle grain */
.grain::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .035;
  background-image: radial-gradient(#1A4275 1px, transparent 1px);
  background-size: 3px 3px;
}

/* Nav scroll state */
.nav-scrolled { background: rgba(255,255,255,.85); backdrop-filter: saturate(180%) blur(14px); box-shadow: 0 1px 0 rgba(26,66,117,.06); }

/* Reveal */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in { opacity: 1; transform: none; }

/* Marquee */
@keyframes marquee { from { transform: translateX(0) } to { transform: translateX(-50%) } }
.marquee-track { animation: marquee 30s linear infinite; }

/* Pill nav active underline */
.nav-link { position: relative; }
.nav-link::after {
  content: ''; position: absolute; left: 12px; right: 12px; bottom: 6px; height: 2px;
  background: #FF3D68; transform: scaleX(0); transform-origin: left; transition: transform .25s ease;
}
.nav-link:hover::after { transform: scaleX(1); }

/* Cards */
.card { background: #fff; border: 1px solid rgba(26,66,117,.08); border-radius: 20px; }
.card:hover { box-shadow: 0 10px 40px -10px rgba(26,66,117,.18); }

/* Soundwave */
@keyframes wave { 0%,100% { transform: scaleY(.3) } 50% { transform: scaleY(1) } }
.bar { display:inline-block; width:4px; margin-right:3px; background:#FF3D68; border-radius:3px; animation: wave 1.2s ease-in-out infinite; transform-origin: center; }
.bar:nth-child(2){ animation-delay:.1s } .bar:nth-child(3){ animation-delay:.2s } .bar:nth-child(4){ animation-delay:.3s }
.bar:nth-child(5){ animation-delay:.4s } .bar:nth-child(6){ animation-delay:.5s } .bar:nth-child(7){ animation-delay:.6s }

/* Buttons */
.btn { display:inline-flex; align-items:center; gap:.5rem; padding:.85rem 1.4rem; border-radius:9999px; font-weight:600; transition:transform .15s ease, box-shadow .2s ease, background .2s ease, color .2s ease; }
.btn-primary { background:#FF3D68; color:#fff; box-shadow: 0 8px 24px -8px rgba(255,61,104,.55); }
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 14px 30px -10px rgba(255,61,104,.65); }
.btn-ghost { background:#fff; color:#1A4275; border:1px solid rgba(26,66,117,.15); }
.btn-ghost:hover { background:#1A4275; color:#fff; }
.btn-dark { background:#1A4275; color:#fff; }
.btn-dark:hover { background:#0F2A4E; }

/* Section heading badge */
.eyebrow { display:inline-flex; align-items:center; gap:.5rem; padding:.35rem .8rem; border-radius:9999px; background:#FFE6EC; color:#FF3D68; font-size:.75rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }

/* Stat tile */
.stat { background: linear-gradient(180deg, #fff, #F6F8FB); border:1px solid rgba(26,66,117,.08); border-radius:24px; padding:1.75rem; }

/* Timeline */
.tl-dot { width:14px; height:14px; border-radius:9999px; background:#FF3D68; box-shadow:0 0 0 6px #FFE6EC; }

/* Article prose styling */
.article-prose { color:#1A4275; }
.article-prose p { font-size:1.075rem; line-height:1.85; color:rgba(15,42,78,.82); margin: 1.15rem 0; }
.article-prose p:first-of-type { font-size:1.2rem; line-height:1.7; color:#0F2A4E; }
.article-prose h2 { font-family:'Poppins'; font-weight:700; font-size:1.6rem; color:#1A4275; margin: 2.6rem 0 .8rem; line-height:1.25; }
.article-prose h3 { font-family:'Poppins'; font-weight:700; font-size:1.2rem; color:#1A4275; margin: 1.8rem 0 .5rem; }
.article-prose ul { margin: 1rem 0 1.25rem 0; padding-left: 1.4rem; }
.article-prose li { margin: .45rem 0; line-height:1.7; color: rgba(15,42,78,.82); }
.article-prose li::marker { color: #FF3D68; }
.article-prose a { color:#FF3D68; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.article-prose a:hover { color: #1A4275; }
.article-prose blockquote { border-left: 3px solid #FF3D68; background: #F1F5FA; padding: 1.25rem 1.5rem; margin: 1.8rem 0; border-radius: 0 16px 16px 0; font-family: 'Playfair Display', serif; font-style: italic; font-size: 1.15rem; color:#1A4275; }
.article-prose strong { color:#1A4275; font-weight:600; }