/** Shopify CDN: Minification failed

Line 3229:17 Unexpected "*"
Line 3716:0 Expected "}" to go with "{"

**/
.dt-border-line { float: left; width: 100%; border: 2px solid #000; }

.user-account {
  background-color: var(--DTform_BG);
  padding: 30px;
  border-radius: var(--DTRadius);
  max-width: 600px;
  margin: auto;
  display: flex;
}

.user-account .grid__item { float: left; width: 100%; position: relative; }

.user-account form { float: left; position: relative; width: 100%; }

.label--hidden { display: none; }

.user-account form label {
  margin-bottom: 5px;
  width: 100%;
  float: left;
}

.user-account form input {
  margin-bottom: var(--DTGutter_Width);
    }

.user-account form input.btn, .user-account form p:last-child { margin: 0; }

.user-account .link-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 20px 0 0;
  border-top: 2px solid var(--DTColor_Border);
  padding: 20px 0 0;
}

.user-account .link-wrapper p { margin: 0; line-height: normal; }

.user-account .section-header { margin-bottom: var(--DTGutter_Width); }

.user-account .section-header__title { margin-top: 0; }

.user-account .password-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/****<---- Other Pages Sections ---->****/

/****<---- Overlay Sections ---->****/

/*.dt-sc-overlay-section .dt-sc-overlay-style { min-height: 500px; }

.dt-sc-overlay-section .dt-sc-overlay-style {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-clip: border-box;
  padding: 0;
  gap: 0;
  overflow: hidden;
  align-self: stretch;
}

.dt-sc-overlay-section .dt-sc-overlay-style .dt-sc-overlay-image {
  width: 100%;
  height: 100%;
  position: absolute;
}

.dt-sc-overlay-section .dt-sc-overlay-style .dt-sc-overlay-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: var(--DTBaseTransition);
}

.dt-sc-overlay-section .dt-sc-overlay-style:hover .dt-sc-overlay-image img {
    transform: scale(1.1, 1.1);
    -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    -o-transform: scale(1.1, 1.1);
}

.dt-sc-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content {
    display: flex;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  	text-align: center;
    z-index: 1;
    height: 100%;
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    transition: var(--DTBaseTransition);
    opacity: 0;
}

.dt-sc-overlay-section .dt-sc-overlay-style:hover .dt-sc-overlay-content { opacity: 1; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); }

.dt-sc-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: var(--DTBaseTransition);
  position: absolute;
  background: #000000;
  z-index: -1;  
}

.dt-sc-overlay-section .dt-sc-overlay-style:hover .dt-sc-overlay-content:before { opacity: 0.8; }

.dt-sc-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content .dt-sc-overlay-inner { padding: 30px; }

.dt-sc-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content *:not(:last-child) { margin: 0 0 10px 0; }

.dt-sc-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content .dt-sc-main-title {
    padding-bottom: 20px;
    position: relative;
    text-transform: inherit;
    margin-bottom: 20px;    
}

.dt-sc-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content .dt-sc-main-title:after {
    position: absolute;
    height: 2px;
    width: 40px;
    background: var(--DTTertiaryColor);
    content: "";
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 0;
}*/

/****<---- Masonry Overlay Sections ---->****/

/*.dt-sc-masonry-section.dt-sc-masonry-overlay {
    display: flex;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: inherit;
    flex-flow: inherit;
    gap: var(--DTGutter_Width);
    min-height: 800px;
}

.dt-sc-masonry-section.dt-sc-masonry-overlay > * {
    width: 50%;
}

.dt-sc-masonry-section.dt-sc-masonry-overlay .dt-sc-additional-grids {
    display: grid;
    gap: var(--DTGutter_Width);
}

.dt-sc-masonry-section .dt-sc-masonry-overlay-style {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-clip: border-box;
  padding: 0;
  gap: 0;
  overflow: hidden;
  align-self: stretch;
  height: 100%;
}

.dt-sc-masonry-section .dt-sc-masonry-overlay-style .dt-sc-masonry-overlay-image {
  width: 100%;
  height: 100%;
  position: absolute;
}

.dt-sc-masonry-section .dt-sc-masonry-overlay-style .dt-sc-masonry-overlay-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: var(--DTBaseTransition);
}

.dt-sc-masonry-section .dt-sc-masonry-overlay-style:hover .dt-sc-masonry-overlay-image img {
    transform: scale(1.1, 1.1);
    -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    -o-transform: scale(1.1, 1.1);
}

.dt-sc-masonry-section .dt-sc-masonry-overlay-style .dt-sc-masonry-overlay-content {
    display: flex;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    z-index: 1;
    height: 100%;
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    transition: var(--DTBaseTransition);
    opacity: 0;
}

.dt-sc-masonry-section .dt-sc-masonry-overlay-style:hover .dt-sc-masonry-overlay-content { opacity: 1; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); }

.dt-sc-masonry-section .dt-sc-masonry-overlay-style .dt-sc-masonry-overlay-content:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: var(--DTBaseTransition);
  position: absolute;
  background: #000000;
  z-index: -1;  
}

.dt-sc-masonry-section .dt-sc-masonry-overlay-style:hover .dt-sc-masonry-overlay-content:before { opacity: 0.8; }

.dt-sc-masonry-section .dt-sc-masonry-overlay-style .dt-sc-masonry-overlay-content .dt-sc-masonry-overlay-inner { padding: 30px; }

.dt-sc-masonry-section .dt-sc-masonry-overlay-style .dt-sc-masonry-overlay-content *:not(:last-child) { margin: 0 0 10px 0; }

.dt-sc-masonry-section .dt-sc-masonry-overlay-style .dt-sc-masonry-overlay-content * { color: #fff; }

.dt-sc-masonry-section .dt-sc-masonry-overlay-style .dt-sc-masonry-overlay-content .dt-sc-main-title {
    padding-bottom: 20px;
    position: relative;
    text-transform: inherit;
    margin-bottom: 20px;    
}

.dt-sc-masonry-section .dt-sc-masonry-overlay-style .dt-sc-masonry-overlay-content .dt-sc-main-title:after {
    position: absolute;
    height: 2px;
    width: 40px;
    background: var(--DTTertiaryColor);
    content: "";
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: 0;
}*/

/****<---- Partial Overlay Sections ---->****/

/*.dt-sc-partial-overlay-section .dt-sc-overlay-style { min-height: 500px; }

.dt-sc-partial-overlay-section .dt-sc-overlay-style {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-clip: border-box;
  padding: 0;
  gap: 0;
  overflow: hidden;
  align-self: stretch;
  align-items: flex-start;
}

.dt-sc-partial-overlay-section .dt-sc-overlay-style.content-right { align-items: flex-end;}

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-image {
  width: 100%;
  height: 100%;
  position: absolute;
}

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: var(--DTBaseTransition);
}

.dt-sc-partial-overlay-section .dt-sc-overlay-style:hover .dt-sc-overlay-image img {
    transform: scale(1.1, 1.1);
    -webkit-transform: scale(1.1, 1.1);
    -moz-transform: scale(1.1, 1.1);
    -ms-transform: scale(1.1, 1.1);
    -o-transform: scale(1.1, 1.1);
}

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content {
    display: flex;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 1;
    width: 50%;
    height: 100%;
    margin: 10px;
    position: relative;
    transition: var(--DTBaseTransition);
}

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0.8;
  transition: var(--DTBaseTransition);
  position: absolute;
  background: var(--DTPrimaryColor);
  z-index: -1;  
}

.dt-sc-partial-overlay-section .dt-sc-overlay-style:hover .dt-sc-overlay-content:before { opacity: 1; }

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content .dt-sc-overlay-inner { padding: 30px; }

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content *:not(:last-child) { margin: 0 0 10px 0; }

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content * { color: #fff; }

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content .dt-sc-main-title {
    position: relative;
    text-transform: inherit;
    margin-bottom: 15px;    
}

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content .dt-sc-description { margin: 0 0 40px; }

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content .content-icon {
    display: flex;
    align-items: center;
    position: relative;
    justify-content: center;
    font-size: 30px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    width: 60px;
    background: #fff;
    margin-bottom: 40px;
}

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content .content-icon i {
    color: var(--DTPrimaryColor);
}

.dt-sc-partial-overlay-section .dt-sc-overlay-style .dt-sc-overlay-content .price {
  float: right;
  padding: 5px 15px;
  text-align: right;
  background-color: #000000;
  color: #ffffff;
}*/

/****<---- List Image Sections ---->****/

/*.dt-sc-list-with-image-section { align-items: center; }

.dt-sc-list-with-image-section .dt-sc-list-with-image-wrapper {
    display: flex;
    flex-wrap: wrap;    
    align-items: center;   
    width: 100%;    
    position: relative;
}

.dt-sc-list-with-image-section .dt-sc-list-with-image-wrapper .dt-sc-list-with-image-list {
    padding: 10px 15px;
}

.dt-sc-list-with-image-section .dt-sc-list-with-image-wrapper .dt-sc-list-with-image-list li {  	   
    padding-left: 30px;
    position: relative;
    text-transform: uppercase;
}

.dt-sc-list-with-image-section .dt-sc-list-with-image-wrapper .dt-sc-list-with-image-list li:not(:last-child) { margin-bottom: 20px; }

.dt-sc-list-with-image-section .dt-sc-list-with-image-wrapper .dt-sc-list-with-image-list li:after {
  content: "\f192";
  font-family: "FontAwesome";
  font-weight: bold;
  left: 0;
  top: 50%;    
  position: absolute;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  color: var(--DTPrimaryColor);
}*/

/****<---- Image Sections ---->****/

/*.dt-sc-image-section .dt-sc-image-section-wrapper {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: 0;
    align-self: normal;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    min-width: 0;
    word-wrap: break-word;
    background-clip: border-box;
    padding: 0;
    gap: 0;
    overflow: hidden;
}

.dt-sc-image-section .dt-sc-image-section-wrapper:not(:last-child) { margin: 0 0 70px 0; }

.dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image {    
    height: 100%;
    float: left;
    position: relative;
    padding: 30px 0 0 30px;
}

.dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image:before {
    background: #e18c44;
}

.dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image:before, .dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image:after {
  content: "";
  position: absolute;
  margin: auto;
  left: 0;
  right: 30px;
  top: 0;
  bottom: 30px;
  z-index: -1;
  transition: var(--DTBaseTransition);
}

.dt-sc-image-section .dt-sc-image-section-wrapper:hover .dt-sc-image:after {
    opacity: 1;
    visibility: visible;
}

.dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image:after {
    background-image: url(//cdn.shopify.com/s/files/1/0461/8947/8037/files/pattern-leaf.png?v=1597814809);
}

.dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image:after {    
    background-repeat: repeat;
    background-size: auto;
    width: 100%;
    opacity: 0;
    visibility: hidden;    
}

.dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image, .dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image-section-content { width: 50%; }

.dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image-section-content {
    display: flex;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;    
    padding: 0 0 0 50px;  
}

.dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image-section-content .content-icon {
    font-size: 42px;
    color: #e18c44;
    margin-bottom: 15px;
    display: inline-block;
}


.dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image-section-content .dt-sc-main-title {
    position: relative;
    text-transform: inherit;
    margin: 0 0 20px;
}

.dt-sc-image-section .dt-sc-image-section-wrapper .dt-sc-image-section-content *:last-child { margin: 0; }
  
.dt-sc-image-section .dt-sc-image-section-wrapper.dt-sc-reverse-columns { flex-direction: row-reverse; }

.dt-sc-image-section .dt-sc-image-section-wrapper.dt-sc-reverse-columns .dt-sc-image-section-content { align-items: flex-end; text-align: right; padding: 0 50px 0 0; }

.dt-sc-image-section .dt-sc-image-section-wrapper.dt-sc-reverse-columns .dt-sc-image { padding: 30px 30px 0 0; }

.dt-sc-image-section .dt-sc-image-section-wrapper.dt-sc-reverse-columns .dt-sc-image:before,
.dt-sc-image-section .dt-sc-image-section-wrapper.alter .dt-sc-image:after { left: 30px; right: 0; }*/

/****<---- Image With Icons Sections ---->****/

/*.dt-sc-image-with-icons-section {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    grid-gap: 0;
    align-self: normal;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    min-width: 0;
    word-wrap: break-word;
    background-clip: border-box;
    padding: 0;
    gap: 0;
    overflow: hidden;
}

.dt-sc-image-with-icons-section .dt-sc-icon-blocks-section { margin: 30px 0 0 0; }

.dt-sc-image-with-icons-section .dt-sc-icon-blocks-section .dt-sc-icon-block {
  display: flex;
  flex-wrap: wrap;
  height: 100%;
  align-content: center;
  align-items: center;
}

.dt-sc-image-with-icons-section .dt-sc-icon-blocks-section .dt-sc-icon-block .dt-sc-icon-image {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 60px;
    background-color: var(--DTTertiaryColor);
    transition: var(--DTBaseTransition);
}

.dt-sc-image-with-icons-section .dt-sc-icon-blocks-section .dt-sc-icon-block:hover .dt-sc-icon-image { background-color: var(--DTPrimaryColor); color: #ffffff; }
  
.dt-sc-image-with-icons-section .dt-sc-icon-blocks-section .dt-sc-icon-block .dt-sc-icon-image img,
.dt-sc-image-with-icons-section .dt-sc-icon-blocks-section .dt-sc-icon-block .dt-sc-icon-image i {
    font-size: 30px;
}

.dt-sc-image-with-icons-section .dt-sc-icon-blocks-section .dt-sc-icon-block .dt-sc-icon-content {
    width: calc(100% - 60px);
    padding-left: 20px;
    padding-right: 0;
}

.dt-sc-image-with-icons-section .dt-sc-icon-blocks-section .dt-sc-icon-block .dt-sc-icon-content .dt-sc-main-title { padding: 0; margin: 0; font-weight: 600; }*/

/****<---- Image With Icons Sections Type 2 ---->****/

/*.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
  position: relative;
}

.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content {
  display: flex;
  flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: flex-start;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content .dt-sc-main-title {
    position: relative;
    text-transform: inherit;
    margin: 0 0 20px;
}

.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content .dt-sc-sub-title {
    position: relative;
    text-transform: inherit;
    margin: 0 0 20px;
  	line-height: 1.8;
}

.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content .dt-sc-icon-blocks-section { margin: 20px 0 0 0; }

.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content .dt-sc-icon-blocks-section .dt-sc-icon-block {
  display: flex;
  flex-wrap: wrap;
  height: 100%;
  align-content: center;
  align-items: center;
}

.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content .dt-sc-icon-blocks-section .dt-sc-icon-block:not(:last-child) { margin-bottom: 30px; }

.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content .dt-sc-icon-blocks-section .dt-sc-icon-block .dt-sc-icon-image {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 60px;
    background-color: var(--DTTertiaryColor);
    transition: var(--DTBaseTransition);
}

.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content .dt-sc-icon-blocks-section .dt-sc-icon-block:hover .dt-sc-icon-image { background-color: var(--DTPrimaryColor); color: #ffffff; }
  
.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content .dt-sc-icon-blocks-section .dt-sc-icon-block .dt-sc-icon-image img,
.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content .dt-sc-icon-blocks-section .dt-sc-icon-block .dt-sc-icon-image i {
    font-size: 30px;
}

.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content .dt-sc-icon-blocks-section .dt-sc-icon-block .dt-sc-icon-content {
  width: calc(100% - 60px);
  padding-left: 20px;
  padding-right: 0;
  display: flex;
  flex-wrap: wrap;
}

.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image-section-content .dt-sc-icon-blocks-section .dt-sc-icon-block
.dt-sc-icon-content .dt-sc-main-title { padding: 0; margin: 0 0 10px; font-size: 20px; }


.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image { height: 100%; float: left; position: relative; }

.dt-sc-image-with-icons-section-type2 .dt-sc-image-with-icon-wrapper .dt-sc-image img {
  	width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}*/

/****<---- Icon Blocks Sections ---->****/

/*.dt-sc-icon-section .dt-sc-icon {
  display: flex;
  flex-wrap: wrap;
  height: 100%;
  align-content: center;
  align-items: center;
  justify-content: center;
}

.dt-sc-icon-section .dt-sc-icon .dt-sc-icon-image {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 170px;
    height: 170px;    
    transition: var(--DTBaseTransition);
    position: relative;
    margin: 0 0 30px;
}

.dt-sc-icon-section .dt-sc-icon .dt-sc-icon-image:before {
    opacity: 0;
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -webkit-animation: blobbing-reverse 25s ease-in-out infinite both alternate;
    animation: blobbing-reverse 25s ease-in-out infinite both alternate;
}

.dt-sc-icon-section .dt-sc-icon .dt-sc-icon-image:before, .dt-sc-icon-section .dt-sc-icon .dt-sc-icon-image:after {
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: -1;
    transition: var(--DTBaseTransition);
}

.dt-sc-icon-section .dt-sc-icon .dt-sc-icon-image:after {
    background: #fbfbfb;
}

.dt-sc-icon-section .dt-sc-icon .dt-sc-icon-image:after {
    opacity: 1;
    -webkit-animation: blobbing 25s ease-in-out infinite both alternate;
    animation: blobbing 25s ease-in-out infinite both alternate;
}

.dt-sc-icon-section .dt-sc-icon:hover .dt-sc-icon-image:before {
    background-color: var(--DTTertiaryColor);
}

.dt-sc-icon-section .dt-sc-icon:hover .dt-sc-icon-image:before {
    opacity: 1;
    transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
}

.dt-sc-icon-section .dt-sc-icon:hover .dt-sc-icon-image:after {
    transform: scale(0);
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    opacity: 0;
}

@-webkit-keyframes blobbing {
  0%,
  100% {
    border-radius: 67% 33% 43% 57% / 27% 28% 72% 73%; }

  7% {
    border-radius: 30% 70% 57% 43% / 53% 38% 62% 47%; }

  14% {
    border-radius: 74% 26% 43% 57% / 51% 25% 75% 49%; }

  21% {
    border-radius: 49% 51% 72% 28% / 32% 36% 64% 68%; }

  28% {
    border-radius: 71% 29% 27% 73% / 52% 59% 41% 48%; }

  35% {
    border-radius: 33% 67% 29% 71% / 43% 46% 54% 57%; }

  42% {
    border-radius: 66% 34% 35% 65% / 68% 69% 31% 32%; }

  49% {
    border-radius: 44% 56% 67% 33% / 33% 46% 54% 67%; }

  56% {
    border-radius: 70% 30% 64% 36% / 43% 59% 41% 57%; }

  63% {
    border-radius: 25% 75% 62% 38% / 39% 60% 40% 61%; }

  70% {
    border-radius: 47% 53% 68% 32% / 70% 68% 32% 30%; }

  77% {
    border-radius: 71% 29% 42% 58% / 35% 67% 33% 65%; }

  84% {
    border-radius: 50% 50% 54% 46% / 69% 69% 31% 31%; }

  91% {
    border-radius: 73% 27% 62% 38% / 26% 36% 64% 74%; }
}

@-webkit-keyframes blobbing-reverse {
  0%,
  100% {
    border-radius: 73% 27% 62% 38% / 26% 36% 64% 74%; }

  7% {
    border-radius: 50% 50% 54% 46% / 69% 69% 31% 31%; }

  14% {
    border-radius: 71% 29% 42% 58% / 35% 67% 33% 65%; }

  21% {
    border-radius: 47% 53% 68% 32% / 70% 68% 32% 30%; }

  28% {
    border-radius: 25% 75% 62% 38% / 39% 60% 40% 61%; }

  35% {
    border-radius: 70% 30% 64% 36% / 43% 59% 41% 57%; }

  42% {
    border-radius: 44% 56% 67% 33% / 33% 46% 54% 67%; }

  49% {
    border-radius: 66% 34% 35% 65% / 68% 69% 31% 32%; }

  56% {
    border-radius: 43% 67% 29% 71% / 43% 46% 54% 57%; }

  63% {
    border-radius: 25% 75% 62% 38% / 39% 60% 40% 61%; }

  70% {
    border-radius: 71% 29% 27% 73% / 52% 59% 41% 48%; }

  77% {
    border-radius: 49% 51% 72% 28% / 32% 36% 64% 68%; }

  84% {
    border-radius: 74% 26% 43% 57% / 51% 25% 75% 49%; }

  91% {
    border-radius: 30% 70% 57% 43% / 53% 38% 62% 47%; }
}

.dt-sc-icon-section .dt-sc-icon .dt-sc-icon-image img {
    transition: var(--DTBaseTransition);
    transform: scale(0.7);
    -webkit-transform: scale(0.7);
    -ms-transform: scale(0.7);
}
      
.dt-sc-icon-section .dt-sc-icon:hover .dt-sc-icon-image img {
    transform: scale(0.9);
    -webkit-transform: scale(0.9);
    -ms-transform: scale(0.9);
}

.dt-sc-icon-section .dt-sc-icon .dt-sc-icon-content { display: flex; flex-wrap: wrap; align-items: center; text-align: center; justify-content: center; width: 100%; }

.dt-sc-icon-section .dt-sc-icon .dt-sc-icon-content .dt-sc-main-title { padding: 0; margin: 0 0 10px; font-size: 20px; width: 100%; }*/

/****<---- Team Sections ---->****/

/*.dt-sc-team-section .dt-sc-team {
  display: flex;
  flex-wrap: wrap;
  height: 100%;
  align-content: center;
  align-items: center;
  justify-content: center;
}

.dt-sc-team-section .dt-sc-team .dt-sc-team-image {
    display: flex;
    justify-content: center;
    align-items: center;       
    transition: var(--DTBaseTransition);
    position: relative;
    margin: 0 0 30px;
}

.dt-sc-team-section .dt-sc-team .dt-sc-team-image:before, .dt-sc-team-section .dt-sc-team .dt-sc-team-image:after {
  top: 0;
  content: "";
  height: 100%;  
  position: absolute;
  width: 0%;  
  transition: var(--DTBaseTransition);
  background: var(--DTOverlayColor);
}

.dt-sc-team-section .dt-sc-team .dt-sc-team-image:before { right: 0; }

.dt-sc-team-section .dt-sc-team .dt-sc-team-image:after { left: 0; }

.dt-sc-team-section .dt-sc-team:hover .dt-sc-team-image:before, .dt-sc-team-section .dt-sc-team:hover .dt-sc-team-image:after { width: 50%; }

.dt-sc-team-section .dt-sc-team .dt-sc-team-image .social-icon {
  z-index: 1;
  text-align: center;
  left: 0;
  margin: 0 auto;
  bottom: 0;
  position: absolute;
  right: 0px;
  opacity: 0;  
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  transition: var(--DTBaseTransition);
 }

.dt-sc-team-section .dt-sc-team .dt-sc-team-image .social-icon li {
  display: flex;
  flex-wrap: wrap;
  height: 100%;
  align-content: center;
  align-items: center;
  margin: 0 5px;
}

.dt-sc-team-section .dt-sc-team .dt-sc-team-image .social-icon li a {
  font-size: 16px;
  padding: 0;
  height: 40px;
  width: 40px;
  line-height: 40px;  
  text-align: center;
  background-color: var(--DTTertiaryColor);
  transition: var(--DTBaseTransition);
}

.dt-sc-team-section .dt-sc-team .dt-sc-team-image .social-icon li a:hover { background-color: var(--DTPrimaryColor); color: #ffffff; }

.dt-sc-team-section .dt-sc-team:hover .dt-sc-team-image .social-icon { opacity: 1; bottom: 30px; }

.dt-sc-team-section .dt-sc-team .dt-sc-team-content { display: flex; flex-wrap: wrap; align-items: center; text-align: center; justify-content: center; width: 100%; }

.dt-sc-team-section .dt-sc-team .dt-sc-team-content .dt-sc-main-title { padding: 0; margin: 0 0 10px; font-size: 20px; width: 100%; }

.dt-sc-team-section .dt-sc-team .dt-sc-team-content h6 { margin: 0; color: #adadad; width: 100%; }*/

/****<---- Custom Info Box Sections ---->****/

/*.dt-sc-custom-info-box { width: 100%; padding: 80px 60px; border: 5px solid; background: var(--DTTertiaryColor); border-color: var(--DTPrimaryColor); }

.dt-sc-custom-info-box .dt-sc-column { margin: 0; }

.dt-sc-custom-info-box .dt-sc-custom-info-content { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; }

.dt-sc-custom-info-box .dt-sc-custom-info-content:last-child { justify-content: flex-end; }

.dt-sc-custom-info-box .dt-sc-custom-info-content h2 { margin: 0 0 30px; text-transform: capitalize; color: var(--DTPrimaryColor); }

.dt-sc-custom-info-box .dt-sc-custom-info-content h2 span { color: var(--DTLinkColor); }

.dt-sc-custom-info-box .dt-sc-custom-info-content a { margin: 0; }*/

/****<---- Icon Box Sections ---->****/

/*.dt-sc-icon-box-section .dt-sc-icon-box {
    display: flex;
    flex-wrap: wrap;
    height: 100%;
    align-content: center;
    align-items: flex-start;
}

.dt-sc-icon-box-section .dt-sc-icon-box .dt-sc-icon-image {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background-color: var(--DTTertiaryColor);
    transition: var(--DTBaseTransition);
}

.dt-sc-icon-box-section .dt-sc-icon-box .dt-sc-icon-image img,
.dt-sc-icon-box-section .dt-sc-icon-box .dt-sc-icon-image i { font-size: 30px; }

.dt-sc-icon-box-section .dt-sc-icon-box .dt-sc-icon-content {
    width: calc(100% - 70px);
    padding: 0 0 0 30px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
}

.dt-sc-icon-box-section .dt-sc-icon-box .dt-sc-icon-content h4 {
    padding: 0;
    margin: 0 0 15px;
    font-size: 20px;
}

.dt-sc-icon-box-section .dt-sc-icon-box:hover .dt-sc-icon-image {
    background-color: var(--DTPrimaryColor);
    color: #ffffff;
}

.dt-sc-icon-box-section .dt-sc-icon-box.dt-sc-reverse-columns .dt-sc-icon-content {
    align-items: flex-end;
    text-align: right;
    padding: 0 30px 0 0;
}*/

/****<---- Testimonial Sections ---->****/

/*.dt-sc-custom-testimonial-section .dt-sc-custom-testimonial {
    display: flex;
    gap: 30px;
    justify-content: center;
    text-align: center;
}

.dt-sc-custom-testimonial-section .dt-sc-custom-testimonial .dt-sc-custom-testimonial-content {
    margin: auto;
    width: 50%;
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
}

.dt-sc-custom-testimonial-section .dt-sc-custom-testimonial .dt-sc-custom-testimonial-content .dt-sc-author-info {
    flex-direction: column;
    justify-content: center;
  	align-items: center;
    display: flex;
    gap: 30px;
    width: 100%;
}

.dt-sc-custom-testimonial-section .dt-sc-custom-testimonial .dt-sc-custom-testimonial-content .dt-sc-author-info .dt-sc-custom-testimonial-image {
    border: 2px solid var(--DTSecondaryColor);
    overflow: hidden;
    height: 85px;
    width: 85px;    
    border-radius: var(--DTRadius);           
}

.dt-sc-custom-testimonial-section .dt-sc-custom-testimonial .dt-sc-custom-testimonial-content cite {
    justify-content: center;
    font-style: normal;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-weight: bold;    
    width: 100%;
    font-size: 20px;
  	gap: 0;
    color:var(--DTSecondaryColor);    
}

.dt-sc-custom-testimonial-section .dt-sc-custom-testimonial .dt-sc-custom-testimonial-content cite span {
    width: 100%;
    margin-top:8px;
    padding-top: 10px;
    position: relative;
    justify-content: center;
    font-style: normal;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    font-weight: normal;
    font-size: 16px;
    color:var(--DTColor_Body);      
}

.dt-sc-custom-testimonial-section .dt-sc-custom-testimonial .dt-sc-custom-testimonial-content cite span:before {
    content: "";
    display: block;
    position: absolute;
    width: 35px;
    height: 2px;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    background-color:var(--DTSecondaryColor);
}*/


/***********************************************************************************/
/* MOBILE RESPONSIVE STYLES - Tablet and Below */
/***********************************************************************************/

/* Tablet Styles - max-width: 1024px */
@media (max-width: 1024px) {
  .container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  h1, h1 a { font-size: 38px !important; }
  h2, h2 a { font-size: 34px !important; }
  h3, h3 a { font-size: 30px !important; }

  .logo img { max-width: 180px !important; }

  .shopify-section { padding: 40px 0 !important; }
}

/* Mobile Styles - max-width: 767px */
@media (max-width: 767px) {

  /* Typography - Fixed font sizes for mobile */
  h1, h1 a { font-size: 32px !important; line-height: 1.2 !important; }
  h2, h2 a { font-size: 28px !important; line-height: 1.3 !important; }
  h3, h3 a { font-size: 24px !important; line-height: 1.3 !important; }
  h4, h4 a { font-size: 20px !important; line-height: 1.4 !important; }
  h5, h5 a { font-size: 18px !important; line-height: 1.4 !important; }
  h6, h6 a { font-size: 16px !important; line-height: 1.4 !important; }

  body { font-size: 14px !important; line-height: 1.6 !important; }
  p { font-size: 14px !important; }

  /* Container and spacing */
  .container {
    padding-left: 15px !important;
    padding-right: 15px !important;
    max-width: 100% !important;
  }

  .shopify-section, section, [class*="section"] {
    padding: 30px 0 !important;
  }

  /* Buttons */
  button, .btn, .dt-sc-btn, input[type="submit"],
  input[type="button"], .button, a.button,
  .shopify-payment-button__button {
    padding: 12px 20px !important;
    font-size: 14px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 10px 0 !important;
    text-align: center !important;
  }

  /* Forms and inputs */
  input[type="text"], input[type="email"], input[type="password"],
  input[type="tel"], input[type="number"], input[type="url"],
  input[type="search"], textarea, select {
    font-size: 16px !important; /* Prevents zoom on iOS */
    padding: 12px 15px !important;
    width: 100% !important;
  }

  /* Header and navigation */
  .site-header, header {
    padding: 10px 0 !important;
  }

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

  .dt-desktop-menu { display: none !important; }
  .mobile-nav-container { display: block !important; }

  .site-header__links {
    gap: 10px !important;
  }

  .site-header__icon {
    font-size: 18px !important;
    padding: 5px !important;
  }

  /* Grid and columns - Stack everything on mobile */
  .dt-sc-column, .row > div, .row > *,
  [class*="grid"] > *, [class*="column"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    margin-bottom: 20px !important;
  }

  .dt-sc-flex, .dt-sc-flex-space-between,
  .dt-sc-flex-end {
    flex-direction: column !important;
    align-items: center !important;
  }

  .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Images */
  img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* DIY Kits Grid Banner Section - 3 columns with higher specificity */
  .row .dt-sc-grid-banner-section.dt-sc-column.four-column,
  .dt-sc-grid-banner-section.dt-sc-column.four-column,
  .dt-sc-grid-banner-section.four-column {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
    padding: 10px !important;
    margin: 0 !important;
  }

  .dt-sc-grid-banner-section .dt-sc-grid-banner,
  .dt-sc-grid-banner.grid-style {
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    text-align: center !important;
    min-height: auto !important;
    background: transparent !important;
    border: none !important;
  }

  .dt-sc-grid-banner-section .dt-sc-grid-banner-image,
  .dt-sc-grid-banner .dt-sc-grid-banner-image {
    order: 1 !important;
    width: 100% !important;
    margin: 0 0 10px 0 !important;
    position: relative !important;
  }

  .dt-sc-grid-banner-section .dt-sc-grid-banner-image img,
  .dt-sc-grid-banner .dt-sc-grid-banner-image img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    border-radius: 6px !important;
  }

  .dt-sc-grid-banner-section .dt-sc-grid-banner-content,
  .dt-sc-grid-banner .dt-sc-grid-banner-content {
    order: 2 !important;
    padding: 0 5px !important;
    position: relative !important;
    background: transparent !important;
  }

  .dt-sc-grid-banner-section .dt-sc-sub-title,
  .dt-sc-grid-banner .dt-sc-sub-title,
  .dt-sc-grid-banner-content .dt-sc-sub-title {
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    margin: 0 0 6px 0 !important;
    line-height: 1.3 !important;
    color: #000 !important;
  }

  .dt-sc-grid-banner-section .dt-sc-description,
  .dt-sc-grid-banner .dt-sc-description,
  .dt-sc-grid-banner-content .dt-sc-description {
    font-size: 10px !important;
    line-height: 1.3 !important;
    margin: 0 0 10px 0 !important;
    color: #666 !important;
  }

  .dt-sc-grid-banner-section .dt-sc-btn,
  .dt-sc-grid-banner .dt-sc-btn,
  .dt-sc-grid-banner-content .dt-sc-btn {
    background: #FFB300 !important;
    color: #000 !important;
    font-weight: 700 !important;
    font-size: 11px !important;
    padding: 8px 15px !important;
    border-radius: 4px !important;
    text-transform: uppercase !important;
    display: inline-block !important;
    width: auto !important;
    max-width: none !important;
    border: none !important;
    margin: 0 auto !important;
    box-shadow: none !important;
  }

  .dt-sc-grid-banner-section .dt-sc-btn:hover,
  .dt-sc-grid-banner .dt-sc-btn:hover {
    background: #FFA000 !important;
  }

  /* Product grids */
  .products, .product-collection,
  [class*="product-grid"], .product-list {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
    padding: 10px !important;
  }

  /* Product card layout - vertical stack */
  .product-collection li,
  .product-card, .product-item {
    display: flex !important;
    flex-direction: column !important;
    padding: 8px !important;
    text-align: center !important;
  }

  /* Product images - must be on top */
  .product-card__image, .product-item__image,
  .product-collection .product-image,
  .product__media,
  .grid-link__image {
    order: 1 !important;
    width: 100% !important;
    margin-bottom: 8px !important;
  }

  .product-card__image img, .product-item__image img,
  .product-collection .product-image img,
  .product__media img,
  .grid-link__image img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }

  /* Ensure collection images share a uniform height */
  .product-grid-item .image_group {
    position: relative !important;
    width: 100% !important;
    height: clamp(240px, 28vw, 320px) !important;
    overflow: hidden !important;
  }

  .product-grid-item .image_group img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
  }

  /* Product title - second */
  .product-card__title, .product-item__title,
  .product__title,
  .grid-link__title,
  h3 {
    order: 2 !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    margin: 0 0 6px 0 !important;
    font-weight: 500 !important;
  }

  /* Clamp titles to two lines on collection grids */
  .product-grid-item .grid-link__title,
  .product-grid-item .grid-link__title a {
    display: -webkit-box !important;
    display: block !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    line-height: 1.35 !important;
    max-height: calc(1.35em * 2) !important;
  }

  /* Product price - third */
  .product-card__price, .product-item__price,
  .product__price,
  .price,
  .grid-link__meta {
    order: 3 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    margin: 0 !important;
  }

  /* Product single page */
  .product-page-row, .product-template-content {
    flex-direction: column !important;
  }

  .product_image_width, .product-description-product-template {
    width: 100% !important;
    padding: 0 !important;
    margin-bottom: 20px !important;
  }

  .product-form {
    margin-top: 20px !important;
  }

  .product-form__item {
    margin-bottom: 15px !important;
  }

  /* Sections */
  .section-header, .section-title {
    margin-bottom: 20px !important;
    text-align: center !important;
  }

  /* Slideshow / Banner */
  .slideshow, [class*="banner"], [class*="hero"],
  .dt-sc-grid-banner {
    min-height: 300px !important;
    height: auto !important;
  }

  .slideshow__text, .banner__content,
  [class*="banner-text"], .dt-sc-grid-banner-content {
    padding: 20px !important;
    text-align: center !important;
  }

  .slideshow__heading, .banner__heading {
    font-size: 28px !important;
    line-height: 1.2 !important;
  }

  .slideshow__subtitle, .banner__subtitle {
    font-size: 16px !important;
    margin-bottom: 15px !important;
  }

  /* Footer */
  .footer, footer {
    padding: 30px 0 !important;
    text-align: center !important;
  }

  .footer__block, .footer-column, .footer__item {
    width: 100% !important;
    margin-bottom: 20px !important;
    text-align: center !important;
  }

  .footer-menu {
    flex-direction: column !important;
  }

  /* Hide desktop-only elements */
  .desktop-only, .hide-mobile {
    display: none !important;
  }

  /* Show mobile-only elements */
  .mobile-only {
    display: block !important;
  }

  /* Tables - Make scrollable */
  table {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    width: 100% !important;
  }

  table td, table th {
    padding: 8px !important;
    font-size: 13px !important;
  }

  /* Cart */
  .cart, .cart-template {
    padding: 0 !important;
  }

  .cart__row {
    flex-direction: column !important;
    text-align: center !important;
    padding: 15px !important;
  }

  .cart__header-labels {
    display: none !important;
  }

  .cart__items {
    width: 100% !important;
  }

  .cart_items img {
    max-width: 150px !important;
    margin: 0 auto 10px !important;
  }

  .cart-subtotal {
    margin-top: 20px !important;
  }

  /* Swiper/Carousel navigation */
  .swiper-button-next, .swiper-button-prev,
  .dt-sc-swiper-slider .swiper-button-next,
  .dt-sc-swiper-slider .swiper-button-prev {
    width: 35px !important;
    height: 35px !important;
  }

  .swiper-pagination {
    bottom: 10px !important;
  }

  .dt-sc-swiper-slider {
    padding-bottom: 40px !important;
  }

  /* Text alignment on mobile */
  .text-center-mobile {
    text-align: center !important;
  }

  /* Featured collections */
  .collection-grid, .featured-collection,
  .dt-sc-featured-collection-section {
    grid-template-columns: 1fr !important;
  }

  /* Testimonials */
  .testimonial, .testimonial-slide,
  .dt-sc-custom-testimonial {
    padding: 20px !important;
    text-align: center !important;
    flex-direction: column !important;
  }

  .dt-sc-custom-testimonial-content {
    width: 100% !important;
  }

  /* Brand logos */
  .brand-logos, .logo-list {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 15px !important;
  }

  /* Icon boxes */
  .icon-box, .feature-box, .dt-sc-icon-box {
    text-align: center !important;
    padding: 20px 15px !important;
    flex-direction: column !important;
  }

  .dt-sc-icon-content {
    width: 100% !important;
    padding: 15px 0 0 0 !important;
  }

  /* Videos */
  video, iframe {
    max-width: 100% !important;
    height: auto !important;
    min-height: 200px !important;
  }

  /* Modals and popups */
  .mfp-content {
    width: 95% !important;
    max-width: 95% !important;
  }

  .mfp-dialog {
    padding: 15px !important;
  }

  /* Breadcrumb */
  .breadcrumb {
    font-size: 12px !important;
    padding: 10px 0 !important;
    margin-bottom: 20px !important;
  }

  .breadcrumb h1 {
    font-size: 24px !important;
  }

  /* Search */
  .search-form, .search-bar {
    width: 100% !important;
  }

  .search-input {
    width: 100% !important;
    margin-bottom: 10px !important;
  }

  /* Newsletter */
  .newsletter-form {
    flex-direction: column !important;
  }

  .newsletter-form input {
    width: 100% !important;
    margin-bottom: 10px !important;
  }

  /* Social icons */
  .social-links, .social-icons {
    justify-content: center !important;
    gap: 15px !important;
  }

  /* User account forms */
  .user-account {
    padding: 20px !important;
    max-width: 100% !important;
  }

  /* Collection filters */
  .collection-sidebar {
    width: 100% !important;
    margin-bottom: 20px !important;
  }

  /* Announcement bar */
  .announcement-bar {
    font-size: 12px !important;
    padding: 8px 15px !important;
  }

  /* Spacing utilities */
  .padding-mobile {
    padding: 15px !important;
  }

  .margin-mobile {
    margin: 15px 0 !important;
  }

  /* Deal/Sale badges */
  .badge, .product-badge, .sale-badge {
    font-size: 11px !important;
    padding: 4px 8px !important;
  }

  /* Quantity selector */
  .qty-box-set, .quantity-selector {
    justify-content: center !important;
    margin: 15px 0 !important;
  }

  /* Pagination */
  .pagination {
    font-size: 14px !important;
    gap: 8px !important;
  }

  /* Blog */
  .blog-grid, .article-grid {
    grid-template-columns: 1fr !important;
  }

  .article-card, .blog-post {
    margin-bottom: 25px !important;
  }

  /* Collection header - keep horizontal */
  .collection-header {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
  }

  .collection-sort, .collection-filters {
    width: auto !important;
    flex: 0 0 auto !important;
  }
}

/* Extra Small Mobile - max-width: 576px */
@media (max-width: 576px) {

  /* Two columns for products on mobile screens */
  .products, .product-collection,
  [class*="product-grid"] {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
    padding: 10px !important;
  }

  /* Product card layout - vertical stack */
  .product-collection li,
  .products .product-item,
  .product-card,
  [class*="product-grid"] > * {
    display: flex !important;
    flex-direction: column !important;
    padding: 8px !important;
    text-align: center !important;
  }

  /* Product images - must be on top */
  .product-collection .product-image,
  .product-item__image-wrapper,
  .product-card__image,
  .product__media,
  .grid-link__image {
    order: 1 !important;
    width: 100% !important;
    margin-bottom: 8px !important;
  }

  .product-collection .product-image img,
  .product-item__image-wrapper img,
  .product-card__image img,
  .product__media img,
  .grid-link__image img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }

  /* Product titles - second */
  .product-collection .product__title,
  .product-item__title,
  .product-card__title,
  .product__title,
  .grid-link__title,
  .product__title a {
    order: 2 !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    margin: 0 0 6px 0 !important;
    font-weight: 500 !important;
  }

  /* Product prices - third */
  .product-collection .price,
  .product-item__price,
  .product-card__price,
  .product__price,
  .grid-link__meta {
    order: 3 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    margin: 0 !important;
  }

  /* DIY Kits Grid Banner Section - FORCE 3 columns on mobile */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section.dt-sc-column.four-column,
  div.row.dt-custom-nopadding-grid-with-textlink > .dt-sc-grid-banner-section.dt-sc-column.four-column,
  .dt-custom-nopadding-grid-with-textlink > .dt-sc-grid-banner-section.four-column {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    padding: 10px 5px !important;
    margin: 0 auto !important;
    max-width: 100% !important;
  }

  /* CRITICAL: Override dt-framework forcing 100% width on grid items */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section.dt-sc-column > .dt-sc-grid-banner {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    margin-bottom: 0 !important;
  }

  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section .dt-sc-grid-banner.grid-style,
  .dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section .dt-sc-grid-banner {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    padding: 0 !important;
    text-align: center !important;
    min-height: auto !important;
    background: transparent !important;
    border: none !important;
    height: 100% !important;
  }

  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-image {
    width: 100% !important;
    height: 90px !important;
    max-width: 100% !important;
    margin: 0 0 6px 0 !important;
    position: relative !important;
    flex-shrink: 0 !important;
  }

  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    display: block !important;
  }

  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-content {
    padding: 0 2px !important;
    position: relative !important;
    background: transparent !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    flex-grow: 1 !important;
  }

  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-content h6.dt-sc-sub-title {
    font-size: 9px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    margin: 0 0 4px 0 !important;
    line-height: 1.1 !important;
    color: #000 !important;
    min-height: 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-content p.dt-sc-description {
    font-size: 8px !important;
    line-height: 1.2 !important;
    margin: 0 0 6px 0 !important;
    color: #666 !important;
    min-height: 30px !important;
    flex-grow: 1 !important;
  }

  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-content a.dt-sc-btn {
    background: #FFB300 !important;
    color: #000 !important;
    font-weight: 700 !important;
    font-size: 8px !important;
    padding: 6px 8px !important;
    border-radius: 3px !important;
    text-transform: uppercase !important;
    display: block !important;
    width: 100% !important;
    border: none !important;
    margin-top: auto !important;
    box-shadow: none !important;
    text-decoration: none !important;
  }

  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-content a.dt-sc-btn:hover {
    background: #FFA000 !important;
  }

  /* Collection header - keep horizontal on mobile */
  .collection-header {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
    padding: 10px !important;
  }

  .collection-header > * {
    flex: 0 0 auto !important;
  }

  /* View mode and sort dropdown */
  .view-mode, .collection-view {
    display: flex !important;
    gap: 8px !important;
  }

  select, .collection-sort select {
    padding: 8px 10px !important;
    font-size: 13px !important;
  }

  /* Smaller font sizes */
  h1, h1 a { font-size: 28px !important; }
  h2, h2 a { font-size: 24px !important; }
  h3, h3 a { font-size: 20px !important; }
  h4, h4 a { font-size: 18px !important; }

  body { font-size: 13px !important; }

  /* Tighter spacing */
  .container {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  section, .shopify-section {
    padding: 20px 0 !important;
  }

  /* Buttons smaller */
  button, .btn, .dt-sc-btn {
    padding: 10px 15px !important;
    font-size: 13px !important;
  }

  /* Logo even smaller */
  .logo img {
    max-width: 120px !important;
  }

  /* Brand logos single column */
  .brand-logos, .logo-list {
    grid-template-columns: 1fr !important;
  }

  /* Slideshow */
  .slideshow, .banner {
    min-height: 250px !important;
  }

  .slideshow__heading, .banner__heading {
    font-size: 24px !important;
  }

  /* Cart adjustments */
  .cart__row:not(.cart__header-labels) {
    max-width: 300px !important;
    margin: 0 auto !important;
  }

  /* Header icons smaller */
  .site-header__icon {
    font-size: 16px !important;
  }
}

/* Additional Home Page Specific Fixes */
@media (max-width: 767px) {

  /* Hero/Banner Section Improvements */
  .slideshow, .slideshow-section, .hero-section {
    min-height: 400px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .slideshow__content, .banner__box, .hero-content {
    padding: 30px 20px !important;
    width: 100% !important;
    text-align: center !important;
  }

  .slideshow__title, .hero__title {
    font-size: 26px !important;
    line-height: 1.3 !important;
    margin-bottom: 15px !important;
    font-weight: bold !important;
  }

  .slideshow__subtitle, .hero__subtitle {
    font-size: 14px !important;
    line-height: 1.5 !important;
    margin-bottom: 20px !important;
  }

  /* Button Group - Side by Side with Gap */
  .slideshow__btn-wrapper, .hero__buttons, .banner__buttons {
    display: flex !important;
    flex-direction: row !important;
    gap: 10px !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
  }

  .slideshow__btn-wrapper .dt-sc-btn,
  .slideshow__btn-wrapper .btn,
  .hero__buttons .dt-sc-btn,
  .hero__buttons .btn {
    width: auto !important;
    min-width: 130px !important;
    padding: 12px 24px !important;
    font-size: 13px !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  /* Slider Dots/Pagination */
  .slick-dots, .slideshow__dots {
    bottom: 15px !important;
    display: flex !important;
    justify-content: center !important;
    gap: 8px !important;
  }

  .slick-dots li {
    width: 8px !important;
    height: 8px !important;
    margin: 0 !important;
  }

  /* Header improvements */
  .site-header {
    padding: 12px 0 !important;
  }

  .site-header__logo, .logo {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 150px !important;
  }

  /* Top bar/announcement */
  .announcement, .top-bar {
    text-align: center !important;
    font-size: 11px !important;
    padding: 8px 10px !important;
  }

  /* Category Section */
  .category-section, .collection-list {
    padding: 30px 15px !important;
  }

  .category-section h2, .section__title {
    font-size: 24px !important;
    margin-bottom: 10px !important;
    text-align: center !important;
  }

  .category-section p, .section__description {
    font-size: 13px !important;
    line-height: 1.6 !important;
    margin-bottom: 20px !important;
    text-align: center !important;
  }

  /* Category Grid */
  .category-grid, .collection-list__grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 15px !important;
    margin-top: 20px !important;
  }

  .category-item, .collection-item {
    text-align: center !important;
    padding: 15px 10px !important;
    background: #fff !important;
  }

  .category-item img, .collection-item img {
    max-width: 80px !important;
    height: auto !important;
    margin: 0 auto 10px !important;
    display: block !important;
  }

  .category-item h3, .collection-item__title {
    font-size: 14px !important;
    margin-bottom: 5px !important;
    font-weight: 600 !important;
  }

  .category-item p, .collection-item__description {
    font-size: 11px !important;
    line-height: 1.4 !important;
    color: #666 !important;
  }

  /* Search Bar Mobile */
  .search-bar, .search-form {
    padding: 10px 15px !important;
  }

  .search-bar input, .search-form input {
    width: 100% !important;
    padding: 10px 15px !important;
    font-size: 14px !important;
  }

  /* Navigation Menu Mobile */
  .menu-trigger {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 13px !important;
  }

  /* Icons in Header */
  .site-header__icon svg {
    width: 20px !important;
    height: 20px !important;
  }

  .site-header__cart-count {
    font-size: 10px !important;
    min-width: 18px !important;
    height: 18px !important;
    line-height: 18px !important;
  }

  /* Product Cards on Home */
  .product-card, .grid-product {
    margin-bottom: 20px !important;
  }

  .product-card__image-wrapper {
    margin-bottom: 12px !important;
    position: relative !important;
    overflow: hidden !important;
  }

  .product-card__title {
    font-size: 13px !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
    min-height: 38px !important;
  }

  .product-card__price {
    font-size: 15px !important;
    font-weight: bold !important;
    color: #000 !important;
  }

  /* Featured Products Section */
  .featured-products, .product-carousel {
    padding: 30px 15px !important;
  }

  .featured-products h2 {
    font-size: 24px !important;
    margin-bottom: 20px !important;
    text-align: center !important;
  }

  /* Spacing between sections */
  .shopify-section {
    margin-bottom: 30px !important;
  }

  /* Remove excess padding/margin */
  .index-section {
    padding: 0 !important;
  }

  /* Make images not overflow */
  .rte img,
  .shopify-section img {
    max-width: 100% !important;
    height: auto !important;
  }
}

/* Extra fixes for the specific layout shown */
@media (max-width: 767px) {

  /* Fix overlapping text in hero - Translucent background */
  .slideshow__text-content {
    background: rgba(255, 255, 255, 0.88) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    padding: 20px !important;
    border-radius: 10px !important;
  }

  /* Ensure proper line breaks in titles */
  h1, h2, h3 {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    hyphens: auto !important;
  }

  /* Fix any absolute positioned elements */
  [style*="position: absolute"] {
    position: relative !important;
  }

  /* SPECIFIC SLIDESHOW FIXES - Based on actual structure */
  .slider-content {
    padding: 25px 15px !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 350px !important;
    background: transparent !important;
  }

  .slider-content > div {
    width: 100% !important;
    max-width: 100% !important;
  }

  .slide-sub-heading-2 {
    font-size: 13px !important;
    margin-bottom: 10px !important;
    line-height: 1.4 !important;
  }

  .slide-heading {
    font-size: 26px !important;
    line-height: 1.3 !important;
    margin-bottom: 12px !important;
    font-weight: bold !important;
  }

  .slide-text {
    font-size: 13px !important;
    line-height: 1.5 !important;
    margin-bottom: 20px !important;
  }

  .multiple-buttons {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    justify-content: center !important;
  }

  .slide-button.dt-sc-btn {
    width: auto !important;
    min-width: 130px !important;
    max-width: 48% !important;
    padding: 12px 20px !important;
    font-size: 12px !important;
    margin: 0 !important;
    white-space: nowrap !important;
  }

  /* Slider image - ensure it covers properly and is ALWAYS visible */
  .slide-img {
    width: 100% !important;
    height: 350px !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
    z-index: 0 !important;
  }

  /* Swiper slide - ensure banner is visible */
  .swiper-slide {
    min-height: 350px !important;
    position: relative !important;
    overflow: hidden !important;
    background: transparent !important;
  }

  /* Ensure slideshow section doesn't have white background */
  .dt-sc-swiper-slider,
  .home-slideshow-section,
  [data-section-type="slideshow-section"],
  .slideshow-section {
    background: transparent !important;
  }

  /* CRITICAL FIX - Make text background translucent */
  .slider-content-bg,
  .slider-content.slider-content-bg,
  .swiper-slide .slider-content-bg,
  .slider_style_3 .slider-content-bg {
    background: rgba(255, 255, 255, 0.75) !important;
    /* blur removed: gradient already provides contrast */
    border-radius: 12px !important;
  }

  /* Ensure swiper slides show images properly */
  .swiper-slide,
  .slider_style_3 {
    position: relative !important;
    overflow: hidden !important;
  }

  .swiper-slide > a {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 0 !important;
  }

  .swiper-slide .slide-img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    z-index: 0 !important;
  }

  .swiper-slide .slider-content,
  .swiper-slide .slider-content-bg {
    position: relative !important;
    z-index: 10 !important;
  }

  .slider-content.text-center {
    text-align: center !important;
  }

  .slider-content.text-start {
    text-align: left !important;
    justify-content: flex-start !important;
  }

  .slider-content.text-end {
    text-align: right !important;
    justify-content: flex-end !important;
  }

  /* WOOLLEN HOUSE STYLE BANNER - Compact & Professional */

  /* Banner container - landscape format, max 55% screen height */
  [data-section-type="slideshow-section"] .swiper-slide,
  .home-slideshow-section .swiper-slide,
  div[class*="home-slideshow"] .swiper-slide {
    position: relative !important;
    height: 420px !important;
    min-height: 320px !important;
    max-height: 55vh !important;
    overflow: hidden !important;
  }

  /* Image - fills banner edge-to-edge, centered subject */
  [data-section-type="slideshow-section"] .slide-img,
  .home-slideshow-section .slide-img,
  .swiper-slide .slide-img,
  .swiper-slide img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  /* Semi-transparent card overlay - sits near bottom with breathing room */
  [data-section-type="slideshow-section"] .slider-content,
  .home-slideshow-section .slider-content,
  .swiper-slide .slider-content {
    position: absolute !important;
    bottom: 20px !important;
    left: 16px !important;
    right: 16px !important;
    top: auto !important;
    transform: none !important;
    width: auto !important;
    max-width: none !important;
    background: rgba(255, 255, 255, 0.75) !important; /* no blur */
    padding: 20px !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15) !important;
  }

  /* Title - bold, max 2 lines */
  [data-section-type="slideshow-section"] .slide-heading,
  .home-slideshow-section .slide-heading,
  .slider-content .slide-heading,
  .slider-content h2 {
    font-size: 20px !important;
    line-height: 1.3 !important;
    margin-bottom: 8px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    text-align: center !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }

  /* Subtitle - smaller, max 2 lines */
  [data-section-type="slideshow-section"] .slide-sub-heading-2,
  .home-slideshow-section .slide-sub-heading-2,
  .slider-content .slide-sub-heading-2 {
    font-size: 11px !important;
    margin-bottom: 6px !important;
    text-align: center !important;
    line-height: 1.4 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }

  /* Description - max 2 lines, no paragraphs */
  [data-section-type="slideshow-section"] .slide-text,
  .home-slideshow-section .slide-text,
  .slider-content .slide-text {
    font-size: 13px !important;
    line-height: 1.5 !important;
    margin-bottom: 16px !important;
    text-align: center !important;
    color: #666 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }

  /* Button container - single button layout */
  [data-section-type="slideshow-section"] .multiple-buttons,
  .home-slideshow-section .multiple-buttons,
  .slider-content .multiple-buttons {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100% !important;
  }

  /* Primary CTA button - full width, thumb-friendly, high contrast */
  [data-section-type="slideshow-section"] .slide-button.dt-sc-btn,
  .home-slideshow-section .slide-button.dt-sc-btn,
  .slider-content .slide-button.dt-sc-btn,
  .slider-content .dt-sc-btn {
    width: 100% !important;
    max-width: none !important;
    min-width: auto !important;
    padding: 14px 24px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin: 0 !important;
    border-radius: 8px !important;
    line-height: 1.2 !important;
    min-height: 48px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Hide second button on mobile - only show primary */
  [data-section-type="slideshow-section"] .slide-button.dt-sc-btn.secondary,
  .home-slideshow-section .slide-button.dt-sc-btn.secondary,
  .slider-content .slide-button.secondary {
    display: none !important;
  }

  /* Slider dots - below banner, not overlapping */
  [data-section-type="slideshow-section"] .swiper-pagination,
  .home-slideshow-section .swiper-pagination,
  .dt-sc-swiper-slider .swiper-pagination {
    position: relative !important;
    bottom: auto !important;
    margin-top: 16px !important;
    margin-bottom: 16px !important;
  }

  [data-section-type="slideshow-section"] .swiper-pagination-bullet,
  .home-slideshow-section .swiper-pagination-bullet {
    width: 10px !important;
    height: 10px !important;
    margin: 0 6px !important;
    opacity: 0.4 !important;
    background: #1a1a1a !important;
  }

  [data-section-type="slideshow-section"] .swiper-pagination-bullet-active,
  .home-slideshow-section .swiper-pagination-bullet-active {
    opacity: 1 !important;
    background: #1a1a1a !important;
    width: 24px !important;
    border-radius: 5px !important;
  }

  /* Container spacing - 16px gutter consistency */
  [data-section-type="slideshow-section"] > div,
  .home-slideshow-section > div {
    padding: 0 !important;
  }

  /* Gap between banner and next section */
  [data-section-type="slideshow-section"],
  .home-slideshow-section {
    margin-bottom: 24px !important;
  }

  /* Header fixes */
  .site-header {
    background: #fff !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08) !important;
  }

  .site-header__logo img, .logo img {
    max-width: 100px !important;
  }

  /* Shop by Category Section */
  .index-section h2 {
    font-size: 20px !important;
    margin-bottom: 8px !important;
    font-weight: 700 !important;
  }

  .index-section > div > p {
    font-size: 12px !important;
    line-height: 1.5 !important;
    margin-bottom: 25px !important;
  }

  /* Header Layout Fix */
  header, .site-header-wrapper {
    padding: 10px 0 !important;
  }

  header .dt-sc-flex,
  header .dt-sc-flex-space-between {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
  }

  header .logo {
    flex: 0 0 auto !important;
    margin: 0 !important;
  }

  header .site-header__links {
    flex: 0 0 auto !important;
    display: flex !important;
    gap: 8px !important;
    align-items: center !important;
    margin-left: auto !important;
  }

  header .site-header__icon {
    padding: 5px !important;
    min-width: 30px !important;
    height: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  header .site-header__cart-count {
    position: absolute !important;
    top: -2px !important;
    right: -2px !important;
    min-width: 16px !important;
    height: 16px !important;
    line-height: 16px !important;
    font-size: 9px !important;
    border-radius: 50% !important;
  }

  header .mobile-nav-container {
    flex: 0 0 auto !important;
  }

  header .menu-trigger {
    padding: 6px 10px !important;
    font-size: 12px !important;
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
  }

  /* Fix the layout - logo on left, menu and icons on right */
  header .dt-sc-flex > *:first-child {
    order: 1 !important;
  }

  header .dt-sc-flex > *:nth-child(2) {
    order: 3 !important;
    margin-left: auto !important;
  }

  header .dt-sc-flex > *:last-child {
    order: 2 !important;
    margin-right: 10px !important;
  }

  /* Swiper pagination dots */
  .swiper-pagination-bullet {
    background: rgba(0, 0, 0, 0.3) !important;
    opacity: 1 !important;
    width: 8px !important;
    height: 8px !important;
  }

  .swiper-pagination-bullet-active {
    background: rgba(0, 0, 0, 0.8) !important;
    width: 20px !important;
    border-radius: 4px !important;
  }

  /* Better spacing for all sections */
  .shopify-section {
    padding: 0 !important;
  }

  .shopify-section > div {
    padding: 30px 0 !important;
  }

  /* Ensure no horizontal overflow */
  body, html {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }

  * {
    box-sizing: border-box !important;
  }

  /* ========================================
     MOBILE HEADER FIX - CIY STYLE
     For secondary-menu-enabled layout
     Logo Left | Icons Right | Sign In Button
     ======================================== */

  /* RESTRUCTURE THE NAV - Force single row layout - ULTRA COMPACT */
  body header#header .logo-alignment.secondary-menu-enabled #AccessibleNav,
  #header .logo-alignment.secondary-menu-enabled #AccessibleNav,
  body header#header nav#AccessibleNav,
  #header nav#AccessibleNav {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    padding: 5px 10px !important;
    gap: 6px !important;
    min-height: auto !important;
    max-height: 45px !important;
    height: auto !important;
    line-height: 1 !important;
    margin: 0 !important;
  }

  /* HEADER SECTION - REMOVE ALL PADDING AND SPACING */
  body header#header .dt-sc-header-logo-sec,
  body header#header .dt-sc-header-logo-sec.sticky-header,
  #header .dt-sc-header-logo-sec,
  #header .dt-sc-header-logo-sec.sticky-header {
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
  }

  body header#header .dt-sc-header-logo-sec .container-fluid,
  body header#header .dt-sc-header-logo-sec .container-fluid.spacing_enabled,
  #header .dt-sc-header-logo-sec .container-fluid,
  #header .dt-sc-header-logo-sec .container-fluid.spacing_enabled {
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
  }

  body header#header .dt-sc-header-logo-sec .row,
  #header .dt-sc-header-logo-sec .row {
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
  }

  body header#header .logo-alignment,
  body header#header .logo-alignment.secondary-menu-enabled,
  #header .logo-alignment,
  #header .logo-alignment.secondary-menu-enabled {
    padding: 0 !important;
    margin: 0 !important;
    line-height: 1 !important;
  }

  /* HIDE DESKTOP MENU COMPLETELY */
  body header#header .dt-desktop-menu,
  body header#header ul.dt-nav,
  #header .dt-desktop-menu,
  #header ul.dt-nav {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
  }

  /* LOGO - FORCE TO LEFT, FIRST ITEM */
  body header#header .logo-alignment.secondary-menu-enabled #AccessibleNav > .logo,
  body header#header nav#AccessibleNav > .logo,
  #header nav#AccessibleNav > .logo,
  #header .logo-alignment #AccessibleNav .logo {
    flex: 0 0 auto !important;
    order: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    max-width: 60px !important;
    width: 60px !important;
    min-width: 60px !important;
    text-align: left !important;
    display: block !important;
    position: static !important;
    transform: none !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    line-height: 1 !important;
  }

  body header#header nav#AccessibleNav > .logo a,
  #header nav#AccessibleNav > .logo a {
    display: block !important;
    line-height: 1 !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  body header#header nav#AccessibleNav > .logo img,
  #header nav#AccessibleNav > .logo img,
  body header#header .logo img,
  #header .logo img {
    max-width: 60px !important;
    width: 60px !important;
    height: auto !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    vertical-align: middle !important;
  }

  /* ICONS + SIGN IN WRAPPER - FORCE TO RIGHT */
  body header#header .dt-secondary-nav-wrap,
  #header .dt-secondary-nav-wrap,
  body header#header nav#AccessibleNav > .dt-secondary-nav-wrap,
  #header nav#AccessibleNav > .dt-secondary-nav-wrap {
    flex: 1 1 auto !important;
    order: 2 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
    gap: 8px !important;
  }

  /* ICONS CONTAINER */
  body header#header .site-header__links,
  body header#header .dt-secondary-nav-wrap .site-header__links,
  #header .site-header__links,
  #header .dt-secondary-nav-wrap .site-header__links {
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* INDIVIDUAL ICONS - TOUCH FRIENDLY */
  body header#header .site-header__links .site-header__icon,
  #header .site-header__links .site-header__icon,
  body header#header .site-header__links a.site-header__icon,
  #header .site-header__links a.site-header__icon {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border-radius: 50% !important;
    order: 1 !important;
    line-height: 1 !important;
  }

  /* Search icon - first */
  body header#header .site-header__links .site-header__search_icon,
  #header .site-header__links .site-header__search_icon {
    order: 1 !important;
  }

  /* Wishlist icon - second */
  body header#header .site-header__links .site-header__wishlist,
  #header .site-header__links .site-header__wishlist {
    order: 2 !important;
  }

  /* Cart icon - third */
  body header#header .site-header__links .site-header__cart,
  body header#header .site-header__links #cart-number,
  #header .site-header__links .site-header__cart,
  #header .site-header__links #cart-number {
    order: 3 !important;
  }

  body header#header .site-header__links .site-header__icon svg,
  #header .site-header__links .site-header__icon svg {
    width: 18px !important;
    height: 18px !important;
    max-width: 18px !important;
    max-height: 18px !important;
  }

  /* SIGN IN BUTTON - BRIGHT YELLOW - APPEARS LAST */
  body header#header .site-header__links .site-header__account-button,
  body header#header .site-header__links .site-header__account,
  body header#header .site-header__links a.site-header__account-button,
  body header#header .site-header__links a.site-header__account,
  #header .site-header__links .site-header__account-button,
  #header .site-header__links .site-header__account,
  #header .site-header__links a.site-header__account-button,
  #header .site-header__links a.site-header__account {
    background: #FFB300 !important;
    background-color: #FFB300 !important;
    color: #000000 !important;
    padding: 0 14px !important;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
    line-height: 28px !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    border-radius: 5px !important;
    margin: 0 0 0 6px !important;
    box-shadow: 0 2px 4px rgba(255, 179, 0, 0.3) !important;
    width: auto !important;
    min-width: 60px !important;
    max-width: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    border: none !important;
    white-space: nowrap !important;
    order: 99 !important;
  }

  body header#header .site-header__account-button:hover,
  #header .site-header__account-button:hover,
  body header#header .site-header__account:hover,
  #header .site-header__account:hover {
    background: #E6A200 !important;
    background-color: #E6A200 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 10px rgba(255, 179, 0, 0.5) !important;
  }

  body header#header .site-header__account-button .account-button-text,
  body header#header .site-header__account .account-button-text,
  #header .site-header__account-button .account-button-text,
  #header .site-header__account .account-button-text {
    color: #000000 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    display: inline !important;
    line-height: normal !important;
  }

  /* CART BADGE - YELLOW TO MATCH BUTTON */
  body header#header .site-header__cart-count,
  body header#header #CartCount,
  #header .site-header__cart-count,
  #header #CartCount {
    position: absolute !important;
    top: -2px !important;
    right: -2px !important;
    background: #FFB300 !important;
    color: #000000 !important;
    min-width: 18px !important;
    height: 18px !important;
    line-height: 18px !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    border-radius: 50% !important;
    border: 2px solid #ffffff !important;
    padding: 0 4px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
  }

  body header#header .site-header__cart-count .CartCount,
  #header .site-header__cart-count .CartCount {
    position: static !important;
    border: none !important;
    background: transparent !important;
    color: #000000 !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: normal !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  body header#header .site-header__cart-count .cart-words,
  #header .site-header__cart-count .cart-words {
    display: none !important;
  }

  /* HIDE COMPARE ICON - SAVE SPACE */
  body header#header .site-header__links .site-header__compare,
  #header .site-header__links .site-header__compare {
    display: none !important;
  }

  /* HIDE TOP BAR ON MOBILE */
  body header#header .dt-sc-header-top-bar,
  #header .dt-sc-header-top-bar {
    display: none !important;
  }

  /* HIDE ICON FALLBACK TEXT */
  body header#header .icon__fallback-text,
  #header .icon__fallback-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    clip: rect(0, 0, 0, 0) !important;
    overflow: hidden !important;
  }

  /* STICKY HEADER ADJUSTMENTS */
  body #header .sticky-header-active {
    padding: 10px 0 !important;
  }

  body #header .sticky-header-active .logo img,
  #header .sticky-header-active .logo img {
    max-width: 65px !important;
    width: 65px !important;
  }

  body #header .sticky-header-active .site-header__icon,
  #header .sticky-header-active .site-header__icon {
    width: 36px !important;
    height: 36px !important;
  }

  body #header .sticky-header-active .site-header__account-button,
  #header .sticky-header-active .site-header__account-button {
    height: 32px !important;
    line-height: 32px !important;
    padding: 0 14px !important;
    font-size: 12px !important;
  }

  /* ABSOLUTE FINAL OVERRIDE - DIY Kits 3 column mobile */
  div.row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section.dt-sc-column.four-column[class*="column"] {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
  }

  /* FORCE grid items to NOT be 100% width */
  div.row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section > .dt-sc-grid-banner[class*="content"] {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
  }

}

/* DIY Kits mobile hardening fix — enforce 3-column grid and prevent overflow (extra guard) */
@media (max-width: 576px) {
  .row.dt-custom-nopadding-grid-with-textlink { 
    overflow-x: hidden !important; 
    width: 100% !important; 
    max-width: 100% !important; 
    margin: 0 auto !important; 
  }
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section { 
    overflow-x: hidden !important; 
    width: 100% !important; 
    max-width: 100% !important; 
  }
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-image { 
    height: 100px !important; 
  }
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-content .dt-sc-btn { 
    width: 100% !important; 
  }
}

/* DIY Kits (mobile) — simplify card layout to stop self-scrolling and tall buttons */
@media (max-width: 576px) {
  /* Container: stable 3 columns, no inner scroll */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
    padding: 0 12px !important;
    overflow: visible !important;
  }

  /* Card wrapper: no flex, no forced height */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section > .dt-sc-grid-banner {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
  }

  /* Image block: natural height */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-image {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 0 8px 0 !important;
  }
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-image img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }

  /* Content: stack and keep button compact */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-content {
    display: block !important;
    padding: 0 !important;
  }
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-content .dt-sc-btn {
    display: inline-block !important;
    width: auto !important;
    min-width: 72px !important;
    padding: 8px 12px !important;
  }
}

/* DIY Kits (mobile) — final strong overrides for layout + sizing */
@media (max-width: 576px) {
  /* Use natural document flow for all DIY cards regardless of style */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section > .dt-sc-grid-banner,
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section > .dt-sc-grid-banner.grid-style,
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section > .dt-sc-grid-banner.list-style,
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section > .dt-sc-grid-banner.overlay-style {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    background: transparent !important;
  }

  /* Ensure image sits on top and is not absolutely positioned */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-image {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 0 8px 0 !important;
  }
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-image img {
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
  }

  /* Text/content directly below image */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-content {
    position: static !important;
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 4px !important;
    overflow: visible !important;
  }

  /* Compact buttons; never full-width */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-content .dt-sc-btn,
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-content a.dt-sc-btn {
    display: inline-block !important;
    width: auto !important;
    min-width: 84px !important;
    padding: 8px 12px !important;
    line-height: 1.2 !important;
    margin: 6px auto 0 !important;
  }

  /* Remove any overlay pseudo elements that might cover content */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .with-overlay:before,
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .with-gradient-overlay:before { display: none !important; }

  /* Section: auto height only */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section { min-height: 0 !important; }
}

/* DIY Kits (mobile) — reduce image size and tighten heading spacing */
@media (max-width: 576px) {
  /* Smaller image height so titles sit immediately below */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-image {
    height: 72px !important;
  }
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-image img {
    height: 100% !important;
    object-fit: contain !important;
  }

  /* Reduce space between section heading and cards */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-heading {
    margin-bottom: 8px !important;
  }

  /* Slightly tighter grid gap */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section {
    gap: 8px !important;
  }
}

/* DIY Kits (mobile) — tighten heading-to-cards spacing further */
@media (max-width: 576px) {
  /* Reduce heading wrapper spacing decisively */
  .home-grid-banner .row.dt-custom-nopadding-grid-with-textlink > .dt-sc-heading {
    margin-bottom: 6px !important;
  }
  .home-grid-banner .row.dt-custom-nopadding-grid-with-textlink > .dt-sc-heading *:not(:last-child) {
    margin-bottom: 6px !important;
  }
  /* Reduce gap between image and text */
  .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner .dt-sc-grid-banner-image {
    margin-bottom: 4px !important;
  }
}

/* DIY Kits (mobile) — final source-order win to reduce image + heading spacing */
@media (max-width: 767px) {
  /* Shorter images so card titles sit tighter under them */
  .home-grid-banner .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section .dt-sc-grid-banner .dt-sc-grid-banner-image {
    height: 64px !important;
    margin-bottom: 4px !important;
  }

  /* Minimize section heading gap above the cards */
  .home-grid-banner .row.dt-custom-nopadding-grid-with-textlink > .dt-sc-heading {
    margin-bottom: 4px !important;
  }
  .home-grid-banner .row.dt-custom-nopadding-grid-with-textlink > .dt-sc-heading *:not(:last-child) {
    margin-bottom: 4px !important;
  }

  /* Trim wrapper padding just for this section on mobile */
  .home-grid-banner .dt-sc-section-wrapper {
    padding-top: 8px !important;
    padding-bottom: 20px !important;
  }

  /* Slightly tighter grid gap */
  .home-grid-banner .row.dt-custom-nopadding-grid-with-textlink .dt-sc-grid-banner-section {
    gap: 6px !important;
  }

  /* Nuke any residual top spacing from containers/rows for this section */
  .home-grid-banner .dt-sc-section-wrapper,
  .home-grid-banner .dt-sc-section-wrapper > .container,
  .home-grid-banner .dt-sc-section-wrapper > .container > .row {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  /* Ensure heading wrapper itself adds no extra gap */
  .home-grid-banner .row.dt-custom-nopadding-grid-with-textlink > .dt-sc-heading {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }
}

/* Shop by Category – center images and enlarge cards (scoped to home grid banner) */
.home-grid-banner .dt-sc-grid-banner-section .dt-sc-grid-banner {
  padding: 14px 12px !important;
  border-radius: 12px !important;
  position: relative !important; /* ensure a stacking context */
}

.home-grid-banner .dt-sc-grid-banner-section .dt-sc-grid-banner .dt-sc-grid-banner-image {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: static !important;
  height: 110px !important;
  min-height: 110px !important;
  margin-bottom: 10px !important;
  position: relative !important;
  z-index: 2 !important; /* keep image above overlays */
}

/* Ensure grid banner image and content stack correctly on home page */
.home-grid-banner .dt-sc-grid-banner .dt-sc-grid-banner-image img {
  position: relative !important;
  z-index: 2 !important;
}

/* Category grid: force anchor + image to center inside image wrapper */
.home-grid-banner .dt-sc-grid-banner .dt-sc-grid-banner-image > a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  position: static !important;
  margin: 0 auto !important;
}
.home-grid-banner .dt-sc-grid-banner .dt-sc-grid-banner-image > a > img {
  display: block !important;
  margin: 0 auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
}
.home-grid-banner .dt-sc-grid-banner.overlay-style .dt-sc-grid-banner-content,
.home-grid-banner .dt-sc-grid-banner .dt-sc-grid-banner-content.overlay-active {
  position: relative !important;
  z-index: 3 !important; /* only raise when overlay is actually used */
}
/* For list/grid styles, keep content below the image (no overlaying) */
.home-grid-banner .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content,
.home-grid-banner .dt-sc-grid-banner.grid-style .dt-sc-grid-banner-content {
  position: static !important;
  z-index: auto !important;
}
.home-grid-banner .dt-sc-grid-banner .with-overlay:before,
.home-grid-banner .dt-sc-grid-banner .with-gradient-overlay:before {
  z-index: 1 !important;
}

/* Support Block (Shop by Category) – center icons and enlarge cards */
#shopify-section-*.home-support-block .dt-sc-support-blocks-section .dt-sc-support-block,
.home-support-block .dt-sc-support-blocks-section .dt-sc-support-block {
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  padding: 18px 14px !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06) !important;
}

.home-support-block .dt-sc-support-blocks-section .dt-sc-support-block .dt-sc-support-icon-image {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 110px !important;
  min-height: 110px !important;
  margin: 0 0 10px 0 !important;
}

.home-support-block .dt-sc-support-blocks-section .dt-sc-support-block .dt-sc-support-icon-image img {
  width: auto !important;
  max-width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  display: block !important;
}

.home-support-block .dt-sc-support-blocks-section .dt-sc-support-block .dt-sc-support-content {
  width: 100% !important;
  padding: 0 6px !important;
  text-align: center !important;
}
/* Remove left padding applied by default section styles */
.home-support-block .dt-sc-support-blocks-section .dt-sc-support-block .dt-sc-support-content { padding-left: 0 !important; padding-right: 0 !important; }

/* Make each swiper slide a bit wider so the card can breathe */
.home-support-block .dt-sc-swiper-slider .swiper-slide { width: 180px !important; }

/* Safer targeting for slider instance: center and size icon area */
.home-support-block .dt-sc-swiper-slider .dt-sc-support-icon-image { display:flex !important; align-items:center !important; justify-content:center !important; }
.home-support-block .dt-sc-swiper-slider .dt-sc-support-icon-image img { width:auto !important; height:100% !important; max-width:100% !important; object-fit:contain !important; }

/* Final centering + size override inside anchor (wins over section inline <style>) */
.home-support-block .dt-sc-support-icon-image > a { 
  display: flex !important; 
  align-items: center !important; 
  justify-content: center !important; 
  width: 100% !important; 
  height: 100% !important; 
}
.home-support-block .dt-sc-support-icon-image > a > img { 
  width: auto !important; 
  max-width: 100% !important; 
  height: 100% !important; 
  object-fit: contain !important; 
  margin: 0 auto !important; 
  display: block !important; 
}

/* Even higher specificity to defeat per-section width rules */
.home-support-block .dt-sc-swiper-slider .swiper-slide .dt-sc-support-icon-image > a > img,
  .home-support-block .dt-sc-support-blocks-section .dt-sc-support-block .dt-sc-support-icon-image > a > img {
  width: auto !important;
  height: 100% !important;
}

@media (min-width: 768px) {
  .home-support-block .dt-sc-support-blocks-section .dt-sc-support-block { padding: 16px 14px !important; }
  .home-support-block .dt-sc-support-blocks-section .dt-sc-support-block .dt-sc-support-icon-image {
    height: 140px !important;
    min-height: 140px !important;
  }
  /* Slightly larger cards on tablet/desktop */
  .home-support-block .dt-sc-swiper-slider .swiper-slide { width: 220px !important; }
}

/* Mobile: make icon wrapper fill slide width so flex centering works */
@media (max-width: 767px) {
  .home-support-block .dt-sc-swiper-slider .swiper-slide .dt-sc-support-icon-image {
    width: 100% !important;
    max-width: 100% !important;
  }
  .home-support-block .dt-sc-swiper-slider .swiper-slide .dt-sc-support-icon-image a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
  }
  .home-support-block .dt-sc-swiper-slider .swiper-slide .dt-sc-support-icon-image img {
    margin: 0 auto !important;
  }
}

.home-grid-banner .dt-sc-grid-banner-section .dt-sc-grid-banner .dt-sc-grid-banner-image img {
  width: auto !important;
  max-width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  display: block !important;
}

@media (min-width: 768px) {
  .home-grid-banner .dt-sc-grid-banner-section .dt-sc-grid-banner {
    padding: 16px 14px !important;
  }
  .home-grid-banner .dt-sc-grid-banner-section .dt-sc-grid-banner .dt-sc-grid-banner-image {
    height: 140px !important;
    min-height: 140px !important;
  }
}

/* Resin Art Banner (below DIY Kits) — ensure image + text show on mobile */
@media (max-width: 767px) {
  .dt-custom-wide-banner .dt-sc-grid-banner-section .dt-sc-grid-banner.list-style {
    display: block !important;
    background: #ffffff !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.08) !important;
  }

  .dt-custom-wide-banner .dt-sc-grid-banner-section .dt-sc-grid-banner.list-style .dt-sc-grid-banner-image {
    position: relative !important;
    width: 100% !important;
    height: 180px !important;
    min-height: 180px !important;
    top: auto !important;
    left: auto !important;
  }
  .dt-custom-wide-banner .dt-sc-grid-banner-section .dt-sc-grid-banner.list-style .dt-sc-grid-banner-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block !important;
  }

  .dt-custom-wide-banner .dt-sc-grid-banner-section .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content {
    position: relative !important;
    width: 100% !important;
    background: #FFB300 !important;
    padding: 18px 16px !important;
    display: block !important;
  }

  .dt-custom-wide-banner .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content .dt-sc-main-title,
  .dt-custom-wide-banner .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content h4.dt-sc-main-title {
    color: #fff !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.25 !important;
    font-size: 18px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
  .dt-custom-wide-banner .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content .dt-sc-sub-title,
  .dt-custom-wide-banner .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content p.dt-sc-description {
    color: #1a1a1a !important;
    margin: 0 0 12px 0 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
  .dt-custom-wide-banner .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content .dt-sc-btn {
    background: #000 !important;
    color: #fff !important;
    padding: 12px 18px !important;
    border-radius: 8px !important;
    display: inline-block !important;
    width: auto !important;
  }
}

/* Resin Art card styling (all viewports) */
.dt-custom-wide-banner .dt-sc-grid-banner-section .dt-sc-grid-banner.list-style {
  display: block !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08) !important;
}
.dt-custom-wide-banner .dt-sc-grid-banner-section .dt-sc-grid-banner.list-style .with-overlay:before,
.dt-custom-wide-banner .dt-sc-grid-banner-section .dt-sc-grid-banner.list-style .with-gradient-overlay:before {
  display: none !important;
}
.dt-custom-wide-banner .dt-sc-grid-banner-section .dt-sc-grid-banner.list-style .dt-sc-grid-banner-image {
  position: relative !important;
  width: 100% !important;
  height: 240px !important;
  min-height: 240px !important;
}
.dt-custom-wide-banner .dt-sc-grid-banner-section .dt-sc-grid-banner.list-style .dt-sc-grid-banner-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}
.dt-custom-wide-banner .dt-sc-grid-banner-section .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content {
  background: #FFB300 !important;
  padding: 24px 20px !important;
}
.dt-custom-wide-banner .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content .dt-sc-main-title,
.dt-custom-wide-banner .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content h4.dt-sc-main-title {
  color: #ffffff !important;
  margin: 0 0 10px 0 !important;
  line-height: 1.25 !important;
}
.dt-custom-wide-banner .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content .dt-sc-sub-title,
.dt-custom-wide-banner .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content p.dt-sc-description {
  color: #1a1a1a !important;
  opacity: 0.9 !important;
  margin: 0 0 16px 0 !important;
}
.dt-custom-wide-banner .dt-sc-grid-banner.list-style .dt-sc-grid-banner-content .dt-sc-btn {
  background: #000000 !important;
  color: #ffffff !important;
  padding: 12px 20px !important;
  border-radius: 8px !important;
  display: inline-block !important;
  width: auto !important;
}

@media (max-width: 991px) and (min-width: 768px) {
  .dt-custom-wide-banner .dt-sc-grid-banner-section .dt-sc-grid-banner.list-style .dt-sc-grid-banner-image {
    height: 220px !important;
    min-height: 220px !important;
  }
}
/* Removed section-specific icon sizing/offset to preserve true centering */

/* Footer (CIY) logo — slightly smaller without affecting header */
footer .logo img,
.site-footer .logo img,
.site-footer__logo img,
.footer__logo img,
.footer-logo img,
.footer .logo img {
  max-width: 120px !important;
  height: auto !important;
}

@media (max-width: 767px) {
  footer .logo img,
  .site-footer .logo img,
  .site-footer__logo img,
  .footer__logo img,
  .footer-logo img,
  .footer .logo img {
    max-width: 90px !important;
  }
}
/* Desktop only: left/top align + left→right white gradient on slideshow */
@media (min-width: 992px) {
  /* Host overlay on each slide */
  .slider_style_3.swiper-slide {
    position: relative !important;
    isolation: isolate !important; /* keep overlay under content */
  }
  .slider_style_3.swiper-slide::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
      90deg,
      rgba(255,255,255,0.95) 0%,
      rgba(255,255,255,0.75) 35%,
      rgba(255,255,255,0.35) 70%,
      rgba(255,255,255,0) 100%
    );
  }

  /* Ensure image layer stays below overlay/content */
  .slider_style_3.swiper-slide > a {
    position: relative !important;
    z-index: 0 !important;
    display: block !important;
  }

  /* Left/top align text container and lift above overlay */
  .slider_style_3.swiper-slide .slider-content {
    position: relative !important;
    z-index: 2 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: left !important;
    padding-left: clamp(24px, 4vw, 72px) !important;
    padding-top: clamp(24px, 4vw, 72px) !important;
    background: transparent !important; /* show gradient */
  }

  /* Override theme utilities forcing center/right */
  .slider_style_3.swiper-slide .slider-content.text-center,
  .slider_style_3.swiper-slide .slider-content.text-end {
    text-align: left !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
  }
  .slider_style_3.swiper-slide .multiple-buttons {
    justify-content: flex-start !important;
  }

  /* Dark text over white gradient for contrast */
  .slider_style_3.swiper-slide .slide-heading,
  .slider_style_3.swiper-slide .slide-sub-heading-2,
  .slider_style_3.swiper-slide .slide-text,
  .slider_style_3.swiper-slide .slide-button {
    color: #111 !important;
  }
}
@media (min-width: 992px) {
  /* Keep overlay below text, but above image */
  .slider_style_3.swiper-slide {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important; /* safe clipping */
  }
  .slider_style_3.swiper-slide::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1; /* gradient layer */
    pointer-events: none;
    background: linear-gradient(
      90deg,
      rgba(255,255,255,0.95) 0%,
      rgba(255,255,255,0.75) 35%,
      rgba(255,255,255,0.35) 70%,
      rgba(255,255,255,0) 100%
    );
  }
  /* Ensure image stays under everything */
  .slider_style_3.swiper-slide > a {
    position: relative !important;
    z-index: 0 !important;
    display: block !important;
  }

  /* CRITICAL: place text over the image, top-left */
  .slider_style_3.swiper-slide .slider-content {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    transform: none !important;
    margin: 0 !important;
    z-index: 2 !important; /* above gradient */
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    text-align: left !important;
    padding-left: clamp(24px, 4vw, 72px) !important;
    padding-top: clamp(24px, 4vw, 72px) !important;
    max-width: min(760px, 60%) !important;
    background: transparent !important; /* no card bg on desktop */
  }

/* Neutralize theme utilities that center/right-align */
.slider_style_3.swiper-slide .slider-content.text-center,
.slider_style_3.swiper-slide .slider-content.text-end {
text-align: left !important;
align-items: flex-start !important;
justify-content: flex-start !important;
}
.slider_style_3.swiper-slide .multiple-buttons {
justify-content: flex-start !important;
}

/* Dark text over the white gradient */
.slider_style_3.swiper-slide .slide-heading,
.slider_style_3.swiper-slide .slide-sub-heading-2,
.slider_style_3.swiper-slide .slide-text,
.slider_style_3.swiper-slide .slide-button {
color: #111 !important;
}

/* Final override: ensure slideshow text overlays banner in all cases */
.home-slideshow-section .swiper-slide { position: relative !important; }
.home-slideshow-section .swiper-slide > a { position: absolute !important; inset: 0 !important; z-index: 0 !important; display: block !important; }
.home-slideshow-section .swiper-slide .slide-img { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; z-index: 0 !important; }
.home-slideshow-section .swiper-slide .slider-content { position: absolute !important; z-index: 2 !important; left: 16px !important; right: 16px !important; bottom: 20px !important; top: auto !important; transform: none !important; background: rgba(255,255,255,0.75) !important; border-radius: 12px !important; padding: 20px !important; }
@media (min-width: 992px) {
  .home-slideshow-section .swiper-slide .slider-content { top: 0 !important; left: 0 !important; right: auto !important; bottom: auto !important; background: transparent !important; padding-left: clamp(24px, 4vw, 72px) !important; padding-top: clamp(24px, 4vw, 72px) !important; max-width: min(760px, 60%) !important; z-index: 2 !important; }
}
/* Give slides a stable height so absolute children don't collapse it */
.home-slideshow-section .swiper-slide { min-height: clamp(520px, 55vh, 680px) !important; }

/* Gradient overlay for slider styles 1 and 2 */
.slider_style_1.swiper-slide,
.slider_style_2.swiper-slide {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
}
.slider_style_1.swiper-slide::before,
.slider_style_2.swiper-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.95) 0%,
    rgba(255, 255, 255, 0.75) 35%,
    rgba(255, 255, 255, 0.35) 70%,
    rgba(255, 255, 255, 0) 100%
  ) !important;
}

@media (min-width: 992px) {
  .home-slideshow-section .swiper-slide .slider-content-bg {
    background: transparent !important;
    box-shadow: none !important;
  }
}

@media (max-width: 991px) {
  .home-slideshow-section .swiper-slide .slider-content-bg {
    background: rgba(255, 255, 255, 0.8) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12) !important;
    backdrop-filter: none !important;
  }
}

@media (max-width: 991px) {
  .slider_style_1.swiper-slide,
  .slider_style_2.swiper-slide,
  .slider_style_3.swiper-slide {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;
  }

  .slider_style_1.swiper-slide::before,
  .slider_style_2.swiper-slide::before,
  .slider_style_3.swiper-slide::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.95) 0%,
      rgba(255, 255, 255, 0.9) 25%,
      rgba(255, 255, 255, 0.65) 55%,
      rgba(255, 255, 255, 0) 100%
    ) !important;
  }

  .slider_style_1.swiper-slide .slider-content,
  .slider_style_2.swiper-slide .slider-content,
  .slider_style_3.swiper-slide .slider-content,
  .slider_style_1.swiper-slide .slider-content-bg,
  .slider_style_2.swiper-slide .slider-content-bg,
  .slider_style_3.swiper-slide .slider-content-bg {
    background: transparent !important;
    box-shadow: none !important;
  }
}
@media (max-width: 767px) {
    #shopify-section-161969332098faeaea.home-support-block .dt-sc-swiper-slider .swiper-slide .dt-sc-support-icon-image img {
        width: 60px !important;
        height: 60px !important;
        max-width: 60px !important;
        max-height: 60px !important;
        object-fit: contain !important;
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        margin-left: 54px !important;
    }
}