@media (max-width: 991.98px) {
    .dt-hero .swiper { height: 620px; }
    .dt-hero-content { max-width: 100%; padding-top: 3rem; }
    .dt-hero-nav { display: none; }
    .dt-footer-top { padding: 3rem 0 1.5rem; }
    .dt-page-header { padding: 3.5rem 0 2.5rem; }

    /* Nav collapses to the hamburger below this width (see components.css),
       leaving just the logo + the action icons in the row - center the logo
       instead of leaving it pinned to the left edge. */
    .dt-header-inner { position: relative; justify-content: flex-end; }
    .dt-logo { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
}

@media (max-width: 767.98px) {
    .dt-hero .swiper { height: 560px; }
    .dt-hero-title { font-size: 2rem; }
    .dt-hero-desc { font-size: .95rem; }
    .dt-trust-strip .dt-trust-item { justify-content: center; text-align: center; flex-direction: column; gap: .35rem; margin-bottom: 1rem; }
    .dt-section { padding: 2.5rem 0; }
    .dt-float-stack { right: .85rem; bottom: .85rem; }
    .dt-float-stack.dt-float-stack-left { right: auto; left: .85rem; }
    .dt-float-btn { width: 50px; height: 50px; font-size: 1.2rem; }

    /* Footer: center each stacked block instead of everything staying
       left-aligned edge-to-edge, and give the brand/contact blocks a
       bottom divider so the stack reads as distinct sections. */
    .dt-footer-top .col-lg-4,
    .dt-footer-top .col-lg-2 { text-align: center; }
    .dt-footer-top .col-lg-4:not(:last-child), .dt-footer-top .col-lg-2 { padding-bottom: 1.5rem; border-bottom: 1px solid rgba(255,255,255,.08); }
    .dt-footer-top .col-lg-4:last-child { border-bottom: 0; padding-bottom: 0; }
    .dt-footer-top .col-lg-4 img { margin-left: auto; margin-right: auto; }
    .dt-footer-links a { justify-content: center; }
    .dt-footer-social { display: flex; justify-content: center; }
    .dt-footer-contact li { justify-content: center; }
    .dt-newsletter-form { max-width: 360px; margin-left: auto; margin-right: auto; }
    .dt-footer-bottom .container { justify-content: center !important; text-align: center; flex-direction: column; }
}

