/* Twinbrooks Family Dental — calm, warm, reassuring */
:root {
  --ink: #1F2D3F;
  --blue: #2E5C8A;
  --blue-light: #6F9BC8;
  --blue-soft: #DCE8F4;
  --peach: #F4E4D6;
  --peach-deep: #E6C9AE;
  --cream: #FAF6F1;
  --green: #5C8B7B;
}
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }

/* Reveal */
.reveal { opacity: 0; transform: translateY(20px); transition: opacity .85s ease, transform .85s ease; }
.reveal.in { opacity: 1; transform: none; }
.reveal-d1 { transition-delay: .15s; } .reveal-d2 { transition-delay: .3s; }
.reveal-d3 { transition-delay: .45s; }

/* Big rounded blob shapes (decorative) */
.blob {
  border-radius: 60% 40% 55% 45% / 50% 60% 40% 50%;
}
.blob-2 {
  border-radius: 45% 55% 60% 40% / 55% 45% 60% 40%;
}

/* Soft button */
.btn-pill {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: 1rem 2rem; border-radius: 9999px;
  font-weight: 600; transition: all .3s ease;
}
.btn-primary { background: var(--blue); color: white; box-shadow: 0 10px 30px -10px rgba(46,92,138,.5); }
.btn-primary:hover { background: #234A75; transform: translateY(-2px); box-shadow: 0 18px 40px -12px rgba(46,92,138,.55); }
.btn-secondary { background: white; color: var(--blue); border: 2px solid var(--blue-soft); }
.btn-secondary:hover { background: var(--blue-soft); }

/* Card */
.card-soft {
  background: white;
  border-radius: 24px;
  box-shadow: 0 4px 12px -4px rgba(31,45,63,.05), 0 1px 3px rgba(31,45,63,.03);
  transition: transform .4s ease, box-shadow .4s ease;
}
.card-soft:hover {
  transform: translateY(-4px);
  box-shadow: 0 24px 40px -16px rgba(31,45,63,.12);
}

/* Wave SVG container */
.wave-divider svg { display: block; width: 100%; height: auto; }

/* Section heading display */
.display-serif {
  font-family: 'Fraunces', serif;
  font-variation-settings: "opsz" 144, "SOFT" 100, "WONK" 1;
  font-weight: 500;
}

/* Focus */
a:focus-visible, button:focus-visible { outline: 3px solid var(--blue-light); outline-offset: 4px; border-radius: 6px; }

/* Accordion icon rotation */
[data-faq-open] [data-faq-icon] { transform: rotate(45deg); }

/* Pulsing dot */
@keyframes soft-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.4); opacity: .6; }
}
.pulse-dot { animation: soft-pulse 2s ease-in-out infinite; }