/**
 * ============================================================================
 * TEAM REMOVALS AUSTRALIA — COMPREHENSIVE MOBILE RESPONSIVE OVERHAUL
 * File: assets/css/mobile-responsive.css
 * Scope: ALL pages — homepage, inner pages, service pages, state pages
 * Min Viewport: 360px
 * Breakpoints: 360px, 375px, 390px, 414px, 430px, 768px (tablet)
 * ============================================================================
 */

/* ============================================================================
   00. GLOBAL RESET & OVERFLOW PREVENTION
   ============================================================================ */
html,
body {
  overflow-x: clip !important;
  width: 100% !important;
  max-width: 100vw !important;
  position: relative !important;
}

*,
*::before,
*::after {
  box-sizing: border-box !important;
}

img,
video,
svg,
iframe {
  max-width: 100% !important;
  height: auto;
}

/* ============================================================================
   00-A. UNIVERSAL TEXT ALIGNMENT — STRICT LEFT ALIGNMENT
   Requirement: Remove ALL text-align: justify; force left alignment site-wide.
   ============================================================================ */
p,
.para,
p.para,
.text-just,
.description,
.content,
.section-desc,
.accordion-body,
.faq-answer,
.service-details p,
.terms-condition-sec p,
.privacy-policy-sec p,
.card-text,
.testimonial .text,
.home-testimonial .text,
.ul-list li,
.why-list .content p,
.tr-why-feat-desc,
.tr-strip-features span,
.new-testi-text,
article p {
  text-align: left !important;
  text-justify: none !important;
}

/* ============================================================================
   00-B. UNIVERSAL SECTION HEADINGS & BADGES CONSISTENCY (ALL PAGES)
   ============================================================================ */
/* Category Eyebrow Pill Badges (.line) */
.line,
.main-heading .line,
.d-block.line,
span.line {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: 'Mulish', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 0.8125rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.10em !important;
  color: #8b181b !important;
  background: rgba(139, 24, 27, 0.08) !important;
  border: 1px solid rgba(139, 24, 27, 0.16) !important;
  border-radius: 9999px !important;
  padding: 5px 18px !important;
  margin-bottom: 12px !important;
  max-width: 100% !important;
  width: auto !important;
  box-sizing: border-box !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  text-align: center !important;
  line-height: 1.3 !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04) !important;
}

/* Main Section Heading Container */
.main-heading {
  max-width: 100% !important;
  box-sizing: border-box !important;
  position: relative !important;
  margin-bottom: clamp(24px, 3.5vw, 42px) !important;
}

.main-heading.text-center {
  text-align: center !important;
}

.main-heading.text-center .line,
.main-heading.text-center .head2 {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Primary Headings (.head2, h2.head2, h1.head2, .section-title, .tr-section-title) */
.head2,
h2.head2,
h1.head2,
.section-title,
.tr-section-title,
.main-heading .head2,
.main-heading h2,
.main-heading h1 {
  font-family: 'Mulish', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  line-height: 1.25 !important;
  letter-spacing: -0.02em !important;
  font-size: clamp(1.85rem, 3.2vw, 2.5rem) !important;
  max-width: 820px !important;
  margin-top: 6px !important;
  margin-bottom: 0 !important;
  box-sizing: border-box !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  hyphens: manual !important;
}

/* Hero Banner Headings */
.banner .head2,
.banner h1.head2,
.banner h2.head2,
.banner span.head2 {
  font-family: 'Mulish', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  font-size: clamp(1.9rem, 3.8vw, 2.75rem) !important;
  line-height: 1.22 !important;
  letter-spacing: -0.02em !important;
  max-width: 900px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
}

/* Subheadings */
h3.head2,
.headsub-title {
  font-family: 'Mulish', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-weight: 750 !important;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem) !important;
  line-height: 1.3 !important;
  color: #0f172a;
  max-width: 100% !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
}

h3,
.head3,
h3.head3 {
  font-family: 'Mulish', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-weight: 750 !important;
  font-size: clamp(1.15rem, 2vw, 1.45rem) !important;
  line-height: 1.35 !important;
  color: #0f172a;
  max-width: 100% !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
}

/* Explicit Contrast Protections for Headers & Cards on Dark Backgrounds */
.tr-bm-form-head .tr-bm-form-title,
.tr-bm-form-title,
.fixedside-menu .navigate>.head3,
.fixedside-menu .contact-call .head3,
.fixedside-menu .contact-call h3,
.fixedside-menu .contact-call p.head3,
.contact-call .head3,
.contact-call h3,
.contact-call p.head3,
.get-quote .form-head .head3,
.get-quote .form-head .head2,
.get-quote .form-head h3,
.get-quote .form-head h2,
#modal-form .form-head .head3,
#modal-form .form-head h3,
#footer-form .form-head .head3,
#footer-form .form-head .head2,
.form-head .head3,
.form-head h3,
.widget-title .head3,
.widget-title h3,
.widget-title p.head3,
#exampleModalToggleLabel,
.tr-modal .head3,
.tr-footer-section h1,
.tr-footer-section h2,
.tr-footer-section h3,
.tr-footer-section h4,
.tr-footer-section .head3,
.tr-footer-section .head4 {
  color: #ffffff !important;
}

.tr-bm-form-head .tr-bm-form-sub,
.tr-bm-form-sub {
  color: rgba(255, 255, 255, 0.9) !important;
}

.fixedside-menu .contact-call .para,
.fixedside-menu .contact-call .para.color-white,
.contact-call .para,
.contact-call .para.color-white {
  color: #a3a3a3 !important;
  text-align: center !important;
}

/* Testimonial slider navigation dots (Hidden on Desktop & Tablet) */
.new-testi-dots,
.tr-testimonials-dots,
.tr-blog-dots {
  display: none !important;
}

/* ============================================================================
   01. HEADER & MOBILE NAVIGATION
   ============================================================================ */
@media screen and (max-width: 768px) {

  header.tr-header,
  .me_sticky.tr-header {
    width: 100% !important;
    max-width: 100vw !important;
    overflow: hidden !important;
  }

  .tr-header__inner {
    padding: 10px 16px !important;
    gap: 12px !important;
  }

  .tr-header__logo {
    height: 38px !important;
    max-height: 38px !important;
    max-width: 180px !important;
  }
}

@media screen and (max-width: 480px) {
  .tr-header__inner {
    padding: 8px 12px !important;
  }

  .tr-header__logo {
    height: 34px !important;
    max-height: 34px !important;
    max-width: 160px !important;
  }

  .tr-burger {
    width: 38px !important;
    height: 38px !important;
    padding: 7px !important;
    flex-shrink: 0 !important;
  }
}

/* ============================================================================
   02. HERO SECTION — HOMEPAGE
   ============================================================================ */
@media (max-width: 767px) {
  .tr-hero-section {
    min-height: auto !important;
    height: auto !important;
    padding: 22px 0 24px !important;
    overflow: hidden !important;
  }

  .tr-hero-bg-frame {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }

  .tr-hero-bg-img {
    object-position: 78% center !important;
  }

  .tr-hero-container {
    padding: 0 14px !important;
    margin-bottom: 12px !important;
  }

  .tr-hero-content-box {
    max-width: 100% !important;
  }

  .tr-hero-main-title {
    font-size: clamp(22px, 6.4vw, 28px) !important;
    line-height: 1.18 !important;
    margin-bottom: 8px !important;
  }

  .tr-hero-title-crimson {
    font-size: clamp(18px, 5.2vw, 22px) !important;
    padding: 3px 12px 4px !important;
    border-radius: 6px !important;
    margin-top: 4px !important;
  }

  .tr-hero-desc-text {
    font-size: 12.5px !important;
    line-height: 1.48 !important;
    border-left-width: 2.5px !important;
    padding-left: 10px !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  .tr-hero-cards-container {
    padding: 0 14px !important;
  }

  .tr-hero-cards-grid {
    display: flex !important;
    flex-direction: row !important;
    gap: 8px !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  .tr-hero-cards-grid>a,
  .tr-hero-cards-grid>.tr-hero-trust-card {
    flex: 1 1 0 !important;
    min-width: 0 !important;
  }

  .tr-hero-trust-card {
    padding: 9px 8px 7px !important;
    border-radius: 12px !important;
  }

  .tr-htrust-top-row {
    gap: 6px !important;
    margin-bottom: 5px !important;
  }

  .tr-htrust-icon-circle {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    border-radius: 9px !important;
  }

  .tr-htrust-score-num {
    font-size: 13px !important;
  }

  .tr-htrust-brand-title {
    font-size: 11.5px !important;
  }

  .tr-htrust-stars-list {
    font-size: 8px !important;
  }

  .tr-htrust-bottom-pill {
    font-size: 7.5px !important;
    padding: 3px 4px !important;
    white-space: nowrap !important;
  }
}

/* ============================================================================
   03. INNER PAGE BANNER / HERO
   ============================================================================ */
@media (max-width: 767px) {
  .banner {
    min-height: auto !important;
    padding: clamp(42px, 8vw, 60px) 0 clamp(30px, 5vw, 44px) !important;
  }

  .banner .head2,
  .banner h1.head2 {
    font-size: clamp(1.5rem, 5.5vw, 2rem) !important;
    line-height: 1.3 !important;
    word-break: break-word !important;
  }

  .banner .breadcrumb {
    padding: 5px 14px !important;
    flex-wrap: wrap !important;
  }

  .banner .breadcrumb-item {
    font-size: 0.73rem !important;
  }

  .service-details .banner,
  body:has(.service-details) .banner {
    padding: clamp(36px, 7vw, 55px) 0 clamp(28px, 5vw, 40px) !important;
  }
}

/* ============================================================================
   04. ABOUT / MOVING & CLEANING SECTION
   ============================================================================ */
@media (max-width: 767px) {

  .tr-about-intro-sec,
  section.tr-about-intro-sec {
    padding: 38px 0 44px !important;
    overflow: hidden !important;
  }

  .tr-about-intro-sec .container,
  .tr-about-intro-sec .tr-wrap {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .main-heading .head2,
  .main-heading h2,
  h2.head2 {
    font-size: clamp(1.45rem, 5.2vw, 1.9rem) !important;
    line-height: 1.28 !important;
  }

  .tr-moving-cleaning-section,
  .moving-cleaning-section {
    padding: 36px 0 42px !important;
    overflow: hidden !important;
  }

  .tr-why-dots--tl,
  .tr-why-dots--br {
    display: none !important;
  }
}

/* ============================================================================
   05. MOVING PROCESS SECTION
   ============================================================================ */
@media (max-width: 767px) {

  .tr-process-section,
  section.tr-process-section {
    padding: 36px 0 42px !important;
    overflow: hidden !important;
  }

  .tr-process-step,
  .step-card {
    padding: 28px 14px 20px !important;
    border-radius: 20px !important;
  }

  .tr-process-connector {
    display: none !important;
  }

  .tr-process-section .container,
  .tr-process-section .tr-wrap {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

/* ============================================================================
   06. SERVICES SECTION
   ============================================================================ */
@media (max-width: 767px) {

  .tr-services-section,
  section.tr-services-section {
    padding: 36px 0 42px !important;
    overflow: hidden !important;
  }

  .service-card {
    padding: 12px !important;
    border-radius: 14px !important;
  }

  .service-card a img {
    height: 170px !important;
    object-fit: cover !important;
    border-radius: 12px !important;
  }

  .service-card .head3,
  .service-card a .head3,
  .service-card a h3 {
    font-size: 1.02rem !important;
    padding: 12px 14px !important;
    line-height: 1.3 !important;
  }

  .related-services-grid,
  .service-card-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }

  .states-wraper {
    gap: 8px !important;
  }

  .states-wraper a.btn2,
  .suburb-links a {
    font-size: 13px !important;
    padding: 8px 14px !important;
    border-radius: 8px !important;
    white-space: normal !important;
    word-break: break-word !important;
  }
}

/* ============================================================================
   07. WHY CHOOSE US SECTION
   ============================================================================ */
@media (max-width: 767px) {
  .tr-why-choose-section {
    padding: 36px 0 42px !important;
    overflow: hidden !important;
  }

  .tr-why-container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .tr-why-title {
    font-size: clamp(22px, 6vw, 28px) !important;
  }

  .tr-why-subtitle {
    font-size: 13.5px !important;
  }

  .tr-why-grid-wrapper {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
  }

  .tr-why-col-left,
  .tr-why-col-right {
    width: 100% !important;
  }

  .tr-why-center-img-wrap {
    display: none !important;
  }

  .tr-why-feat-card {
    padding: 16px 18px !important;
  }

  .tr-why-feat-title {
    font-size: 14px !important;
  }

  .tr-why-feat-desc {
    font-size: 13px !important;
  }

  .whychoose-card {
    padding: 42px 18px 24px !important;
  }

  .why-card-outer {
    margin-bottom: 60px !important;
  }
}

/* ============================================================================
   08. TESTIMONIALS — ONE-CARD TOUCH CAROUSEL
   ============================================================================ */
@media (max-width: 767px) {
  .tr-testimonials-section {
    padding: 36px 0 44px !important;
    overflow: hidden !important;
  }

  .tr-testimonials-container {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .tr-testimonials-header {
    padding: 0 14px !important;
    margin-bottom: 16px !important;
    text-align: center !important;
  }

  .tr-testimonials-title {
    font-size: clamp(20px, 5.6vw, 26px) !important;
    line-height: 1.25 !important;
  }

  .new-testi-grid,
  .tr-testimonials-grid {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    scroll-behavior: smooth !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 12px !important;
    padding: 6px 14px 16px !important;
    margin: 0 !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }

  .new-testi-grid::-webkit-scrollbar,
  .tr-testimonials-grid::-webkit-scrollbar {
    display: none !important;
  }

  .new-testi-card,
  .tr-testimonials-card {
    flex: 0 0 calc(100vw - 28px) !important;
    width: calc(100vw - 28px) !important;
    min-width: calc(100vw - 28px) !important;
    max-width: calc(100vw - 28px) !important;
    scroll-snap-align: start !important;
    scroll-snap-stop: always !important;
    box-sizing: border-box !important;
    padding: 18px 16px 14px !important;
    border-radius: 16px !important;
  }

  /* Testimonials Slider Dots (Mobile) */
  .new-testi-dots,
  .tr-testimonials-dots {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 7px !important;
    margin: 14px auto 0 !important;
    padding: 6px 12px !important;
    width: fit-content !important;
    max-width: 260px !important;
    overflow-x: auto !important;
    scroll-behavior: smooth !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    box-sizing: border-box !important;
  }

  .new-testi-dots::-webkit-scrollbar,
  .tr-testimonials-dots::-webkit-scrollbar {
    display: none !important;
  }

  .new-testi-dot,
  .tr-testimonials-dot {
    display: inline-block !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    border: none !important;
    outline: none !important;
    cursor: pointer !important;
    width: 7px !important;
    height: 7px !important;
    min-width: 7px !important;
    min-height: 7px !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 999px !important;
    background-color: #d1d5db !important;
    transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative !important;
    touch-action: manipulation !important;
  }

  .new-testi-dot::before,
  .tr-testimonials-dot::before {
    content: '' !important;
    position: absolute !important;
    top: -10px !important;
    bottom: -10px !important;
    left: -5px !important;
    right: -5px !important;
  }

  .new-testi-dot.active,
  .tr-testimonials-dot.active {
    width: 22px !important;
    background: #7a1326 !important;
    border-radius: 999px !important;
    box-shadow: 0 2px 6px rgba(122, 19, 38, 0.35) !important;
  }
}

/* ============================================================================
   09. FIND PROFESSIONAL REMOVALISTS — STATES GRID
   ============================================================================ */
@media (max-width: 767px) {
  .tr-states-section {
    padding: 36px 0 44px !important;
    overflow: hidden !important;
  }

  .tr-states-section .tr-wrap,
  .tr-states-section .container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .tr-states-header {
    margin-bottom: 18px !important;
  }

  .tr-states-title-dark,
  .tr-states-title-crimson {
    font-size: clamp(1.25rem, 4.8vw, 1.55rem) !important;
    line-height: 1.25 !important;
  }

  .tr-states-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    width: 100% !important;
  }

  .tr-state-card {
    min-height: 54px !important;
    padding: 7px 8px !important;
    border-radius: 12px !important;
    border-left-width: 3px !important;
    gap: 0 !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .tr-state-badge {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    border-radius: 9px !important;
    margin-right: 7px !important;
    padding: 4px !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
  }

  .tr-state-map-img {
    width: 20px !important;
    height: 20px !important;
    object-fit: contain !important;
  }

  .tr-state-info {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .tr-state-code {
    font-size: 0.74rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    display: inline-block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .tr-state-name {
    font-size: 0.58rem !important;
    margin-top: 1px !important;
    display: block !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .tr-state-arrow {
    display: none !important;
  }
}

/* ============================================================================
   10. STORIES / HAPPY CUSTOMER SECTION
   ============================================================================ */
@media (max-width: 767px) {

  .tr-stories-section,
  section.tr-stories-section,
  .happy-customer-sec {
    padding: 36px 0 42px !important;
    overflow: hidden !important;
  }

  .tr-stories-section .container,
  .tr-stories-section .tr-wrap {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .customer-inner {
    flex-direction: column !important;
  }

  .customer-inner .happy-left {
    height: 200px !important;
    width: 100% !important;
  }

  .customer-inner .happy-right {
    height: auto !important;
  }

  .customer-inner .happy-right p {
    width: 100% !important;
  }
}

/* ============================================================================
   11. BLOG CARDS SECTION (MOBILE CAROUSEL)
   ============================================================================ */
@media (max-width: 767px) {

  section.removalist-sec,
  .removalist-sec,
  .tr-home-blogs-section {
    padding: 36px 0 42px !important;
    overflow: hidden !important;
  }

  .removalist-sec .container,
  .tr-home-blogs-section .container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .removalist-sec .main-heading {
    margin-bottom: 22px !important;
  }

  .tr-blog-carousel-wrapper {
    position: relative !important;
    width: 100% !important;
    overflow: visible !important;
  }

  .tr-blog-carousel,
  .tr-blog-grid-row.tr-blog-carousel {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory !important;
    scroll-behavior: smooth !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 14px !important;
    padding: 6px 14px 16px !important;
    margin: 0 -14px !important;
    row-gap: 0 !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
  }

  .tr-blog-carousel::-webkit-scrollbar,
  .tr-blog-grid-row.tr-blog-carousel::-webkit-scrollbar {
    display: none !important;
  }

  .tr-blog-card-col {
    display: flex !important;
    flex: 0 0 calc(100vw - 36px) !important;
    width: calc(100vw - 36px) !important;
    min-width: calc(100vw - 36px) !important;
    max-width: calc(100vw - 36px) !important;
    scroll-snap-align: start !important;
    scroll-snap-stop: always !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .tr-blog-card {
    border-radius: 14px !important;
    width: 100% !important;
    height: 100% !important;
  }

  .tr-blog-card-media {
    min-height: 185px !important;
    max-height: 210px !important;
  }

  .tr-blog-card-body {
    padding: 14px 16px 16px !important;
  }

  .tr-blog-card-title {
    font-size: 1rem !important;
    line-height: 1.35 !important;
  }

  .tr-blog-card-excerpt {
    font-size: 0.87rem !important;
    margin-bottom: 12px !important;
  }

  .tr-blog-view-all-btn {
    width: 100% !important;
    justify-content: center !important;
    padding: 12px 20px !important;
  }

  .tr-blog-cta-row {
    margin-top: 8px !important;
  }
}

/* ============================================================================
   12. BOOK YOUR MOVE / CTA FORM
   ============================================================================ */
@media (max-width: 767px) {
  .tr-book-move-section {
    padding: 38px 0 48px !important;
    overflow: hidden !important;
  }

  .tr-bm-container {
    padding: 0 14px !important;
  }

  .tr-bm-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }

  .tr-bm-main-title {
    font-size: clamp(22px, 5.8vw, 28px) !important;
    line-height: 1.25 !important;
  }

  .tr-bm-subtitle {
    font-size: 13.5px !important;
  }

  .tr-bm-fields-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .tr-bm-form-body {
    padding: 16px 14px 18px !important;
  }

  .tr-bm-form-head {
    padding: 16px 16px 14px !important;
  }

  .tr-bm-form-title {
    font-size: 20px !important;
  }

  .tr-bm-options-strip {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
    padding: 10px 14px !important;
  }

  .tr-bm-opt-divider {
    display: none !important;
  }

  .tr-bm-submit-btn {
    width: 100% !important;
    justify-content: center !important;
    padding: 13px 16px !important;
  }

  .tr-bm-feat-card {
    padding: 12px 14px !important;
    gap: 12px !important;
  }

  .tr-bm-feat-circle {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
  }

  .tr-bm-mover-photo-wrap,
  .tr-bm-boxes-photo-wrap,
  .tr-bm-hand-arrow,
  .tr-bm-house-watermark {
    display: none !important;
  }

  .tr-bm-script-slogan {
    justify-content: center !important;
    margin-top: 20px !important;
  }
}

/* ============================================================================
   13. FOOTER
   ============================================================================ */
@media (max-width: 767px) {

  footer,
  .tr-footer,
  .footer-main {
    overflow: hidden !important;
  }

  footer .container,
  .tr-footer .container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  footer .col-md-3,
  footer .col-md-4,
  footer .col-lg-3,
  footer .col-lg-4 {
    margin-bottom: 28px !important;
  }

  footer .footer-logo img {
    max-height: 48px !important;
    width: auto !important;
  }

  .tr-strip-section {
    flex-direction: column !important;
    overflow: hidden !important;
  }

  .tr-strip-bg-photo-wrap {
    position: relative !important;
    width: 100% !important;
    height: 220px !important;
  }

  .tr-strip-container {
    padding: 30px 14px 36px !important;
  }

  .tr-strip-card {
    padding-left: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  .tr-strip-title-dark,
  .tr-strip-title-red {
    font-size: clamp(22px, 6vw, 26px) !important;
    letter-spacing: -0.4px !important;
  }

  .tr-strip-features {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 14px !important;
  }

  .tr-strip-feat-sep {
    display: none !important;
  }

  .tr-strip-btn {
    width: 100% !important;
    justify-content: center !important;
    padding: 14px 20px !important;
  }
}

/* ============================================================================
   14. STICKY MOBILE BOTTOM BAR
   ============================================================================ */
@media (max-width: 767px) {
  body {
    padding-bottom: 64px !important;
  }

  .tr-mobile-bottom-bar,
  .mobile-sticky-bar,
  .fixed-bottom-bar {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important;
  }

  .tr-mobile-bottom-bar a,
  .mobile-sticky-bar a,
  .fixed-bottom-bar a {
    flex: 1 1 0 !important;
    text-align: center !important;
    padding: 10px 4px !important;
    font-size: 11px !important;
  }
}

/* ============================================================================
   15. CONTACT PAGE
   ============================================================================ */
@media (max-width: 767px) {
  .contact-form form {
    padding: 16px 14px !important;
  }

  .contact-form form .head3 {
    font-size: 18px !important;
    text-align: center !important;
  }

  .tr-contact-grid,
  .contact-info-grid {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .tr-contact-hero-section {
    padding: 36px 0 44px !important;
  }

  .tr-contact-hero-section .container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .tr-contact-form-card {
    border-radius: 16px !important;
    padding: 20px 16px !important;
  }
}

/* ============================================================================
   16. FAQ ACCORDION
   ============================================================================ */
@media (max-width: 767px) {
  .accordion-item {
    border-radius: 12px !important;
    margin-bottom: 10px !important;
  }

  .accordion-button {
    font-size: 0.96rem !important;
    padding: 15px 16px !important;
    line-height: 1.4 !important;
  }

  .accordion-body {
    padding: 14px 16px !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
  }

  .faq-section,
  .tr-faq-section {
    padding: 36px 0 42px !important;
  }

  .faq-section .container,
  .tr-faq-section .container {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

/* ============================================================================
   17. QUOTE FORM
   ============================================================================ */
@media (max-width: 767px) {

  .get-quote,
  .quote-form-wrap {
    margin-top: 0px !important;
  }

  .get-quote .detail .p-4 {
    padding: 0.75rem !important;
  }

  .get-quote .px-4 {
    padding-left: 0.4rem !important;
    padding-right: 0.4rem !important;
  }

  .tr-quote-form-modal,
  .quote-modal {
    width: 95vw !important;
    max-width: 95vw !important;
    margin: 0 auto !important;
    padding: 16px !important;
  }
}

/* ============================================================================
   18. SIDEBAR
   ============================================================================ */
@media (max-width: 991px) {

  .sidebar,
  .tr-sidebar {
    margin-top: 32px !important;
  }

  .sidebar-inner,
  .tr-sidebar-inner {
    padding: 0 !important;
  }
}

/* ============================================================================
   19. GENERAL CARDS, BUTTONS & TYPOGRAPHY
   ============================================================================ */
@media (max-width: 767px) {

  /* Category Eyebrows (.line) — Anti-Overflow & Wrap */
  .line,
  .main-heading .line,
  .d-block.line,
  span.line {
    font-size: clamp(0.70rem, 2.9vw, 0.78rem) !important;
    letter-spacing: 0.05em !important;
    padding: 5px 12px !important;
    margin: 0 auto 10px auto !important;
    max-width: calc(100vw - 32px) !important;
    width: auto !important;
    white-space: normal !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    line-height: 1.35 !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  .line::before,
  .line::after,
  .main-heading .line::before,
  .main-heading .line::after {
    display: none !important;
    content: none !important;
  }

  .main-heading {
    margin-bottom: 22px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .section-title,
  .head2,
  h2.head2,
  h1.head2,
  h3.head2,
  .tr-section-title,
  .main-heading .head2,
  .main-heading h1,
  .main-heading h2,
  .main-heading h3 {
    font-size: clamp(1.35rem, 5.2vw, 1.85rem) !important;
    line-height: 1.28 !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  h3,
  .head3,
  h3.head3 {
    font-size: clamp(1.1rem, 4vw, 1.35rem) !important;
    line-height: 1.32 !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
  }

  .banner .head2,
  .banner h1.head2,
  .banner h2.head2,
  .banner span.head2 {
    font-size: clamp(1.35rem, 5.2vw, 1.85rem) !important;
    line-height: 1.25 !important;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
  }

  /* Section Padding & Wrappers */
  section.section-padding,
  .section-padding,
  .wrapper.section-padding {
    padding-top: clamp(34px, 6vw, 48px) !important;
    padding-bottom: clamp(34px, 6vw, 48px) !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }

  .btn1,
  .btn2,
  .btn3,
  .theme-button {
    min-height: 44px !important;
    padding: 11px 20px !important;
    font-size: 14px !important;
    border-radius: 8px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    word-break: break-word !important;
  }

  .cta-strip .cta-content {
    flex-direction: column !important;
    gap: 14px !important;
    text-align: center !important;
  }

  .center-align .my-3 img,
  .service-main-img {
    max-height: 280px !important;
    width: 100% !important;
    object-fit: cover !important;
  }

  .booking-card img {
    height: 14rem !important;
  }

  .detail {
    padding: 18px 14px !important;
  }

  .flex-dir-col-reverse {
    flex-direction: column-reverse !important;
  }

  .w-70,
  .w-75,
  .w-80,
  .w-85,
  .w-90 {
    width: 100% !important;
    max-width: 100% !important;
  }

  .states-wraper {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  .states-wraper a.btn2 {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
  }

  .breadcrumb {
    flex-wrap: wrap !important;
    margin-bottom: 0 !important;
  }

  p.para,
  .para {
    font-size: 14.5px !important;
    line-height: 1.7 !important;
  }

  /* Overflow Protection for Cards & Complex Components */
  .service-details,
  .customer-inner,
  .customer-inner .happy-left,
  .why-list,
  .step-card {
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ============================================================================
   20. FINE-TUNED 360px - 380px OVERRIDES
   ============================================================================ */
@media (max-width: 380px) {
  .tr-hero-cards-grid {
    gap: 6px !important;
  }

  .tr-hero-trust-card {
    padding: 7px 6px 6px !important;
  }

  .tr-htrust-icon-circle {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
  }

  .tr-htrust-brand-title {
    font-size: 10.5px !important;
  }

  .tr-htrust-score-num {
    font-size: 12px !important;
  }

  .new-testi-card,
  .tr-testimonials-card {
    flex: 0 0 calc(100vw - 20px) !important;
    width: calc(100vw - 20px) !important;
    min-width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    padding: 14px 12px 10px !important;
  }

  .new-testi-grid,
  .tr-testimonials-grid {
    padding: 4px 10px 14px !important;
    gap: 10px !important;
  }

  .new-testi-dots,
  .tr-testimonials-dots {
    gap: 5px !important;
    margin-top: 10px !important;
  }

  .new-testi-dot,
  .tr-testimonials-dot {
    width: 6px !important;
    height: 6px !important;
    min-width: 6px !important;
    min-height: 6px !important;
  }

  .new-testi-dot.active,
  .tr-testimonials-dot.active {
    width: 18px !important;
  }

  .tr-states-grid {
    gap: 6px !important;
  }

  .tr-state-card {
    padding: 6px 7px !important;
    min-height: 50px !important;
  }

  .tr-state-badge {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    margin-right: 5px !important;
    padding: 3px !important;
  }

  .tr-state-map-img {
    width: 17px !important;
    height: 17px !important;
  }

  .tr-state-code {
    font-size: 0.7rem !important;
  }

  .tr-state-name {
    font-size: 0.56rem !important;
  }

  .tr-blog-grid-row .col-md-4 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  .tr-header__inner {
    padding: 8px 10px !important;
  }

  .tr-header__logo {
    height: 32px !important;
    max-width: 148px !important;
  }

  .tr-states-section .tr-wrap,
  .tr-states-section .container,
  .tr-testimonials-section .tr-wrap,
  .tr-book-move-section .tr-bm-container {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .container,
  .container-fluid {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  /* 360px Eyebrows & Headings */
  .line,
  .main-heading .line,
  .d-block.line,
  span.line {
    font-size: 0.70rem !important;
    padding: 4px 10px !important;
    letter-spacing: 0.04em !important;
    max-width: calc(100vw - 20px) !important;
  }

  .head2,
  h2.head2,
  h1.head2,
  .section-title,
  .tr-section-title,
  .main-heading .head2,
  .main-heading h1,
  .main-heading h2 {
    font-size: clamp(1.22rem, 5.2vw, 1.55rem) !important;
    line-height: 1.26 !important;
  }

  .banner .head2,
  .banner h1.head2,
  .banner h2.head2,
  .banner span.head2 {
    font-size: clamp(1.22rem, 5.2vw, 1.55rem) !important;
    line-height: 1.24 !important;
  }

  .service-details {
    padding: 18px 12px !important;
  }

  .tr-why-title {
    font-size: clamp(19px, 5.6vw, 22px) !important;
  }

  .tr-bm-main-title {
    font-size: clamp(19px, 5.6vw, 22px) !important;
  }
}

/* ============================================================================
   TABLET FIXES (768px - 991px)
   ============================================================================ */
@media (min-width: 768px) and (max-width: 991px) {
  .tr-states-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 14px !important;
  }

  .tr-why-grid-wrapper {
    grid-template-columns: 1fr 1fr !important;
  }

  .tr-why-center-img-wrap {
    display: none !important;
  }

  .tr-bm-grid {
    grid-template-columns: 1fr !important;
    gap: 32px !important;
  }

  .tr-bm-mover-photo-wrap,
  .tr-bm-boxes-photo-wrap,
  .tr-bm-hand-arrow,
  .tr-bm-house-watermark {
    display: none !important;
  }

  .new-testi-grid,
  .tr-testimonials-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    overflow: visible !important;
    flex-direction: unset !important;
    flex-wrap: unset !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
  }

  .new-testi-card,
  .tr-testimonials-card {
    flex: unset !important;
    width: auto !important;
    min-width: unset !important;
    max-width: unset !important;
    scroll-snap-align: unset !important;
    scroll-snap-stop: unset !important;
  }
}