/* Site-specific overrides, loaded last. Manual tweaks live here (never generated). */

/* The three footer column headings were <h1> on the old Weebly site; they were
   demoted to <h2> for SEO (junk H1s on every page). That exposed them to the
   theme's generic `.wsite-footer h2` styling (Montserrat/uppercase), so this
   pins their original rendering. ID-level :is() outguns the theme !importants. */
#footer :is(#element-2d82e37a-2df0-4933-bae9-62fcacf4f5a4,
            #element-de73dbd2-71e1-4499-b637-a69a1a0e7d6e,
            #element-7880b904-89d8-4fea-9e01-69d9a5b6841e) .default-font {
  font-family: inherit !important;
  text-transform: initial !important;
  letter-spacing: normal !important;
}

/* Footer links. The Weebly theme styles the footer for a dark background
   (`.wsite-footer .paragraph a {color:#fff}` in head-styles.njk), but #footer
   is white — so the Other Links / Accepting All Major Funds / Affiliations
   lists rendered white-on-white. Repainted in the brand tan, going navy on
   hover, matching the tan/navy swap used by .button-navigation. */
#footer-content :is(.wsite-footer h2 a,
                    .wsite-footer .paragraph a,
                    .wsite-footer blockquote a) {
  color: #ac8e6f !important;
}
#footer-content :is(.wsite-footer h2 a,
                    .wsite-footer .paragraph a,
                    .wsite-footer blockquote a):hover {
  color: #192a43 !important;
}

/* "Meet Our Experienced Dentists" headshots (home + emergency-dentist). The
   four source photos have different aspect ratios (625x800, 706x800,
   1039x1377, 625x800), so at equal column widths they rendered at four
   different heights. Pin every one to Dr Simon Khalil's 625:800 ratio and let
   object-fit crop the difference; `top` keeps faces in frame on the taller
   sources. */
img.team-photo {
  width: 100%;
  max-width: 100%;
  height: auto;
  aspect-ratio: 625 / 800;
  object-fit: cover;
  object-position: center top;
}

/* Heading hierarchy fix. 14 pages had no <h1> at all and 11 had several, so the
   heading that already acts as each page's title was promoted to <h1> and the
   surplus ones demoted to <h2>. The Weebly theme only ever styles `h2` — its
   font, size and colour rules are keyed to the tag with !important — so a
   promoted <h1> fell through to the browser default (Didact Gothic, bold,
   grey). These rules give h1.wsite-content-title the exact presentation its h2
   had, in both the banner and the body, so the change is invisible on screen. */
.wsite-header-section h1.wsite-content-title,
.wsite-header-elements h1.wsite-content-title {
  font-weight: 400 !important;
}
.wsite-elements.wsite-not-footer:not(.wsite-header-elements) h1.wsite-content-title,
#wsite-content h1.wsite-content-title {
  font-family: "Libre Franklin" !important;
  font-size: 30px !important;
  font-weight: 400 !important;
  color: #2b211f !important;
  text-transform: none !important;
}

