/* ===================================
    Garden Outdoor living
====================================== */
/* font */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Figtree:wght@300;400;500;600;700;800&display=swap');
/* variable */
:root {
    /* --base-color: #fee300; */
    --base-color: #97c440;
    --alt-font: 'Outfit', sans-serif;
    --primary-font: 'Figtree', sans-serif;
    --medium-gray: #828282;
    /* --green-shade: #d5d52b; */
    --green-shade: #97c440;
    --dark-green-shade: #4e843c;
}
/* reset */
body {
    font-size: 17px;
    line-height: 32px;
}
a:hover {
    color: var(--dark-gray);
}
.input-small, .textarea-small, .select-small {
    font-size: 14px;
}
.input-small {
    padding: 9px 15px;
}
/* header */
header .navbar-brand img {
    /* max-height: 34px; */
    max-height: 65px;
}
header .navbar-brand {
    padding: 22px 0;
}
.navbar.center-logo .navbar-nav .nav-link {
    padding: 29px 20px;
    font-size: 19px;
}
.header-icon .icon > a {
    padding-left: 20px;
}
.header-icon .icon .header-language > a, .header-icon .icon .header-cart > a {
    padding-left: 18px;
}
.header-cart-icon .cart-count {
    /* color: var(--dark-gray); */
    color: var(--base-color);
}
header .widget {
    font-size: 17px;
    display: inline-block;
}
.navbar .navbar-nav .submenu-content ul .sub-title {
    font-size: 17px;
    margin-bottom: 3px;
}
.navbar .navbar-nav .dropdown .dropdown-menu a {
    font-size: 16px;
    padding-bottom: 3px;
    font-weight: 300;
    border-color: transparent;
}
.header-cart-icon .header-cart .cart-item-list {
    border-radius: 0;
}
.header-cart-icon .header-cart .cart-item-list .cart-item .product-detail a {
    font-size: 16px;
    line-height: 28px;
}
.header-cart-icon .cart-count {
    /* background-color: var(--dark-gray); */
    background-color: var(--base-color);
}
.navbar.center-logo .navbar-left, .navbar.center-logo .navbar-right {
    width: 35%
}
/* bg color */
.bg-nero-grey, .bg-nero-grey:focus {
    background-color: #1B1B1B;
}
/* min-width */
.min-w-150px {
    min-width: 150px;
}
/* btn */
.btn.btn-large {
    padding: 15px 30px;
}
.btn {
    text-transform: inherit;
}
.btn.btn-dark-gray {
    font-weight: 400;
}
.btn.btn-extra-large {
    font-size: 19px;
    padding: 20px 38px;
}
.btn.btn-large {
    font-size: 18px;
    padding: 15px 30px;
}
.btn.btn-medium {
    font-size: 16px;
    padding: 13px 26px;
}
.btn.btn-small {
    font-size: 16px;
    padding: 10px 20px;
}
.btn.btn-very-small {
    font-size: 14px;
    padding: 9px 20px;
}
.btn.btn-link {
    padding: 0 0 2px;
}
/* page title */
.page-title-extra-large h1 {
    font-size: 4.5rem;
    line-height: 4.5rem;
}
/* top bottom left right class */
.left-15 {
    left: 15%;
}
/* interactive banner */
.interactive-banner-style-09 .image-content:hover .content-arrow {
    opacity: 1;
}
/* tab style 04 */
.tab-style-04 .nav-tabs .nav-item .nav-link {
    line-height: 50px;
}
/* progress bar 02 */
.progress-bar-style-02 .progress {
    height: 10px;
}
/* footer */
.footer-dark, .footer-dark p, .footer-dark a {
    color: var(--medium-gray);
}
footer .footer-logo img {
    /* max-height: 34px; */
    max-height: 65px;
}
footer .nav-link {
    color: var(--white);
    padding: 0 20px;
}
footer ul li {
    margin-bottom: 0;
}
footer .elements-social.social-icon-style-02 li {
    margin: 0 14px 0 0;
}
/* tab style 07 */
.tab-style-07 .nav-tabs .nav-item .nav-link {
    padding: 20px 30px;
}
.tab-style-07 .nav-tabs .nav-item .nav-link.active span,
.tab-style-07 .nav-tabs .nav-item .nav-link:hover span {
    color: var(--dark-gray);
}
/* tooltip */
.tooltip.show {
    opacity: 1;
}
.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before, .bs-tooltip-top .tooltip-arrow::before {
    border-top-color: var(--dark-gray);
    top: -2px;
}
.tooltip .tooltip-inner {
    background-color: var(--dark-gray);
    border-radius: 3px;
    font-size: 10px;
    text-transform: uppercase;
    padding: 5px 10px;
    font-weight: 500;
}
/* media query responsive */
@media (max-width: 1399px) {
    .sticky-wrap.shadow-in { left: 25px; }
    .center-logo .navbar-nav .nav-link, header.sticky .center-logo .navbar-nav .nav-link {
        padding-left: 13px;
        padding-right: 13px;
    }
}
@media (max-width: 1250px){
    .sticky-wrap.shadow-in { left: 10px; }
}
@media (max-width: 991px) {
    .tab-style-07 .nav-tabs .nav-item .nav-link { padding: 20px; }
    .navbar.center-logo .navbar-left, .navbar.center-logo .navbar-right { width: 100%; }
    .navbar .navbar-nav .dropdown .dropdown-menu a, .navbar .navbar-nav .dropdown .dropdown-menu li.sub-title, .navbar-modern-inner .navbar-nav .dropdown .dropdown-menu li.sub-title, .navbar-full-screen-menu-inner .navbar-nav .dropdown .dropdown-menu li.sub-title { line-height: normal; }
    .header-icon .icon > a, .header-icon .icon .header-language > a, .header-icon .icon .header-cart > a { padding-left: 12px; }
    footer .nav-link { padding: 0 12px; }
    .tab-style-04 .nav-tabs .nav-item { padding: 0 16px; }
}
@media (max-width: 767px) {
    .tab-style-04 .nav-tabs .nav-item .nav-link { line-height: 35px; }
    .swiper-number-pagination-progress-vertical .swiper-pagination-wrapper { right: 15px;}
    .btn.btn-large { font-size: 17px; padding: 13px 25px; }
}
@media (min-width: 1301px) and (max-width: 1399px) {
    .navbar.center-logo .navbar-nav .nav-link, header.sticky .center-logo .navbar-nav .nav-link { padding-left: 13px; padding-right: 13px; font-size: 18px; }
}
@media (min-width: 1200px) and (max-width: 1300px) {
    .navbar.center-logo .navbar-nav .nav-link, header.sticky .center-logo .navbar-nav .nav-link { padding-left: 11px; padding-right: 11px; font-size: 17px; }
    .header-icon .icon > a { font-size: 16px; padding-left: 13px; }
}
@media (min-width: 992px) and (max-width: 1199px) {
    .header-icon .icon > a { font-size: 16px; padding-left: 10px; }
    .header-icon .icon .header-language > a, .header-icon .icon .header-cart > a { padding-left: 10px; font-size: 16px; }
    .navbar.center-logo .navbar-nav .nav-link, header.sticky .center-logo .navbar-nav .nav-link { padding-left: 14px; padding-right: 14px; font-size: 17px; }
    .btn.btn-switch-text.btn-large>span { padding: 16px 28px; }
}


.markup-description  ul li {
    list-style: circle !important;
}

.new-product-grid-item:hover {
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}


.product-card:hover {
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.shop-image .lable {
    position: absolute;
    left: 17px;
    top: 17px;
    color: var(--white);
    font-size: 14px;
    line-height: 21px;
    border-radius: 2px;
    text-transform: uppercase;
    font-weight: 700;
    border-radius: 50% !important;
    height: 30px;
    width: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Default: show grid-1, hide grid-2 */
.grid-1 {
    display: block;
    height: auto !important;
}
.grid-2 {
    display: none;
}

/* On small screens (max-width: 767px), reverse visibility */
@media (max-width: 767.98px) {
    .grid-1 {
        display: none !important;
    }
    .grid-2 {
        display: block !important;
    }
}

.promo-card {
  display: grid;
  grid-template-columns: 300px 1fr 240px; /* fixed | flexible | fixed */
  gap: 15px;
  align-items: center;
  border-radius: 6px;
  padding: 15px;
  min-height: 220px; /* ✅ ensures block height */
  overflow: hidden;
  background-color: white;
}

.promo-img {
  position: relative;
  width: 100%;
  height: 200px;
}

.promo-img img {
  width: 100%;
  height: 100%;
  /* object-fit: contain; */
    object-fit: cover;
}

.badge-new {
    position: absolute;
    top: 5px;
    left: 5px;
    /* background: var(--green); */
    background: var(--green-shade);
    color: #fff;
    font-size: 12px;
    padding: 0px 14px;
    border-radius: 50px;
    font-weight: bolder;
}

.product-info {
  padding: 0 10px;
  text-align: left;
}

.promo-description {
  font-size: 16px;
  color: #666;
  line-height: 24px;
  text-align: left;
}

.code-wrapper {
    text-align: center;
    border-left: 1px solid var(--base-color);
    padding-left: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    justify-content: center;
}

.code-expiry {
  font-size: 1.5rem;
  font-weight: 600;
  color: var(--alt-font);
  margin-bottom: 10px;
}

.get-code, .get-code:hover {
  background-color: var(--green-shade);
  color: white;
  font-weight: bold;
  font-size: 1rem;
  border: none;
  padding: 6px 15px;
  border-radius: 50px;
}

.get-code i {
  margin-right: 5px;
}

.promo-card:hover {
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.amazon-button {
    max-width: 150px !important;
}

.amazon-button-link:hover {
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.btn-dark-gray {
    background-color: var(--dark-green-shade) !important;
}

.btn-dark-gray:hover {
    background-color: var(--dark-green-shade) !important;
    border-color: var(--dark-green-shade) !important;
}


.navbar .navbar-nav .nav-item:hover .nav-link {
    color: var(--dark-green-shade) !important;
}

.lines-1 {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: repeat;
  background-image: url("data:image/svg+xml;utf8,%3Csvg width=%222000%22 height=%221400%22 xmlns=%22http:%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath fill=%22%23f4f9eb%22 d=%22M0 0h2000v1400H0z%22%2F%3E%3Cpath d=%22M0 155h0c103.409.743 206.817 1.487 320-1 113.183-2.487 236.14-8.204 351-9 114.86-.796 221.626 3.328 330 9 108.374 5.672 218.358 12.891 322 11s200.942-12.894 328-16c127.058-3.106 283.874 1.684 347 4 63.126 2.316 32.563 2.158 42 2%22 fill=%22none%22 stroke=%22%23abcf65%22 stroke-width=%222%22 stroke-linecap=%22round%22%2F%3E%3Cpath d=%22M0 311h0c103.514-.171 207.028-.342 318 2 110.972 2.342 229.403 7.198 344 6 114.597-1.198 225.359-8.448 336-15 110.641-6.552 221.162-12.406 331-6 109.838 6.406 218.995 25.07 344 28 125.005 2.93 265.859-9.877 323-15 57.141-5.123 30.57-2.561 44 0%22 fill=%22none%22 stroke=%22%23add069%22 stroke-width=%222%22 stroke-linecap=%22round%22%2F%3E%3Cpath d=%22M0 466h0c107.356.738 214.713 1.476 327 0s229.505-5.165 343-7 223.268-1.815 336 3c112.732 4.815 228.423 14.425 337 15 108.577.575 210.04-7.884 334-9 123.96-1.116 270.417 5.11 328 6 57.583.89 26.291-3.555 35-8%22 fill=%22none%22 stroke=%22%2399c544%22 stroke-width=%222%22 stroke-linecap=%22round%22%2F%3E%3Cpath d=%22M0 622h0c111.14 7.273 222.281 14.546 333 13 110.719-1.546 221.015-11.912 333-15 111.985-3.088 225.659 1.1 342 3 116.341 1.9 235.35 1.51 339 1s191.944-1.137 314-2c122.056-.863 277.873-1.96 340-2 62.127-.04 30.563.98 39 2%22 fill=%22none%22 stroke=%22%23d8e9b8%22 stroke-width=%222%22 stroke-linecap=%22round%22%2F%3E%3Cpath d=%22M0 777h0c102.314-2.572 204.628-5.145 319-3 114.372 2.145 240.8 9.006 358 8 117.2-1.006 225.17-9.88 333-16 107.83-6.12 215.522-9.486 324-3 108.478 6.486 217.744 22.823 347 28s278.502-.807 335-5c56.498-4.193 20.25-6.597 24-9%22 fill=%22none%22 stroke=%22%239ac545%22 stroke-width=%222%22 stroke-linecap=%22round%22%2F%3E%3Cpath d=%22M0 933h0c113.028-7.935 226.056-15.87 341-12 114.944 3.87 231.804 19.548 342 18 110.196-1.548 213.73-20.32 318-20 104.27.32 209.279 19.735 321 21 111.721 1.265 230.156-15.621 355-18 124.844-2.379 256.098 9.749 311 14 54.902 4.251 33.45.626 52-3%22 fill=%22none%22 stroke=%22%23a0c950%22 stroke-width=%222%22 stroke-linecap=%22round%22%2F%3E%3Cpath d=%22M0 1088h0c115.625-.921 231.25-1.843 339 2s207.624 12.45 320 11c112.376-1.45 237.253-12.955 350-20 112.747-7.045 213.365-9.63 315-4 101.635 5.63 204.286 19.477 329 23 124.714 3.523 271.49-3.28 333-7 61.51-3.72 37.755-4.36 54-5%22 fill=%22none%22 stroke=%22%239dc74b%22 stroke-width=%222%22 stroke-linecap=%22round%22%2F%3E%3Cpath d=%22M0 1244h0c110.594 3.167 221.188 6.335 331 9 109.812 2.665 218.843 4.829 334 2 115.157-2.829 236.44-10.65 346-11 109.56-.35 207.398 6.772 310 10 102.602 3.228 209.97 2.561 338 2 128.03-.561 276.723-1.018 337-3 60.277-1.982 32.139-5.491 44-9%22 fill=%22none%22 stroke=%22%23deecc3%22 stroke-width=%222%22 stroke-linecap=%22round%22%2F%3E%3C%2Fsvg%3E");
}

.waves-1 {
    background-color: #ffffff;
    opacity: 0.2;
    background-image:  repeating-radial-gradient( circle at 0 0, transparent 0, #ffffff 26px ), repeating-linear-gradient( #97c44055, #97c440 );
}


.lines-2 {
    position: relative;
    isolation: isolate; /* Prevent interference with internal z-index */
    z-index: 0;
}

.lines-2::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url('data:image/svg+xml;utf8,<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg"><path d="M 0 100 Q 50 0 100 100 T 200 100 T 300 100 T 400 100 T 500 100" fill="none" stroke="limegreen" stroke-width="6" stroke-linecap="round"/></svg>');
    background-repeat: repeat;
    background-size: 600px 200px; /* Adjust based on wave spacing */
    opacity: 0.2;
    z-index: -1;
    pointer-events: none;
}

.lines-3 {
    position: relative;
    isolation: isolate;
    z-index: 0;
    overflow: hidden;
}

.lines-3::before,
.lines-3::after {
    content: "";
    position: absolute;
    width: 200%;
    height: 200%;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0.15;
    pointer-events: none;
    z-index: -1;
    animation: worm-drift 30s linear infinite;
}

/* Wavy green worm 1 */
.lines-3::before {
    top: -20%;
    left: -20%;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1000' height='1000'><path d='M0 200 C 100 100, 200 300, 300 200 S 500 100, 600 200 S 800 300, 1000 200' stroke='limegreen' stroke-width='4' fill='none' stroke-linecap='round' /></svg>");
    animation-delay: 0s;
}

/* Worm 2 with more chaos */
.lines-3::after {
    top: -30%;
    left: -40%;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1000' height='1000'><path d='M0 300 C 80 200, 160 400, 240 300 S 400 200, 480 300 S 640 400, 720 300 S 880 200, 1000 300' stroke='limegreen' stroke-width='3' fill='none' stroke-linecap='round' /></svg>");
    animation-delay: -10s;
}

@keyframes worm-drift {
    0% {
        transform: translate(0, 0) rotate(0deg) scale(1);
    }
    50% {
        transform: translate(-10px, -20px) rotate(2deg) scale(1.05);
    }
    100% {
        transform: translate(0, 0) rotate(0deg) scale(1);
    }
}

.lines-4 {
    position: relative;
    isolation: isolate;
    z-index: 0;
    overflow: hidden;
}

.lines-4::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1000' height='800'><path d='M50 100 C 100 20, 200 180, 250 100' stroke='limegreen' stroke-width='4' fill='none'/><path d='M300 200 C 350 120, 450 280, 500 200' stroke='limegreen' stroke-width='3' fill='none'/><path d='M600 100 C 650 180, 750 20, 800 100' stroke='limegreen' stroke-width='3' fill='none'/><path d='M150 300 C 200 400, 300 250, 350 350' stroke='limegreen' stroke-width='2.5' fill='none'/><path d='M450 450 C 470 370, 580 580, 620 440' stroke='limegreen' stroke-width='2.5' fill='none'/><path d='M700 300 C 760 220, 840 360, 900 280' stroke='limegreen' stroke-width='3' fill='none'/><path d='M100 500 C 200 600, 250 480, 350 580' stroke='limegreen' stroke-width='3' fill='none'/><path d='M400 600 C 500 700, 600 550, 700 650' stroke='limegreen' stroke-width='3' fill='none'/></svg>");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    opacity: 0.2;
}

.categories-style-01 .categories-box .icon-box{
    width: 100% !important;
}


.navbar-left, .navbar-right {
    gap: 10px !important;
}