/* ==========================================================================
   DeDominic & Associates - Responsive Breakpoints Stylesheet
   Devices: Desktop (1920px-1200px), Tablet (992px-768px), Mobile (<576px)
   ========================================================================== */

/* --------------------------------------------------
   Large Desktop & Displays (>= 1400px)
   -------------------------------------------------- */
@media (min-width: 1400px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1340px;
  }
}

/* --------------------------------------------------
   Desktops & Laptops (992px - 1199px)
   -------------------------------------------------- */
@media (max-width: 1199.98px) {
  .dd-hero-buttons-overlay {
    top: 67.5%;
    left: 46%;
    right: 4%;
  }

  .dd-brand-logo {
    height: 80px;
    max-height: 85px;
  }

  .dd-gallery-item {
    width: 100%;
  }
}

/* --------------------------------------------------
   Tablets (768px - 991.98px)
   -------------------------------------------------- */
@media (max-width: 991.98px) {
  .dd-site-header {
    padding: 0.4rem 0;
  }

  .dd-brand-logo {
    height: 68px;
    max-height: 72px;
  }

  .dd-hero-buttons-overlay {
    top: 66.5%;
    left: 45%;
    right: 3%;
    gap: 8px;
  }

  .dd-hero-top-btns {
    gap: 8px;
    max-width: 380px;
  }

  .dd-btn-hero-solid,
  .dd-btn-hero-outline {
    padding: 0.45rem 0.6rem;
    font-size: 0.75rem;
  }

  .dd-btn-hero-bottom {
    padding: 0.45rem 0.8rem;
    font-size: 0.75rem;
    max-width: 250px;
  }

  .dd-growth-section,
  .dd-why-choose-section,
  .dd-gallery-section,
  .dd-testimonials-section,
  .dd-feedback-contact-section {
    padding: 4.5rem 0;
  }

  .dd-gallery-item {
    width: 100%;
  }

  .dd-gallery-section .dd-nav-circle-btn.prev {
    left: 12px;
  }

  .dd-gallery-section .dd-nav-circle-btn.next {
    right: 12px;
  }

  .dd-footer-col {
    margin-bottom: 2rem;
  }
}

/* --------------------------------------------------
   Mobile Devices (<= 767.98px)
   -------------------------------------------------- */
@media (max-width: 767.98px) {
  html {
    font-size: 15px;
  }

  .dd-brand-logo {
    height: 52px;
    max-height: 56px;
  }

  /* When screen is narrower than 768px, place buttons neatly below the hero image */
  .dd-hero-buttons-overlay {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    width: 100%;
    padding: 1.5rem 1rem 0.5rem;
    background-color: #FFFFFF;
    gap: 0.75rem;
  }

  .dd-hero-top-btns {
    flex-direction: column;
    width: 100%;
    max-width: 340px;
    gap: 0.75rem;
  }

  .dd-btn-hero-solid,
  .dd-btn-hero-outline,
  .dd-btn-hero-bottom {
    width: 100%;
    max-width: 340px;
    padding: 0.75rem 1.2rem;
    font-size: 0.95rem;
  }

  .dd-growth-section,
  .dd-why-choose-section,
  .dd-gallery-section,
  .dd-testimonials-section,
  .dd-feedback-contact-section {
    padding: 3.5rem 0;
  }

  .dd-gallery-item {
    width: 100%;
  }

  .dd-gallery-section .dd-nav-circle-btn {
    width: 38px;
    height: 38px;
  }

  .dd-gallery-section .dd-nav-circle-btn.prev {
    left: 8px;
  }

  .dd-gallery-section .dd-nav-circle-btn.next {
    right: 8px;
  }

  .dd-site-footer {
    padding: 3.5rem 0 2rem;
  }

  .dd-chevron-divider {
    display: none;
  }
}

/* --------------------------------------------------
   Small Mobile Devices (<= 480px)
   -------------------------------------------------- */
@media (max-width: 480px) {
  .dd-btn {
    padding: 0.65rem 1.2rem;
    font-size: 0.9rem;
  }

  .dd-marquee-item {
    font-size: 1.25rem;
    padding: 0 1.5rem;
  }

  .dd-testimonial-card {
    padding: 2rem 1.25rem;
  }
}

/* --------------------------------------------------
   Global Overflow & Layout Protection
   -------------------------------------------------- */
body, main, header, footer, section {
  max-width: 100vw;
  overflow-x: clip;
}