/* Photo contrast is bounded even over a pure-white image pixel.
   62% black gives at least 6.2:1 against white text; gradients add depth. */
.single-items::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.5); /* lighter: the photos stay visible; text-shadow below carries the rest */
    pointer-events: none;
}
.single-items > .container { position: relative; z-index: 1; }
.single-items .area-heading { text-shadow: 0 2px 12px rgba(0,0,0,.2); }
.single-items .area-title { font-weight: 400; text-transform: none !important; }
.single-items .area-title strong { font-weight: 700; }
.single-items p { font-weight: 400; line-height: 1.8; }
.single-items .btn { text-transform: none; text-shadow: none; }
.single-items .btn-transparent-white:hover,
.single-items .btn-transparent-white:focus { color: #263230 !important; }
.navbar-top-default { background: rgba(13,20,20,.90); }
.header-appear .navbar-top-default { background: #fff; }
.header-appear .nav-box-round .navbar-nav .nav-link.active,
.scroll-top-arrow,
.footer-social li a:hover { background-color: #007783; }
.header-appear .nav-box-round .navbar-nav .nav-link:hover { color: #006773; }
.side-menu { background: #006773; }
.side-menu .social-icons-simple a:hover { color: #006773 !important; }
.company-about, .footer-social { color: #505957; }
.company-about a:hover { color: #006773; }
a:focus-visible { outline: 3px solid currentColor; outline-offset: 5px; }
.single-items .area-title a:focus-visible { outline-color: #fff; }
@media (max-width: 767px) {
    .single-items { min-height: 640px; height: 100svh; padding: 100px 0 60px; background-attachment: scroll; background-position: center !important; }
    .single-items h3 { font-size: clamp(1.75rem, 8vw, 2.5rem); line-height: 1.22; overflow-wrap: break-word; }
    .single-items p { font-size: 16px; }
    .single-items .container { padding-left: 24px; padding-right: 24px; }
    .single-items::before { background: rgba(0,0,0,.5); }
    .side-menu { width: min(380px, 100%); }
    .side-menu .inner-wrapper { padding: 4rem 2rem 2rem; }
}

.single-items h2, .single-items p, .single-items h5 { text-shadow: 0 1px 3px rgba(0,0,0,.55), 0 0 18px rgba(0,0,0,.35); }