/*!
 * Hermes CMO — Polish Layer (design parity toward AtlantaDentalSpa.com)
 * Additive, non-destructive smoothness enhancements. Loaded last so it layers
 * on top of the theme. Remove the enqueuing mu-plugin to fully revert.
 * v1.0.0 — 2026-07-10
 *
 * Palette anchors (from live site): primary blue #1a5a8d, teal #31b4c9,
 * light blue #93b8f2. ADD warm accent (copper) as the missing "pop".
 */

:root {
  --hcmo-accent: #c85f2f;        /* ADS-style warm copper accent */
  --hcmo-accent-dark: #a94d24;
  --hcmo-blue: #1a5a8d;
  --hcmo-ease: 0.28s cubic-bezier(0.22, 0.61, 0.36, 1); /* smooth, premium easing */
  --hcmo-shadow: 0 6px 20px rgba(26, 90, 141, 0.16);
  --hcmo-shadow-soft: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* ---- Global smooth micro-interactions ---- */
a, button, .btn, .service-tile, .cta, img {
  transition: color var(--hcmo-ease),
              background-color var(--hcmo-ease),
              box-shadow var(--hcmo-ease),
              transform var(--hcmo-ease),
              opacity var(--hcmo-ease) !important;
}

/* ---- Buttons: soft radius, hover lift + shadow (ADS feel) ---- */
.btn, .btn-bright, .btn-primary {
  border-radius: 6px !important;
  letter-spacing: 0.02em;
}
.btn:hover, .btn-bright:hover, .btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: var(--hcmo-shadow);
}

/* Primary CTA -> warm accent on hover (the "pop") */
.btn-bright:hover {
  background-color: var(--hcmo-accent) !important;
  color: #fff !important;
}

/* ---- Service tiles: hover lift + subtle zoom on inner image ---- */
.service-tile {
  overflow: hidden;
  border-radius: 8px !important;
  box-shadow: var(--hcmo-shadow-soft);
}
.service-tile:hover {
  transform: translateY(-4px);
  box-shadow: var(--hcmo-shadow);
}
.service-tile img { transition: transform var(--hcmo-ease) !important; }
.service-tile:hover img { transform: scale(1.05); }

/* ---- Links: smooth accent underline reveal ---- */
main a:not(.btn):not(.cta):hover { color: var(--hcmo-accent-dark); }

/* ---- Images: gentle rounding + smoothness on content pages ---- */
.entry-content img, article img { border-radius: 8px; }

/* ---- Scroll-reveal (paired with polish.js) ---- */
.hcmo-reveal { opacity: 0; transform: translateY(24px); }
.hcmo-reveal.hcmo-in {
  opacity: 1; transform: none;
  transition: opacity 0.7s var(--hcmo-ease), transform 0.7s var(--hcmo-ease);
}

/* Respect reduced-motion accessibility preference */
@media (prefers-reduced-motion: reduce) {
  a, button, .btn, .service-tile, .cta, img { transition: none !important; }
  .hcmo-reveal { opacity: 1 !important; transform: none !important; }
}
