/* Site additions on top of the theme (theme files stay untouched). */

/* One <h1> per page without changing the look:
   home = the welcome heading (was an h3), inner pages = the current breadcrumb item. */
.about-header h1 { color: #1e2832; }
ul.custom-breadcrumb li h1 { display: inline; margin: 0; font: inherit; letter-spacing: inherit; color: inherit; }

/* Photo grids load 450 px thumbnails: fill the theme's 5:3 frame with the same
   centred crop the theme showed with the full image (main.js centres .center-image). */
.image-gallery a .image img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }

/* Fade-up on scroll (site.js adds .is-visible). Without JS, or with reduced motion, content shows at once. */
.js-fade .fade-up { opacity: 0; transform: translate3d(0, 28px, 0); transition: opacity .7s ease-out, transform .7s ease-out; will-change: opacity, transform; }
.js-fade .fade-up.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    .js-fade .fade-up { opacity: 1; transform: none; transition: none; }
}

/* Phones: the theme shrinks the copyright line to 10px; keep it readable. */
@media only screen and (max-width: 767px) {
    .copytext { font-size: 12px; line-height: 1.6; }
}

/* Mobile menu "NEED HELP?": the e-mail / phone links read as the plain text they replaced,
   not as menu rows (#MobileNav li a is a padded block), and a long address wraps. */
#MobileNav li.help a { display: inline; padding: 0; font-size: inherit; letter-spacing: inherit; text-transform: inherit; overflow-wrap: anywhere; }

/* Phones and tablets: the contact details come first (above the form) — keep them apart from it. */
@media only screen and (max-width: 991px) {
    .contact-details { margin-bottom: 30px; }
}
