/* Shared public responsive rules. Scoped above page-level component styles. */
.frontend-app { overflow-wrap: break-word; }
.frontend-app :is(.row > *, .card-custom, .news-card, .pf-card) { min-width: 0; }
.frontend-app :is(main, section, footer) :is(img, video, iframe) { max-width: 100%; }
.frontend-app :is(h1,h2,h3,h4,h5,h6,a,p) { overflow-wrap: anywhere; }
.frontend-app :is(.news-article-body,.vm-body) iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; }
.frontend-app :is(button,a,input,textarea,select):focus-visible { outline: 3px solid #245bff; outline-offset: 3px; }
.frontend-app .pf-filter { white-space: normal; }
.frontend-app .news-pagination { flex-wrap: wrap; }

@media (max-width: 1199.98px) {
    .frontend-app #mobileNav { width: min(390px, 100%); max-height: 100dvh; }
    .frontend-app #mobileNav .offcanvas-body { overflow-y: auto; overscroll-behavior: contain; padding-bottom: max(24px, env(safe-area-inset-bottom)); }
    .frontend-app #mobileNav a { white-space: normal; overflow-wrap: anywhere; }
    .frontend-app :is(.navbar-toggler, .offcanvas .btn-close) { min-width: 44px; min-height: 44px; }
    .frontend-app .navbar-brand { min-width: 0; max-width: calc(100% - 64px); }
    .frontend-app .navbar-brand img { max-width: 100%; object-fit: contain; }
}

@media (max-width: 991.98px) {
    .frontend-app .hero-slide,
    .frontend-app .hero-overlay { min-height: 480px; min-height: clamp(480px, 70svh, 640px); }
    .frontend-app .hero-overlay { padding-top: 132px; padding-bottom: 96px; align-items: center !important; }
    .frontend-app .hero-static-badge {
        position: relative; inset: auto; transform: none; width: min(420px, calc(100% - 40px));
        height: auto; margin: -48px auto 24px;
    }
    .frontend-app .hero-project-panel { height: auto; background: #fff; border: 1px solid #dce1e9; padding: 8px; border-radius: 20px; }
    .frontend-app .hero-project-media { height: auto; aspect-ratio: 16 / 9; border-radius: 14px; }
    .frontend-app .hero-project-action { min-height: 44px; font-size: .8125rem; }
    .frontend-app .hero-slide-tagline { max-width: 62ch; }
    .frontend-app .page-header { padding: 124px 0 40px; }
    .frontend-app .section-spacing { padding-block: 40px; }
    .frontend-app .home-news-compact .home-news-layout { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    .frontend-app .home-news-compact .news-card-slider { width: 100%; max-width: 600px; margin-inline: auto; }
    .frontend-app .home-news-compact .news-card-horizontal { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
    .frontend-app .home-news-compact .news-card-body { padding: 16px; }
    .frontend-app .news-card-bullets button { width: 36px; height: 44px; }
    .frontend-app .home-services-track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .frontend-app .contact-message-cta { flex-wrap: wrap; }
    .frontend-app .contact-map-stage { height: 340px; }
    .frontend-app .org-chart-inner { min-width: 0; }
    .frontend-app .org-leaders { width: 100%; }
    .frontend-app .org-node { width: min(100%, 300px); border-radius: 16px; border-color: #dce1e9; }
    .frontend-app .org-branch { padding-top: 0; }
    .frontend-app .org-directors { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    .frontend-app :is(.org-branch,.org-director-item)::before { display: none; }
    .frontend-app .pf-dialog { margin-block: 16px; min-height: calc(100% - 32px); }
    .frontend-app .pf-modal { max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; }
    .frontend-app .pf-modal-header { flex-shrink: 0; }
    .frontend-app .pf-preview { flex-shrink: 0; }
    .frontend-app .pf-details { flex-shrink: 0; }
    .frontend-app .pf-preview :is(img,video) { max-height: 48svh; }
    .frontend-app .contact-form-modal .modal-content { max-height: calc(100dvh - 32px); overflow-y: auto !important; }
    .frontend-app footer .row { row-gap: 28px; }
}

@media (max-width: 575.98px) {
    .frontend-app :is(.container,.container-fluid,.container-xxl) { padding-inline: 20px; }
    .frontend-app .row { --bs-gutter-x: 1.25rem; }
    .frontend-app .section-spacing { padding-block: 32px; }
    .frontend-app .page-header { padding: 112px 0 32px; }
    .frontend-app .hero-overlay { padding: 116px 0 88px; }
    .frontend-app .hero-slide,
    .frontend-app .hero-overlay { min-height: 450px; min-height: clamp(450px, 72svh, 600px); }
    .frontend-app .hero-kicker { max-width: 100%; white-space: normal; }
    .frontend-app .hero-static-badge { width: calc(100% - 40px); max-width: 380px; margin-top: -40px; }
    .frontend-app .hero-overlay h1 { font-size: clamp(1.65rem, 6.6vw, 2.2rem) !important; line-height: 1.25 !important; }
    .frontend-app :is(.btn,.pf-filter,.home-service-action) { min-height: 44px; }
    .frontend-app :is(input,textarea,select).form-control,
    .frontend-app select.form-select { font-size: 16px !important; }
    .frontend-app .home-services-heading { margin-bottom: 24px !important; }
    .frontend-app .home-services-track { gap: 12px; }
    .frontend-app .home-service-badge { max-width: calc(100% - 16px); white-space: normal; }
    .frontend-app .home-history-image { max-width: 100%; }
    .frontend-app .client-wide-inner { padding-inline: 20px !important; }
    .frontend-app .client-slider { padding-inline: 0; }
    .frontend-app .vm-card-content { padding: 22px; }
    .frontend-app .vm-eyebrow { margin-bottom: 20px; }
    .frontend-app .vm-layout { gap: 16px; }
    .frontend-app .pf-filters { gap: 8px; }
    .frontend-app .pf-filter { flex: 1 1 calc(50% - 8px); padding: 10px; border-radius: 12px; }
    .frontend-app .pf-caption { padding: 16px; }
    .frontend-app .pf-modal-header { padding: 18px 52px; }
    .frontend-app .pf-modal-header .btn-close { width: 24px; height: 24px; padding: 10px; top: 9px; right: 8px; }
    .frontend-app .pf-details { padding: 18px; }
    .frontend-app .contact-map-card,
    .frontend-app .office-location-card,
    .frontend-app .contact-form-card { padding: 20px; border-radius: 18px; }
    .frontend-app .contact-map-stage { height: 280px; }
    .frontend-app .contact-message-cta { padding: 20px; gap: 12px; }
    .frontend-app .contact-message-cta-content { flex: 1 1 180px; min-width: 0; }
    .frontend-app .contact-message-cta > .btn { width: 100%; }
    .frontend-app .contact-form-heading { padding-right: 28px; }
    .frontend-app .contact-modal-close { min-width: 44px; min-height: 44px; }
    .frontend-app .news-list-grid { gap: 18px; }
    .frontend-app .news-section-heading { gap: 12px; }
    .frontend-app .news-article { padding: 20px; border-radius: 16px; }
    .frontend-app .news-article-cover { margin-bottom: 20px; }
    .frontend-app .news-card-bullets { gap: 0; margin-top: 6px; }
    .frontend-app .home-news-compact .news-card-horizontal .news-card-body { padding: 12px; }
    .frontend-app .home-news-compact .news-card-horizontal .news-excerpt { -webkit-line-clamp: 3; }
    .frontend-app .org-directors { grid-template-columns: minmax(0,1fr); }
    .frontend-app .modal-dialog:not(.pf-dialog) { margin: 16px; }
    .frontend-app footer { padding-top: 36px; }
    .frontend-app footer .d-flex { flex-wrap: wrap; }
}

@media (max-width: 359.98px) {
    .frontend-app .home-services-track { grid-template-columns: minmax(0,1fr); }
    .frontend-app .home-news-compact .news-card-horizontal { grid-template-columns: minmax(0,.65fr) minmax(0,1.35fr); }
}
@media (prefers-reduced-motion: reduce) {
    .frontend-app { scroll-behavior: auto; }
}
/* Keep embedded media and long modal captions usable in landscape too. */
@media (max-width: 991.98px) {
    .frontend-app .contact-map-stage { min-height: 0; }
    .frontend-app .contact-map-panel { height: 100%; min-height: 0; }
    .frontend-app :is(.project-gallery-modal-shell,.content-gallery-modal-shell) {
        max-height: calc(100dvh - 32px); overflow-y: auto !important; overscroll-behavior: contain;
    }
    .frontend-app :is(.project-gallery-modal-stage-inner,.project-gallery-modal-image) { min-height: 0; }
    .frontend-app .project-gallery-modal-image { height: auto; max-height: 55svh; }
    .frontend-app :is(.project-gallery-modal-close,.content-gallery-modal-close,.project-list-filter-btn) { min-width: 44px; min-height: 44px; }
}
@media (max-width: 575.98px) {
    .frontend-app .history-story-content { padding: 22px; }
    .frontend-app .contact-message-cta { grid-template-columns: auto minmax(0,1fr); }
}

/* Contact and footer share the same two independent locations. */
.frontend-app .office-location-card p { white-space: pre-line; }
.frontend-app .footer-locations-grid { display: grid; grid-template-columns: minmax(0,1fr); gap: 20px; }
.frontend-app .footer-locations-grid > * { min-width: 0; }
.frontend-app .footer-locations-grid .footer-office-card { margin: 0; }
.frontend-app .footer-locations-grid .footer-office-title { margin-bottom: 10px; }
@media (max-width: 575.98px) { .frontend-app .footer-locations-grid { gap: 16px; } }
@media (max-width: 359.98px) { .frontend-app .footer-locations-grid { grid-template-columns: minmax(0,1fr); } }

/* Stretch the map to the full office + message column height on desktop. */
@media (min-width: 992px) {
    .frontend-app .contact-layout-row > .contact-map-column { display: flex; }
    .frontend-app .contact-map-column > .contact-map-card { display: flex; flex-direction: column; width: 100%; }
    .frontend-app .contact-map-column .contact-map-stage { flex: 1 1 auto; min-height: 360px; height: auto; }
    .frontend-app .contact-map-column .contact-map-panel { position: absolute; inset: 0; height: 100%; }
}

/* Service listing: equal cards, consistent media, aligned detail links. */
.frontend-app .services-page-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); grid-auto-rows: 1fr; gap: 24px; }
.frontend-app .services-page-item { min-width: 0; }
.frontend-app .services-page-card { display: flex; flex-direction: column; height: 100%; overflow: hidden; }
.frontend-app .services-page-image { display: block; width: 100%; aspect-ratio: 4/3; height: auto; object-fit: cover; flex-shrink: 0; }
.frontend-app .services-page-body { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.frontend-app .services-page-body h5 { min-height: 2.8em; line-height: 1.4; }
.frontend-app .services-page-action { margin-top: auto; min-height: 44px; display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px; }
@media (max-width: 1199.98px) { .frontend-app .services-page-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; } }
@media (max-width: 575.98px) { .frontend-app .services-page-grid { grid-template-columns: minmax(0,1fr); gap: 16px; } .frontend-app .services-page-body { padding: 20px !important; } }

/* Floating chat sits below modal/offcanvas backdrops and respects mobile safe areas. */
.frontend-app .whatsapp-floating { display: grid; place-items: center; position: fixed; z-index: 1020; width: 56px; height: 56px; right: max(24px,env(safe-area-inset-right)); bottom: max(24px,env(safe-area-inset-bottom)); color: #fff; background: #128c4b; border: 2px solid #fff; border-radius: 50%; font-size: 28px; box-shadow: 0 6px 22px rgba(18,140,75,.3); }
.frontend-app .whatsapp-floating:hover { color: #fff; background: #0e743e; }
@media (max-width:575.98px) { .frontend-app .whatsapp-floating { width: 50px; height: 50px; font-size: 25px; right: max(16px,env(safe-area-inset-right)); bottom: max(16px,env(safe-area-inset-bottom)); } }
@media (prefers-reduced-motion:reduce) { .frontend-app .whatsapp-floating { transition: none; transform: none; } }