@media (min-width: 1800px) and (max-width: 1900px) {
  .container-fluid {
    padding: 0 30px;
  }
}

@media (min-width: 1600px) {
  .container {
    max-width: 1464px;
  }
}

@media (max-width: 1800px) {
  .choose-us .rgt {
    padding: 80px 100px;
  }
}

@media (max-width: 1700px) {
  :root {
    --size-22: 20px;
    --size-23: 20px;
    --size-24: 22px;
    --size-25: 23px;
    --size-27: 24px;
    --size-28: 26px;
    --size-30: 28px;
    --size-32: 30px;
    --size-35: 32px;
    --size-36: 34px;
    --size-38: 36px;
    --size-42: 38px;
    --size-45: 41px;
    --size-62: 52px;
    --size-93: 73px;
    --size-137: 109px;
    --size-56: 52px;
    --size-70: 65px;
    --size-73: 68px;
  }

  body {
    font-size: 18px;
  }

  h1 {
    font-size: 64px;
  }

  h2 {
    font-size: 38px;
  }

  h3 {
    font-size: 34px;
  }

  h4 {
    font-size: 29px;
  }

  h5 {
    font-size: 24px;
  }

  h6 {
    font-size: 20px;
  }

  /* ---------- Spacing utilities ---------- */
  .pb-120 {
    padding-bottom: 110px;
  }

  .pb-140 {
    padding-bottom: 130px;
  }
  .pt-140 {
    padding-top: 130px;
  }

  .pt-135 {
    padding-top: 125px;
  }

  .pb-150 {
    padding-bottom: 140px;
  }
  .pt-150 {
    padding-top: 140px;
  }
  .mt-34 {
    margin-top: 28px;
  }
  .mt-45 {
    margin-top: 35px;
  }

  .mt-163 {
    margin-top: 150px;
  }

  .ft_90 {
    font-size: 80px;
  }

  .pb-100 {
    padding-bottom: 85px;
  }
  .pt-80 {
    padding-top: 70px;
  }
  .pt-200 {
    padding-top: 180px;
  }

  .pt-120 {
    padding-top: 110px;
  }

  .choose-us .rgt {
    padding: 80px 70px;
  }
  .text-reveal .color-animation h3 {
    font-size: 40px;
  }
  .title-box {
    max-width: 850px;
  }
  .about-banner .abt-wrp h1 {
    max-width: 750px;
  }
  .text-reveal .color-animation {
    max-width: 881px;
    margin: auto;
  }
  .ready-sec.text-reveal .color-animation {
    max-width: 683px;
    margin: auto;
  }
  .abt-glry .rgt {
    max-width: 444px;
  }
  .floring-ryt h2 {
    max-width: 400px;
    width: 100%;
  }
  .flooring-slice__heading {
    max-width: 700px;
  }
  .howwork-inner {
    margin-bottom: 10px;
  }
  .howwork h6 {
    margin-bottom: 15px;
  }
  .rates h3 {
    font-size: 54px;
  }
  .revbtn {
    padding: 20px 33px;
  }
  .innercommercial-head h2 {
    max-width: 560px;
  }
  .lead-crpt .wrap .btn-bnr {
    margin-top: 20px;
  }
  .lead-crpt h2 {
    max-width: 750px;
  }
  .bacs-slider_desc {
    max-width: 700px;
  }
  .glry-1 .lft {
    max-width: 450px;
  }
}

@media (max-width: 1599px) {
  .quality-right {
    padding-top: 10px;
  }
  .choose-us .rgt {
    padding: 50px;
  }
  .floring-ryt {
    padding: 10px;
  }

  /* .mainprivcy{
  padding-top: 20px;
} */
  .find-form {
    grid-template-columns: 2fr 2fr 1fr;
  }
  .glry-2 {
    height: 750px;
  }
  .text-reveal .color-animation h3 {
    font-size: 38px;
  }
  .quality-tp-img img {
    height: 490px;
  }
}

@media (max-width: 1499px) {
  :root {
    --size-22: 18px;
    --size-23: 20px;
    --size-24: 21px;
    --size-25: 23px;
    --size-27: 22px;
    --size-28: 20px;
    --size-30: 26px;
    --size-32: 24px;
    --size-35: 32px;
    --size-38: 36px;
    --size-42: 38px;
    --size-45: 41px;
    --size-62: 52px;
    --size-93: 73px;
    --size-137: 109px;
    --size-56: 52px;
    --size-70: 63px;
    --size-73: 65px;
  }

  header {
    padding: 18px 0;
  }

  header .navbar-brand {
    padding-right: 10px;
  }

  header .navbar .navbar-nav {
    gap: 15px;
  }

  header .nav-link {
    font-size: 14px;
  }

  .hdr-srch {
    gap: 20px !important;
  }

  .hdr-btn a {
    padding: 12px 24px;
    font-size: 13px;
  }

  footer .top-ft {
    padding-top: 110px;
    padding-bottom: 100px;
  }

  footer .top-ft .inr {
    column-gap: 50px;
    row-gap: 50px;
  }

  footer .top-ft .inr .logo-box {
    max-width: 330px;
  }

  footer .top-ft .inr .logo-box p {
    margin-top: 20px;
  }

  footer .top-ft .inr .link-box ul {
    gap: 12px;
    margin-top: 16px;
  }

  footer .top-ft .inr .link-box.cntct-info {
    max-width: 300px;
  }

  footer .top-ft .inr .link-box.cntct-info li {
    align-items: flex-start;
    gap: 10px;
  }

  .log-cntnt p {
    font-size: 16px;
  }

  /* ---------- Spacing utilities ---------- */
  .pb-120 {
    padding-bottom: 100px;
  }

  .pb-140 {
    padding-bottom: 120px;
  }
  .pt-140 {
    padding-top: 120px;
  }

  .pt-135 {
    padding-top: 115px;
  }

  .pb-150 {
    padding-bottom: 130px;
  }
  .pt-150 {
    padding-top: 130px;
  }
  .pb-100 {
    padding-bottom: 75px;
  }
  .pt-80 {
    padding-top: 70px;
  }
  .mt-34 {
    margin-top: 26px;
  }
  .mt-45 {
    margin-top: 32px;
  }

  .mt-163 {
    margin-top: 140px;
  }

  .ft_90 {
    font-size: 70px;
  }

  .pt-200 {
    padding-top: 160px;
  }

  .pt-120 {
    padding-top: 100px;
  }

  .choose-us .btn-box {
    flex-wrap: wrap;
  }

  .glry-1 .lft {
    max-width: 400px;
  }
  .ready-sec.text-reveal .color-animation {
    max-width: 645px;
    margin: auto;
  }
}

@media (max-width: 1399px) {
  .choose-us .btn-box {
    flex-wrap: wrap;
  }
  .filter-ryt-side {
    padding-left: 10px;
  }

  .filter-sec .filter-left-side {
    padding-right: 40px;
  }

  .filter-ryt-side .filter-ryt-iner {
    gap: 22px;
  }

  .filter-pagination .page-btn {
    width: 45px;
    height: 45px;
  }

  .pb-120 {
    padding-bottom: 100px;
  }

  .quality-inner-img img {
    width: 80px;
    height: 80px;
  }

  .specfy-wrapper {
    padding: 60px;
  }

  .spcf-item span {
    width: 50%;
  }

  .spcfy-iner-wrp .spcfy-left::after {
    right: 10%;
  }

  .p-100 {
    padding: 80px 0;
  }
  .flooring-slider .slick-track .flooring-card {
    height: auto;
    min-height: auto;
  }

  .about-banner .abt-wrp h1 {
    max-width: 80%;
  }

  .choose-wrp > .row > div:nth-child(1) {
    margin-top: 150px;
  }

  .choose-wrp > .row > div:nth-child(2) {
    margin-top: 32px;
  }

  .new_floor {
    padding: 180px 0 90px;
  }
  .glry-1 .container-fluid {
    height: 650px;
  }

  .mke-flr-simple .card-boxe .cntnt-box .num {
    height: 40px;
    width: 40px;
    margin-left: 22px;
  }
  .glry-2 {
    height: 650px;
    padding: 40px 20px;
  }
  .term-sec .cnt-head {
    margin-bottom: 50px;
  }

  .privcy-sec .cnt-head {
    margin-bottom: 50px;
  }

  .otp-login-container input#email_input,
  .otp-login-container input#otp_input {
    padding: 17px 17px;
  }
  #products-pagination-container ul li .page-numbers {
    width: 45px;
    height: 45px;
  }
  .quality-tp-img img {
    height: 460px;
  }
}
@media (max-width: 1299px) {
  .avloption {
    grid-template-columns: repeat(2, 1fr);
  }
  .navbar-brand {
    margin-right: 0;
  }
  header ul#menu-header-menu {
    margin-left: 0;
  }
  .floring-ryt p {
    margin-bottom: 30px;
  }
}

@media (max-width: 1199px) {
  :root {
    --size-22: 18px;
    --size-23: 17px;
    --size-24: 18px;
    --size-25: 19px;
    --size-27: 20px;
    --size-28: 26px;
    --size-32: 23px;
    --size-35: 26px;
    --size-36: 26px;
    --size-38: 29px;
    --size-30: 24px;
    --size-42: 31px;
    --size-45: 34px;
    --size-62: 44px;
    --size-93: 63px;
    --size-137: 92px;
    --size-56: 46px;
    --size-70: 57px;
    --size-73: 59px;
  }

  h1 {
    font-size: 56px;
  }

  h2 {
    font-size: 35px;
  }

  h3 {
    font-size: 30px;
  }

  h4 {
    font-size: 27px;
  }

  h5 {
    font-size: 22px;
  }

  h6 {
    font-size: 20px;
  }

  header {
    padding: 14px 0;
  }

  header .navbar-brand {
    padding-right: 8px;
  }

  header .navbar-collapse {
    margin-top: 20px;
  }

  header .navbar-brand img {
    transition: 0.3s ease-in all;
    width: 80px;
  }
  header.site-header:has([aria-expanded="true"]) {
    background: var(--brown) !important;
    padding: 8px 0;
  }

  header .navbar .navbar-nav {
    gap: 10px;
  }

  header .nav-link {
    font-size: 13px;
  }

  .hdr-srch {
    gap: 15px !important;
  }

  .hdr-btn a {
    padding: 11px 18px;
    font-size: 12px;
  }

  .hom_baner {
    padding: 200px 0 162px;
  }

  footer .top-ft {
    padding-top: 90px;
    padding-bottom: 80px;
  }

  footer .top-ft .inr {
    justify-content: flex-start;
    column-gap: 70px;
    row-gap: 50px;
  }

  footer .top-ft .inr .logo-box {
    max-width: 300px;
  }

  footer .top-ft .inr .link-box.cntct-info {
    max-width: 280px;
  }

  footer .top-ft .inr .link-box ul {
    gap: 10px;
  }

  footer .top-ft .inr .link-box.cntct-info li {
    line-height: 1.5;
  }

  .row-top .log-col,
  .row-btm .log-col {
    height: 50px;
    padding: 0;
  }

  .row-mid .log-col::after,
  .row-btm .log-col::after {
    width: 10px;
    height: 10px;
  }

  .row-top .log-col,
  .row-btm .log-col {
    height: 50px;
    padding: 0;
  }
  .log-cntnt p {
    font-size: 13px;
  }

  /* ---------- Spacing utilities ---------- */
  .pb-120 {
    padding-bottom: 90px;
  }

  .pb-140 {
    padding-bottom: 110px;
  }
  .pt-140 {
    padding-top: 110px;
  }

  .pt-135 {
    padding-top: 105px;
  }

  .pb-150 {
    padding-bottom: 120px;
  }
  .pt-150 {
    padding-top: 120px;
  }
  .mt-34 {
    margin-top: 24px;
  }
  .mt-45 {
    margin-top: 32px;
  }

  .mt-163 {
    margin-top: 120px;
  }
  .pb-100 {
    padding-bottom: 65px;
  }
  .pt-80 {
    padding-top: 60px;
  }
  .ft_90 {
    font-size: 60px;
  }

  .pt-200 {
    padding-top: 140px;
  }

  .pt-120 {
    padding-top: 90px;
  }

  .text-reveal .color-animation h3 {
    font-size: 30px;
  }

  .glry-1 .lft {
    left: 60px;
  }

  .glry-1 .rgt {
    right: 50px;
  }

  .glry-2 {
    height: 600px;
  }

  .glry-2 .box {
    max-width: 700px;
  }

  .glry-2.float-img .img-box {
    padding: 60px;
  }

  .glry-2.float-img .img-box img:nth-child(1) {
    left: 120px;
    top: 110px;
  }

  .glry-2.float-img .img-box img:nth-child(2) {
    right: 300px;
    top: 30px;
  }

  .glry-2.float-img .img-box img:nth-child(3) {
    right: 50px;
    top: 70px;
  }

  .glry-2.float-img .img-box img:nth-child(4) {
    right: 150px;
    bottom: 100px;
  }

  .glry-2.float-img .img-box img:nth-child(5) {
    left: 50px;
    bottom: 120px;
  }

  .choose-us::after {
    display: none;
  }
  .trnsfrm-spce .box {
    max-width: 750px;
  }

  .trnsfrm-spce .box p {
    max-width: 680px;
  }

  footer .top-ft .inr .logo-box img {
    max-width: 150px;
  }
  .chat-icon {
    height: 50px;
    width: 50px;

    right: 30px;
    bottom: 15%;
  }
  .chat-icon img {
    height: 20px;
    width: 20px;
  }
  .pb-90 {
    padding-bottom: 70px;
  }

  .filter-ryt-side .filter-ryt-iner {
    grid-template-columns: 1fr 1fr;
  }

  .quality-right {
    margin-top: 30px;
  }

  .carpet-con {
    padding: 15px 0;
  }

  .spcfy-iner-wrp .spcfy-left::after {
    right: 8%;
  }

  .specfy-wrapper {
    padding: 40px;
  }

  .pb-110 {
    padding-bottom: 90px;
  }

  .q-mid-pera {
    padding: 20px 0;
  }

  form.req-form {
    max-width: 80%;
    margin: 30px auto 0;
  }

  .req-form input,
  .req-form textarea {
    padding: 18px;
  }
  .mke-flr-simple .card-boxe {
    grid-template-columns: repeat(3, 1fr);
  }

  .choose-us .lft img {
    height: 100%;
    max-height: 450px;
  }
  .text-reveal::after {
    left: 3%;
    height: 190px;
    width: 190px;
  }

  .pt-260 {
    padding-top: 220px;
  }

  .abt-glry .container-fluid {
    max-width: 95%;
    height: 500px !important;
  }

  .choose-wrp > .row > div:nth-child(1) {
    margin-top: 110px;
  }

  .make-wrapper .flr-form {
    max-width: 90%;
  }
  .abutcrd input,
  .abutcrd textarea,
  .abutcrd select {
    padding: 18px 16px;
  }
  .product-card-prnt {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }
  header .navbar {
    align-items: center;
  }
  .mke-flr-simple .baner-btn {
    margin-top: 45px;
  }
  .text-reveal .color-animation {
    max-width: 681px;
  }
  .abt-glry .rgt {
    max-width: 354px;
  }
  .about-flr h4 {
    font-size: 34px;
  }
  header.site-header:has([aria-expanded="true"]) {
    padding: 18px 0 40px;
  }
  .comm-flr .inner-comm {
    max-width: 950px;
    margin-inline: auto;
  }
  .lead-crpt h2 {
    max-width: 650px;
  }
  .hdr-srch {
    margin-top: 15px;
    justify-content: flex-start;
  }
  .prd-detsils-brdcm.pt-260 {
    padding-top: 170px;
  }
}

@media (max-width: 991px) {
  body {
    font-size: 16px;
  }
  :root {
    --size-23: 16px;
    --size-24: 17px;
    --size-25: 18px;
    --size-27: 20px;
    --size-35: 26px;
    --size-38: 27px;
    --size-42: 31px;
    --size-45: 32px;
    --size-62: 41px;
    --size-93: 58px;
    --size-137: 83px;
    --size-56: 42px;
    --size-30: 22px;
    --size-36: 26px;
    --size-32: 22px;
    --size-22: 18px;
    --size-28: 24px;

    --size-56: 42px;
    --size-70: 53px;
    --size-73: 55px;
  }

  .container-fluid {
    padding: 0 15px;
  }
  h1 {
    font-size: 48px;
  }

  h2 {
    font-size: 32px;
  }

  h3 {
    font-size: 27px;
  }

  h4 {
    font-size: 24px;
  }

  h5 {
    font-size: 20px;
  }

  h6 {
    font-size: 18px;
  }

  header {
    padding: 0;
  }

  header .navbar-brand {
    padding-right: 0;
  }

  header .navbar-toggler {
    border: 0;
    padding: 5px;
  }

  header .navbar-toggler:focus {
    box-shadow: none;
  }

  header .navbar-collapse {
    margin-top: 20px;
  }

  header .navbar .navbar-nav {
    gap: 5px;
  }

  header .nav-link {
    font-size: 14px;
    padding: 10px 0;
  }

  .hdr-srch {
    margin-top: 15px;
    justify-content: flex-start;
  }

  footer .top-ft {
    padding-top: 70px;
    padding-bottom: 60px;
  }

  footer .top-ft .inr {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 50px;
    row-gap: 50px;
  }

  footer .top-ft .inr .logo-box {
    max-width: 100%;
  }

  footer .top-ft .inr .link-box.cntct-info {
    max-width: 100%;
  }

  footer .top-ft .inr .link-box ul {
    margin-top: 15px;
  }

  footer .top-ft .inr .link-box .cnct {
    margin-top: 25px;
  }

  /* ---------- Spacing utilities ---------- */
  .pb-120 {
    padding-bottom: 80px;
  }

  .pb-140 {
    padding-bottom: 100px;
  }
  .pt-140 {
    padding-top: 100px;
  }

  .pt-135 {
    padding-top: 95px;
  }

  .pb-150 {
    padding-bottom: 110px;
  }
  .pt-150 {
    padding-top: 110px;
  }
  .mt-34 {
    margin-top: 22px;
  }
  .mt-45 {
    margin-top: 28px;
  }

  .mt-163 {
    margin-top: 100px;
  }

  .ft_90 {
    font-size: 50px;
  }

  .pt-200 {
    padding-top: 120px;
  }

  .pt-120 {
    padding-top: 80px;
  }
  .pb-100 {
    padding-bottom: 60px;
  }
  .pt-80 {
    padding-top: 55px;
  }
  .text-reveal .color-animation h3 {
    font-size: 28px;
  }

  .glry-1 .container-fluid {
    height: 550px;
    background-attachment: fixed;
  }

  .glry-1 .lft {
    left: 50px;
    top: 60px;
    max-width: 350px;
  }

  .glry-1 .rgt {
    right: 50px;
    bottom: 60px;
    max-width: 500px;
  }

  .glry-2 {
    height: 650px;

    background-attachment: scroll;
  }

  .glry-2 .box {
    width: 100%;
  }

  .glry-2 .baner-btn {
    margin-top: 60px;
  }

  .glry-2 .box .top {
    margin-bottom: 30px;
  }

  .glry-2 .btn-box {
    margin-top: 30px;
  }

  .glry-2.float-img .img-box {
    padding: 30px;
  }

  .glry-2.float-img .img-box img:nth-child(1) {
    left: 40px;
    top: 100px;
    width: 150px;
  }

  .glry-2.float-img .img-box img:nth-child(2) {
    right: 220px;
    top: 30px;
    width: 120px;
  }

  .glry-2.float-img .img-box img:nth-child(3) {
    right: 30px;
    top: 90px;
    width: 160px;
  }

  .glry-2.float-img .img-box img:nth-child(4) {
    right: 80px;
    bottom: 70px;
    width: 140px;
  }

  .glry-2.float-img .img-box img:nth-child(5) {
    left: 30px;
    bottom: 80px;
    width: 130px;
  }

  .choose-us {
    grid-template-columns: 1fr;
  }

  .choose-us .rgt .title {
    max-width: 100%;
  }

  .choose-us .rgt ul {
    margin-bottom: 35px;
    gap: 16px;
  }

  .choose-us::after {
    width: 150px;
    height: 320px;
  }

  .trnsfrm-spce .box h2 {
    margin-bottom: 40px;
  }

  .trnsfrm-spce .box p {
    max-width: 100%;
  }

  .trnsfrm-spce .baner-btn {
    margin-top: 30px;
  }

  .top-ft-sec .baner-btn {
    margin-top: -15px;
  }

  .filter-sec .filters-search input {
    max-width: 100%;
  }

  .filter-sec .filter-left-side {
    padding-right: 0;
    border: 0;
  }

  .filter-sec .filters-search i {
    right: 15px;
  }

  .filter-wrpp .row {
    row-gap: 25px;
  }

  .filter-ryt-side {
    padding-left: 0;
  }

  .pro-image img {
    width: 100%;
  }

  .pt-70 {
    padding-top: 50px;
  }

  .quality-bt-wrp {
    margin-bottom: 20px;
  }

  .quality-inner-img img {
    width: 70px;
    height: 70px;
  }

  .spcfy-iner-wrp {
    flex-direction: column;
    gap: 20px;
  }

  .spcfy-iner-wrp .spcfy-left::after {
    display: none;
  }

  form.req-form {
    max-width: 100%;
  }

  .req-sec::after {
    width: 400px;
    bottom: -12%;
  }

  .related-bxx-wrp .row {
    gap: 20px;
  }

  .spcfy-iner-wrp .spcfy-left,
  .spcfy-iner-wrp .spcfy-right {
    width: 100%;
    gap: 15px;
  }

  .rates h3 {
    font-size: 40px;
  }
  .reviwstar {
    margin: 20px 0px;
  }
  .revbtn {
    padding: 20px 30px;
  }
  .prsn img {
    width: 50px;
    height: 50px;
  }
  .review-crd {
    padding: 25px;
    gap: 10px;
  }
  .trans-inner h2 {
    font-size: 40px;
  }
  .srch input {
    padding: 13px 40px;
  }
  .flor-inst::before {
    content: "";
    height: 120%;
    top: -20px;
  }

  .frm-flr {
    margin-top: 20px;
  }
  .flor-inst {
    margin: 30px 0px;
    margin-right: unset;
  }

  .carpet-banner.main-page {
    padding-top: 140px;
  }
  .mke-flr-simple .card-boxe {
    grid-template-columns: repeat(2, 1fr);
  }

  .innerprivacy p {
    font-size: 20px;
  }
  .pricylink a {
    font-size: 20px;
  }

  .thankinner h1 {
    margin-top: 25px;
  }

  .in-cnt {
    padding: 30px;
    margin-bottom: 15px;
  }
  .about-flr h4 {
    font-size: 35px;
  }
  .about-flr {
    padding: 30px;
  }
  .thankinner p {
    margin-bottom: 20px;
  }
  .thanktick img {
    width: 120px;
    height: 120px;
  }
  .flooring-wrp .row,
  .choose-wrp .row {
    row-gap: 20px;
  }

  .pt-260 {
    padding-top: 200px;
  }

  .make-wrapper .flr-form {
    max-width: 100%;
  }

  .choose-wrp > .row > div:nth-child(1) {
    margin-top: 0;
    padding-right: 10px;
  }

  .choose-wrp > .row > div:nth-child(3) {
    padding-left: 10px;
  }

  .flooring-sec.req-sec::after {
    bottom: -5%;
  }

  .make-wrapper .abutcrd input,
  .make-wrapper .abutcrd textarea,
  .make-wrapper .abutcrd select {
    padding: 15px;
  }
  .find-form {
    grid-template-columns: 1fr;
  }

  .hom_baner.new_floor.about-banner {
    padding: 150px 0 70px;
  }

  .updatedate h6 {
    margin-bottom: 15px;
  }
  .prvpoint h5 {
    margin-bottom: 15px;
  }
  .pricylink h6 {
    font-size: 20px;
  }
  .prvpoint ul li {
    font-size: 20px;
  }
  .up-cont-flr,
  .content-wrpper p {
    max-width: 100%;
  }
  .consbtn {
    margin-top: 30px;
  }
  .appointment-card {
    padding: 30px;
  }
  .appointment-card li {
    margin-bottom: 15px;
  }
  .appointment-card li span:first-child {
    width: 70px;
  }
  .choose-mid {
    align-items: start;
    justify-content: center;
    text-align: start;
    margin: unset;
    margin-bottom: 20px;
  }
  .filter-sec .filter-left-side {
    display: flex;
    position: fixed;
    inset: 0;

    width: 100%;
    height: 100vh;
    min-height: unset;

    z-index: 9999;
    background: var(--white, #fff);
    padding: 24px 20px;

    opacity: 0;
    visibility: hidden;
    transform: translateX(100%);

    transition:
      transform 0.4s ease,
      opacity 0.3s ease,
      visibility 0.4s ease;

    pointer-events: none;
  }

  .filter-sec .filter-left-side.active {
    visibility: visible;
    opacity: 1;
    transform: translateX(0);

    pointer-events: auto;
  }

  .filter-sec .filter-left-side.show {
    opacity: 1;
    transform: translateX(0);
  }
  .filter-close {
    display: none;
  }

  .filter-sec .filter-left-side::before {
    content: "";
    position: fixed;
    inset: 0;
    /* background: rgba(30, 33, 36, 0.6); */
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    z-index: -1;
    opacity: 0;
    visibility: hidden;
    transition:
      opacity 0.4s ease,
      visibility 0.4s;
    pointer-events: none;
  }

  .filter-sec .filter-left-side.show::before {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .filter-close {
    display: block;
  }
  .filter-row-mobile {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin: 0 0 20px;
    padding: 14px 18px;
    border: 1px solid rgba(84, 43, 4, 0.18);
    border-radius: 70px;
    background: var(--yellowish);
    color: var(--dark);
    cursor: pointer;
    transition:
      background-color 0.3s ease,
      border-color 0.3s ease,
      transform 0.2s ease;
  }

  .filter-row-mobile span {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--dark);
    font-family: var(--satoshi-font);
    font-size: 16px;
    font-weight: 500;
    line-height: 1;
    text-transform: capitalize;
  }

  .filter-row-mobile svg {
    width: 16px;
    height: 12px;
    flex: 0 0 auto;
  }

  .filter-row-mobile:hover {
    background: var(--brown);
    border-color: var(--brown);
    color: var(--white);
  }

  .filter-row-mobile:hover span {
    color: var(--white);
  }

  .filter-row-mobile:hover svg path {
    fill: var(--white);
  }

  .filter-row-mobile:active {
    transform: scale(0.98);
  }

  .filter-close {
    display: none;
  }

  .filter-sec .filter-left-side.active .filter-close {
    display: block;
    position: absolute;
    top: 16px;
    right: 20px;
    font-size: 28px;
    line-height: 1;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 2;
  }
  .prd-detsils-brdcm.pt-260 {
    padding-top: 110px;
  }
  .prd-detsils-brdcm.pb-90 {
    padding-bottom: 50px;
  }
  .quality-tp-img img {
    height: 390px;
  }
}

@media (max-width: 767px) {
  :root {
    --size-23: 15px;
    --size-24: 16px;
    --size-25: 17px;
    --size-27: 19px;
    --size-35: 24px;
    --size-38: 26px;
    --size-42: 28px;
    --size-45: 30px;
    --size-62: 37px;
    --size-93: 51px;
    --size-137: 75px;
    --size-56: 38px;
    --size-70: 42px;
    --size-73: 47px;
  }

  h1 {
    font-size: 38px;
  }

  h2 {
    font-size: 27px;
  }

  h3 {
    font-size: 24px;
  }

  h4 {
    font-size: 22px;
  }

  h5 {
    font-size: 16px;
  }

  h6 {
    font-size: 14px;
  }
  header .navbar-brand img {
    max-width: 170px;
  }

  .hom_baner .baner-btn {
    flex-wrap: wrap;
  }

  .cta {
    padding: 12px 20px;
  }

  footer .top-ft {
    padding-top: 60px;
    padding-bottom: 50px;
  }

  footer .top-ft .inr {
    grid-template-columns: 1fr 1fr;
    column-gap: 30px;
    row-gap: 40px;
  }

  footer .top-ft .inr .logo-box {
    grid-column: 1 / -1;
    max-width: 500px;
  }

  footer .top-ft .inr .link-box.cntct-info {
    grid-column: 1 / -1;
  }

  footer .top-ft .inr .link-box.cntct-info li {
    align-items: flex-start;
  }

  footer .top-ft .inr .link-box .cnct {
    margin-top: 25px;
  }

  .logo-wrap-hdr {
    grid-column: 1;
    justify-self: start;
  }

  .empty-col.log-col {
    display: none;
  }
  .logo-row {
    flex-direction: column;
  }
  .logo-row.row-btm,
  .logo-row.row-top {
    display: none;
  }
  .row-mid .log-col::after,
  .row-btm .log-col::after {
    display: none;
  }

  /* ---------- Spacing utilities ---------- */
  .pb-120 {
    padding-bottom: 70px;
  }

  .pb-140 {
    padding-bottom: 90px;
  }
  .pt-140 {
    padding-top: 90px;
  }

  .pt-135 {
    padding-top: 85px;
  }

  .pb-150 {
    padding-bottom: 90px;
  }
  .pt-150 {
    padding-top: 90px;
  }
  .mt-34 {
    margin-top: 20px;
  }

  .mt-45 {
    margin-top: 26px;
  }
  .mt-163 {
    margin-top: 80px;
  }

  .ft_90 {
    font-size: 42px;
  }
  .pb-100 {
    padding-bottom: 55px;
  }
  .pt-80 {
    padding-top: 40px;
  }

  .pt-200 {
    padding-top: 100px;
  }

  .pt-120 {
    padding-top: 70px;
  }

  .text-reveal .color-animation h3 {
    font-size: 22px;
  }

  .btn-box {
    flex-wrap: wrap;
    justify-content: center;
    max-width: 400px;
    margin-inline: auto;
  }
  .glry-1 .container-fluid {
    height: 600px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 50px 25px;
  }

  .glry-1 .lft {
    position: relative;
    left: auto;
    top: auto;
    max-width: 100%;
    text-align: center;
  }

  .glry-1 .rgt {
    position: relative;
    right: auto;
    bottom: auto;
    max-width: 100%;
    text-align: center;
  }

  .glry-1 .container-fluid {
    height: 450px;
    padding: 40px 20px;
  }

  .glry-2 {
    height: 600px;
    padding: 80px 25px;
  }

  .glry-2 .box {
    max-width: 100%;
  }

  .glry-2 .baner-btn {
    margin-top: 45px;
  }

  .glry-2 .box .top {
    margin-bottom: 25px;
  }

  .glry-2 .btn-box {
    margin-top: 25px;
  }

  .glry-2.float-img {
    overflow: hidden;
  }

  .glry-2.float-img .img-box {
    padding: 0;
  }

  .glry-2.float-img .img-box img:nth-child(1) {
    left: 15px;
    top: 70px;
    width: 110px;
  }

  .glry-2.float-img .img-box img:nth-child(2) {
    right: 80px;
    top: 25px;
    width: 90px;
  }

  .glry-2.float-img .img-box img:nth-child(3) {
    right: 20px;
    top: 100px;
    width: 120px;
  }

  .glry-2.float-img .img-box img:nth-child(4) {
    right: 20px;
    bottom: 55px;
    width: 105px;
  }

  .glry-2.float-img .img-box img:nth-child(5) {
    left: 10px;
    bottom: 60px;
    width: 100px;
  }

  .choose-us .rgt ul {
    margin-top: 16px;
    margin-bottom: 30px;
    gap: 15px;
  }

  .choose-us .rgt ul li {
    padding-left: 38px;
  }

  .choose-us .rgt ul li::before {
    top: 4px;
  }

  .trnsfrm-spce .box {
    max-width: 100%;
    padding: 0 25px;
  }

  .trnsfrm-spce .box h2 {
    margin-bottom: 35px;
  }

  .trnsfrm-spce .box h2::after {
    width: 130px;
    bottom: -15px;
  }

  .trnsfrm-spce .box p {
    max-width: 100%;
  }

  .trnsfrm-spce .baner-btn {
    margin-top: 25px;
  }

  .top-ft-sec .box {
    max-width: 100%;
  }

  .top-ft-sec .baner-btn {
    margin-top: 0;
  }

  footer .top-ft .inr .logo-box img {
    max-width: 120px;
  }

  .zip-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .panel-title {
    font-size: 24px;
  }
  .simpl-way h4 {
    font-size: 25px;
  }
  .review-crd {
    grid-template-columns: 1fr;
  }
  .srchreview {
    flex-direction: column;
    gap: 20px;
  }
  .paginationmain a {
    width: 40px;
    height: 40px;
  }
  .paginationmain {
    margin-top: 30px;
  }
  .trans-inner h2 {
    font-size: 30px;
  }
  .trans-inner h2::after {
    left: 39%;
  }
  .reviewmain {
    margin-top: 25px;
  }
  .srchreview {
    margin-top: 25px;
  }

  .frm-flr {
    padding: 20px;
  }

  .Residental_baner {
    padding-bottom: 70px;
  }
  .innerflr2 {
    margin-top: 30px;
  }
  .innerfrm {
    flex-direction: column;
  }

  .quality-tp-img img {
    height: 350px !important;
  }
  .innerprivacy p {
    font-size: 16px;
  }
  .pricylink a {
    font-size: 16px;
  }
  .cooki h4 {
    margin-bottom: 20px;
    font-size: 26px;
  }
  .cooki {
    margin-top: 25px;
  }
  .margred {
    margin-bottom: unset;
  }
  .apptext p {
    font-size: 16px;
  }
  .abutcrd input,
  .abutcrd textarea,
  .abutcrd select {
    padding: 15px;
  }
  .aboutbtn {
    margin-top: 30px;
  }

  .cnt-head h5 {
    margin-bottom: 25px;
  }
  .in-cnt h4 {
    margin: 15px 0px;
  }
  .abutcrd input::placeholder,
  .abutcrd textarea::placeholder,
  .abutcrd select {
    font-size: 14px;
  }
  .abutcrd input,
  .abutcrd textarea {
    font-size: 14px;
  }
  .abutcrd {
    margin-bottom: 10px;
  }
  .direct {
    top: 44%;
  }
  .direct img {
    width: 40px;
  }

  .product-card-prnt {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .pricylink h6 {
    font-size: 16px;
  }
  .prvpoint ul li {
    font-size: 16px;
  }
  .slide-sec .container-fluid {
    padding-right: 20px;
  }
  .mke-flr-simple .baner-btn {
    margin-top: 30px;
  }
  .visitbtnss {
    flex-direction: column;
    align-items: start;
  }
  .dateinput input {
    padding: 15px 50px;
  }
  .cityslc {
    margin-bottom: unset;
  }
  .appointment-card {
    margin-bottom: 15px;
  }
  .appointment-card li {
    font-size: 16px;
  }
  .otp-login-container input#email_input,
  .otp-login-container input#otp_input {
    padding: 15px 17px;
  }

  .srch-panel {
    width: 92%;
    max-height: 85vh;
    padding: 40px 24px 30px;
    border-radius: 18px;
  }
  .srch-input {
    font-size: var(--size-22);
  }
  .srch-results li {
    font-size: 15px;
  }
  .prd-detsils-brdcm.pt-260 {
    padding-top: 100px;
  }

  .quality-sec .wpgs-nav img {
    height: 100px !important;
  }

  .quality-sec .wpgs-nav .slick-prev,
  .quality-sec .wpgs-nav .slick-next {
    display: none !important;
  } /* Show dots */
  .quality-sec .wpgs-nav .slick-dots {
    display: block !important;
  }
}

@media (max-width: 575px) {
  :root {
    --size-18: 14px;

    --size-23: 16px;

    --size-25: 16px;
    --size-27: 17px;

    --size-22: 18px;
    --size-24: 18px;
    --size-28: 20px;
    --size-30: 22px;
    --size-32: 21px;
    --size-35: 22px;
    --size-36: 23px;
    --size-38: 24px;
    --size-42: 26px;
    --size-45: 28px;
    --size-62: 32px;
    --size-93: 44px;
    --size-137: 61px;
    --size-56: 33px;
    --size-70: 35px;
    --size-73: 39px;
  }
  :root {
  }
  body {
    font-size: 16px;
  }

  h1 {
    font-size: 32px;
  }

  h2 {
    font-size: 26px;
  }

  h3 {
    font-size: 24px;
  }

  h4 {
    font-size: 22px;
  }

  h5 {
    font-size: 20px;
  }

  h6 {
    font-size: 18px;
  }

  .container-fluid {
    padding: 0 20px;
  }

  header.active {
    background-color: var(--brown);
    padding: 0;
  }

  header {
    padding: 0;
  }

  header .navbar-brand img {
    max-width: 63px;
  }

  header .navbar-collapse {
    margin-top: 15px;
  }

  header .nav-link {
    font-size: 13px;
  }

  .hdr-srch {
    flex-wrap: wrap;
    gap: 12px !important;
  }

  .hdr-btn a {
    padding: 10px 16px;
    font-size: 11px;
  }

  /* ---------- Footer ---------- */

  footer .top-ft {
    padding-top: 50px;
    padding-bottom: 40px;
  }

  footer .top-ft .inr {
    display: flex;
    flex-direction: column;
    gap: 35px;
  }

  footer .top-ft .inr .logo-box,
  footer .top-ft .inr .link-box,
  footer .top-ft .inr .link-box.cntct-info {
    width: 100%;
    max-width: 100%;
  }

  footer .top-ft .inr .logo-box p {
    margin-top: 18px;
  }

  footer .top-ft .inr .link-box ul {
    margin-top: 14px;
    gap: 10px;
  }

  footer .top-ft .inr .link-box .cnct {
    margin-top: 25px;
  }

  footer .top-ft .inr .link-box.cntct-info li {
    gap: 10px;
    word-break: break-word;
  }

  footer .top-ft .inr .link-box.cntct-info li a {
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  footer .top-ft .inr .link-box .cnct .cntc-icons a {
    width: 36px;
    height: 36px;
  }

  .logo-wrap-hdr {
    grid-column: 2;
    justify-self: center;
  }
  .log-col {
    padding: 15px 14px;
  }

  /* ---------- Spacing utilities ---------- */
  .pb-120 {
    padding-bottom: 60px;
  }

  .pb-140 {
    padding-bottom: 70px;
  }
  .pt-140 {
    padding-top: 70px;
  }

  .pt-135 {
    padding-top: 65px;
  }

  .pb-150 {
    padding-bottom: 70px;
  }
  .pt-150 {
    padding-top: 70px;
  }
  .mt-34 {
    margin-top: 18px;
  }

  .mt-45 {
    margin-top: 24px;
  }
  .mt-163 {
    margin-top: 60px;
  }

  .ft_90 {
    font-size: 36px;
  }

  .pt-200 {
    padding-top: 80px;
  }

  .pt-120 {
    padding-top: 60px;
  }
  .pb-100 {
    padding-bottom: 45px;
  }
  .pt-80 {
    padding-top: 35px;
  }

  .text-reveal .color-animation h3 {
    font-size: 21px;
  }

  .glry-2 {
    height: auto;
    padding: 60px 20px;
  }

  .glry-2 .baner-btn {
    margin-top: 35px;
  }

  .glry-2.float-img .img-box img:nth-child(1) {
    left: 5px;
    top: 65px;
    width: 90px;
  }

  .glry-2.float-img .img-box img:nth-child(2) {
    right: 135px;
    top: 20px;
    width: 75px;
  }

  .glry-2.float-img .img-box img:nth-child(3) {
    right: 8px;
    top: 85px;
    width: 100px;
  }

  .glry-2.float-img .img-box img:nth-child(4) {
    right: 10px;
    bottom: 45px;
    width: 90px;
  }

  .glry-2.float-img .img-box img:nth-child(5) {
    left: 5px;
    bottom: 45px;
    width: 85px;
  }

  .choose-us .rgt ul {
    gap: 12px;
    margin-bottom: 25px;
  }

  .choose-us .rgt ul li {
    padding-left: 35px;
  }

  .choose-us .rgt ul li::before {
    top: 3px;
  }

  .choose-us::after {
    width: 120px;
    height: 220px;
    opacity: 0.5;
  }

  .trnsfrm-spce .box {
    padding: 0 20px;
  }

  .trnsfrm-spce .box h2 {
    margin-bottom: 30px;
  }

  .trnsfrm-spce .box h2::after {
    width: 110px;
    bottom: -13px;
  }

  .trnsfrm-spce .baner-btn {
    margin-top: 20px;
  }

  .top-ft-sec .baner-btn {
    margin-top: 5px;
  }

  .flooring-card .flooring-card__label {
    padding-inline: 15px;
  }
  .text-reveal::after {
    display: none;
  }
  .chat-icon {
    height: 50px;
    width: 50px;

    right: 10px;
    bottom: 15%;
  }
  footer .back-top {
    right: 10px;
    bottom: 8%;
  }

  .carpet-banner .breadcrumb {
    margin: 0;
  }

  .pb-90 {
    padding-bottom: 60px;
  }

  .pt-90 {
    padding-top: 60px;
  }

  .filter-sec .filter-body {
    padding: 0 0 15px 8px;
  }

  .filter-sec .filter-group summary {
    padding: 16px 0;
    font-size: 15px;
  }

  .filter-sec .filter-group summary::after {
    font-size: 22px;
    margin-right: 0;
  }

  .results-count,
  .sort-wrapper {
    font-size: 14px;
  }

  .filter-ryt-side .filter-ryt-iner {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .size-20 {
    font-size: 18px;
  }

  .quality-inner-img img {
    width: 50px;
    height: 50px;
  }

  .quality-btn-side {
    padding: 20px 0;
    flex-direction: column;
  }

  .quality-btn-side a {
    padding: 14px 23px;
    width: 100%;
    justify-content: center;
  }

  .dwm-achore a {
    margin-top: 15px;
  }

  .dwm-achore {
    display: flex;
    justify-content: center;
  }

  .specfy-wrapper {
    padding: 30px 20px;
  }

  .req-form .req-row {
    gap: 0;
    flex-direction: column;
  }

  .req-form input,
  .req-form textarea {
    font-size: 14px;
    padding: 14px;
    margin-bottom: 15px;
  }

  .p-100 {
    padding: 60px 0;
  }

  .spcf-item p,
  .spcf-item span {
    width: 100%;
  }

  .spcf-item {
    flex-direction: column;
  }

  .pb-110 {
    padding-bottom: 60px;
  }

  .simpl-way p {
    margin-bottom: 20px;
  }
  .browpro {
    margin-bottom: 20px;
  }
  .flooring-options {
    flex-direction: column;
    align-items: unset;
  }
  .floor-radio {
    margin-bottom: 8px;
  }
  .flooring-options:first-of-type {
    margin: unset;
  }
  .trans-inner h2::after {
    left: 32%;
  }
  .review-crd {
    padding: 15px;
    margin-bottom: 20px;
  }
  .rates h3 {
    font-size: 32px;
  }

  .innerfrm input,
  .innerfrm select,
  .innerfrm textarea {
    padding: 15px;
  }

  .comm-text p {
    margin-top: 15px;
  }

  .mke-flr-simple .card-boxe {
    grid-template-columns: repeat(1, 1fr);
  }

  .carpet-banner.main-page {
    padding-top: 125px;
  }
  .quality-tp-img img {
    height: 258px !important;
  }
  .thnkscta {
    padding: 15px 39px;
  }
  .choose-us .rgt {
    padding: 30px;
  }

  .about-flr {
    padding: 15px;
  }
  .about-flr h4 {
    margin-bottom: 25px;
  }
  .about-flr h4 {
    font-size: 30px;
  }
  .logcont img {
    width: 70px;
    height: 70px;
  }
  .abutcrd textarea {
    min-height: 100px;
  }
  .direct img {
    width: 25px;
  }

  .thankinner p {
    margin-top: 20px;
  }

  .pt-260 {
    padding-top: 180px;
  }

  .flooring-sec.req-sec::after {
    bottom: -9%;
  }

  .chose-arrow {
    width: 40px;
    height: 40px;
  }

  .licensed-sec.flooring-sec.req-sec::after {
    bottom: -7%;
  }

  .choose-bxx {
    padding: 10px;
  }

  .make-wrapper .abutcrd input,
  .make-wrapper .abutcrd textarea,
  .make-wrapper .abutcrd select {
    font-size: 14px;
  }

  .make-wrapper .flooring-options .floor-radio {
    width: 100%;
    font-size: 16px;
  }

  .make-wrapper .captcha-box,
  .make-wrapper .sbt.oppsub {
    justify-content: left;
    margin-bottom: 0;
  }

  .make-sec.req-sec::after {
    height: 150px;
  }

  .find-wrapper {
    padding: 20px !important;
  }
  .find-form button {
    padding: 14px 40px;
  }

  .find-input input,
  .find-input select {
    padding: 14px;
    font-size: 14px;
  }

  .hom_baner.new_floor.about-banner {
    padding: 130px 0 40px;
  }
  .glry-1 .container-fluid {
    height: auto;
    padding: 60px 20px;
  }
  .glry-1 .rgt h5 {
    margin-top: 40px;
  }
  .product-card-prnt .product-card.flex-col {
    width: 100%;
  }

  .apnt-form .cntct-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .avloption {
    grid-template-columns: 1fr;
  }
  .vstbtn {
    margin-bottom: unset;
  }
  .schdbtn {
    flex-direction: column;
  }
  .appointment-card {
    padding: 18px;
  }
  .flooring-slider .slick-slide {
    padding: 0 15px;
  }
  .startviews p {
    font-size: 14px;
  }
  .prd-detsils-brdcm.pt-260 {
    padding-top: 80px;
  }
  .carpet-banner h2 {
    text-align: center;
  }
  .results-header {
    flex-wrap: wrap;
    gap: 19px;
  }
	.sort-wrapper select.orderby {
    padding: 9px;
    font-size: 14px;
   
}
}