/* Accessibility refinements: keyboard visibility, readable links, reflow and system colors. */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
[hidden] { display: none !important; }
@media screen {
    html { scroll-padding-top: 125px; scroll-padding-bottom: 110px; }
    :where(a, button, summary, input, select, textarea, [tabindex]):focus-visible,
    [data-form-result]:focus { outline: 3px solid #12334a !important; outline-offset: 3px; box-shadow: 0 0 0 3px #fff !important; }
    .skip-link { max-width: calc(100% - 40px); }
    p a, .validation-summary-errors a { text-decoration: underline; text-underline-offset: .18em; }
    .validation-summary-errors h3 { font-size: 1.375rem; letter-spacing: -.02em; margin: 0 0 12px; }
    .validation-summary-errors li { margin-block: 8px; }
    .validation-summary-errors a { display: inline-block; padding-block: 3px; }
    .form-field [aria-invalid="true"] { border: 2px solid #a13622; }
    .prose, .guide-content, .not-found, .form-panel { overflow-wrap: anywhere; }
    .form-panel { min-width: 0; }
    .accessibility-statement .page-heading { padding-bottom: 10px; }
    .accessibility-statement h1 { font-size: clamp(2.5rem, 5vw, 4rem); }
    .photo-caption > a { background: #12334a; border-color: white; }
    .photo-caption > span { background: #12334ae6; width: fit-content; padding: 4px 8px; border-radius: 4px; }
    .photo-caption strong { text-shadow: 0 2px 8px #061f2a; }
    .stars { background: none; color: #93420b; }
}
@media screen and (max-width: 760px) {
    html { scroll-padding-top: 105px; scroll-padding-bottom: 115px; }
}
@media screen and (max-height: 500px) {
    .site-header { position: relative; }
    .mobile-actions { position: static; }
    .site-footer { padding-bottom: 24px; }
    html { scroll-padding-top: 16px; scroll-padding-bottom: 16px; }
}
@media (forced-colors: active) {
    .button, .service-card, .detail-card, .size-card, .hero-contact > a, .menu-toggle { border: 1px solid ButtonText; }
    .stars { background: none; color: CanvasText; -webkit-text-fill-color: CanvasText; }
    .photo-caption, .contact-photo > span, .image-label { background: Canvas; color: CanvasText; text-shadow: none; }
    .photo-caption > span, .photo-caption > a { color: CanvasText; background: Canvas; }
    :where(a, button, summary, input, select, textarea, [tabindex]):focus-visible { outline-color: Highlight !important; }
}

@media screen {
    .header-inner { flex-wrap: wrap; }
    .brand { min-width: 0; flex-shrink: 1; }
    .brand > span { min-width: 0; overflow-wrap: anywhere; }
    .site-header nav { flex-wrap: wrap; }
    .hero-contact { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
    .service-card, .detail-card, .size-card, .review-card, .section-heading > *, .visit-band .container > * { min-width: 0; overflow-wrap: anywhere; }
    .services-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .reviews-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); }
    .footer-top { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
    .visit-band > .container { flex-wrap: wrap; }
    .visit-band .button { flex-shrink: 1; }
    .feature-line > span, .review-avatar { min-width: 2.3rem; min-height: 2.3rem; }
    .hero-visual { display: grid; grid-template-rows: 1fr auto auto; gap: 24px; height: auto; min-height: 640px; padding: 20px 28px 0; }
    .hero-photo, .photo-shade { position: absolute; inset: 0; }
    .round-stamp { position: relative; top: auto; right: auto; justify-self: end; align-self: start; width: min(10rem, 100%); height: auto; min-height: 10rem; padding: 20px; text-align: center; transform: none; }
    .round-stamp span { max-width: 100%; overflow-wrap: anywhere; }
    .photo-caption { position: relative; inset: auto; display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 10px; align-items: end; margin-top: 45px; }
    .photo-caption > span { grid-column: 1 / -1; max-width: none; }
    .photo-caption strong { overflow-wrap: anywhere; }
    .photo-caption > a { position: static; align-self: end; }
    .floating-note { position: relative; inset: auto; margin-bottom: -22px; }
    .map-panel { display: flex; flex-direction: column; }
    .map-panel iframe { height: 480px; flex: 1 0 480px; }
    .map-caption { position: relative; inset: auto; margin: 15px; }
    html.large-header:not(.navigation-open) .site-header { position: relative; }
}
@media screen and (max-width: 1100px) {
    .header-inner { flex-wrap: nowrap; }
    .services-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .navigation-open .brand { max-width: 100%; }
}
@media screen and (max-width: 760px) {
    .services-grid { grid-template-columns: minmax(0, 1fr); }
    .hero-visual { min-height: 545px; padding: 16px 20px 0; }
    .round-stamp { min-height: 8.5rem; width: min(8.5rem, 100%); padding: 16px; }
    .photo-caption { margin-top: 20px; }
    .photo-caption > a { width: 40px; height: 40px; }
    .floating-note { margin-inline: -8px; }
}
@media screen {
    h1, h2, h3, .breadcrumbs { overflow-wrap: anywhere; }
    .photo-caption { background: #12334a; border-radius: 16px; padding: 18px; }
    .photo-caption > span { background: none; padding: 0; }
    .photo-caption strong { text-shadow: none; }
    .contact-photo > span { background: #12334af2; }
}
@media screen {
    /* Keyboard focus must not wait for a smooth scroll animation to become visible. */
    html:focus-within { scroll-behavior: auto; }
}

@media screen { .guide-section .eyebrow { color: #005461; } }
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
    /* Keep caption contrast constant while the image moves into place. */
    @keyframes arrive { from { transform: translateY(14px); } to { transform: translateY(0); } }
}