:root {
  --sk-primary: #69ad38;
  --sk-primary-dark: #39761d;
  --sk-primary-soft: #edf7e7;
  --sk-secondary: #e8b13e;
  --sk-dark: #172019;
  --sk-dark-two: #263029;
  --sk-text: #667068;
  --sk-light: #f6f8f5;
  --sk-white: #ffffff;
  --sk-border: #e3e9e1;
  --sk-danger: #e74f4f;
  --sk-shadow: 0 20px 50px rgba(29, 60, 23, 0.1);
  --sk-shadow-small: 0 12px 30px rgba(29, 60, 23, 0.08);
  --sk-transition: all 0.35s ease;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "DM Sans", sans-serif;
  color: var(--sk-dark);
  background: var(--sk-white);
  overflow-x: hidden;
}

body.sk-menu-open {
  overflow: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Manrope", sans-serif;
  font-weight: 800;
}

a {
  text-decoration: none;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

img {
  display: block;
  max-width: 100%;
}

button,
input,
select,
textarea {
  font-family: inherit;
}

.sk-section-space {
  padding: 100px 0;
}

.sk-section-light {
 background: #fff;
}

.sk-section-heading {
  max-width: 760px;
  margin: 0 auto 48px;
  text-align: center;
}

.sk-section-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  margin-bottom: 16px;
  border-radius: 50px;
  background: var(--sk-primary-soft);
  color: var(--sk-primary-dark);
  border: 1px solid rgba(105, 173, 56, 0.18);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.sk-section-title {
  margin-bottom: 16px;
  font-family: "Playfair Display", serif;
  /* font-size: clamp(34px, 4vw, 53px); */
  line-height: 1.15;
  color: var(--sk-dark);
}

.sk-section-heading p {
  margin: 0;
  color: var(--sk-text);
  font-size: 17px;
  line-height: 1.8;
}

.sk-primary-btn,
.sk-secondary-btn,
.sk-outline-btn,
.sk-dark-btn {
  min-height: 52px;
  padding: 13px 25px;
  border: 1px solid transparent;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 800;
  transition: var(--sk-transition);
  cursor: pointer;
}

.sk-primary-btn {
  background: var(--sk-primary);
  color: var(--sk-white);
}

.sk-primary-btn:hover {
  background: var(--sk-primary-dark);
  color: var(--sk-white);
  transform: translateY(-3px);
  box-shadow: 0 12px 26px rgba(57, 118, 29, 0.25);
}

.sk-dark-btn {
  background: var(--sk-dark);
  color: var(--sk-white);
}

.sk-dark-btn:hover {
  background: var(--sk-primary);
  color: var(--sk-white);
  transform: translateY(-3px);
}

.sk-secondary-btn {
  background: var(--sk-secondary);
  color: var(--sk-dark);
}

.sk-secondary-btn:hover {
  background: #f2c25f;
  color: var(--sk-dark);
  transform: translateY(-3px);
}

.sk-outline-btn {
  color: var(--sk-white);
  border-color: rgba(255, 255, 255, 0.6);
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(8px);
}

.sk-outline-btn:hover {
  color: var(--sk-dark);
  background: var(--sk-white);
  transform: translateY(-3px);
}

/* Topbar */

.sk-topbar {
  background: var(--sk-dark);
  color: var(--sk-white);
  padding: 9px 0;
  font-size: 13px;
}

.sk-topbar-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.sk-topbar-left,
.sk-topbar-right {
  display: flex;
  align-items: center;
  gap: 24px;
}

.sk-topbar a,
.sk-topbar span {
  color: rgba(255, 255, 255, 0.8);
}

.sk-topbar a {
  transition: var(--sk-transition);
}

.sk-topbar a:hover {
  color: #a9de83;
}

.sk-topbar i {
  margin-right: 7px;
  color: #9ed277;
}
/* Header */

.sk-header {
  position: relative;
  z-index: 1000;
  background: var(--sk-white);
  border-bottom: 1px solid var(--sk-border);
  transition: var(--sk-transition);
}

.sk-header.sk-sticky {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  animation: skHeaderDown 0.45s ease;
  box-shadow: 0 8px 30px rgba(15, 31, 18, 0.1);
}

@keyframes skHeaderDown {
  from {
    transform: translateY(-100%);
  }

  to {
    transform: translateY(0);
  }
}

.sk-header-wrapper {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px;
}

.sk-logo {
  flex-shrink: 0;
}

.sk-logo img {
  /*width: 130px;*/
  width: 90px;
  /* height: 62px; */
  object-fit: cover;
}

.sk-navigation {
  display: flex;
  align-items: center;
  gap: 2px;
}

.sk-nav-item {
  position: relative;
}

.custom-container {
  padding: 0 30px;
}

.sk-nav-link {
  min-height: 82px;
  padding: 0 13px;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--sk-dark);
  font-size: 14px;
  font-weight: 800;
  position: relative;
  transition: var(--sk-transition);
}

.sk-nav-link::after {
  content: "";
  position: absolute;
  left: 13px;
  right: 13px;
  bottom: 19px;
  height: 2px;
  background: var(--sk-primary);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.35s ease;
}

.sk-nav-link:hover,
.sk-nav-link.sk-active {
  color: var(--sk-primary-dark);
}

.sk-nav-link:hover::after,
.sk-nav-link.sk-active::after {
  transform: scaleX(1);
  transform-origin: left;
}

.sk-nav-link i {
  font-size: 10px;
  transition: transform 0.35s ease;
}

.sk-nav-item:hover > .sk-nav-link i {
  transform: rotate(180deg);
}

/* Normal Animated Dropdown */

.sk-dropdown {
  position: absolute;
  top: calc(100% + 1px);
  left: 0;
  width: 255px;
  padding: 11px;
  border-radius: 0 0 13px 13px;
  background: var(--sk-white);
  border-top: 3px solid var(--sk-primary);
  box-shadow: var(--sk-shadow);
  opacity: 0;
  visibility: hidden;
  transform: translateY(18px);
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease,
    transform 0.35s ease;
}

.sk-nav-item:hover .sk-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.sk-dropdown li {
  opacity: 0;
  transform: translateX(-8px);
  transition: var(--sk-transition);
}

.sk-nav-item:hover .sk-dropdown li {
  opacity: 1;
  transform: translateX(0);
}

.sk-nav-item:hover .sk-dropdown li:nth-child(1) {
  transition-delay: 0.04s;
}

.sk-nav-item:hover .sk-dropdown li:nth-child(2) {
  transition-delay: 0.08s;
}

.sk-nav-item:hover .sk-dropdown li:nth-child(3) {
  transition-delay: 0.12s;
}

.sk-nav-item:hover .sk-dropdown li:nth-child(4) {
  transition-delay: 0.16s;
}

.sk-nav-item:hover .sk-dropdown li:nth-child(5) {
  transition-delay: 0.2s;
}

.sk-nav-item:hover .sk-dropdown li:nth-child(6) {
  transition-delay: 0.24s;
}

.sk-nav-item:hover .sk-dropdown li:nth-child(7) {
  transition-delay: 0.28s;
}

.sk-dropdown a {
  padding: 11px 12px;
  border-radius: 7px;
  color: var(--sk-dark);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 14px;
  font-weight: 700;
  transition: var(--sk-transition);
}

.sk-dropdown a:hover {
  padding-left: 17px;
  background: var(--sk-primary-soft);
  color: var(--sk-primary-dark);
}

.sk-dropdown a i {
  color: var(--sk-primary);
  font-size: 11px;
}

.sk-header-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sk-header-icon {
  width: 43px;
  height: 43px;
  border: 1px solid var(--sk-border);
  border-radius: 50%;
  background: var(--sk-white);
  color: var(--sk-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  transition: var(--sk-transition);
}

.sk-header-icon:hover {
  background: var(--sk-primary);
  border-color: var(--sk-primary);
  color: var(--sk-white);
  transform: translateY(-2px);
}

.sk-cart-number {
  position: absolute;
  top: -5px;
  right: -3px;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: var(--sk-danger);
  color: var(--sk-white);
  font-size: 10px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sk-header-inquiry {
  min-height: 43px;
  padding: 10px 17px;
}

.sk-menu-button {
  width: 43px;
  height: 43px;
  border: none;
  border-radius: 8px;
  background: var(--sk-primary);
  color: var(--sk-white);
  display: none;
  font-size: 19px;
}

/* Search */

.sk-search-overlay {
  position: fixed;
  inset: 0;
  z-index: 3000;
  background: rgba(9, 17, 11, 0.9);
  backdrop-filter: blur(9px);
  opacity: 0;
  visibility: hidden;
  transition: var(--sk-transition);
  padding: 130px 20px 20px;
}

.sk-search-overlay.sk-search-active {
  opacity: 1;
  visibility: visible;
}

.sk-search-close {
  position: absolute;
  top: 30px;
  right: 35px;
  border: none;
  background: transparent;
  color: var(--sk-white);
  font-size: 32px;
}

.sk-search-form {
  position: relative;
  width: 760px;
  max-width: 100%;
  margin: auto;
  transform: translateY(-20px);
  transition: transform 0.4s ease;
}

.sk-search-overlay.sk-search-active .sk-search-form {
  transform: translateY(0);
}

.sk-search-form input {
  width: 100%;
  height: 70px;
  padding: 0 78px 0 25px;
  border: none;
  border-radius: 12px;
  outline: none;
  font-size: 17px;
}

.sk-search-form button {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 54px;
  height: 54px;
  border: none;
  border-radius: 9px;
  background: var(--sk-primary);
  color: var(--sk-white);
}

/* Mobile Menu */

.sk-mobile-overlay {
  position: fixed;
  inset: 0;
  z-index: 2400;
  background: rgba(0, 0, 0, 0.58);
  opacity: 0;
  visibility: hidden;
  transition: var(--sk-transition);
}

.sk-mobile-overlay.sk-active {
  opacity: 1;
  visibility: visible;
}

.sk-mobile-sidebar {
  position: fixed;
  top: 0;
  right: -100%;
  z-index: 2500;
  width: min(390px, 90vw);
  height: 100%;
  padding: 25px;
  overflow-y: auto;
  background: var(--sk-white);
  transition: right 0.42s cubic-bezier(0.77, 0, 0.18, 1);
}

.sk-mobile-sidebar.sk-active {
  right: 0;
}

.sk-mobile-head {
  padding-bottom: 20px;
  border-bottom: 1px solid var(--sk-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sk-mobile-head img {
  width: 100px;
  /* height: 55px; */
  object-fit: contain;
}

.sk-mobile-close {
  width: 40px;
  height: 40px;
  border: none;
  border-radius: 50%;
  background: var(--sk-primary-soft);
  color: var(--sk-primary-dark);
}

.sk-mobile-navigation {
  margin-top: 10px;
}

.sk-mobile-navigation > li {
  border-bottom: 1px solid var(--sk-border);
}

.sk-mobile-navigation > li > a,
.sk-mobile-dropdown-button {
  min-height: 60px;
  width: 100%;
  border: none;
  background: transparent;
  color: var(--sk-dark);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 16px;
  font-weight: 800;
  text-align: left;
}

.sk-mobile-dropdown-button i {
  transition: transform 0.35s ease;
}

.sk-mobile-dropdown-button.sk-active i {
  transform: rotate(180deg);
}

.sk-mobile-dropdown {
  display: none;
  padding: 0 0 13px 12px;
}

.sk-mobile-dropdown a {
  padding: 9px 10px;
  color: var(--sk-text);
  display: block;
  font-size: 14px;
  font-weight: 700;
}

.sk-mobile-contact {
  margin-top: 25px;
  padding: 20px;
  border-radius: 13px;
  background: var(--sk-primary-soft);
}

.sk-mobile-contact h4 {
  margin-bottom: 14px;
  font-size: 18px;
}

.sk-mobile-contact a {
  margin-top: 10px;
  display: block;
  color: var(--sk-dark);
  font-size: 14px;
}

/* ======================= sub category start  */
.sk-category-dropdown > .sk-dropdown-item {
  position: relative;
}

.sk-sub-dropdown {
  position: absolute;
  top: -11px;
  left: calc(100% + 11px);
  width: 255px;
  padding: 11px;
  margin: 0;
  list-style: none;
  background: var(--sk-white);
  border-top: 3px solid var(--sk-primary);
  border-radius: 0 0 13px 13px;
  /* box-shadow: var(--sk-shadow); */
  opacity: 0;
  visibility: hidden;
  transform: translateX(15px);
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease,
    transform 0.35s ease;
  z-index: 1100;
}

.sk-dropdown-item.sk-has-submenu:hover > .sk-sub-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}

.sk-sub-dropdown li {
  opacity: 1 !important;
  transform: none !important;
}

.sk-sub-dropdown li a {
  padding: 11px 12px;
  border-radius: 7px;
  color: var(--sk-dark);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-size: 14px;
  font-weight: 700;
  white-space: normal;
  transition: var(--sk-transition);
}

.sk-sub-dropdown li a:hover {
  padding-left: 17px;
  background: var(--sk-primary-soft);
  color: var(--sk-primary-dark);
}

/* =========================================================
   MOBILE SUB CATEGORY DROPDOWN
========================================================= */

.sk-mobile-category-item {
  border-bottom: 1px solid var(--sk-border);
}

.sk-mobile-subcategory-button {
  width: 100%;
  min-height: 48px;
  padding: 9px 10px;
  border: none;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  color: var(--sk-dark);
  font-size: 14px;
  font-weight: 700;
  text-align: left;
}

.sk-mobile-subcategory-button i {
  flex-shrink: 0;
  font-size: 11px;
  transition: transform 0.3s ease;
}

.sk-mobile-subcategory-button.sk-active i {
  transform: rotate(180deg);
}

.sk-mobile-category-link {
  width: 100%;
  padding: 13px 10px !important;
  display: block;
  color: var(--sk-dark) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.sk-mobile-subcategory-dropdown {
  display: none;
  margin: 0 0 10px 10px;
  padding: 6px 0 6px 12px;
  border-left: 2px solid var(--sk-primary);
  background: rgba(0, 0, 0, 0.015);
}

.sk-mobile-subcategory-dropdown a {
  padding: 9px 10px !important;
  display: block;
  color: var(--sk-text) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border-radius: 6px;
  transition: var(--sk-transition);
}

.sk-mobile-subcategory-dropdown a:hover {
  background: var(--sk-primary-soft);
  color: var(--sk-primary-dark) !important;
}

.sk-mobile-subcategory-dropdown .sk-mobile-view-all {
  color: var(--sk-primary-dark) !important;
  font-weight: 800 !important;
}

/* =========================================================
   RESPONSIVE
========================================================= */

/* Tablet + Mobile Header */
@media (max-width: 1199px) {
  /* Hide desktop navigation completely */
  .sk-navigation {
    display: none !important;
  }

  /* Show hamburger */
  .sk-menu-button {
    display: flex !important;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }

  /* Hide desktop inquiry button */
  .sk-header-inquiry {
    display: none !important;
  }

  .sk-header-wrapper {
    min-height: 70px;
    gap: 12px;
  }

  .sk-logo img {
    width: 105px;
    height: auto;
    object-fit: contain;
  }

  .sk-header-actions {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 7px;
    flex-shrink: 0;
  }

  .custom-container {
    padding-left: 20px;
    padding-right: 20px;
  }

  /* Desktop second-level dropdown not needed on tablet/mobile */
  .sk-sub-dropdown {
    display: none;
  }

  /* Keep sidebar fully outside viewport until opened */
  .sk-mobile-sidebar {
    right: -100%;
    width: min(390px, 90vw);
    max-width: 90vw;
    box-sizing: border-box;
    overflow-x: hidden;
  }

  .sk-mobile-sidebar.sk-active {
    right: 0;
  }
}

/* Tablet */
@media (max-width: 767px) {
  .sk-header-wrapper {
    min-height: 64px;
    gap: 8px;
  }

  .custom-container {
    padding-left: 15px;
    padding-right: 15px;
  }

  .sk-logo img {
    width: 90px;
  }

  .sk-header-actions {
    gap: 6px;
  }

  .sk-header-icon,
  .sk-menu-button {
    width: 38px;
    height: 38px;
  }

  .sk-header-icon {
    font-size: 14px;
  }

  .sk-menu-button {
    font-size: 17px;
  }

  .sk-mobile-sidebar {
    width: min(360px, 90vw);
    max-width: 90vw;
    right: -100%;
    padding: 20px;
  }

  .sk-mobile-dropdown {
    padding-left: 6px;
  }

  .sk-mobile-subcategory-button {
    min-height: 46px;
    font-size: 14px;
  }

  .sk-mobile-subcategory-dropdown {
    margin-left: 7px;
    padding-left: 9px;
  }

  .sk-mobile-subcategory-dropdown a {
    font-size: 13px !important;
  }
}

/* Small Mobile */
@media (max-width: 480px) {
  .sk-header-wrapper {
    min-height: 60px;
    gap: 6px;
  }

  .custom-container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .sk-logo img {
    width: 82px;
  }

  .sk-header-actions {
    gap: 5px;
  }

  .sk-header-icon,
  .sk-menu-button {
    width: 36px;
    height: 36px;
  }

  .sk-cart-number {
    width: 17px;
    height: 17px;
    top: -4px;
    right: -2px;
    font-size: 9px;
  }

  .sk-mobile-sidebar {
    width: 88vw;
    max-width: 340px;
    right: -100%;
    padding: 18px;
  }

  .sk-mobile-subcategory-button,
  .sk-mobile-category-link {
    padding-left: 7px !important;
    padding-right: 7px !important;
  }
}

/* Prevent any hidden menu/content from creating horizontal scroll */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}
/* ======================= sub category end  */

/* Hero */

.sk-hero-slider,
.sk-hero-slide {
  height: 700px;
}

.sk-hero-slide {
  position: relative;
  background-position: center;
  background-size: cover;
}

.sk-hero-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(8, 18, 10, 0.91) 0%,
    rgba(8, 18, 10, 0.68) 47%,
    rgba(8, 18, 10, 0.16) 100%
  );
}

.sk-hero-slide::after {
  content: "";
  position: absolute;
  left: -100px;
  bottom: -160px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: rgba(105, 173, 56, 0.18);
  filter: blur(15px);
}

.sk-hero-container {
  height: 700px;
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
}

.sk-hero-content {
  max-width: 730px;
  color: var(--sk-white);
}

.sk-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 22px;
  padding: 9px 16px;
  border-radius: 50px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  font-size: 13px;
  font-weight: 800;
}

.sk-hero-badge i {
  color: #a8db81;
}

.sk-hero-title {
  margin-bottom: 23px;
  font-family: "Playfair Display", serif;
  font-size: clamp(48px, 6vw, 80px);
  line-height: 1.04;
}

.sk-hero-title span {
  color: #a9dc83;
}

.sk-hero-description {
  max-width: 650px;
  margin-bottom: 32px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 18px;
  line-height: 1.8;
}

.sk-hero-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 13px;
}

.sk-hero-slider .swiper-button-prev,
.sk-hero-slider .swiper-button-next {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  color: var(--sk-white);
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(8px);
  transition: var(--sk-transition);
}

.sk-hero-slider .swiper-button-prev:hover,
.sk-hero-slider .swiper-button-next:hover {
  background: var(--sk-primary);
  border-color: var(--sk-primary);
}

.sk-hero-slider .swiper-button-prev::after,
.sk-hero-slider .swiper-button-next::after {
  font-size: 16px;
  font-weight: 800;
}

.sk-hero-slider .swiper-pagination-bullet {
  width: 9px;
  height: 9px;
  background: var(--sk-white);
  opacity: 0.55;
}

.sk-hero-slider .swiper-pagination-bullet-active {
  width: 28px;
  border-radius: 20px;
  background: var(--sk-primary);
  opacity: 1;
}

/* Highlights */

.sk-highlight-strip {
  position: relative;
  z-index: 10;
  margin-top: -48px;
}

.sk-highlight-wrapper {
  overflow: hidden;
  border-radius: 16px;
  background: var(--sk-white);
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  box-shadow: var(--sk-shadow);
}

.sk-highlight-item {
  padding: 25px;
  display: flex;
  align-items: center;
  gap: 15px;
  border-right: 1px solid var(--sk-border);
}

.sk-highlight-item:last-child {
  border-right: none;
}

.sk-highlight-icon {
  width: 54px;
  height: 54px;
  border-radius: 13px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--sk-primary-dark);
  background: var(--sk-primary-soft);
  font-size: 23px;
  transition: var(--sk-transition);
}

.sk-highlight-item:hover .sk-highlight-icon {
  background: var(--sk-primary);
  color: var(--sk-white);
  transform: rotateY(180deg);
}

.sk-highlight-item h4 {
  margin-bottom: 4px;
  font-size: 15px;
}

.sk-highlight-item p {
  margin: 0;
  color: var(--sk-text);
  font-size: 13px;
}

/* Categories */

.sk-category-card {
  position: relative;
  height: 365px;
  margin-bottom: 24px;
  border-radius: 18px;
  overflow: hidden;
  display: block;
  background: var(--sk-dark);
}

.sk-category-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s ease;
}

.sk-category-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(14, 25, 16, 0.02) 20%,
    rgba(14, 25, 16, 0.9) 100%
  );
}

.sk-category-card:hover img {
  transform: scale(1.1);
}

.sk-category-number {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 3;
  color: rgba(255, 255, 255, 0.8);
  font-family: "Playfair Display", serif;
  font-size: 18px;
}

.sk-category-arrow {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 3;
  width: 43px;
  height: 43px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.93);
  color: var(--sk-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--sk-transition);
}

.sk-category-card:hover .sk-category-arrow {
  background: var(--sk-primary);
  color: var(--sk-white);
  transform: rotate(45deg);
}

.sk-category-content {
  position: absolute;
  left: 25px;
  right: 25px;
  bottom: 25px;
  z-index: 3;
  color: var(--sk-white);
}

.sk-category-content h3 {
  margin-bottom: 7px;
  /* font-family: "Playfair Display", serif; */
  font-size: 22px;
}

.sk-category-content p {
  margin: 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 14px;
}

/* About */

.sk-about-image-area {
  position: relative;
  padding: 0 38px 38px 0;
}

.sk-about-main {
  width: 100%;
  height: 600px;
  border-radius: 22px;
  object-fit: cover;
}

.sk-about-small {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 245px;
  height: 230px;
  border: 9px solid var(--sk-white);
  border-radius: 18px;
  object-fit: cover;
}

.sk-about-experience {
  position: absolute;
  top: 45px;
  left: -22px;
  width: 160px;
  padding: 23px;
  border-radius: 14px;
  background: var(--sk-primary);
  color: var(--sk-white);
  box-shadow: var(--sk-shadow);
}

.sk-about-experience strong {
  display: block;
  font-family: "Playfair Display", serif;
  font-size: 43px;
  line-height: 1;
}

.sk-about-experience span {
  margin-top: 8px;
  display: block;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.5;
}

.sk-about-content {
  padding-left: 38px;
}

.sk-about-content > p {
  color: var(--sk-text);
  font-size: 16px;
  line-height: 1.85;
}

.sk-about-features {
  margin: 27px 0 31px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.sk-about-features li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 800;
}

.sk-about-features i {
  width: 27px;
  height: 27px;
  border-radius: 50%;
  background: var(--sk-primary-soft);
  color: var(--sk-primary-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
}

/* Collection Banners */

.sk-collection-card {
  min-height: 360px;
  padding: 40px;
  border-radius: 20px;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: flex-end;
  background-position: center;
  background-size: cover;
}

.sk-collection-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(10, 20, 12, 0.05),
    rgba(10, 20, 12, 0.88)
  );
}

.sk-collection-card-large {
  min-height: 745px;
}

.sk-collection-content {
  max-width: 520px;
  position: relative;
  z-index: 2;
  color: var(--sk-white);
}

.sk-collection-content span {
  margin-bottom: 10px;
  display: inline-block;
  color: #b5e290;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.sk-collection-content h3 {
  margin-bottom: 12px;
  font-family: "Playfair Display", serif;
  font-size: 35px;
}

.sk-collection-content p {
  margin-bottom: 20px;
  color: rgba(255, 255, 255, 0.75);
  line-height: 1.7;
}

.sk-collection-link {
  color: var(--sk-white);
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 14px;
  font-weight: 800;
}

.sk-collection-link:hover {
  color: #b5e290;
}

/* Products */

.sk-product-filter {
  margin-bottom: 40px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}

.sk-filter-btn {
  min-height: 43px;
  padding: 9px 20px;
  border: 1px solid var(--sk-border);
  border-radius: 50px;
  background: var(--sk-white);
  color: var(--sk-dark);
  font-size: 13px;
  font-weight: 800;
  transition: var(--sk-transition);
}

.sk-filter-btn:hover,
.sk-filter-btn.sk-active {
  border-color: var(--sk-primary);
  background: var(--sk-primary);
  color: var(--sk-white);
}

.sk-product-card {
  height: 100%;
  overflow: hidden;
  border: 1px solid var(--sk-border);
  border-radius: 16px;
  background: var(--sk-white);
  transition: var(--sk-transition);
}

.sk-product-card:hover {
  border-color: transparent;
  box-shadow: var(--sk-shadow);
  transform: translateY(-8px);
}

.sk-product-image {
  height: 305px;
  overflow: hidden;
  position: relative;
  background: #f3f5f2;
}

.sk-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.65s ease;
}

.sk-product-card:hover .sk-product-image img {
  transform: scale(1.08);
}

.sk-product-badge {
  position: absolute;
  top: 15px;
  left: 15px;
  z-index: 2;
  padding: 6px 11px;
  border-radius: 50px;
  background: var(--sk-primary);
  color: var(--sk-white);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.sk-product-badge.sk-sale {
  background: var(--sk-danger);
}

.sk-product-actions {
  position: absolute;
  top: 15px;
  right: -55px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: right 0.38s ease;
}

.sk-product-card:hover .sk-product-actions {
  right: 15px;
}

.sk-product-action {
  width: 41px;
  height: 41px;
  border: none;
  border-radius: 50%;
  background: var(--sk-white);
  color: var(--sk-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 7px 20px rgba(0, 0, 0, 0.13);
  transition: var(--sk-transition);
}

.sk-product-action:hover {
  background: var(--sk-primary);
  color: var(--sk-white);
}

.sk-product-content {
  padding: 20px;
}

.sk-product-category {
  margin-bottom: 6px;
  color: var(--sk-primary-dark);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.7px;
}

.sk-product-title {
  margin-bottom: 9px;
  color: var(--sk-dark);
  display: block;
  font-family: "Manrope", sans-serif;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.45;
  transition: var(--sk-transition);
}

.sk-product-title:hover {
  color: var(--sk-primary-dark);
}

.sk-product-rating {
  margin-bottom: 14px;
  color: var(--sk-secondary);
  font-size: 11px;
}

.sk-product-rating span {
  margin-left: 4px;
  color: var(--sk-text);
}

.sk-product-description {
  margin-bottom: 16px;
  color: var(--sk-text);
  font-size: 13px;
  line-height: 1.65;
}

.sk-product-bottom {
  padding-top: 15px;
  border-top: 1px solid var(--sk-border);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 7px;
}

.sk-product-price {
  color: var(--sk-dark);
  font-size: 18px;
  font-weight: 800;
}

.sk-product-price del {
  margin-left: 4px;
  color: #9da49e;
  font-size: 12px;
  font-weight: 500;
}

.sk-add-cart {
  width: 43px;
  height: 43px;
  border: none;
  border-radius: 9px;
  background: var(--sk-primary-soft);
  color: var(--sk-primary-dark);
  transition: var(--sk-transition);
}

.sk-add-cart:hover {
  background: var(--sk-primary);
  color: var(--sk-white);
}

/* Product Slider */

.sk-product-slider {
  padding: 10px 4px 65px;
}

.sk-product-slider .swiper-pagination-bullet-active {
  background: var(--sk-primary);
}

/* Feature Product */

.sk-feature-product {
  overflow: hidden;
  border-radius: 22px;
  background: var(--sk-dark);
}

.sk-feature-product-image {
  height: 100%;
}

.sk-feature-product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sk-feature-product-content {
  height: 100%;
  padding: 60px;
  color: var(--sk-white);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.sk-feature-product-content .sk-section-label {
  width: max-content;
}

.sk-feature-product-content h2 {
  margin-bottom: 18px;
  font-family: "Playfair Display", serif;
  font-size: clamp(36px, 4vw, 55px);
  line-height: 1.15;
}

.sk-feature-product-content > p {
  margin-bottom: 24px;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.8;
}

.sk-feature-product-list {
  margin-bottom: 29px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 13px;
}

.sk-feature-product-list li {
  color: rgba(255, 255, 255, 0.87);
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 14px;
  font-weight: 700;
}

.sk-feature-product-list i {
  color: #a7da80;
}

/* Process */

.sk-process-wrapper {
  position: relative;
}

.sk-process-wrapper::before {
  content: "";
  position: absolute;
  top: 57px;
  left: 12%;
  right: 12%;
  height: 1px;
  border-top: 1px dashed rgba(105, 173, 56, 0.5);
}

.sk-process-card {
  position: relative;
  z-index: 2;
  padding: 25px 18px;
  text-align: center;
}

.sk-process-number {
  position: absolute;
  top: 6px;
  right: 22%;
  width: 27px;
  height: 27px;
  border-radius: 50%;
  background: var(--sk-secondary);
  color: var(--sk-dark);
  border: 3px solid var(--sk-white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 800;
}

.sk-process-icon {
  width: 82px;
  height: 82px;
  margin: 0 auto 21px;
  border-radius: 50%;
  border: 8px solid var(--sk-primary-soft);
  background: var(--sk-white);
  color: var(--sk-primary-dark);
  box-shadow: var(--sk-shadow-small);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 29px;
  transition: var(--sk-transition);
}

.sk-process-card:hover .sk-process-icon {
  border-color: var(--sk-primary);
  background: var(--sk-primary);
  color: var(--sk-white);
  transform: translateY(-6px);
}

.sk-process-card h4 {
  margin-bottom: 9px;
  font-size: 17px;
}

.sk-process-card p {
  margin: 0;
  color: var(--sk-text);
  font-size: 13px;
  line-height: 1.7;
}

/* Why Choose */

.sk-why-section {
  color: var(--sk-white);
  background:
    linear-gradient(rgba(10, 22, 12, 0.93), rgba(10, 22, 12, 0.93)),
    url("https://images.unsplash.com/photo-1556911220-bff31c812dba?auto=format&fit=crop&w=1900&q=85")
      center / cover fixed;
}

.sk-why-section .sk-section-title {
  color: var(--sk-white);
}

.sk-why-section .sk-section-heading p {
  color: rgba(255, 255, 255, 0.67);
}

.sk-why-card {
  height: 100%;
  padding: 30px 25px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.065);
  backdrop-filter: blur(10px);
  transition: var(--sk-transition);
}

.sk-why-card:hover {
  border-color: rgba(169, 220, 131, 0.36);
  background: rgba(105, 173, 56, 0.18);
  transform: translateY(-8px);
}

.sk-why-icon {
  width: 61px;
  height: 61px;
  margin-bottom: 20px;
  border-radius: 14px;
  background: var(--sk-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 25px;
}

.sk-why-card h3 {
  margin-bottom: 11px;
  font-size: 19px;
}

.sk-why-card p {
  margin: 0;
  color: rgba(255, 255, 255, 0.67);
  font-size: 14px;
  line-height: 1.75;
}

/* Industries */

.sk-industry-card {
  height: 100%;
  padding: 28px 15px;
  text-align: center;
  border: 1px solid var(--sk-border);
  border-radius: 15px;
  background: var(--sk-white);
  transition: var(--sk-transition);
}

.sk-industry-card:hover {
  border-color: var(--sk-primary);
  transform: translateY(-7px);
  box-shadow: var(--sk-shadow-small);
}

.sk-industry-icon {
  width: 67px;
  height: 67px;
  margin: 0 auto 17px;
  border-radius: 50%;
  background: var(--sk-primary-soft);
  color: var(--sk-primary-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 27px;
  transition: var(--sk-transition);
}

.sk-industry-card:hover .sk-industry-icon {
  background: var(--sk-primary);
  color: var(--sk-white);
  transform: rotateY(180deg);
}

.sk-industry-card h4 {
  margin: 0;
  font-size: 16px;
}

/* Bulk */

.sk-bulk-banner {
  min-height: 460px;
  padding: 60px;
  border-radius: 22px;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  background:
    linear-gradient(90deg, rgba(9, 21, 11, 0.94), rgba(9, 21, 11, 0.4)),
    url("https://images.unsplash.com/photo-1556912172-45b7abe8b7e1?auto=format&fit=crop&w=1800&q=85")
      center / cover;
}

.sk-bulk-banner::after {
  content: "";
  position: absolute;
  right: -100px;
  top: -110px;
  width: 330px;
  height: 330px;
  border-radius: 50%;
  border: 60px solid rgba(105, 173, 56, 0.16);
}

.sk-bulk-content {
  max-width: 650px;
  position: relative;
  z-index: 2;
  color: var(--sk-white);
}

.sk-bulk-content small {
  margin-bottom: 17px;
  padding: 7px 14px;
  border-radius: 50px;
  display: inline-block;
  background: var(--sk-primary);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.7px;
}

.sk-bulk-content h2 {
  margin-bottom: 18px;
  font-family: "Playfair Display", serif;
  font-size: clamp(37px, 5vw, 58px);
  line-height: 1.12;
}

.sk-bulk-content p {
  margin-bottom: 27px;
  color: rgba(255, 255, 255, 0.75);
  font-size: 16px;
  line-height: 1.8;
}

/* Statistics */

.sk-statistics {
  padding: 66px 0;
  background: var(--sk-primary);
  color: var(--sk-white);
}

.sk-stat-item {
  padding: 10px;
  text-align: center;
  border-right: 1px solid rgba(255, 255, 255, 0.28);
}

.sk-statistics .col-lg-3:last-child .sk-stat-item {
  border-right: none;
}

.sk-stat-number {
  font-family: "Playfair Display", serif;
  font-size: 54px;
  font-weight: 700;
  line-height: 1;
}

.sk-stat-item p {
  margin: 10px 0 0;
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-weight: 800;
}

/* Testimonial */

.sk-testimonial-slider {
  padding: 5px 3px 65px;
}

.sk-testimonial-card {
  height: auto;
  padding: 31px;
  border: 1px solid var(--sk-border);
  border-radius: 17px;
  background: var(--sk-white);
  position: relative;
  transition: var(--sk-transition);
}

.swiper-wrapper {
  position: relative;
  width: 100%;
  height: auto;
  z-index: 1;
  display: flex;
  transition-property: transform;
  transition-timing-function: var(
    --swiper-wrapper-transition-timing-function,
    initial
  );
  box-sizing: content-box;
}

.sk-testimonial-card:hover {
  box-shadow: var(--sk-shadow-small);
  transform: translateY(-5px);
}

.sk-testimonial-quote {
  position: absolute;
  top: 25px;
  right: 26px;
  color: var(--sk-primary-soft);
  font-size: 52px;
}

.sk-testimonial-rating {
  margin-bottom: 17px;
  color: var(--sk-secondary);
  font-size: 12px;
}

.sk-testimonial-card > p {
  margin-bottom: 24px;
  color: var(--sk-text);
  font-size: 14px;
  line-height: 1.85;
}

.sk-testimonial-user {
  display: flex;
  align-items: center;
  gap: 13px;
}

.sk-testimonial-user img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  object-fit: cover;
}

.sk-testimonial-user h4 {
  margin-bottom: 3px;
  font-size: 15px;
}

.sk-testimonial-user span {
  color: var(--sk-text);
  font-size: 12px;
}

.sk-testimonial-slider .swiper-pagination-bullet-active {
  background: var(--sk-primary);
}

/* Blog */

.sk-blog-card {
  height: 100%;
  overflow: hidden;
  border: 1px solid var(--sk-border);
  border-radius: 17px;
  background: var(--sk-white);
  transition: var(--sk-transition);
}

.sk-blog-card:hover {
  border-color: transparent;
  box-shadow: var(--sk-shadow);
  transform: translateY(-7px);
}

.sk-blog-image {
  height: 270px;
  overflow: hidden;
  position: relative;
}

.sk-blog-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}

.sk-blog-card:hover .sk-blog-image img {
  transform: scale(1.08);
}

.sk-blog-date {
  position: absolute;
  top: 16px;
  left: 16px;
  min-width: 58px;
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--sk-primary);
  color: var(--sk-white);
  text-align: center;
  line-height: 1.1;
}

.sk-blog-date strong {
  display: block;
  font-size: 21px;
}

.sk-blog-date span {
  font-size: 9px;
  text-transform: uppercase;
}

.sk-blog-content {
  padding: 24px;
}

.sk-blog-meta {
  margin-bottom: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  color: var(--sk-text);
  font-size: 11px;
}

.sk-blog-meta i {
  margin-right: 5px;
  color: var(--sk-primary);
}

.sk-blog-title {
  margin-bottom: 16px;
  color: var(--sk-dark);
  display: block;
  font-size: 19px;
  font-weight: 800;
  line-height: 1.5;
  transition: var(--sk-transition);
}

.sk-blog-title:hover {
  color: var(--sk-primary-dark);
}

.sk-blog-link {
  color: var(--sk-primary-dark);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 800;
}

/* Newsletter */

.sk-newsletter {
  padding: 60px 0;
  background: var(--sk-dark);
  color: var(--sk-white);
}

.sk-newsletter-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
}

.sk-newsletter-content {
  display: flex;
  align-items: center;
  gap: 20px;
}

.sk-newsletter-icon {
  color: var(--sk-primary);
  font-size: 45px;
}

.sk-newsletter-content h3 {
  margin-bottom: 6px;
  font-family: "Playfair Display", serif;
  font-size: 31px;
}

.sk-newsletter-content p {
  margin: 0;
  color: rgba(255, 255, 255, 0.65);
}

.sk-newsletter-form {
  width: 480px;
  max-width: 100%;
  position: relative;
}

.sk-newsletter-form input {
  width: 100%;
  height: 61px;
  padding: 0 155px 0 20px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 10px;
  outline: none;
  background: rgba(255, 255, 255, 0.08);
  color: var(--sk-white);
}

.sk-newsletter-form input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.sk-newsletter-form button {
  position: absolute;
  top: 6px;
  right: 6px;
  height: 49px;
  padding: 0 23px;
  border: none;
  border-radius: 8px;
  background: var(--sk-primary);
  color: var(--sk-white);
  font-weight: 800;
}

/* Footer */

.sk-footer {
  padding: 80px 0 0;
  background: #101612;
  color: var(--sk-white);
}

.sk-footer-logo {
  width: 181px;
  height: 76px;
  margin-bottom: 20px;
  /* padding: 8px 12px; */
  object-fit: contain;
  border-radius: 8px;
  background: var(--sk-white);
}

.sk-footer-about {
  margin-bottom: 22px;
  color: rgb(255 255 255 / 90%);
  font-size: 14px;
  line-height: 1.8;
}

.sk-footer-social {
  display: flex;
  gap: 9px;
}

.sk-footer-social a {
  width: 41px;
  height: 41px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: var(--sk-white);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--sk-transition);
}

.sk-footer-social a:hover {
  background: var(--sk-primary);
  color: var(--sk-white);
  transform: translateY(-4px);
}

.sk-footer-title {
  margin: 7px 0 24px;
  padding-bottom: 13px;
  position: relative;
  font-size: 18px;
}

.sk-footer-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 43px;
  height: 2px;
  background: var(--sk-primary);
}

.sk-footer-links li {
  margin-bottom: 12px;
}

.sk-footer-links a {
  color: rgb(255 255 255 / 90%);
  font-size: 14px;
  transition: var(--sk-transition);
}

.sk-footer-links a:hover {
  padding-left: 5px;
  color: var(--sk-primary);
}

.sk-footer-contact li {
  margin-bottom: 17px;
  display: flex;
  gap: 12px;
  color: rgb(255 255 255 / 90%);
  font-size: 14px;
  line-height: 1.6;
}

.sk-footer-contact i {
  margin-top: 4px;
  color: var(--sk-primary);
  flex-shrink: 0;
}

.sk-copyright {
  margin-top: 60px;
  padding: 20px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgb(255 255 255 / 90%);
  font-size: 13px;
}

.sk-copyright-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.sk-copyright-links {
  display: flex;
  gap: 20px;
}

.sk-copyright a {
  color: rgba(255, 255, 255, 0.58);
}

/* Floating */

.sk-floating-buttons {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 1500;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.sk-floating-btn {
  width: 53px;
  height: 53px;
  border: none;
  border-radius: 50%;
  color: var(--sk-white);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 21px;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.21);
  transition: var(--sk-transition);
}

.sk-floating-btn:hover {
  color: var(--sk-white);
  transform: translateY(-4px) scale(1.05);
}

.sk-whatsapp-btn {
  background: #25d366;
}

.sk-enquiry-btn {
  background: var(--sk-primary);
}

.sk-back-top {
  display: none;
  background: var(--sk-dark);
}

.sk-back-top.sk-show {
  display: flex;
}

/* Modal */

.sk-inquiry-modal .modal-content {
  overflow: hidden;
  border: none;
  border-radius: 18px;
}

.sk-modal-header {
  position: relative;
  padding: 32px;
  color: var(--sk-white);
  background:
    linear-gradient(rgba(15, 37, 18, 0.88), rgba(15, 37, 18, 0.88)),
    url("https://images.unsplash.com/photo-1556911220-e15b29be8c8f?auto=format&fit=crop&w=1000&q=80")
      center / cover;
}

.sk-modal-header h3 {
  margin-bottom: 7px;
  font-family: "Playfair Display", serif;
  font-size: 31px;
}

.sk-modal-header p {
  margin: 0;
  color: rgba(255, 255, 255, 0.72);
}

.sk-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 38px;
  height: 38px;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.14);
  color: var(--sk-white);
}

.sk-modal-body {
  padding: 30px;
}

.sk-form-group {
  margin-bottom: 18px;
}

.sk-form-group label {
  margin-bottom: 7px;
  display: block;
  font-size: 13px;
  font-weight: 800;
}

.sk-form-control {
  width: 100%;
  min-height: 51px;
  padding: 11px 14px;
  border: 1px solid var(--sk-border);
  border-radius: 8px;
  outline: none;
  font-size: 14px;
  transition: var(--sk-transition);
}

.sk-form-control:focus {
  border-color: var(--sk-primary);
  box-shadow: 0 0 0 4px rgba(105, 173, 56, 0.12);
}

textarea.sk-form-control {
  min-height: 120px;
  resize: vertical;
}

/* .sk-testimonial-card .swiper-wrapper {
  position: relative;
  width: 100%;
  height: auto !important;
  z-index: 1;
  display: flex;
  transition-property: transform;
  transition-timing-function: var(
    --swiper-wrapper-transition-timing-function,
    initial
  );
  box-sizing: content-box;
} */

/* Responsive */

@media (max-width: 1199px) {
  .sk-navigation {
    display: none;
  }

  .sk-menu-button {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sk-header-inquiry {
    display: none;
  }

  .sk-highlight-wrapper {
    grid-template-columns: repeat(2, 1fr);
  }

  .sk-highlight-item:nth-child(2) {
    border-right: none;
  }

  .sk-highlight-item:nth-child(-n + 2) {
    border-bottom: 1px solid var(--sk-border);
  }

  .sk-about-content {
    padding-left: 0;
  }

  .sk-process-wrapper::before {
    display: none;
  }
}

@media (max-width: 991px) {
  .sk-section-space {
    padding: 78px 0;
  }

  .sk-topbar-right {
    display: none;
  }

  .sk-topbar-wrapper {
    justify-content: center;
  }

  .sk-hero-slider,
  .sk-hero-slide,
  .sk-hero-container {
    height: 625px;
  }

  .sk-about-content {
    margin-top: 55px;
  }

  .sk-collection-card-large {
    min-height: 500px;
    margin-bottom: 24px;
  }

  .sk-feature-product-content {
    padding: 45px;
  }

  .sk-feature-product-image {
    height: 500px;
  }

  .sk-newsletter-wrapper {
    align-items: flex-start;
    flex-direction: column;
  }

  .sk-newsletter-form {
    width: 100%;
  }

  .sk-stat-item {
    padding: 22px 10px;
    border-right: none;
  }

  .sk-statistics .col-md-6:nth-child(odd) .sk-stat-item {
    border-right: 1px solid rgba(255, 255, 255, 0.28);
  }
}

@media (max-width: 767px) {
  .sk-section-space {
    padding: 62px 0;
  }

  .sk-topbar {
    display: none;
  }

  .sk-header-wrapper {
    min-height: 72px;
  }

  .sk-logo img {
    width: 130px;
    /* height: 52px; */
    height: 90px;
  }

  /* .sk-user-icon {
    display: none;
  } */

  .sk-header-icon,
  .sk-menu-button {
    width: 40px;
    height: 40px;
  }

  .sk-hero-slider,
  .sk-hero-slide,
  .sk-hero-container {
    height: 600px;
  }

  .sk-hero-slide::before {
    background: rgba(8, 18, 10, 0.74);
  }

  .sk-hero-content {
    margin: auto;
    text-align: center;
  }

  .sk-hero-title {
    font-size: 47px;
  }

  .sk-hero-description {
    font-size: 15px;
  }

  .sk-hero-buttons {
    justify-content: center;
  }

  .sk-hero-slider .swiper-button-prev,
  .sk-hero-slider .swiper-button-next {
    display: none;
  }

  .sk-highlight-strip {
    margin-top: 0;
    padding-top: 25px;
  }

  .sk-highlight-wrapper {
    grid-template-columns: 1fr;
  }

  .sk-highlight-item {
    border-right: none;
    border-bottom: 1px solid var(--sk-border);
  }

  .sk-highlight-item:last-child {
    border-bottom: none;
  }

  .sk-category-card {
    height: 335px;
  }

  .sk-about-image-area {
    padding: 0;
  }

  .sk-about-main {
    height: 470px;
  }

  .sk-about-small {
    display: none;
  }

  .sk-about-experience {
    top: 20px;
    left: 15px;
  }

  .sk-about-features {
    grid-template-columns: 1fr;
  }

  .sk-collection-card,
  .sk-collection-card-large {
    min-height: 410px;
    padding: 28px;
  }

  .sk-product-image {
    height: 330px;
  }

  .sk-feature-product-image {
    height: 420px;
  }

  .sk-feature-product-content {
    padding: 35px 25px;
  }

  .sk-feature-product-list {
    grid-template-columns: 1fr;
  }

  .sk-bulk-banner {
    min-height: 500px;
    padding: 35px 25px;
    background-position: 62% center;
  }

  .sk-statistics .col-md-6:nth-child(odd) .sk-stat-item {
    border-right: none;
  }

  .sk-stat-item {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
  }

  .sk-statistics .col-6:nth-last-child(-n + 2) .sk-stat-item {
    border-bottom: none;
  }

  .sk-newsletter-content {
    align-items: flex-start;
  }

  .sk-newsletter-content h3 {
    font-size: 25px;
  }

  .sk-copyright-wrapper {
    text-align: center;
    flex-direction: column;
  }

  .sk-floating-buttons {
    right: 13px;
    bottom: 13px;
  }

  .sk-floating-btn {
    width: 48px;
    height: 48px;
  }
}

@media (max-width: 575px) {
  .sk-search-icon {
    display: none;
  }

  .sk-header-actions {
    gap: 10px;
  }

  .sk-hero-title {
    font-size: 40px;
  }

  .sk-hero-badge {
    font-size: 11px;
  }

  .sk-primary-btn,
  .sk-secondary-btn,
  .sk-outline-btn,
  .sk-dark-btn {
    min-height: 47px;
    padding: 11px 17px;
    font-size: 12px;
  }

  .sk-section-title {
    font-size: 34px;
  }

  .sk-product-image {
    height: 300px;
  }

  .sk-newsletter-form input {
    padding-right: 20px;
  }

  .sk-newsletter-form button {
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
    margin-top: 10px;
  }

  .sk-footer {
    padding-top: 60px;
  }

  .sk-modal-header,
  .sk-modal-body {
    padding: 24px 20px;
  }
}

/* =================================== about us breadcrum start  */
/* =========================================================
   ABOUT PAGE BREADCRUMB
========================================================= */

.sk-about-breadcrumb {
  position: relative;
  overflow: hidden;
  padding: 110px 0;
}

/* Extra Overlay */

.sk-about-breadcrumb-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.02) 1px, transparent 1px),
    linear-gradient(rgba(255, 255, 255, 0.02) 1px, transparent 1px);
  background-size: 45px 45px;
  pointer-events: none;
}

/* Main Wrapper */

.sk-about-breadcrumb-wrapper {
  position: relative;
  z-index: 5;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 60px;
}

/* Left Content */

.sk-about-breadcrumb-content {
  width: 100%;
  max-width: 720px;

  color: #ffffff;
}

/* Top Small Tag */

.sk-about-breadcrumb-tag {
  display: inline-flex;
  align-items: center;

  gap: 9px;

  margin-bottom: 18px;

  padding: 9px 16px;

  border-radius: 50px;

  border: 1px solid rgba(255, 255, 255, 0.18);

  background: rgba(255, 255, 255, 0.1);

  backdrop-filter: blur(10px);

  color: #ccecb6;

  font-size: 12px;
  font-weight: 800;

  letter-spacing: 1px;
  text-transform: uppercase;

  animation: skFadeUp 0.8s ease both;
}

.sk-about-breadcrumb-tag i {
  color: #9ed875;
}

/* Main Heading */

.sk-about-breadcrumb-content h1 {
  margin: 0 0 20px;
  font-size: clamp(50px, 3vw, 78px);
  line-height: 1.05;
  font-weight: 700;
  color: #ffffff;
  animation: skFadeUp 0.8s ease 0.1s both;
}

.sk-about-breadcrumb-content h1 span {
  position: relative;
  color: #a8dd80;
}

.sk-about-breadcrumb-content h1 span::after {
  content: "";
  position: absolute;
  left: 4px;
  right: 4px;
  bottom: 5px;
  height: 7px;
  border-radius: 20px;
  background: rgba(168, 221, 128, 0.14);
}

/* Paragraph */

.sk-about-breadcrumb-content > p {
  max-width: 640px;

  margin: 0 0 28px;

  color: rgba(255, 255, 255, 0.78);

  font-size: 17px;

  line-height: 1.8;

  animation: skFadeUp 0.8s ease 0.2s both;
}

/* Breadcrumb Navigation */

.sk-about-breadcrumb-nav {
  display: inline-flex;

  padding: 11px 16px;

  border-radius: 9px;

  border: 1px solid rgba(255, 255, 255, 0.16);

  background: rgba(255, 255, 255, 0.08);

  backdrop-filter: blur(9px);

  animation: skFadeUp 0.8s ease 0.3s both;
}

.sk-about-breadcrumb-nav .breadcrumb {
  align-items: center;
}

.sk-about-breadcrumb-nav .breadcrumb-item {
  color: #ffffff;

  font-size: 13px;
  font-weight: 700;
}

.sk-about-breadcrumb-nav .breadcrumb-item a {
  display: inline-flex;
  align-items: center;

  gap: 7px;

  color: rgba(255, 255, 255, 0.78);

  transition: all 0.3s ease;
}

.sk-about-breadcrumb-nav .breadcrumb-item a:hover {
  color: #a8dd80;
}

.sk-about-breadcrumb-nav .breadcrumb-item.active {
  color: #ffffff;
}

.sk-about-breadcrumb-nav .breadcrumb-item + .breadcrumb-item::before {
  color: rgba(255, 255, 255, 0.45);
}

/* =========================================================
   RIGHT GLASS CARD
========================================================= */

.sk-about-info-card {
  position: relative;

  width: 320px;
  min-width: 320px;

  overflow: hidden;

  padding: 31px;

  border-radius: 18px;

  border: 1px solid rgba(255, 255, 255, 0.18);

  background: rgba(255, 255, 255, 0.1);

  backdrop-filter: blur(14px);

  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.2);

  color: #ffffff;

  animation: skFadeLeft 0.9s ease 0.25s both;
}

.sk-about-info-card::before {
  content: "";

  position: absolute;

  width: 170px;
  height: 170px;

  top: -85px;
  right: -85px;

  border-radius: 50%;

  background: rgba(164, 218, 123, 0.13);
}

.sk-about-info-icon {
  position: relative;
  z-index: 2;

  width: 64px;
  height: 64px;

  margin-bottom: 20px;

  border-radius: 15px;

  display: flex;
  align-items: center;
  justify-content: center;

  background: #69ad38;

  color: #ffffff;

  font-size: 27px;

  box-shadow: 0 12px 28px rgba(52, 109, 28, 0.3);
}

.sk-about-info-card span {
  display: block;

  margin-bottom: 9px;

  color: #b9e79a;

  font-size: 11px;
  font-weight: 800;

  text-transform: uppercase;

  letter-spacing: 0.8px;
}

.sk-about-info-card h3 {
  margin: 0 0 12px;

  color: #ffffff;

  font-size: 23px;

  line-height: 1.45;

  font-weight: 800;
}

.sk-about-info-card p {
  margin: 0;

  color: rgba(255, 255, 255, 0.67);

  font-size: 13px;

  line-height: 1.7;
}

/* =========================================================
   DECORATIVE SHAPES
========================================================= */

.sk-about-shape {
  position: absolute;

  border-radius: 50%;

  pointer-events: none;
}

.sk-about-shape-one {
  width: 340px;
  height: 340px;

  top: -180px;
  right: 10%;

  border: 60px solid rgba(255, 255, 255, 0.035);

  animation: skRotateShape 20s linear infinite;
}

.sk-about-shape-two {
  width: 230px;
  height: 230px;

  left: -100px;
  bottom: -120px;

  background: rgba(105, 173, 56, 0.17);

  filter: blur(3px);

  animation: skFloatShape 6s ease-in-out infinite;
}

/* =========================================================
   ANIMATIONS
========================================================= */

@keyframes skFadeUp {
  from {
    opacity: 0;
    transform: translateY(28px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes skFadeLeft {
  from {
    opacity: 0;
    transform: translateX(35px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes skFloatShape {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-18px);
  }
}

@keyframes skRotateShape {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {
  .sk-about-breadcrumb {
    padding: 90px 0;
  }

  .sk-about-breadcrumb-wrapper {
    gap: 35px;
  }

  .sk-about-info-card {
    width: 280px;
    min-width: 280px;

    padding: 26px;
  }

  .sk-about-info-card h3 {
    font-size: 20px;
  }
}

@media (max-width: 767px) {
  .sk-about-breadcrumb {
    padding: 78px 0 72px;

    background-position: 62% center;
  }

  .sk-about-breadcrumb-wrapper {
    display: block;

    text-align: center;
  }

  .sk-about-breadcrumb-content {
    margin: auto;
  }

  .sk-about-breadcrumb-content h1 {
    font-size: 48px;
  }

  .sk-about-breadcrumb-content > p {
    margin-left: auto;
    margin-right: auto;

    font-size: 15px;
  }

  .sk-about-breadcrumb-nav {
    margin: auto;
  }

  .sk-about-info-card {
    width: 100%;
    min-width: 0;

    max-width: 430px;

    margin: 38px auto 0;

    text-align: left;
  }

  .sk-about-shape-one {
    right: -160px;
  }
}

@media (max-width: 575px) {
  .sk-about-breadcrumb {
    padding: 65px 0 62px;
  }

  .sk-about-breadcrumb-tag {
    padding: 8px 13px;

    font-size: 10px;
  }

  .sk-about-breadcrumb-content h1 {
    font-size: 39px;
  }

  .sk-about-breadcrumb-content > p {
    font-size: 14px;

    line-height: 1.75;
  }

  .sk-about-breadcrumb-nav {
    padding: 9px 13px;
  }

  .sk-about-breadcrumb-nav .breadcrumb-item {
    font-size: 12px;
  }

  .sk-about-info-card {
    padding: 22px;
  }

  .sk-about-info-icon {
    width: 55px;
    height: 55px;

    font-size: 23px;
  }

  .sk-about-info-card h3 {
    font-size: 18px;
  }
}
/* =================================== about us breadcrum end  */

/* ===================== about us page start =====  */
/* =========================================================
   SKITCH ABOUT PAGE
   Unique prefix used to prevent CSS conflicts
========================================================= */

.skitch-about-page-section {
  position: relative;
  overflow: hidden;
  padding: 110px 0;
  background: #ffffff;
}

/* =========================================================
   IMAGE AREA
========================================================= */

.skitch-about-page-image-area {
  position: relative;
  max-width: 590px;
  padding: 0 50px 55px 0;
}

/* Main Image */

.skitch-about-page-main-image {
  position: relative;
  height: 550px;
  overflow: hidden;
  border-radius: 28px;
  background: #f3f5f1;

  box-shadow: 0 25px 60px rgba(19, 50, 23, 0.12);
}

.skitch-about-page-main-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;

  display: block;

  transition: transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.skitch-about-page-main-image:hover img {
  transform: scale(1.05);
}

/* Small Image */

.skitch-about-page-small-image {
  position: absolute;

  right: 0;
  bottom: 0;

  width: 230px;
  height: 220px;

  padding: 8px;

  overflow: hidden;

  border-radius: 22px;

  background: #ffffff;

  box-shadow: 0 20px 50px rgba(17, 48, 20, 0.18);
}

.skitch-about-page-small-image img {
  width: 100%;
  height: 100%;

  object-fit: cover;

  display: block;

  border-radius: 16px;

  transition: transform 0.6s ease;
}

.skitch-about-page-small-image:hover img {
  transform: scale(1.06);
}

/* =========================================================
   EXPERIENCE CARD
========================================================= */

.skitch-about-page-experience {
  position: absolute;

  left: -30px;
  bottom: 85px;

  z-index: 5;

  display: flex;
  align-items: center;

  gap: 13px;

  min-width: 215px;

  padding: 16px 20px;

  border-radius: 15px;

  background: #173d20;

  box-shadow: 0 15px 40px rgba(11, 44, 17, 0.25);
}

.skitch-about-page-experience-icon {
  width: 48px;
  height: 48px;

  min-width: 48px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 12px;

  background: #73b643;

  color: #ffffff;

  font-size: 21px;
}

.skitch-about-page-experience strong {
  display: block;

  margin-bottom: 2px;

  color: #ffffff;

  font-size: 17px;
  font-weight: 800;
}

.skitch-about-page-experience span {
  display: block;

  color: rgba(255, 255, 255, 0.65);

  font-size: 11px;
  font-weight: 600;

  letter-spacing: 0.4px;

  text-transform: uppercase;
}

/* =========================================================
   DOT DESIGN
========================================================= */

.skitch-about-page-dots {
  position: absolute;

  top: -25px;
  right: 20px;

  width: 75px;

  display: grid;

  grid-template-columns: repeat(4, 7px);

  gap: 10px;

  z-index: 0;
}

.skitch-about-page-dots span {
  width: 7px;
  height: 7px;

  display: block;

  border-radius: 50%;

  background: #78b84a;

  opacity: 0.4;
}

/* =========================================================
   CONTENT
========================================================= */

.skitch-about-page-content {
  position: relative;

  max-width: 630px;

  padding-left: 15px;
}

/* Subtitle */

.skitch-about-page-subtitle {
  display: flex;
  align-items: center;

  gap: 11px;

  margin-bottom: 17px;

  color: #67a83c;

  font-size: 12px;
  font-weight: 800;

  letter-spacing: 1.7px;

  text-transform: uppercase;
}

.skitch-about-page-subtitle span {
  width: 35px;
  height: 2px;

  display: block;

  background: #70b143;
}

/* Main Heading */

.skitch-about-page-content h2 {
  margin: 0 0 23px;

  color: #16341c;

  /* font-size: clamp(38px, 4vw, 55px); */

  font-weight: 700;

  line-height: 1.15;

  letter-spacing: -0.8px;
}

.skitch-about-page-content h2 span {
  color: #72af45;
}

/* Lead */

.skitch-about-page-lead {
  position: relative;

  margin: 0 0 20px;

  padding-left: 18px;

  color: #334d38;

  font-size: 17px;
  font-weight: 600;

  line-height: 1.8;

  border-left: 3px solid #75b447;
}

/* Description */

.skitch-about-page-description {
  margin: 0 0 14px;

  color: #68766b;

  font-size: 14px;

  line-height: 1.9;
}

/* =========================================================
   FEATURES
========================================================= */

.skitch-about-page-features {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 15px;

  margin-top: 28px;
}

.skitch-about-page-feature {
  display: flex;
  align-items: flex-start;

  gap: 13px;

  padding: 18px;

  border: 1px solid #e7ede4;

  border-radius: 14px;

  background: #fafcf9;

  transition:
    transform 0.35s ease,
    box-shadow 0.35s ease,
    border-color 0.35s ease;
}

.skitch-about-page-feature:hover {
  transform: translateY(-5px);

  border-color: #bcd7aa;

  box-shadow: 0 12px 30px rgba(31, 72, 34, 0.09);
}

.skitch-about-page-feature-icon {
  width: 43px;
  height: 43px;

  min-width: 43px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 11px;

  background: #e9f4e2;

  color: #62a436;

  font-size: 18px;

  transition: all 0.35s ease;
}

.skitch-about-page-feature:hover .skitch-about-page-feature-icon {
  background: #68aa3b;

  color: #ffffff;

  transform: rotate(-5deg);
}

.skitch-about-page-feature h4 {
  margin: 0 0 5px;

  color: #1c3b22;

  font-size: 14px;
  font-weight: 800;
}

.skitch-about-page-feature p {
  margin: 0;

  color: #79837a;

  font-size: 11px;

  line-height: 1.6;
}

/* =========================================================
   BOTTOM BUTTON + TRUST
========================================================= */

.skitch-about-page-bottom {
  display: flex;
  align-items: center;

  gap: 25px;

  margin-top: 30px;
}

.skitch-about-page-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: 12px;

  min-height: 52px;

  padding: 0 24px;

  border-radius: 8px;

  background: #173d20;

  color: #ffffff !important;

  text-decoration: none !important;

  font-size: 13px;
  font-weight: 700;

  transition:
    background 0.35s ease,
    transform 0.35s ease,
    box-shadow 0.35s ease;
}

.skitch-about-page-button i {
  font-size: 12px;

  transition: transform 0.3s ease;
}

.skitch-about-page-button:hover {
  background: #67a93b;

  transform: translateY(-3px);

  box-shadow: 0 12px 25px rgba(40, 92, 41, 0.2);
}

.skitch-about-page-button:hover i {
  transform: translateX(5px);
}

/* Trust */

.skitch-about-page-trust {
  display: flex;
  align-items: center;

  gap: 11px;
}

.skitch-about-page-trust-icon {
  width: 42px;
  height: 42px;

  min-width: 42px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: #edf6e8;

  color: #68aa3c;

  font-size: 17px;
}

.skitch-about-page-trust strong {
  display: block;

  margin-bottom: 2px;

  color: #243d29;

  font-size: 12px;
  font-weight: 800;
}

.skitch-about-page-trust span {
  display: block;

  color: #8a938b;

  font-size: 10px;
}

/* =========================================================
   BACKGROUND DECORATION
========================================================= */

.skitch-about-page-decor {
  position: absolute;

  border-radius: 50%;

  pointer-events: none;
}

.skitch-about-page-decor-one {
  width: 400px;
  height: 400px;

  right: -220px;
  top: 50px;

  background: rgba(116, 178, 71, 0.05);
}

.skitch-about-page-decor-two {
  width: 300px;
  height: 300px;

  left: -190px;
  bottom: -100px;

  border: 50px solid rgba(116, 178, 71, 0.04);
}

/* =========================================================
   SMOOTH ENTRY ANIMATION
========================================================= */

.skitch-about-page-image-area {
  animation: skitchAboutImageAnimation 0.9s ease both;
}

.skitch-about-page-content {
  animation: skitchAboutContentAnimation 0.9s ease 0.15s both;
}

@keyframes skitchAboutImageAnimation {
  from {
    opacity: 0;
    transform: translateX(-30px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes skitchAboutContentAnimation {
  from {
    opacity: 0;
    transform: translateY(30px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =========================================================
   RESPONSIVE - TABLET
========================================================= */

@media (max-width: 1199px) {
  .skitch-about-page-main-image {
    height: 500px;
  }

  .skitch-about-page-content {
    padding-left: 0;
  }

  .skitch-about-page-experience {
    left: -10px;
  }
}

/* =========================================================
   RESPONSIVE - TABLET / MOBILE
========================================================= */

@media (max-width: 991px) {
  .skitch-about-page-section {
    padding: 80px 0;
  }

  .skitch-about-page-image-area {
    max-width: 650px;

    margin: 0 auto 25px;
  }

  .skitch-about-page-content {
    max-width: 100%;
  }

  .skitch-about-page-main-image {
    height: 520px;
  }
}

/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {
  .skitch-about-page-section {
    padding: 65px 0;
  }

  .skitch-about-page-image-area {
    padding: 0 25px 45px 0;
  }

  .skitch-about-page-main-image {
    height: 430px;

    border-radius: 20px;
  }

  .skitch-about-page-small-image {
    width: 180px;
    height: 170px;

    border-radius: 17px;
  }

  .skitch-about-page-experience {
    left: 10px;
    bottom: 65px;

    min-width: 190px;

    padding: 13px 15px;
  }

  .skitch-about-page-content h2 {
    font-size: 38px;
  }

  .skitch-about-page-features {
    grid-template-columns: 1fr;
  }

  .skitch-about-page-bottom {
    align-items: flex-start;

    flex-direction: column;

    gap: 20px;
  }
}

/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575px) {
  .skitch-about-page-section {
    padding: 55px 0;
  }

  .skitch-about-page-image-area {
    padding: 0 15px 35px 0;
  }

  .skitch-about-page-main-image {
    height: 360px;

    border-radius: 17px;
  }

  .skitch-about-page-small-image {
    width: 145px;
    height: 140px;

    padding: 5px;

    border-radius: 14px;
  }

  .skitch-about-page-small-image img {
    border-radius: 10px;
  }

  .skitch-about-page-experience {
    left: 8px;
    bottom: 48px;

    min-width: auto;

    padding: 10px 12px;

    gap: 9px;
  }

  .skitch-about-page-experience-icon {
    width: 39px;
    height: 39px;

    min-width: 39px;

    font-size: 16px;
  }

  .skitch-about-page-experience strong {
    font-size: 13px;
  }

  .skitch-about-page-experience span {
    font-size: 8px;
  }

  .skitch-about-page-dots {
    display: none;
  }

  .skitch-about-page-subtitle {
    font-size: 10px;

    margin-bottom: 13px;
  }

  .skitch-about-page-content h2 {
    margin-bottom: 18px;

    font-size: 32px;

    line-height: 1.2;
  }

  .skitch-about-page-lead {
    font-size: 15px;

    line-height: 1.7;
  }

  .skitch-about-page-description {
    font-size: 13px;

    line-height: 1.8;
  }

  .skitch-about-page-feature {
    padding: 15px;
  }

  .skitch-about-page-button {
    width: 100%;

    min-height: 50px;
  }
}

/* Reduced Motion Support */

@media (prefers-reduced-motion: reduce) {
  .skitch-about-page-image-area,
  .skitch-about-page-content {
    animation: none;
  }
}
/* ===================== about us page end =====  */

.coustom_btn {
  font-size: 10px !important;
  padding: 4px 16px !important;
  background: #69ac38 !important;
  color: #fff !important;
  border: 1px solid transparent;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800 !important;
}

/* ============================= contact us start =====================  */
/* =========================================================
   SKITCH CONTACT PAGE SECTION
   UNIQUE CLASS PREFIX - NO CSS CONFLICT
========================================================= */

.skitch-contact-page-section {
  position: relative;
  overflow: hidden;
  padding: 105px 0;
  background: linear-gradient(180deg, #ffffff 0%, #f8faf7 100%);
}

/* =========================================================
   DECORATIVE SHAPES
========================================================= */

.skitch-contact-page-shape {
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
}

.skitch-contact-page-shape-one {
  width: 430px;
  height: 430px;
  top: -230px;
  right: -190px;
  background: rgba(105, 173, 56, 0.06);
}

.skitch-contact-page-shape-two {
  width: 300px;
  height: 300px;
  left: -180px;
  bottom: -160px;
  border: 55px solid rgba(105, 173, 56, 0.045);
}

/* =========================================================
   HEADING
========================================================= */

.skitch-contact-page-heading {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0 auto 52px;
  text-align: center;
}

.skitch-contact-page-small-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: 15px;
  color: #63a43a;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.8px;
  text-transform: uppercase;
}

.skitch-contact-page-small-title span {
  width: 32px;
  height: 2px;
  display: block;
  background: #72b246;
}

.skitch-contact-page-heading h2 {
  margin: 0 0 17px;
  color: #17361e;
  font-family: "Playfair Display", serif;
  font-size: clamp(38px, 4.3vw, 56px);
  font-weight: 700;
  line-height: 1.13;
}

.skitch-contact-page-heading h2 span {
  color: #6aae3e;
}

.skitch-contact-page-heading p {
  max-width: 700px;
  margin: auto;
  color: #6c786d;
  font-size: 15px;
  line-height: 1.8;
}

/* =========================================================
   LEFT INFORMATION PANEL
========================================================= */

.skitch-contact-page-info {
  position: relative;
  height: 100%;
  overflow: hidden;
  padding: 42px;
  border-radius: 24px;
  background: linear-gradient(145deg, #173c20 0%, #102c17 100%);
  box-shadow: 0 22px 55px rgba(17, 48, 22, 0.16);
}

.skitch-contact-page-info::before {
  content: "";
  position: absolute;
  width: 260px;
  height: 260px;
  top: -140px;
  right: -130px;
  border-radius: 50%;
  background: rgba(112, 177, 67, 0.13);
}

.skitch-contact-page-info::after {
  content: "";
  position: absolute;
  width: 190px;
  height: 190px;
  left: -120px;
  bottom: -100px;
  border-radius: 50%;
  border: 35px solid rgba(255, 255, 255, 0.025);
}

.skitch-contact-page-info-top {
  position: relative;
  z-index: 2;
}

.skitch-contact-page-info-badge {
  width: max-content;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 18px;
  padding: 8px 14px;
  border-radius: 50px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: #b7df9d;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.8px;
  text-transform: uppercase;
}

.skitch-contact-page-info-badge i {
  color: #83c355;
}

.skitch-contact-page-info-top h3 {
  max-width: 430px;
  margin: 0 0 16px;
  color: #ffffff;
  font-family: "Playfair Display", serif;
  font-size: 34px;
  font-weight: 700;
  line-height: 1.25;
}

.skitch-contact-page-info-top p {
  margin: 0;
  color: rgba(255, 255, 255, 0.63);
  font-size: 13px;
  line-height: 1.8;
}

/* =========================================================
   CONTACT DETAILS
========================================================= */

.skitch-contact-page-details {
  position: relative;
  z-index: 2;
  margin-top: 30px;
}

.skitch-contact-page-detail-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 12px;
  padding: 15px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.055);
  color: #ffffff !important;
  text-decoration: none !important;
  transition:
    background 0.35s ease,
    border-color 0.35s ease,
    transform 0.35s ease;
}

.skitch-contact-page-detail-card:hover {
  transform: translateX(5px);
  border-color: rgba(132, 197, 86, 0.35);
  background: rgba(105, 173, 56, 0.12);
}

.skitch-contact-page-detail-icon {
  width: 48px;
  height: 48px;
  min-width: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #6daf40;
  color: #ffffff;
  font-size: 18px;
}

.skitch-contact-page-detail-content {
  flex: 1;
  min-width: 0;
}

.skitch-contact-page-detail-content span {
  display: block;
  margin-bottom: 2px;
  color: rgba(255, 255, 255, 0.48);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.8px;
}

.skitch-contact-page-detail-content strong {
  display: block;
  overflow-wrap: anywhere;
  color: #ffffff;
  font-size: 13px;
  font-weight: 700;
}

.skitch-contact-page-detail-content small {
  display: block;
  margin-top: 3px;
  color: rgba(255, 255, 255, 0.42);
  font-size: 9px;
}

.skitch-contact-page-detail-arrow {
  width: 30px;
  height: 30px;
  min-width: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.42);
  font-size: 11px;
  transition: 0.3s ease;
}

.skitch-contact-page-detail-card:hover .skitch-contact-page-detail-arrow {
  color: #8dcc61;
  transform: translateX(3px);
}

/* =========================================================
   WHATSAPP CARD
========================================================= */

.skitch-contact-page-whatsapp {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
  padding: 17px;
  border-radius: 14px;
  background: #ffffff;
}

.skitch-contact-page-whatsapp-icon {
  width: 48px;
  height: 48px;
  min-width: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #e6f9eb;
  color: #22b954;
  font-size: 25px;
}

.skitch-contact-page-whatsapp-content {
  flex: 1;
}

.skitch-contact-page-whatsapp-content span {
  display: block;
  color: #819083;
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
}

.skitch-contact-page-whatsapp-content h4 {
  margin: 3px 0 0;
  color: #193c21;
  font-size: 13px;
  font-weight: 800;
}

.skitch-contact-page-whatsapp-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 13px;
  border-radius: 8px;
  background: #22b954;
  color: #ffffff !important;
  text-decoration: none !important;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
  transition: 0.3s ease;
}

.skitch-contact-page-whatsapp-btn:hover {
  background: #179845;
  transform: translateY(-2px);
}

/* =========================================================
   SOCIAL
========================================================= */

.skitch-contact-page-social-wrapper {
  position: relative;
  z-index: 2;
  margin-top: 28px;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, 0.09);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}

.skitch-contact-page-social-wrapper > span {
  color: rgba(255, 255, 255, 0.48);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.8px;
}

.skitch-contact-page-social {
  display: flex;
  align-items: center;
  gap: 7px;
}

.skitch-contact-page-social a {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.07);
  color: #ffffff;
  font-size: 12px;
  transition: 0.3s ease;
}

.skitch-contact-page-social a:hover {
  background: #6daf40;
  color: #ffffff;
  transform: translateY(-3px);
}

/* =========================================================
   RIGHT FORM CARD
========================================================= */

.skitch-contact-page-form-card {
  height: 100%;
  padding: 42px;
  border: 1px solid #e5ece2;
  border-radius: 24px;
  background: #ffffff;
  box-shadow: 0 20px 55px rgba(24, 61, 27, 0.08);
}

.skitch-contact-page-form-heading {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 30px;
  padding-bottom: 22px;
  border-bottom: 1px solid #edf1eb;
}

.skitch-contact-page-form-icon {
  width: 56px;
  height: 56px;
  min-width: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: #edf7e7;
  color: #65a83a;
  font-size: 21px;
}

.skitch-contact-page-form-heading span {
  display: block;
  margin-bottom: 3px;
  color: #6bad40;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.skitch-contact-page-form-heading h3 {
  margin: 0;
  color: #18391f;
  font-size: 22px;
  font-weight: 800;
}

/* =========================================================
   FORM GROUP
========================================================= */

.skitch-contact-page-form-group label {
  display: block;
  margin-bottom: 7px;
  color: #304934;
  font-size: 11px;
  font-weight: 800;
}

.skitch-contact-page-form-group label span {
  color: #e45151;
}

.skitch-contact-page-input-wrap {
  position: relative;
}

.skitch-contact-page-input-wrap > i {
  position: absolute;
  top: 50%;
  left: 15px;
  z-index: 2;
  transform: translateY(-50%);
  color: #8a978b;
  font-size: 12px;
  pointer-events: none;
}

.skitch-contact-page-input-wrap input,
.skitch-contact-page-input-wrap select,
.skitch-contact-page-input-wrap textarea {
  width: 100%;
  min-height: 51px;
  padding: 11px 14px 11px 42px;
  border: 1px solid #e3e9e1;
  border-radius: 9px;
  outline: none;
  background: #fbfcfa;
  color: #263b2a;
  font-size: 12px;
  transition:
    border-color 0.3s ease,
    box-shadow 0.3s ease,
    background 0.3s ease;
}

.skitch-contact-page-input-wrap input::placeholder,
.skitch-contact-page-input-wrap textarea::placeholder {
  color: #a6afa7;
}

.skitch-contact-page-input-wrap select {
  cursor: pointer;
}

.skitch-contact-page-input-wrap input:focus,
.skitch-contact-page-input-wrap select:focus,
.skitch-contact-page-input-wrap textarea:focus {
  border-color: #7db657;
  background: #ffffff;
  box-shadow: 0 0 0 4px rgba(105, 173, 56, 0.09);
}

.skitch-contact-page-textarea-wrap > i {
  top: 18px;
  transform: none;
}

.skitch-contact-page-input-wrap textarea {
  min-height: 125px;
  resize: vertical;
  padding-top: 14px;
}

/* =========================================================
   CUSTOM CHECKBOX
========================================================= */

.skitch-contact-page-check {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
}

.skitch-contact-page-check input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.skitch-contact-page-checkmark {
  width: 20px;
  height: 20px;
  min-width: 20px;
  margin-top: 1px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d9e2d5;
  border-radius: 5px;
  background: #ffffff;
  color: transparent;
  font-size: 9px;
  transition: 0.25s ease;
}

.skitch-contact-page-check input:checked + .skitch-contact-page-checkmark {
  border-color: #68aa3c;
  background: #68aa3c;
  color: #ffffff;
}

.skitch-contact-page-check-text {
  color: #7b867d;
  font-size: 10px;
  line-height: 1.6;
}

/* =========================================================
   SUBMIT BUTTON
========================================================= */

.skitch-contact-page-submit {
  width: 100%;
  min-height: 55px;
  margin-top: 5px;
  padding: 6px 7px 6px 20px;
  border: none;
  border-radius: 9px;
  background: #173d20;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  transition:
    transform 0.3s ease,
    background 0.3s ease,
    box-shadow 0.3s ease;
}

.skitch-contact-page-submit-icon {
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 7px;
  background: #6dae40;
  color: #ffffff;
  transition: 0.3s ease;
}

.skitch-contact-page-submit:hover {
  background: #24562e;
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(30, 83, 37, 0.17);
}

.skitch-contact-page-submit:hover .skitch-contact-page-submit-icon {
  transform: translateX(-3px);
}

/* =========================================================
   FORM BOTTOM
========================================================= */

.skitch-contact-page-form-bottom {
  margin-top: 20px;
  padding-top: 17px;
  border-top: 1px solid #edf1eb;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px 20px;
}

.skitch-contact-page-form-bottom div {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #929c93;
  font-size: 9px;
}

.skitch-contact-page-form-bottom i {
  color: #6bad40;
}

/* =========================================================
   ANIMATION
========================================================= */

.skitch-contact-page-info {
  animation: skitchContactLeft 0.8s ease both;
}

.skitch-contact-page-form-card {
  animation: skitchContactRight 0.8s ease 0.12s both;
}

@keyframes skitchContactLeft {
  from {
    opacity: 0;
    transform: translateX(-30px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes skitchContactRight {
  from {
    opacity: 0;
    transform: translateX(30px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {
  .skitch-contact-page-info,
  .skitch-contact-page-form-card {
    padding: 34px;
  }

  .skitch-contact-page-info-top h3 {
    font-size: 30px;
  }

  .skitch-contact-page-whatsapp {
    flex-wrap: wrap;
  }

  .skitch-contact-page-whatsapp-btn {
    margin-left: 60px;
  }
}

@media (max-width: 991px) {
  .skitch-contact-page-section {
    padding: 80px 0;
  }

  .skitch-contact-page-heading {
    margin-bottom: 42px;
  }

  .skitch-contact-page-info {
    height: auto;
  }

  .skitch-contact-page-whatsapp {
    flex-wrap: nowrap;
  }

  .skitch-contact-page-whatsapp-btn {
    margin-left: 0;
  }
}

@media (max-width: 767px) {
  .skitch-contact-page-section {
    padding: 65px 0;
  }

  .skitch-contact-page-heading h2 {
    font-size: 38px;
  }

  .skitch-contact-page-heading p {
    font-size: 13px;
  }

  .skitch-contact-page-info,
  .skitch-contact-page-form-card {
    padding: 28px;
    border-radius: 18px;
  }

  .skitch-contact-page-info-top h3 {
    font-size: 27px;
  }

  .skitch-contact-page-form-heading h3 {
    font-size: 19px;
  }
}

@media (max-width: 575px) {
  .skitch-contact-page-section {
    padding: 55px 0;
  }

  .skitch-contact-page-heading {
    margin-bottom: 34px;
  }

  .skitch-contact-page-heading h2 {
    font-size: 32px;
  }

  .skitch-contact-page-small-title {
    font-size: 9px;
  }

  .skitch-contact-page-small-title span {
    width: 22px;
  }

  .skitch-contact-page-info,
  .skitch-contact-page-form-card {
    padding: 22px 18px;
    border-radius: 16px;
  }

  .skitch-contact-page-info-top h3 {
    font-size: 25px;
  }

  .skitch-contact-page-info-top p {
    font-size: 12px;
  }

  .skitch-contact-page-detail-card {
    padding: 12px;
    gap: 10px;
  }

  .skitch-contact-page-detail-icon {
    width: 43px;
    height: 43px;
    min-width: 43px;
    font-size: 16px;
  }

  .skitch-contact-page-detail-content strong {
    font-size: 11px;
  }

  .skitch-contact-page-detail-arrow {
    display: none;
  }

  .skitch-contact-page-whatsapp {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .skitch-contact-page-whatsapp-btn {
    width: 100%;
    justify-content: center;
  }

  .skitch-contact-page-social-wrapper {
    align-items: flex-start;
    flex-direction: column;
  }

  .skitch-contact-page-form-heading {
    align-items: flex-start;
  }

  .skitch-contact-page-form-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
  }

  .skitch-contact-page-form-heading h3 {
    font-size: 17px;
  }

  .skitch-contact-page-form-bottom {
    flex-direction: column;
  }
}

@media (prefers-reduced-motion: reduce) {
  .skitch-contact-page-info,
  .skitch-contact-page-form-card {
    animation: none;
  }
}
/* ============================= contact us end =====================  */

/* ================================ product details start =========  */
/* =========================================================
   SKITCH PRODUCT DETAILS PAGE
========================================================= */

.skitch-product-detail-section {
  padding: 85px 0 30px;
  background: #ffffff;
}

/* =========================================================
   PRODUCT GALLERY
========================================================= */

.skitch-product-detail-gallery {
  position: sticky;
  top: 110px;

  display: flex;
  gap: 16px;
}

.skitch-product-detail-thumbnails {
  width: 82px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.skitch-product-detail-thumb {
  width: 82px;
  height: 90px;

  padding: 5px;

  border: 1px solid #e3e9e0;
  border-radius: 11px;

  background: #ffffff;

  cursor: pointer;

  transition: all 0.3s ease;
}

.skitch-product-detail-thumb img {
  width: 100%;
  height: 100%;

  border-radius: 7px;

  object-fit: cover;
}

.skitch-product-detail-thumb:hover,
.skitch-product-detail-thumb.active {
  border-color: #69ad38;

  box-shadow: 0 6px 18px rgba(58, 109, 32, 0.13);
}

.skitch-product-detail-main-image-wrap {
  position: relative;
  flex: 1;

  min-width: 0;
}

.skitch-product-detail-main-image {
  position: relative;

  height: 620px;

  overflow: hidden;

  border-radius: 20px;

  background: #f7f8f6;

  border: 1px solid #e9ede7;
}

.skitch-product-detail-main-image img {
  width: 100%;
  height: 100%;

  object-fit: cover;

  transition: transform 0.7s ease;
}

.skitch-product-detail-main-image:hover img {
  transform: scale(1.08);
}

.skitch-product-detail-sale-badge {
  position: absolute;

  top: 18px;
  left: 18px;

  z-index: 4;

  padding: 8px 12px;

  border-radius: 6px;

  background: #e64c4c;

  color: #ffffff;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 0.5px;
}

.skitch-product-detail-wishlist-top {
  position: absolute;

  top: 17px;
  right: 17px;

  z-index: 4;

  width: 44px;
  height: 44px;

  border: none;
  border-radius: 50%;

  background: #ffffff;

  color: #26372a;

  display: flex;
  align-items: center;
  justify-content: center;

  box-shadow: 0 7px 22px rgba(0, 0, 0, 0.1);

  transition: all 0.3s ease;
}

.skitch-product-detail-wishlist-top:hover {
  background: #69ad38;
  color: #ffffff;
}

.skitch-product-detail-image-hint {
  margin-top: 12px;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 7px;

  color: #8b968d;

  font-size: 11px;
}

/* =========================================================
   PRODUCT CONTENT
========================================================= */

.skitch-product-detail-content {
  padding-left: 10px;
}

.skitch-product-detail-category {
  margin-bottom: 12px;

  color: #67a83b;

  font-size: 11px;
  font-weight: 800;

  text-transform: uppercase;

  letter-spacing: 1.2px;
}

.skitch-product-detail-content h1 {
  margin: 0 0 16px;
  color: #182f1d;
  line-height: 1.18;
  font-weight: 700;
}

/* Rating */

.skitch-product-detail-rating-row {
  display: flex;
  align-items: center;

  flex-wrap: wrap;

  gap: 10px;

  margin-bottom: 21px;
}

.skitch-product-detail-stars {
  color: #e5a827;

  font-size: 12px;
}

.skitch-product-detail-rating-row a {
  color: #435048;

  font-size: 11px;
  font-weight: 700;
}

.skitch-product-detail-rating-row > span {
  width: 1px;
  height: 14px;

  background: #dce2da;
}

.skitch-product-detail-sold {
  color: #7c887f;

  font-size: 11px;
}

/* Short Description */

.skitch-product-detail-short-description {
  margin-bottom: 22px;
  color: #000;
  font-size: 16px;
  line-height: 1.85;
}

/* Price */

.skitch-product-detail-price-box {
  margin-bottom: 20px;

  padding: 18px 20px;

  border-radius: 12px;

  background: #f6f9f4;
}

.skitch-product-detail-price {
  display: flex;
  align-items: center;

  flex-wrap: wrap;

  gap: 11px;
}

.skitch-product-detail-price strong {
  color: #17381e;

  font-size: 30px;
  font-weight: 800;
}

.skitch-product-detail-price del {
  color: #173d20;
  font-size: 16px;
}

.skitch-product-detail-price span {
  padding: 5px 9px;

  border-radius: 5px;

  background: #e6f3dd;

  color: #4c8b29;

  font-size: 10px;
  font-weight: 800;
}

.skitch-product-detail-price-box small {
  display: block;

  margin-top: 5px;

  color: #89938b;

  font-size: 10px;
}

/* Stock */

.skitch-product-detail-stock-row {
  display: flex;
  align-items: center;

  gap: 12px;

  margin-bottom: 22px;
}

.skitch-product-detail-stock {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #33914c;
  font-size: 13px;
  font-weight: 800;
}

.skitch-product-detail-stock span {
  width: 8px;
  height: 8px;

  border-radius: 50%;

  background: #42a859;

  box-shadow: 0 0 0 4px rgba(66, 168, 89, 0.12);
}

.skitch-product-detail-stock-text {
  color: #69ad38;
  font-size: 14px;
}

/* Meta */

.skitch-product-detail-meta {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 10px 20px;

  margin-bottom: 27px;

  padding: 18px;

  border: 1px solid #e6ebe4;

  border-radius: 11px;
}

.skitch-product-detail-meta div {
  display: flex;
  justify-content: space-between;

  gap: 12px;

  font-size: 11px;
}

.skitch-product-detail-meta span {
  color: #8b958d;
}

.skitch-product-detail-meta strong {
  color: #304536;

  font-weight: 700;
}

/* Options */

.skitch-product-detail-option {
  margin-bottom: 24px;
}

.skitch-product-detail-option-title {
  display: flex;
  align-items: center;
  justify-content: space-between;

  margin-bottom: 11px;
}

.skitch-product-detail-option-title > span {
  color: #273d2c;

  font-size: 12px;
  font-weight: 800;
}

.skitch-product-detail-option-title strong {
  color: #67a83b;

  font-size: 11px;
}

.skitch-product-detail-option-title a {
  color: #5c9c36;

  font-size: 10px;
  font-weight: 700;
}

.skitch-product-detail-color-list {
  display: flex;
  gap: 10px;
}

.skitch-product-detail-color {
  width: 38px;
  height: 38px;

  padding: 4px;

  border: 1px solid #dce4d9;

  border-radius: 50%;

  background: #ffffff;

  transition: 0.3s ease;
}

.skitch-product-detail-color.active {
  border-color: #69ad38;
}

.skitch-product-detail-color span {
  width: 100%;
  height: 100%;

  display: block;

  border-radius: 50%;
}

.skitch-product-detail-color-silver {
  background: #c7cbcb;
}

.skitch-product-detail-color-black {
  background: #262626;
}

.skitch-product-detail-color-copper {
  background: #b87333;
}

/* Size */

.skitch-product-detail-size-list {
  display: flex;

  flex-wrap: wrap;

  gap: 9px;
}

.skitch-product-detail-size {
  min-width: 68px;

  height: 39px;

  padding: 0 13px;

  border: 1px solid #dde4da;

  border-radius: 7px;

  background: #ffffff;

  color: #455149;

  font-size: 11px;
  font-weight: 700;

  transition: 0.3s ease;
}

.skitch-product-detail-size:hover,
.skitch-product-detail-size.active {
  border-color: #69ad38;

  background: #edf7e7;

  color: #518f2e;
}

/* =========================================================
   QUANTITY & PURCHASE
========================================================= */

.skitch-product-detail-purchase-row {
  display: flex;

  gap: 12px;

  margin-top: 28px;
}

.skitch-product-detail-quantity {
  height: 53px;

  display: flex;

  border: 1px solid #dfe6dc;

  border-radius: 9px;

  overflow: hidden;
}

.skitch-product-detail-quantity button {
  width: 45px;

  border: none;

  background: #f7f9f6;

  color: #314535;

  font-size: 11px;
}

.skitch-product-detail-quantity input {
  width: 52px;

  border: none;

  outline: none;

  text-align: center;

  color: #233b29;

  font-size: 13px;
  font-weight: 800;
}

.skitch-product-detail-add-cart {
  flex: 1;

  min-height: 53px;

  border: none;

  border-radius: 9px;

  background: #69ad38;

  color: #ffffff;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 10px;

  font-size: 13px;
  font-weight: 800;

  transition: 0.3s ease;
}

.skitch-product-detail-add-cart:hover {
  background: #4d8c29;

  transform: translateY(-2px);

  box-shadow: 0 10px 24px rgba(71, 131, 37, 0.2);
}

/* Actions */

.skitch-product-detail-action-row {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 12px;

  margin-top: 12px;
}

.skitch-product-detail-buy-now,
.skitch-product-detail-enquiry {
  min-height: 51px;

  border-radius: 9px;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 9px;

  font-size: 13px;
  font-weight: 800;

  transition: 0.3s ease;
}

.skitch-product-detail-buy-now {
  border: none;

  background: #173d20;

  color: #ffffff;
}

.skitch-product-detail-buy-now:hover {
  background: #285b31;

  transform: translateY(-2px);
}

.skitch-product-detail-enquiry {
  border: 1px solid #dce4d9;

  background: #ffffff;

  color: #29442f;
}

.skitch-product-detail-enquiry:hover {
  border-color: #69ad38;

  background: #edf7e7;

  color: #4e8b2b;
}

/* =========================================================
   DELIVERY
========================================================= */

.skitch-product-detail-delivery {
  display: flex;
  align-items: center;

  gap: 14px;

  margin-top: 22px;

  padding: 17px;

  border-radius: 11px;

  background: #f8faf7;

  border: 1px solid #e5ebe2;
}

.skitch-product-detail-delivery-icon {
  width: 45px;
  height: 45px;

  min-width: 45px;

  border-radius: 10px;

  background: #eaf5e4;

  color: #62a338;

  display: flex;
  align-items: center;
  justify-content: center;
}

.skitch-product-detail-delivery-content {
  flex: 1;
}

.skitch-product-detail-delivery-content > span {
  display: block;

  margin-bottom: 7px;

  color: #33493a;

  font-size: 10px;
  font-weight: 800;
}

.skitch-product-detail-pincode {
  display: flex;

  gap: 8px;
}

.skitch-product-detail-pincode input {
  flex: 1;

  height: 37px;

  min-width: 0;

  padding: 0 11px;

  border: 1px solid #dfe6dc;

  border-radius: 6px;

  outline: none;

  font-size: 10px;
}

.skitch-product-detail-pincode input:focus {
  border-color: #69ad38;
}

.skitch-product-detail-pincode button {
  height: 37px;

  padding: 0 15px;

  border: none;

  border-radius: 6px;

  background: #173d20;

  color: #ffffff;

  font-size: 9px;
  font-weight: 800;
}

/* Benefits */

.skitch-product-detail-benefits {
  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 9px;

  margin-top: 22px;
}

.skitch-product-detail-benefits div {
  padding: 13px 8px;

  text-align: center;

  border: 1px solid #e6ebe4;

  border-radius: 9px;
}

.skitch-product-detail-benefits i {
  display: block;

  margin-bottom: 7px;

  color: #66a93b;

  font-size: 17px;
}

.skitch-product-detail-benefits span {
  color: #536057;

  font-size: 13px;
  font-weight: 700;
}

/* Share */

.skitch-product-detail-share {
  display: flex;
  align-items: center;

  gap: 8px;

  margin-top: 23px;
}

.skitch-product-detail-share > span {
  margin-right: 5px;

  color: #69756c;

  font-size: 10px;
  font-weight: 700;
}

.skitch-product-detail-share a {
  width: 34px;
  height: 34px;

  border-radius: 50%;

  background: #f1f5ef;

  color: #3d5542;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 14px;

  transition: 0.3s ease;
}

.skitch-product-detail-share a:hover {
  background: #69ad38;

  color: #ffffff;

  transform: translateY(-2px);
}

/* =========================================================
   TAB SECTION
========================================================= */

.skitch-product-detail-info-section {
  padding: 20px 0 100px;

  background: #ffffff;
}

.skitch-product-detail-tabs {
  display: flex;

  overflow-x: auto;

  border-bottom: 1px solid #e3e9e1;
}

.skitch-product-detail-tab-button {
  min-width: max-content;

  padding: 18px 25px;

  border: none;

  border-bottom: 2px solid transparent;

  background: transparent;

  color: #7a867d;

  font-size: 12px;
  font-weight: 800;

  transition: 0.3s ease;
}

.skitch-product-detail-tab-button:hover,
.skitch-product-detail-tab-button.active {
  color: #4f8e2b;

  border-bottom-color: #69ad38;
}

.skitch-product-detail-tab-content {
  display: none;

  padding-top: 45px;
}

.skitch-product-detail-tab-content.active {
  display: block;

  animation: skitchProductTabFade 0.45s ease;
}

@keyframes skitchProductTabFade {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Description */

.skitch-product-detail-description > span {
  display: block;

  margin-bottom: 10px;

  color: #68a93d;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 1px;

  text-transform: uppercase;
}

.skitch-product-detail-description h2 {
  margin-bottom: 18px;

  color: #18391f;

  font-family: "Playfair Display", serif;

  font-size: 38px;
}

.skitch-product-detail-description p {
  color: #6e796f;

  font-size: 13px;

  line-height: 1.9;
}

.skitch-product-detail-description ul {
  margin-top: 23px;

  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 12px;
}

.skitch-product-detail-description li {
  display: flex;
  align-items: center;

  gap: 9px;

  color: #405246;

  font-size: 11px;
  font-weight: 700;
}

.skitch-product-detail-description li i {
  width: 24px;
  height: 24px;

  border-radius: 50%;

  background: #edf6e8;

  color: #62a538;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 9px;
}

.skitch-product-detail-description-image {
  height: 400px;

  overflow: hidden;

  border-radius: 18px;
}

.skitch-product-detail-description-image img {
  width: 100%;
  height: 100%;

  object-fit: cover;
}

/* Specifications */

.skitch-product-detail-specification {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  border: 1px solid #e4eae1;

  border-radius: 14px;

  overflow: hidden;
}

.skitch-product-detail-specification div {
  display: flex;
  justify-content: space-between;

  gap: 20px;

  padding: 16px 20px;

  border-bottom: 1px solid #e8ede6;
}

.skitch-product-detail-specification div:nth-child(odd) {
  border-right: 1px solid #e8ede6;
}

.skitch-product-detail-specification span {
  color: #7d897f;

  font-size: 11px;
}

.skitch-product-detail-specification strong {
  color: #33483a;

  font-size: 11px;
}

/* Feature Cards */

.skitch-product-detail-feature-card {
  height: 100%;

  padding: 26px;

  border: 1px solid #e5ebe2;

  border-radius: 14px;

  transition: 0.3s ease;
}

.skitch-product-detail-feature-card:hover {
  border-color: #bcd8aa;

  transform: translateY(-5px);

  box-shadow: 0 12px 30px rgba(39, 77, 34, 0.08);
}

.skitch-product-detail-feature-card > div {
  width: 53px;
  height: 53px;

  margin-bottom: 18px;

  border-radius: 12px;

  background: #edf6e8;

  color: #63a63a;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 21px;
}

.skitch-product-detail-feature-card h4 {
  margin-bottom: 8px;

  color: #263f2c;

  font-size: 15px;
}

.skitch-product-detail-feature-card p {
  margin: 0;

  color: #78847a;

  font-size: 11px;

  line-height: 1.75;
}

/* Reviews */

.skitch-product-detail-review-summary {
  padding: 35px;

  text-align: center;

  border-radius: 16px;

  background: #f6f9f4;
}

.skitch-product-detail-review-summary > span {
  display: block;

  color: #69756c;

  font-size: 10px;
  font-weight: 700;
}

.skitch-product-detail-review-summary > strong {
  display: block;

  margin: 8px 0;

  color: #18391f;

  font-size: 52px;
}

.skitch-product-detail-review-summary > div {
  color: #e5a827;

  font-size: 13px;
}

.skitch-product-detail-review-summary p {
  margin: 9px 0 0;

  color: #8b968d;

  font-size: 10px;
}

.skitch-product-detail-review-item {
  padding: 20px 0;

  border-bottom: 1px solid #e7ece5;
}

.skitch-product-detail-review-item:first-child {
  padding-top: 0;
}

.skitch-product-detail-review-head {
  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;

  margin-bottom: 10px;
}

.skitch-product-detail-review-head strong {
  display: block;

  color: #2f4635;

  font-size: 12px;
}

.skitch-product-detail-review-head span {
  display: block;

  margin-top: 2px;

  color: #89948b;

  font-size: 9px;
}

.skitch-product-detail-review-head > div:last-child {
  color: #e5a827;

  font-size: 10px;
}

.skitch-product-detail-review-item p {
  margin: 0;

  color: #6f7c72;

  font-size: 12px;

  line-height: 1.75;
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {
  .skitch-product-detail-main-image {
    height: 540px;
  }

  .skitch-product-detail-benefits {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 991px) {
  .skitch-product-detail-section {
    padding: 65px 0 80px;
  }

  .skitch-product-detail-gallery {
    position: relative;

    top: auto;
  }

  .skitch-product-detail-content {
    padding-left: 0;
  }

  .skitch-product-detail-main-image {
    height: 580px;
  }
}

@media (max-width: 767px) {
  .skitch-product-detail-gallery {
    flex-direction: column-reverse;
  }

  .skitch-product-detail-thumbnails {
    width: 100%;

    flex-direction: row;

    overflow-x: auto;
  }

  .skitch-product-detail-thumb {
    min-width: 72px;

    width: 72px;
    height: 78px;
  }

  .skitch-product-detail-main-image {
    height: 480px;
  }

  .skitch-product-detail-meta {
    grid-template-columns: 1fr;
  }

  .skitch-product-detail-purchase-row {
    flex-direction: column;
  }

  .skitch-product-detail-quantity {
    width: 100%;
  }

  .skitch-product-detail-quantity input {
    flex: 1;
  }

  .skitch-product-detail-action-row {
    grid-template-columns: 1fr;
  }

  .skitch-product-detail-description ul {
    grid-template-columns: 1fr;
  }

  .skitch-product-detail-specification {
    grid-template-columns: 1fr;
  }

  .skitch-product-detail-specification div:nth-child(odd) {
    border-right: none;
  }
}

@media (max-width: 575px) {
  .skitch-product-detail-section {
    padding: 50px 0 65px;
  }

  .skitch-product-detail-main-image {
    height: 360px;

    border-radius: 15px;
  }

  .skitch-product-detail-content h1 {
    font-size: 32px;
  }

  .skitch-product-detail-price strong {
    font-size: 25px;
  }

  .skitch-product-detail-benefits {
    grid-template-columns: repeat(2, 1fr);
  }

  .skitch-product-detail-delivery {
    align-items: flex-start;
  }

  .skitch-product-detail-description h2 {
    font-size: 30px;
  }

  .skitch-product-detail-description-image {
    height: 300px;
  }

  .skitch-product-detail-review-head {
    align-items: flex-start;

    flex-direction: column;
  }
}
/* ================================ product details end =========  */

.product-padding {
  padding-top: 0;
}

/* ================= shoping cart section start ================  */
/* =========================================================
   SKITCH SHOPPING CART PAGE
   UNIQUE PREFIX TO AVOID CSS CONFLICT
========================================================= */

.skitch-cart-page-section {
  position: relative;
  padding: 90px 0 105px;
  background: linear-gradient(180deg, #ffffff 0%, #f7f9f6 100%);
}

/* =========================================================
   PAGE HEADING
========================================================= */

.skitch-cart-page-heading {
  margin-bottom: 30px;

  display: flex;
  align-items: flex-end;
  justify-content: space-between;

  gap: 30px;
}

.skitch-cart-page-label {
  display: inline-flex;
  align-items: center;

  gap: 8px;

  margin-bottom: 11px;

  color: #69a83e;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 1.3px;

  text-transform: uppercase;
}

.skitch-cart-page-heading h1 {
  margin: 0 0 8px;

  color: #17371e;

  font-weight: 700;
}

.skitch-cart-page-heading p {
  margin: 0;

  color: #79847b;

  font-size: 13px;
}

.skitch-cart-page-continue-top {
  display: inline-flex;
  align-items: center;

  gap: 9px;

  padding: 11px 16px;

  border: 1px solid #dfe6dc;

  border-radius: 8px;

  background: #ffffff;

  color: #344b39 !important;

  text-decoration: none !important;

  font-size: 15px;
  font-weight: 800;

  transition: 0.3s ease;
}

.skitch-cart-page-continue-top:hover {
  border-color: #6cad40;

  color: #5d9d35 !important;

  transform: translateY(-2px);
}

/* =========================================================
   SHIPPING PROGRESS
========================================================= */

.skitch-cart-page-shipping-progress {
  margin-bottom: 30px;

  padding: 18px 20px;

  display: flex;
  align-items: center;

  gap: 15px;

  border: 1px solid #dfead9;

  border-radius: 13px;

  background: #f4f9f1;
}

.skitch-cart-page-shipping-icon {
  width: 48px;
  height: 48px;

  min-width: 48px;

  border-radius: 11px;

  background: #6cad40;

  color: #ffffff;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 18px;
}

.skitch-cart-page-shipping-content {
  flex: 1;
}

.skitch-cart-page-shipping-text {
  margin-bottom: 10px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 15px;
}

.skitch-cart-page-shipping-text > span {
  color: #344b39;

  font-size: 12px;
}

.skitch-cart-page-shipping-text strong {
  color: #5f9f36;
}

.skitch-cart-page-shipping-text small {
  color: #879189;

  font-size: 9px;
}

.skitch-cart-page-progress-bar {
  width: 100%;
  height: 7px;

  overflow: hidden;

  border-radius: 30px;

  background: #dde8d7;
}

.skitch-cart-page-progress-fill {
  height: 100%;

  border-radius: inherit;

  background: linear-gradient(90deg, #69ad38, #91c96d);

  transition: width 0.4s ease;
}

/* =========================================================
   CART PRODUCTS CARD
========================================================= */

.skitch-cart-page-products-card {
  overflow: hidden;

  border: 1px solid #e2e8df;

  border-radius: 18px;

  background: #ffffff;

  box-shadow: 0 17px 45px rgba(35, 69, 32, 0.06);
}

.skitch-cart-page-products-header {
  padding: 22px 24px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;

  border-bottom: 1px solid #e8ede6;
}

.skitch-cart-page-products-header h3 {
  margin: 0 0 3px;

  color: #203b27;

  font-size: 18px;
  font-weight: 800;
}

.skitch-cart-page-products-header span {
  color: #88938a;

  font-size: 10px;
}

.skitch-cart-page-clear {
  border: none;

  background: transparent;

  color: #c04e4e;

  display: inline-flex;
  align-items: center;

  gap: 7px;

  font-size: 10px;
  font-weight: 800;

  transition: 0.3s ease;
}

.skitch-cart-page-clear:hover {
  color: #e14444;
}

/* =========================================================
   CART ITEM
========================================================= */

.skitch-cart-page-item {
  padding: 23px 24px;

  display: flex;

  gap: 20px;

  border-bottom: 1px solid #edf1eb;

  transition: background 0.3s ease;
}

.skitch-cart-page-item:hover {
  background: #fcfdfb;
}

.skitch-cart-page-product-image {
  width: 145px;
  height: 145px;

  min-width: 145px;

  overflow: hidden;

  border-radius: 12px;

  background: #f5f7f3;

  border: 1px solid #e6ebe3;
}

.skitch-cart-page-product-image img {
  width: 100%;
  height: 100%;

  object-fit: cover;

  transition: transform 0.5s ease;
}

.skitch-cart-page-product-image:hover img {
  transform: scale(1.06);
}

.skitch-cart-page-product-info {
  flex: 1;

  min-width: 0;
}

.skitch-cart-page-product-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;

  gap: 15px;
}

.skitch-cart-page-product-category {
  display: block;

  margin-bottom: 5px;

  color: #69a83d;

  font-size: 9px;
  font-weight: 800;

  letter-spacing: 0.7px;

  text-transform: uppercase;
}

.skitch-cart-page-product-title {
  display: inline-block;

  color: #223a28 !important;

  text-decoration: none !important;

  font-size: 18px;
  font-weight: 800;

  line-height: 1.45;

  transition: 0.3s ease;
}

.skitch-cart-page-product-title:hover {
  color: #5d9c35 !important;
}

.skitch-cart-page-product-meta {
  margin-top: 8px;

  display: flex;
  flex-wrap: wrap;

  gap: 5px 16px;
}

.skitch-cart-page-product-meta span {
  color: #8a948c;

  font-size: 9px;
}

.skitch-cart-page-product-meta strong {
  color: #59645c;

  font-weight: 700;
}

.skitch-cart-page-remove {
  width: 36px;
  height: 36px;

  min-width: 36px;

  border: 1px solid #ecefed;

  border-radius: 50%;

  background: red;

  color: #fff;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 12px;

  transition: 0.3s ease;
}

.skitch-cart-page-remove:hover {
  border-color: red;
  background: #fff4f4;
  color: red;
}

/* Product Bottom */

.skitch-cart-page-product-bottom {
  margin-top: 24px;

  display: grid;

  grid-template-columns: 1.2fr 1fr 1fr;

  align-items: center;

  gap: 15px;
}

.skitch-cart-page-price {
  display: flex;
  align-items: center;

  flex-wrap: wrap;

  gap: 7px;
}

.skitch-cart-page-price strong {
  color: #173b20;

  font-size: 16px;
  font-weight: 800;
}

.skitch-cart-page-price del {
  color: #a3aba5;

  font-size: 11px;
}

.skitch-cart-page-price span {
  padding: 4px 6px;

  border-radius: 4px;

  background: #eaf4e4;

  color: #5b9834;

  font-size: 8px;
  font-weight: 800;
}

/* Quantity */

.skitch-cart-page-quantity {
  width: 120px;
  height: 40px;

  display: flex;

  overflow: hidden;

  border: 1px solid #dfe6dc;

  border-radius: 7px;

  background: #ffffff;
}

.skitch-cart-page-quantity button {
  width: 38px;

  border: none;

  background: #f7f9f6;

  color: #435148;

  font-size: 9px;
}

.skitch-cart-page-quantity input {
  width: 44px;

  border: none;

  outline: none;

  text-align: center;

  color: #304335;

  font-size: 11px;
  font-weight: 800;
}

.skitch-cart-page-item-total {
  text-align: right;
}

.skitch-cart-page-item-total span {
  display: block;

  margin-bottom: 2px;

  color: #8b958d;

  font-size: 8px;

  text-transform: uppercase;

  letter-spacing: 0.5px;
}

.skitch-cart-page-item-total strong {
  color: #173a20;

  font-size: 15px;
}

/* =========================================================
   CART FOOTER
========================================================= */

.skitch-cart-page-cart-footer {
  padding: 20px 24px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;
}

.skitch-cart-page-continue {
  display: inline-flex;
  align-items: center;

  gap: 8px;

  color: #405246 !important;

  text-decoration: none !important;

  font-size: 12px;
  font-weight: 800;
}

.skitch-cart-page-continue:hover {
  color: #5d9e35 !important;
}

.skitch-cart-page-update {
  min-height: 40px;

  padding: 0 16px;

  border: 1px solid #dce5d9;

  border-radius: 7px;

  background: #ffffff;

  color: #364a3b;

  display: inline-flex;
  align-items: center;

  gap: 8px;

  font-size: 10px;
  font-weight: 800;

  transition: 0.3s ease;
}

.skitch-cart-page-update:hover {
  border-color: #6dad40;

  background: #edf7e7;

  color: #5b9834;
}

/* =========================================================
   COUPON
========================================================= */

.skitch-cart-page-coupon-card {
  margin-top: 20px;

  padding: 20px;

  display: flex;
  align-items: center;

  gap: 15px;

  border: 1px dashed #cddbc6;

  border-radius: 14px;

  background: #fbfdf9;
}

.skitch-cart-page-coupon-icon {
  width: 52px;
  height: 52px;

  min-width: 52px;

  border-radius: 12px;

  background: #edf6e8;

  color: #65a73a;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 20px;
}

.skitch-cart-page-coupon-content {
  flex: 1;
}

.skitch-cart-page-coupon-content span {
  display: block;

  color: #71aa4b;

  font-size: 8px;
  font-weight: 800;

  text-transform: uppercase;

  letter-spacing: 0.8px;
}

.skitch-cart-page-coupon-content h4 {
  margin: 2px 0 4px;

  color: #29432f;

  font-size: 14px;
}

.skitch-cart-page-coupon-content p {
  margin: 0;

  color: #89938b;

  font-size: 9px;
}

.skitch-cart-page-coupon-form {
  width: 280px;

  display: flex;

  overflow: hidden;

  border: 1px solid #dfe6dc;

  border-radius: 8px;

  background: #ffffff;
}

.skitch-cart-page-coupon-form input {
  flex: 1;

  min-width: 0;

  height: 43px;

  padding: 0 12px;

  border: none;

  outline: none;

  color: #435148;

  font-size: 10px;
}

.skitch-cart-page-coupon-form button {
  min-width: 72px;

  border: none;

  background: #173d20;

  color: #ffffff;

  font-size: 9px;
  font-weight: 800;
}

/* =========================================================
   BENEFITS
========================================================= */

.skitch-cart-page-benefits {
  margin-top: 20px;

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 12px;
}

.skitch-cart-page-benefit {
  padding: 18px 14px;

  border: 1px solid #e5ebe2;

  border-radius: 12px;

  background: #ffffff;

  text-align: center;
}

.skitch-cart-page-benefit div {
  width: 42px;
  height: 42px;

  margin: 0 auto 10px;

  border-radius: 50%;

  background: #edf6e8;

  color: #66a93c;

  display: flex;
  align-items: center;
  justify-content: center;
}

.skitch-cart-page-benefit span {
  display: block;

  margin-bottom: 3px;

  color: #334a39;

  font-size: 10px;
  font-weight: 800;
}

.skitch-cart-page-benefit small {
  color: #8a948c;

  font-size: 8px;
}

/* =========================================================
   ORDER SUMMARY
========================================================= */

.skitch-cart-page-summary {
  position: sticky;
  top: 110px;

  padding: 28px;

  border: 1px solid #e0e7dd;

  border-radius: 18px;

  background: #ffffff;

  box-shadow: 0 20px 50px rgba(28, 61, 27, 0.08);
}

.skitch-cart-page-summary-heading {
  padding-bottom: 20px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 15px;

  border-bottom: 1px solid #e8ede6;
}

.skitch-cart-page-summary-heading span {
  display: block;

  margin-bottom: 3px;

  color: #70a94a;

  font-size: 8px;
  font-weight: 800;

  text-transform: uppercase;

  letter-spacing: 0.9px;
}

.skitch-cart-page-summary-heading h3 {
  margin: 0;

  color: #243e2a;

  font-size: 19px;
}

.skitch-cart-page-summary-icon {
  width: 47px;
  height: 47px;

  border-radius: 11px;

  background: #edf6e8;

  color: #63a639;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 18px;
}

.skitch-cart-page-summary-list {
  padding: 22px 0;
}

.skitch-cart-page-summary-row {
  margin-bottom: 14px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;
}

.skitch-cart-page-summary-row:last-child {
  margin-bottom: 0;
}

.skitch-cart-page-summary-row span {
  color: #000;

  font-size: 13px;
}

.skitch-cart-page-summary-row strong {
  color: #000;

  font-size: 14px;
}

.skitch-cart-page-summary-row .skitch-cart-page-discount {
  color: #4f9d52;
}

.skitch-cart-page-summary-divider {
  border-top: 1px dashed #d9e1d6;
}

.skitch-cart-page-total {
  padding: 20px 0;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 15px;
}

.skitch-cart-page-total span {
  display: block;

  color: #344a3a;

  font-size: 14px;
  font-weight: 800;
}

.skitch-cart-page-total small {
  display: block;

  margin-top: 2px;

  color: #929c94;

  font-size: 11px;
}

.skitch-cart-page-total > strong {
  color: #173b20;

  font-size: 22px;
  font-weight: 800;
}

/* Checkout */

.skitch-cart-page-checkout {
  width: 100%;
  min-height: 55px;

  padding: 6px 7px 6px 19px;

  border-radius: 9px;

  background: #173d20;

  color: #ffffff !important;

  display: flex;
  align-items: center;
  justify-content: space-between;

  text-decoration: none !important;

  font-size: 14px;
  font-weight: 800;

  transition: 0.3s ease;
}

.skitch-cart-page-checkout div {
  width: 42px;
  height: 42px;

  border-radius: 7px;

  background: #69ad38;

  display: flex;
  align-items: center;
  justify-content: center;

  transition: 0.3s ease;
}

.skitch-cart-page-checkout:hover {
  background: #27582f;

  transform: translateY(-2px);

  box-shadow: 0 12px 28px rgba(28, 83, 34, 0.17);
}

.skitch-cart-page-checkout:hover div {
  transform: translateX(-3px);
}

.skitch-cart-page-secure {
  margin-top: 12px;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 7px;

  color: #8c968e;

  font-size: 8px;
}

.skitch-cart-page-secure i {
  color: #63a63a;
}

/* Payment */

.skitch-cart-page-payment {
  margin-top: 22px;

  padding-top: 18px;

  border-top: 1px solid #e8ede6;
}

.skitch-cart-page-payment > span {
  display: block;

  margin-bottom: 10px;

  color: #859087;

  font-size: 8px;

  text-transform: uppercase;

  letter-spacing: 0.7px;
}

.skitch-cart-page-payment > div {
  display: flex;
  flex-wrap: wrap;

  gap: 7px;
}

.skitch-cart-page-payment > div span {
  min-width: 48px;

  padding: 7px 9px;

  border: 1px solid #e1e7df;

  border-radius: 5px;

  color: #4e5d52;

  text-align: center;

  font-size: 11px;
  font-weight: 800;
}

/* Help */

.skitch-cart-page-help {
  margin-top: 22px;

  padding: 15px;

  display: flex;
  align-items: center;

  gap: 12px;

  border-radius: 11px;

  background: #f5f9f2;
}

.skitch-cart-page-help-icon {
  width: 42px;
  height: 42px;

  min-width: 42px;

  border-radius: 10px;

  background: #e7f3df;

  color: #62a537;

  display: flex;
  align-items: center;
  justify-content: center;
}

.skitch-cart-page-help span {
  display: block;

  margin-bottom: 2px;

  color: #7c887f;

  font-size: 8px;
}

.skitch-cart-page-help a {
  color: #304c35 !important;

  text-decoration: none !important;

  font-size: 11px;
  font-weight: 800;
}

/* =========================================================
   EMPTY CART
========================================================= */

.skitch-cart-page-empty {
  display: none;

  max-width: 620px;

  margin: 30px auto;

  padding: 70px 30px;

  text-align: center;
}

.skitch-cart-page-empty-icon {
  width: 95px;
  height: 95px;

  margin: 0 auto 22px;

  border-radius: 50%;

  background: #edf6e8;

  color: #67a93b;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 36px;
}

.skitch-cart-page-empty > span {
  display: block;

  margin-bottom: 7px;

  color: #68a83e;

  font-size: 9px;
  font-weight: 800;

  letter-spacing: 1px;

  text-transform: uppercase;
}

.skitch-cart-page-empty h2 {
  margin-bottom: 12px;

  color: #203b27;

  font-family: "Playfair Display", serif;

  font-size: 38px;
}

.skitch-cart-page-empty p {
  max-width: 470px;

  margin: 0 auto 24px;

  color: #7c887f;

  font-size: 12px;

  line-height: 1.75;
}

.skitch-cart-page-empty-button {
  min-height: 49px;

  padding: 0 21px;

  border-radius: 8px;

  background: #173d20;

  color: #ffffff !important;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: 9px;

  text-decoration: none !important;

  font-size: 10px;
  font-weight: 800;

  transition: 0.3s ease;
}

.skitch-cart-page-empty-button:hover {
  background: #69ad38;

  transform: translateY(-2px);
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {
  .skitch-cart-page-product-bottom {
    grid-template-columns: 1fr 120px;
  }

  .skitch-cart-page-item-total {
    grid-column: 1 / -1;

    text-align: left;
  }

  .skitch-cart-page-coupon-card {
    flex-wrap: wrap;
  }

  .skitch-cart-page-coupon-form {
    width: 100%;
  }
}

@media (max-width: 991px) {
  .skitch-cart-page-section {
    padding: 70px 0 85px;
  }

  .skitch-cart-page-summary {
    position: relative;
    top: auto;
  }
}

@media (max-width: 767px) {
  .skitch-cart-page-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .skitch-cart-page-shipping-text {
    align-items: flex-start;
    flex-direction: column;

    gap: 4px;
  }

  .skitch-cart-page-item {
    flex-direction: column;
  }

  .skitch-cart-page-product-image {
    width: 100%;
    height: 300px;
  }

  .skitch-cart-page-product-bottom {
    grid-template-columns: 1fr;
  }

  .skitch-cart-page-item-total {
    grid-column: auto;
    text-align: left;
  }

  .skitch-cart-page-benefits {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575px) {
  .skitch-cart-page-section {
    padding: 55px 0 70px;
  }

  .skitch-cart-page-heading h1 {
    font-size: 34px;
  }

  .skitch-cart-page-shipping-progress {
    align-items: flex-start;

    padding: 15px;
  }

  .skitch-cart-page-products-header {
    padding: 18px 15px;
  }

  .skitch-cart-page-item {
    padding: 18px 15px;
  }

  .skitch-cart-page-product-image {
    height: 250px;
  }

  .skitch-cart-page-product-top {
    gap: 8px;
  }

  .skitch-cart-page-product-title {
    font-size: 14px;
  }

  .skitch-cart-page-cart-footer {
    align-items: flex-start;
    flex-direction: column;

    padding: 17px 15px;
  }

  .skitch-cart-page-update {
    width: 100%;

    justify-content: center;
  }

  .skitch-cart-page-coupon-card {
    padding: 16px;
  }

  .skitch-cart-page-coupon-content {
    width: calc(100% - 70px);
  }

  .skitch-cart-page-summary {
    padding: 22px 18px;
  }

  .skitch-cart-page-total > strong {
    font-size: 19px;
  }
}
/* ================= shoping cart section end ================  */

/* =========================== checkout start  */
/* =========================================================
   SKITCH CHECKOUT PAGE
   UNIQUE PREFIX - NO CSS CONFLICT
========================================================= */

.skitch-checkout-page-section {
  position: relative;
  padding: 90px 0 105px;
  background: linear-gradient(180deg, #ffffff 0%, #f7f9f6 100%);
}

/* =========================================================
   HEADING
========================================================= */

.skitch-checkout-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;

  gap: 30px;

  margin-bottom: 30px;
}

.skitch-checkout-page-heading > div > span {
  display: inline-flex;
  align-items: center;

  gap: 8px;

  margin-bottom: 9px;

  color: #68a73d;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 1.2px;

  text-transform: uppercase;
}

.skitch-checkout-page-heading h1 {
  margin: 0 0 8px;

  color: #17371e;

  font-weight: 700;

  line-height: 1.15;
}

.skitch-checkout-page-heading p {
  margin: 0;

  color: #7b877d;

  font-size: 13px;
}

.skitch-checkout-page-back-cart {
  display: inline-flex;
  align-items: center;

  gap: 9px;

  padding: 11px 16px;

  border: 1px solid #dfe6dc;

  border-radius: 8px;

  background: #ffffff;

  color: #344a39 !important;

  text-decoration: none !important;

  font-size: 10px;
  font-weight: 800;

  transition: 0.3s ease;
}

.skitch-checkout-page-back-cart:hover {
  border-color: #69ad38;

  color: #579331 !important;

  transform: translateY(-2px);
}

/* =========================================================
   CHECKOUT STEPS
========================================================= */

.skitch-checkout-page-steps {
  max-width: 570px;

  margin: 0 auto 38px;

  display: flex;
  align-items: flex-start;
}

.skitch-checkout-page-step {
  min-width: 75px;

  display: flex;
  align-items: center;
  flex-direction: column;

  gap: 7px;

  text-align: center;
}

.skitch-checkout-page-step > div {
  width: 36px;
  height: 36px;

  border: 1px solid #d9e1d6;

  border-radius: 50%;

  background: #ffffff;

  color: #98a099;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 10px;
  font-weight: 800;
}

.skitch-checkout-page-step span {
  color: #929b94;

  font-size: 9px;
  font-weight: 700;
}

.skitch-checkout-page-step.active > div {
  border-color: #69ad38;

  background: #69ad38;

  color: #ffffff;

  box-shadow: 0 0 0 5px rgba(105, 173, 56, 0.1);
}

.skitch-checkout-page-step.active span {
  color: #4f8730;
}

.skitch-checkout-page-step-line {
  flex: 1;

  height: 1px;

  margin-top: 18px;

  background: #dce4da;
}

.skitch-checkout-page-step-line.active {
  background: #69ad38;
}

/* =========================================================
   CARD
========================================================= */

.skitch-checkout-page-card {
  margin-bottom: 22px;

  padding: 30px;

  border: 1px solid #e1e7df;

  border-radius: 18px;

  background: #ffffff;

  box-shadow: 0 16px 42px rgba(33, 68, 30, 0.055);
}

.skitch-checkout-page-card-heading {
  display: flex;
  align-items: center;

  gap: 13px;

  margin-bottom: 25px;

  padding-bottom: 19px;

  border-bottom: 1px solid #e8ede6;
}

.skitch-checkout-page-card-icon {
  width: 48px;
  height: 48px;

  min-width: 48px;

  border-radius: 11px;

  background: #edf6e8;

  color: #64a63a;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 18px;
}

.skitch-checkout-page-card-heading span {
  display: block;

  margin-bottom: 2px;

  color: #6da94a;

  font-size: 8px;
  font-weight: 800;

  text-transform: uppercase;

  letter-spacing: 0.8px;
}

.skitch-checkout-page-card-heading h3 {
  margin: 0;

  color: #283f2e;

  font-size: 18px;
  font-weight: 800;
}

/* =========================================================
   FORM
========================================================= */

.skitch-checkout-page-form-group label {
  display: block;

  margin-bottom: 7px;

  color: #354c3a;

  font-size: 13px;
  font-weight: 800;
}

.skitch-checkout-page-form-group label span {
  color: #e34d4d;
}

.skitch-checkout-page-form-group input,
.skitch-checkout-page-form-group select,
.skitch-checkout-page-form-group textarea {
  width: 100%;

  min-height: 50px;

  padding: 11px 13px;

  border: 1px solid #dfe6dc;

  border-radius: 8px;

  outline: none;

  background: #fbfcfa;

  color: #33493a;

  font-size: 13px;

  transition:
    border-color 0.3s ease,
    box-shadow 0.3s ease,
    background 0.3s ease;
}

.skitch-checkout-page-form-group input::placeholder,
.skitch-checkout-page-form-group textarea::placeholder {
  color: #a5aea6;
}

.skitch-checkout-page-form-group input:focus,
.skitch-checkout-page-form-group select:focus,
.skitch-checkout-page-form-group textarea:focus {
  border-color: #77b44e;

  background: #ffffff;

  box-shadow: 0 0 0 4px rgba(105, 173, 56, 0.09);
}

.skitch-checkout-page-form-group textarea {
  min-height: 115px;

  resize: vertical;
}

/* =========================================================
   CUSTOM CHECKBOX
========================================================= */

.skitch-checkout-page-checkbox {
  position: relative;

  display: flex;
  align-items: flex-start;

  gap: 10px;

  cursor: pointer;
}

.skitch-checkout-page-checkbox input {
  position: absolute;

  opacity: 0;
}

.skitch-checkout-page-checkbox-box {
  width: 20px;
  height: 20px;

  min-width: 20px;

  margin-top: 1px;

  border: 1px solid #d9e2d6;

  border-radius: 5px;

  background: #ffffff;

  color: transparent;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 9px;

  transition: 0.25s ease;
}

.skitch-checkout-page-checkbox
  input:checked
  + .skitch-checkout-page-checkbox-box {
  border-color: #68a93c;

  background: #68a93c;

  color: #ffffff;
}

.skitch-checkout-page-checkbox > span:last-child {
  color: #667268;

  font-size: 10px;

  line-height: 1.6;
}

/* Shipping */

.skitch-checkout-page-shipping-fields {
  display: none;

  margin-top: 23px;

  padding-top: 22px;

  border-top: 1px dashed #dce4d9;
}

.skitch-checkout-page-shipping-fields.active {
  display: block;

  animation: skitchCheckoutFade 0.35s ease;
}

/* =========================================================
   PAYMENT METHOD
========================================================= */

.skitch-checkout-page-payment-methods {
  display: grid;

  gap: 11px;
}

.skitch-checkout-page-payment-item {
  position: relative;

  min-height: 75px;

  padding: 15px;

  display: flex;
  align-items: center;

  gap: 13px;

  border: 1px solid #e0e7de;

  border-radius: 11px;

  background: #ffffff;

  cursor: pointer;

  transition: 0.3s ease;
}

.skitch-checkout-page-payment-item:hover,
.skitch-checkout-page-payment-item.active {
  border-color: #75b44d;

  background: #f8fcf5;

  box-shadow: 0 8px 22px rgba(56, 101, 42, 0.07);
}

.skitch-checkout-page-payment-item > input {
  position: absolute;

  opacity: 0;
}

.skitch-checkout-page-payment-radio {
  width: 18px;
  height: 18px;

  min-width: 18px;

  border: 1px solid #bdc8bb;

  border-radius: 50%;

  position: relative;
}

.skitch-checkout-page-payment-item.active .skitch-checkout-page-payment-radio {
  border-color: #69ad38;
}

.skitch-checkout-page-payment-item.active
  .skitch-checkout-page-payment-radio::after {
  content: "";

  position: absolute;

  width: 8px;
  height: 8px;

  top: 4px;
  left: 4px;

  border-radius: 50%;

  background: #69ad38;
}

.skitch-checkout-page-payment-icon {
  width: 43px;
  height: 43px;

  min-width: 43px;

  border-radius: 10px;

  background: #edf6e8;

  color: #64a63a;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 16px;
}

.skitch-checkout-page-payment-content {
  flex: 1;
}

.skitch-checkout-page-payment-content strong {
  display: block;

  margin-bottom: 3px;

  color: #344a39;

  font-size: 13px;
}

.skitch-checkout-page-payment-content span {
  display: block;

  color: #8b958d;

  font-size: 11px;
}

.skitch-checkout-page-payment-badge {
  padding: 5px 8px;

  border-radius: 4px;

  background: #e9f5e2;

  color: #5d9a38;

  font-size: 7px;
  font-weight: 800;

  text-transform: uppercase;
}

.skitch-checkout-page-payment-extra {
  display: none;

  margin-top: 18px;

  padding-top: 18px;

  border-top: 1px dashed #dde5da;
}

.skitch-checkout-page-payment-extra.active {
  display: block;

  animation: skitchCheckoutFade 0.3s ease;
}

.skitch-checkout-page-payment-info {
  padding: 14px 16px;

  border-radius: 9px;

  background: #f4f9f1;

  color: #667268;

  font-size: 10px;

  line-height: 1.7;
}

.skitch-checkout-page-payment-info i {
  margin-right: 7px;

  color: #66a83d;
}

/* =========================================================
   ORDER SUMMARY
========================================================= */

.skitch-checkout-page-summary {
  position: sticky;

  top: 110px;

  padding: 27px;

  border: 1px solid #e0e7de;

  border-radius: 18px;

  background: #ffffff;

  box-shadow: 0 20px 50px rgba(28, 61, 27, 0.08);
}

.skitch-checkout-page-summary-heading {
  padding-bottom: 19px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 15px;

  border-bottom: 1px solid #e8ede6;
}

.skitch-checkout-page-summary-heading span {
  display: block;

  margin-bottom: 2px;

  color: #6da848;

  font-size: 8px;
  font-weight: 800;

  text-transform: uppercase;

  letter-spacing: 0.8px;
}

.skitch-checkout-page-summary-heading h3 {
  margin: 0;

  color: #273f2d;

  font-size: 18px;
}

.skitch-checkout-page-summary-icon {
  width: 46px;
  height: 46px;

  border-radius: 11px;

  background: #edf6e8;

  color: #63a538;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 17px;
}

/* Products */

.skitch-checkout-page-product {
  padding: 17px 0;

  display: flex;
  align-items: center;

  gap: 11px;

  border-bottom: 1px solid #edf1eb;
}

.skitch-checkout-page-product-image {
  position: relative;

  width: 58px;
  height: 58px;

  min-width: 58px;

  border-radius: 8px;

  overflow: visible;
}

.skitch-checkout-page-product-image img {
  width: 100%;
  height: 100%;

  border-radius: 8px;

  object-fit: cover;
}

.skitch-checkout-page-product-image span {
  position: absolute;

  top: -7px;
  right: -7px;

  width: 20px;
  height: 20px;

  border-radius: 50%;

  background: #69ad38;

  color: #ffffff;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 8px;
  font-weight: 800;
}

.skitch-checkout-page-product-content {
  flex: 1;

  min-width: 0;
}

.skitch-checkout-page-product-content strong {
  display: block;

  color: #354a3a;

  font-size: 12px;

  line-height: 1.5;
}

.skitch-checkout-page-product-content span {
  display: block;

  margin-top: 3px;

  color: #000;

  font-size: 12px;
}

.skitch-checkout-page-product-price {
  color: #1d3d25;

  font-size: 12px;
  font-weight: 800;

  white-space: nowrap;
}

/* Coupon */

.skitch-checkout-page-coupon {
  margin: 19px 0;

  display: flex;

  overflow: hidden;

  border: 1px solid #dfe6dc;

  border-radius: 8px;
}

.skitch-checkout-page-coupon input {
  flex: 1;

  min-width: 0;

  height: 42px;

  padding: 0 11px;

  border: none;

  outline: none;

  font-size: 9px;
}

.skitch-checkout-page-coupon button {
  min-width: 68px;

  border: none;

  background: #173d20;

  color: #ffffff;

  font-size: 8px;
  font-weight: 800;
}

/* Price */

.skitch-checkout-page-price-list {
  padding: 17px 0;

  border-top: 1px dashed #dce4d9;

  border-bottom: 1px dashed #dce4d9;
}

.skitch-checkout-page-price-list > div {
  margin-bottom: 12px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 15px;
}

.skitch-checkout-page-price-list > div:last-child {
  margin-bottom: 0;
}

.skitch-checkout-page-price-list span {
  color: #000;

  font-size: 13px;
}

.skitch-checkout-page-price-list strong {
  color: #34493a;

  font-size: 13px;
}

.skitch-checkout-page-price-list .skitch-checkout-page-green {
  color: #4d9850;
}

.skitch-checkout-page-total {
  padding: 20px 0;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 15px;
}

.skitch-checkout-page-total span {
  display: block;

  color: #314838;

  font-size: 13px;
  font-weight: 800;
}

.skitch-checkout-page-total small {
  display: block;

  margin-top: 2px;

  color: #929b94;

  font-size: 7px;
}

.skitch-checkout-page-total > strong {
  color: #173b20;

  font-size: 21px;
}

/* Terms */

.skitch-checkout-page-terms {
  margin-bottom: 17px;
}

.skitch-checkout-page-terms a {
  color: #5f9f38;

  text-decoration: none;
}

/* Place Order */

.skitch-checkout-page-place-order {
  width: 100%;

  min-height: 58px;

  padding: 6px 7px 6px 18px;

  border: none;

  border-radius: 9px;

  background: #173d20;

  color: #ffffff;

  display: flex;
  align-items: center;
  justify-content: space-between;

  cursor: pointer;

  transition: 0.3s ease;
}

.skitch-checkout-page-place-order > span {
  text-align: left;

  font-size: 11px;
  font-weight: 800;
}

.skitch-checkout-page-place-order small {
  display: block;

  margin-bottom: 1px;

  color: rgba(255, 255, 255, 0.55);

  font-size: 7px;
  font-weight: 500;
}

.skitch-checkout-page-place-order > div {
  width: 43px;
  height: 43px;

  border-radius: 7px;

  background: #69ad38;

  display: flex;
  align-items: center;
  justify-content: center;

  transition: 0.3s ease;
}

.skitch-checkout-page-place-order:hover {
  background: #27572f;

  transform: translateY(-2px);

  box-shadow: 0 12px 28px rgba(27, 80, 34, 0.17);
}

.skitch-checkout-page-place-order:hover > div {
  transform: translateX(-3px);
}

.skitch-checkout-page-secure-text {
  margin-top: 11px;

  color: #8d978f;

  text-align: center;

  font-size: 7px;
}

.skitch-checkout-page-secure-text i {
  margin-right: 5px;

  color: #63a638;
}

/* Logos */

.skitch-checkout-page-payment-logos {
  margin-top: 20px;

  padding-top: 17px;

  border-top: 1px solid #e9ede7;
}

.skitch-checkout-page-payment-logos > span {
  display: block;

  margin-bottom: 9px;

  color: #89938b;

  font-size: 7px;

  text-transform: uppercase;

  letter-spacing: 0.7px;
}

.skitch-checkout-page-payment-logos > div {
  display: flex;
  flex-wrap: wrap;

  gap: 6px;
}

.skitch-checkout-page-payment-logos b {
  min-width: 46px;

  padding: 7px 8px;

  border: 1px solid #e1e7df;

  border-radius: 5px;

  color: #536157;

  text-align: center;

  font-size: 7px;
}

/* Help */

.skitch-checkout-page-help {
  margin-top: 20px;

  padding: 14px;

  border-radius: 10px;

  background: #f4f8f2;

  display: flex;
  align-items: center;

  gap: 11px;
}

.skitch-checkout-page-help > div {
  width: 39px;
  height: 39px;

  min-width: 39px;

  border-radius: 9px;

  background: #e6f2df;

  color: #61a336;

  display: flex;
  align-items: center;
  justify-content: center;
}

.skitch-checkout-page-help span {
  color: #7e8981;

  font-size: 8px;
}

.skitch-checkout-page-help a {
  display: block;

  margin-top: 2px;

  color: #314d36 !important;

  text-decoration: none !important;

  font-size: 10px;
  font-weight: 800;
}

/* Animation */

@keyframes skitchCheckoutFade {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {
  .skitch-checkout-page-section {
    padding: 70px 0 85px;
  }

  .skitch-checkout-page-summary {
    position: relative;

    top: auto;
  }
}

@media (max-width: 767px) {
  .skitch-checkout-page-heading {
    align-items: flex-start;

    flex-direction: column;
  }

  .skitch-checkout-page-card {
    padding: 24px;
  }

  .skitch-checkout-page-payment-badge {
    display: none;
  }
}

@media (max-width: 575px) {
  .skitch-checkout-page-section {
    padding: 55px 0 70px;
  }

  .skitch-checkout-page-heading h1 {
    font-size: 34px;
  }

  .skitch-checkout-page-steps {
    margin-bottom: 28px;
  }

  .skitch-checkout-page-step {
    min-width: 55px;
  }

  .skitch-checkout-page-step > div {
    width: 31px;
    height: 31px;
  }

  .skitch-checkout-page-step-line {
    margin-top: 15px;
  }

  .skitch-checkout-page-card {
    padding: 20px 16px;

    border-radius: 15px;
  }

  .skitch-checkout-page-card-heading {
    align-items: flex-start;
  }

  .skitch-checkout-page-payment-item {
    align-items: flex-start;

    padding: 13px;
  }

  .skitch-checkout-page-payment-content span {
    line-height: 1.5;
  }

  .skitch-checkout-page-summary {
    padding: 22px 17px;
  }

  .skitch-checkout-page-product {
    align-items: flex-start;
  }

  .skitch-checkout-page-product-price {
    font-size: 9px;
  }
}
/* =========================== checkout end */

/* ====================================== category section content start  */
/* =========================================
   SKITCH CATEGORY TEXT SECTION
========================================= */

.skitch-category-text-section {
  position: relative;
  padding: 85px 0;
  overflow: hidden;

  background: linear-gradient(180deg, #ffffff 0%, #f7faf5 100%);
}

/* soft decoration */

.skitch-category-text-section::before {
  content: "";
  position: absolute;

  width: 380px;
  height: 380px;

  top: -220px;
  right: -180px;

  border-radius: 50%;

  background: rgba(105, 173, 56, 0.05);

  pointer-events: none;
}

.skitch-category-text-section::after {
  content: "";
  position: absolute;

  width: 250px;
  height: 250px;

  left: -150px;
  bottom: -150px;

  border-radius: 50%;

  border: 45px solid rgba(105, 173, 56, 0.035);

  pointer-events: none;
}

/* wrapper */

.skitch-category-text-wrapper {
  position: relative;
  z-index: 2;

  max-width: 1100px;

  margin: 0 auto;

  text-align: center;
}

/* label */

.skitch-category-text-label {
  display: flex;
  align-items: center;
  justify-content: center;

  gap: 12px;

  margin-bottom: 16px;

  color: #67a83d;

  font-size: 10px;
  font-weight: 800;

  letter-spacing: 1.5px;

  text-transform: uppercase;
}

.skitch-category-text-label span {
  width: 34px;
  height: 2px;

  display: block;

  background: #69ad38;
}

/* heading */

.skitch-category-text-wrapper h2 {
  max-width: 950px;
  margin: 0 auto 24px;
  color: #17371e;
  font-weight: 700;
  line-height: 1.18;
}

.skitch-category-text-wrapper h2 span {
  display: block;
  color: #69ad38;
}

/* lead paragraph */

.skitch-category-text-lead {
  max-width: 980px;
  margin: 0 auto 18px !important;
  color: #3e5544 !important;
  font-size: 16px !important;
  font-weight: 600;

  line-height: 1.85 !important;
}

/* normal paragraph */

.skitch-category-text-wrapper p {
  max-width: 1050px;

  margin: 0 auto 15px;

  color: #000;

  font-size: 15px;

  line-height: 1.9;
}

/* bottom decorative line */

.skitch-category-text-wrapper::after {
  content: "";

  width: 70px;
  height: 3px;

  display: block;

  margin: 30px auto 0;

  border-radius: 20px;

  background: linear-gradient(90deg, #69ad38, #a7d787);
}

/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 991px) {
  .skitch-category-text-section {
    padding: 70px 0;
  }

  .skitch-category-text-wrapper {
    max-width: 900px;
  }
}

@media (max-width: 767px) {
  .skitch-category-text-section {
    padding: 60px 0;
  }

  .skitch-category-text-wrapper h2 {
    font-size: 36px;
  }

  .skitch-category-text-lead {
    font-size: 14px !important;
  }

  .skitch-category-text-wrapper p {
    font-size: 13px;
    line-height: 1.8;
  }
}

@media (max-width: 575px) {
  .skitch-category-text-section {
    padding: 50px 0;
  }

  .skitch-category-text-label {
    gap: 8px;

    font-size: 8px;
  }

  .skitch-category-text-label span {
    width: 22px;
  }

  .skitch-category-text-wrapper h2 {
    margin-bottom: 18px;

    font-size: 30px;

    line-height: 1.22;
  }

  .skitch-category-text-lead {
    font-size: 13px !important;

    line-height: 1.75 !important;
  }

  .skitch-category-text-wrapper p {
    font-size: 12px;

    line-height: 1.8;
  }
}
/* ====================================== category section content end  */

/* =================================== login section start  */
/* =========================================================
   SKITCH LOGIN PAGE
   UNIQUE PREFIX - NO CSS CONFLICT
========================================================= */

.skitch-login-page-section {
  position: relative;

  min-height: 760px;

  padding: 90px 0;

  overflow: hidden;

  display: flex;
  align-items: center;

  background: linear-gradient(180deg, #f8faf6 0%, #ffffff 100%);
}

/* =========================================================
   DECORATIVE SHAPES
========================================================= */

.skitch-login-page-shape {
  position: absolute;

  border-radius: 50%;

  pointer-events: none;
}

.skitch-login-page-shape-one {
  width: 420px;
  height: 420px;

  top: -230px;
  right: -180px;

  background: rgba(105, 173, 56, 0.06);
}

.skitch-login-page-shape-two {
  width: 300px;
  height: 300px;

  left: -180px;
  bottom: -170px;

  border: 55px solid rgba(105, 173, 56, 0.035);
}

/* =========================================================
   MAIN WRAPPER
========================================================= */

.skitch-login-page-wrapper {
  position: relative;

  z-index: 3;

  max-width: 1120px;

  margin: auto;

  overflow: hidden;

  border: 1px solid #e2e9df;

  border-radius: 26px;

  background: #ffffff;

  box-shadow: 0 28px 70px rgba(24, 59, 27, 0.11);
}

/* =========================================================
   LEFT BRAND PANEL
========================================================= */

.skitch-login-page-brand-panel {
  position: relative;

  height: 100%;
  min-height: 680px;

  overflow: hidden;

  background:
    linear-gradient(145deg, rgba(16, 46, 22, 0.96), rgba(29, 80, 35, 0.9)),
    url("assets/images/login-bg.jpg") center / cover no-repeat;
}

.skitch-login-page-brand-overlay {
  position: absolute;

  inset: 0;

  background: radial-gradient(
    circle at 80% 20%,
    rgba(105, 173, 56, 0.18),
    transparent 38%
  );
}

.skitch-login-page-brand-panel::before {
  content: "";

  position: absolute;

  width: 330px;
  height: 330px;

  top: -170px;
  right: -150px;

  border-radius: 50%;

  border: 60px solid rgba(255, 255, 255, 0.035);
}

.skitch-login-page-brand-panel::after {
  content: "";

  position: absolute;

  width: 240px;
  height: 240px;

  left: -120px;
  bottom: -110px;

  border-radius: 50%;

  background: rgba(105, 173, 56, 0.1);
}

.skitch-login-page-brand-content {
  position: relative;

  z-index: 3;

  min-height: 680px;

  padding: 55px;

  display: flex;
  flex-direction: column;
  justify-content: center;

  color: #ffffff;
}

/* Logo */

.skitch-login-page-brand-logo {
  margin-bottom: 35px;
}

.skitch-login-page-brand-logo img {
  width: 175px;
  height: 65px;

  padding: 7px 10px;

  object-fit: contain;

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.96);
}

/* Badge */

.skitch-login-page-brand-badge {
  width: max-content;

  max-width: 100%;

  margin-bottom: 18px;

  padding: 8px 14px;

  display: inline-flex;
  align-items: center;

  gap: 8px;

  border: 1px solid rgba(255, 255, 255, 0.14);

  border-radius: 50px;

  background: rgba(255, 255, 255, 0.08);

  color: #c1e7a9;

  font-size: 9px;
  font-weight: 800;

  text-transform: uppercase;

  letter-spacing: 1px;

  backdrop-filter: blur(8px);
}

.skitch-login-page-brand-badge i {
  color: #9fd477;
}

/* Heading */

.skitch-login-page-brand-content h2 {
  max-width: 500px;

  margin: 0 0 19px;

  color: #ffffff;

  font-weight: 700;

  line-height: 1.13;
}

.skitch-login-page-brand-content h2 span {
  display: block;

  color: #a6d985;
}

/* Text */

.skitch-login-page-brand-content > p {
  max-width: 490px;

  margin: 0;

  color: rgba(255, 255, 255, 0.66);

  font-size: 13px;

  line-height: 1.85;
}

/* =========================================================
   BRAND FEATURES
========================================================= */

.skitch-login-page-brand-features {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 12px;

  margin-top: 31px;
}

.skitch-login-page-brand-feature {
  padding: 14px;

  display: flex;
  align-items: center;

  gap: 11px;

  border: 1px solid rgba(255, 255, 255, 0.09);

  border-radius: 11px;

  background: rgba(255, 255, 255, 0.055);

  backdrop-filter: blur(7px);

  transition: all 0.3s ease;
}

.skitch-login-page-brand-feature:hover {
  border-color: rgba(156, 210, 117, 0.28);

  background: rgba(105, 173, 56, 0.13);

  transform: translateY(-3px);
}

.skitch-login-page-brand-feature > div {
  width: 38px;
  height: 38px;

  min-width: 38px;

  border-radius: 9px;

  background: rgba(105, 173, 56, 0.18);

  color: #acd98d;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 14px;
}

.skitch-login-page-brand-feature span {
  color: rgba(255, 255, 255, 0.81);
  font-size: 12px;
  font-weight: 700;
}

/* =========================================================
   TRUST
========================================================= */

.skitch-login-page-brand-trust {
  margin-top: 35px;

  padding-top: 25px;

  border-top: 1px solid rgba(255, 255, 255, 0.09);

  display: flex;
  align-items: center;

  gap: 12px;
}

.skitch-login-page-brand-trust-icon {
  width: 43px;
  height: 43px;

  min-width: 43px;

  border-radius: 50%;

  background: rgba(105, 173, 56, 0.16);

  color: #aad88b;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 15px;
}

.skitch-login-page-brand-trust strong {
  display: block;
  margin-bottom: 2px;
  color: #ffffff;
  font-size: 13px;
}

.skitch-login-page-brand-trust span {
  color: rgba(255, 255, 255, 0.48);

  font-size: 8px;
}

/* =========================================================
   FORM PANEL
========================================================= */

.skitch-login-page-form-panel {
  height: 100%;

  min-height: 680px;

  padding: 55px;

  display: flex;
  align-items: center;

  background: #ffffff;
}

.skitch-login-page-form-inner {
  width: 100%;

  max-width: 430px;

  margin: auto;
}

/* Heading */

.skitch-login-page-form-heading {
  margin-bottom: 30px;
}

.skitch-login-page-form-heading > span {
  display: block;

  margin-bottom: 7px;

  color: #68a83d;

  font-size: 9px;
  font-weight: 800;

  letter-spacing: 1.2px;

  text-transform: uppercase;
}

.skitch-login-page-form-heading h1 {
  margin: 0 0 10px;
  color: #18371f;
  font-size: 35px;
  font-weight: 700;
}

.skitch-login-page-form-heading p {
  margin: 0;
  color: #212529;
  font-size: 13px;
  line-height: 1.7;
}

/* =========================================================
   FORM
========================================================= */

.skitch-login-page-form-group {
  margin-bottom: 18px;
}

.skitch-login-page-form-group label {
  display: block;
  margin-bottom: 7px;
  color: #354b3a;
  font-size: 13px;
  font-weight: 800;
}

.skitch-login-page-input-wrap {
  position: relative;
}

.skitch-login-page-input-wrap > i {
  position: absolute;

  top: 50%;
  left: 15px;

  transform: translateY(-50%);

  color: #8e9990;

  font-size: 12px;

  pointer-events: none;
}

.skitch-login-page-input-wrap input {
  width: 100%;
  min-height: 52px;
  padding: 11px 48px 11px 42px;
  border: 1px solid #dfe6dc;
  border-radius: 9px;
  outline: none;
  background: #fbfcfa;
  color: #304537;
  font-size: 13px;
  transition:
    border-color 0.3s ease,
    box-shadow 0.3s ease,
    background 0.3s ease;
}

.skitch-login-page-input-wrap input::placeholder {
  color: #a5aea6;
}

.skitch-login-page-input-wrap input:focus {
  border-color: #72b047;

  background: #ffffff;

  box-shadow: 0 0 0 4px rgba(105, 173, 56, 0.09);
}

/* Password Button */

.skitch-login-page-password-toggle {
  position: absolute;

  top: 50%;
  right: 12px;

  transform: translateY(-50%);

  width: 35px;
  height: 35px;

  border: none;

  border-radius: 50%;

  background: transparent;

  color: #8d978f;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 12px;

  transition: 0.3s ease;
}

.skitch-login-page-password-toggle:hover {
  background: #edf6e8;

  color: #5f9f37;
}

/* =========================================================
   OPTIONS
========================================================= */

.skitch-login-page-options {
  margin: 4px 0 22px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 15px;
}

/* Checkbox */

.skitch-login-page-checkbox {
  position: relative;

  display: flex;
  align-items: center;

  gap: 8px;

  cursor: pointer;
}

.skitch-login-page-checkbox input {
  position: absolute;

  opacity: 0;
}

.skitch-login-page-checkbox-box {
  width: 18px;
  height: 18px;

  min-width: 18px;

  border: 1px solid #d9e2d6;

  border-radius: 4px;

  background: #ffffff;

  color: transparent;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 8px;

  transition: 0.25s ease;
}

.skitch-login-page-checkbox input:checked + .skitch-login-page-checkbox-box {
  border-color: #69ad38;

  background: #69ad38;

  color: #ffffff;
}

.skitch-login-page-checkbox > span:last-child {
  color: #77837a;

  font-size: 9px;
}

.skitch-login-page-forgot {
  color: #5e9e36 !important;
  text-decoration: none !important;
  font-size: 12px;
  font-weight: 800;
}

.skitch-login-page-forgot:hover {
  text-decoration: underline !important;
}

/* =========================================================
   LOGIN BUTTON
========================================================= */

.skitch-login-page-submit {
  width: 100%;

  min-height: 56px;

  padding: 6px 7px 6px 20px;

  border: none;

  border-radius: 9px;

  background: #173d20;

  color: #ffffff;

  display: flex;
  align-items: center;
  justify-content: space-between;

  font-size: 11px;
  font-weight: 800;

  cursor: pointer;

  transition: all 0.3s ease;
}

.skitch-login-page-submit > div {
  width: 42px;
  height: 42px;

  border-radius: 7px;

  background: #69ad38;

  display: flex;
  align-items: center;
  justify-content: center;

  transition: 0.3s ease;
}

.skitch-login-page-submit:hover {
  background: #27572f;

  transform: translateY(-2px);

  box-shadow: 0 12px 28px rgba(27, 80, 34, 0.18);
}

.skitch-login-page-submit:hover > div {
  transform: translateX(-3px);
}

/* =========================================================
   DIVIDER
========================================================= */

.skitch-login-page-divider {
  position: relative;

  margin: 27px 0;

  text-align: center;
}

.skitch-login-page-divider::before {
  content: "";

  position: absolute;

  top: 50%;
  left: 0;

  width: 100%;
  height: 1px;

  background: #e8ede6;
}

.skitch-login-page-divider span {
  position: relative;

  z-index: 2;

  padding: 0 12px;

  background: #ffffff;

  color: #98a099;

  font-size: 8px;
}

/* =========================================================
   SOCIAL BUTTONS
========================================================= */

.skitch-login-page-social-buttons {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 10px;
}

.skitch-login-page-social-btn {
  min-height: 47px;

  border: 1px solid #e0e7de;

  border-radius: 8px;

  background: #ffffff;

  color: #3e5043;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 8px;

  font-size: 10px;
  font-weight: 800;

  transition: all 0.3s ease;
}

.skitch-login-page-social-btn:hover {
  border-color: #b9d5aa;

  background: #f6faf3;

  transform: translateY(-2px);
}

.skitch-login-page-social-btn .fa-google {
  color: #db4437;
}

.skitch-login-page-social-btn .fa-facebook-f {
  color: #1877f2;
}

/* =========================================================
   REGISTER
========================================================= */

.skitch-login-page-register {
  margin-top: 25px;
  text-align: center;
  color: #212529;
  font-size: 13px;
}

.skitch-login-page-register a {
  margin-left: 4px;
  color: #5d9b36 !important;
  text-decoration: none !important;
  font-size: 13px;
  font-weight: 800;
}

.skitch-login-page-register a:hover {
  text-decoration: underline !important;
}

/* =========================================================
   SECURITY
========================================================= */

.skitch-login-page-security {
  margin-top: 23px;
  padding: 12px 14px;
  border-radius: 8px;
  background: #f5f9f2;
  color: #212529;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  line-height: 1.5;
}

.skitch-login-page-security i {
  color: #63a638;
}

/* =========================================================
   ANIMATIONS
========================================================= */

.skitch-login-page-brand-content {
  animation: skitchLoginBrandFade 0.8s ease both;
}

.skitch-login-page-form-inner {
  animation: skitchLoginFormFade 0.8s ease 0.12s both;
}

@keyframes skitchLoginBrandFade {
  from {
    opacity: 0;
    transform: translateX(-25px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes skitchLoginFormFade {
  from {
    opacity: 0;
    transform: translateY(25px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {
  .skitch-login-page-section {
    padding: 70px 0;
  }

  .skitch-login-page-brand-panel {
    min-height: auto;
  }

  .skitch-login-page-brand-content {
    min-height: auto;

    padding: 45px;
  }

  .skitch-login-page-form-panel {
    min-height: auto;

    padding: 50px 40px;
  }
}

@media (max-width: 767px) {
  .skitch-login-page-section {
    padding: 55px 0;
  }

  .skitch-login-page-wrapper {
    border-radius: 20px;
  }

  .skitch-login-page-brand-content {
    padding: 35px 28px;
  }

  .skitch-login-page-form-panel {
    padding: 40px 28px;
  }

  .skitch-login-page-brand-content h2 {
    font-size: 38px;
  }

  .skitch-login-page-brand-features {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575px) {
  .skitch-login-page-section {
    padding: 40px 0;
  }

  .skitch-login-page-brand-content {
    padding: 30px 20px;
  }

  .skitch-login-page-form-panel {
    padding: 34px 20px;
  }

  .skitch-login-page-brand-logo img {
    width: 145px;
    height: 55px;
  }

  .skitch-login-page-brand-content h2 {
    font-size: 31px;
  }

  .skitch-login-page-brand-content > p {
    font-size: 11px;
  }

  .skitch-login-page-form-heading h1 {
    font-size: 32px;
  }

  .skitch-login-page-options {
    align-items: flex-start;

    flex-direction: column;

    gap: 10px;
  }

  .skitch-login-page-social-buttons {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .skitch-login-page-brand-content,
  .skitch-login-page-form-inner {
    animation: none;
  }
}
/* =================================== login section end  */

/* ======================================= singup section start  */
/* =========================================================
   SKITCH SIGNUP PAGE
   UNIQUE PREFIX TO AVOID CSS CONFLICT
========================================================= */

.skitch-signup-page-section {
  position: relative;
  overflow: hidden;

  padding: 85px 0;

  background: linear-gradient(180deg, #f7faf5 0%, #ffffff 100%);
}

/* =========================================================
   DECORATIVE BACKGROUND
========================================================= */

.skitch-signup-page-shape {
  position: absolute;

  border-radius: 50%;

  pointer-events: none;
}

.skitch-signup-page-shape-one {
  width: 430px;
  height: 430px;

  top: -240px;
  right: -190px;

  background: rgba(105, 173, 56, 0.055);
}

.skitch-signup-page-shape-two {
  width: 300px;
  height: 300px;

  bottom: -180px;
  left: -190px;

  border: 55px solid rgba(105, 173, 56, 0.035);
}

/* =========================================================
   WRAPPER
========================================================= */

.skitch-signup-page-wrapper {
  position: relative;

  z-index: 3;

  max-width: 1180px;

  margin: 0 auto;

  overflow: hidden;

  border: 1px solid #e1e8de;

  border-radius: 26px;

  background: #ffffff;

  box-shadow: 0 28px 70px rgba(25, 59, 27, 0.11);
}

/* =========================================================
   LEFT BRAND AREA
========================================================= */

.skitch-signup-page-brand {
  position: relative;

  height: 100%;
  min-height: 760px;

  overflow: hidden;

  background-image:
    linear-gradient(
      145deg,
      rgba(12, 43, 18, 0.97) 0%,
      rgba(25, 74, 31, 0.91) 100%
    ),
    url("assets/images/signup-bg.jpg");

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.skitch-signup-page-brand-overlay {
  position: absolute;

  inset: 0;

  background: radial-gradient(
    circle at 85% 15%,
    rgba(126, 192, 78, 0.17),
    transparent 35%
  );
}

.skitch-signup-page-brand::before {
  content: "";

  position: absolute;

  width: 320px;
  height: 320px;

  right: -170px;
  top: -160px;

  border-radius: 50%;

  border: 55px solid rgba(255, 255, 255, 0.03);
}

.skitch-signup-page-brand::after {
  content: "";

  position: absolute;

  width: 240px;
  height: 240px;

  bottom: -120px;
  left: -125px;

  border-radius: 50%;

  background: rgba(105, 173, 56, 0.11);
}

.skitch-signup-page-brand-content {
  position: relative;

  z-index: 3;

  min-height: 760px;

  padding: 55px 48px;

  color: #ffffff;

  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* =========================================================
   LOGO
========================================================= */

.skitch-signup-page-logo {
  width: max-content;

  margin-bottom: 34px;

  display: inline-block;
}

.skitch-signup-page-logo img {
  width: 165px;
  height: 62px;

  padding: 7px 10px;

  border-radius: 8px;

  object-fit: contain;

  background: rgba(255, 255, 255, 0.96);
}

/* =========================================================
   LABEL
========================================================= */

.skitch-signup-page-brand-label {
  width: max-content;
  max-width: 100%;

  margin-bottom: 17px;

  padding: 8px 14px;

  border: 1px solid rgba(255, 255, 255, 0.13);

  border-radius: 50px;

  background: rgba(255, 255, 255, 0.07);

  color: #c5e8ad;

  display: inline-flex;
  align-items: center;

  gap: 8px;

  font-size: 9px;
  font-weight: 800;

  letter-spacing: 1px;

  text-transform: uppercase;

  backdrop-filter: blur(8px);
}

.skitch-signup-page-brand-label i {
  color: #9bd272;
}

/* =========================================================
   BRAND HEADING
========================================================= */

.skitch-signup-page-brand-content h2 {
  max-width: 460px;
  margin: 0 0 18px;
  color: #ffffff;
  font-weight: 700;
  line-height: 1.14;
}

.skitch-signup-page-brand-content h2 span {
  display: block;

  color: #a6d985;
}

.skitch-signup-page-brand-content > p {
  max-width: 450px;

  margin: 0;

  color: rgba(255, 255, 255, 0.64);

  font-size: 12px;

  line-height: 1.85;
}

/* =========================================================
   BENEFITS
========================================================= */

.skitch-signup-page-benefits {
  margin-top: 31px;

  display: grid;

  gap: 11px;
}

.skitch-signup-page-benefit {
  padding: 13px;

  border: 1px solid rgba(255, 255, 255, 0.08);

  border-radius: 11px;

  background: rgba(255, 255, 255, 0.05);

  display: flex;
  align-items: center;

  gap: 12px;

  backdrop-filter: blur(7px);

  transition:
    background 0.3s ease,
    border-color 0.3s ease,
    transform 0.3s ease;
}

.skitch-signup-page-benefit:hover {
  transform: translateX(5px);

  border-color: rgba(163, 214, 126, 0.24);

  background: rgba(105, 173, 56, 0.12);
}

.skitch-signup-page-benefit > div:first-child {
  width: 42px;
  height: 42px;

  min-width: 42px;

  border-radius: 10px;

  background: rgba(105, 173, 56, 0.17);

  color: #a6d985;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 15px;
}

.skitch-signup-page-benefit strong {
  display: block;

  margin-bottom: 3px;

  color: #ffffff;

  font-size: 10px;
  font-weight: 800;
}

.skitch-signup-page-benefit span {
  display: block;

  color: rgba(255, 255, 255, 0.48);

  font-size: 8px;

  line-height: 1.5;
}

/* =========================================================
   TRUST
========================================================= */

.skitch-signup-page-trust {
  margin-top: 30px;

  padding-top: 22px;

  border-top: 1px solid rgba(255, 255, 255, 0.08);

  display: flex;
  align-items: center;

  gap: 12px;
}

.skitch-signup-page-trust > i {
  width: 42px;
  height: 42px;

  min-width: 42px;

  border-radius: 50%;

  background: rgba(105, 173, 56, 0.15);

  color: #a5d985;

  display: flex;
  align-items: center;
  justify-content: center;
}

.skitch-signup-page-trust strong {
  display: block;
  margin-bottom: 2px;
  color: #ffffff;
  font-size: 13px;
}

.skitch-signup-page-trust span {
  color: rgba(255, 255, 255, 0.45);
  font-size: 13px;
}

/* =========================================================
   RIGHT FORM AREA
========================================================= */

.skitch-signup-page-form-panel {
  min-height: 760px;

  padding: 50px;

  display: flex;
  align-items: center;

  background: #ffffff;
}

.skitch-signup-page-form-inner {
  width: 100%;

  max-width: 570px;

  margin: 0 auto;
}

/* =========================================================
   HEADING
========================================================= */

.skitch-signup-page-heading {
  margin-bottom: 27px;
}

.skitch-signup-page-heading > span {
  display: block;

  margin-bottom: 6px;

  color: #68a83d;

  font-size: 9px;
  font-weight: 800;

  letter-spacing: 1.1px;

  text-transform: uppercase;
}

.skitch-signup-page-heading h1 {
  margin: 0 0 9px;

  color: #17371e;

  font-family: "Playfair Display", serif;

  font-size: 39px;

  font-weight: 700;

  line-height: 1.15;
}

.skitch-signup-page-heading p {
  max-width: 450px;

  margin: 0;

  color: #7f8a81;

  font-size: 13px;

  line-height: 1.7;
}

/* =========================================================
   FORM
========================================================= */

.skitch-signup-page-form-group label {
  display: block;
  margin-bottom: 7px;
  color: #354b3a;
  font-size: 13px;
  font-weight: 800;
}

.skitch-signup-page-form-group label span {
  color: #de4c4c;
}

.skitch-signup-page-input-wrap {
  position: relative;
}

.skitch-signup-page-input-wrap > i {
  position: absolute;

  top: 50%;
  left: 14px;

  z-index: 2;

  transform: translateY(-50%);

  color: #919b93;

  font-size: 11px;

  pointer-events: none;
}

.skitch-signup-page-input-wrap input {
  width: 100%;
  min-height: 51px;
  padding: 11px 45px 11px 40px;
  border: 1px solid #dfe6dc;
  border-radius: 8px;
  outline: none;
  background: #fbfcfa;
  color: #304537;
  font-size: 13px;
  transition:
    border-color 0.3s ease,
    box-shadow 0.3s ease,
    background 0.3s ease;
}

.skitch-signup-page-input-wrap input::placeholder {
  color: #a6afa7;
}

.skitch-signup-page-input-wrap input:focus {
  border-color: #73b149;

  background: #ffffff;

  box-shadow: 0 0 0 4px rgba(105, 173, 56, 0.085);
}

/* =========================================================
   PASSWORD TOGGLE
========================================================= */

.skitch-signup-page-password-toggle {
  position: absolute;

  top: 50%;
  right: 10px;

  transform: translateY(-50%);

  width: 35px;
  height: 35px;

  border: none;

  border-radius: 50%;

  background: transparent;

  color: #8f9991;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 11px;

  transition: 0.3s ease;
}

.skitch-signup-page-password-toggle:hover {
  background: #edf6e8;

  color: #60a037;
}

/* =========================================================
   PASSWORD NOTE
========================================================= */

.skitch-signup-page-password-note {
  padding: 10px 12px;
  border-radius: 7px;
  background: #f6f9f4;
  color: #000;
  font-size: 12px;
}

.skitch-signup-page-password-note i {
  margin-right: 6px;

  color: #68a83e;
}

/* =========================================================
   CHECKBOX
========================================================= */

.skitch-signup-page-checkbox {
  position: relative;

  display: flex;
  align-items: flex-start;

  gap: 9px;

  cursor: pointer;
}

.skitch-signup-page-checkbox input {
  position: absolute;

  opacity: 0;
}

.skitch-signup-page-check-box {
  width: 19px;
  height: 19px;

  min-width: 19px;

  margin-top: 1px;

  border: 1px solid #d9e2d6;

  border-radius: 5px;

  background: #ffffff;

  color: transparent;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 8px;

  transition: 0.25s ease;
}

.skitch-signup-page-checkbox input:checked + .skitch-signup-page-check-box {
  border-color: #69ad38;

  background: #69ad38;

  color: #ffffff;
}

.skitch-signup-page-checkbox > span:last-child {
  color: #7b867d;

  font-size: 9px;

  line-height: 1.6;
}

.skitch-signup-page-checkbox a {
  color: #5f9f37 !important;

  text-decoration: none !important;

  font-weight: 800;
}

.skitch-signup-page-checkbox a:hover {
  text-decoration: underline !important;
}

/* =========================================================
   ERROR
========================================================= */

.skitch-signup-page-error {
  display: none;

  padding: 10px 12px;

  border: 1px solid #f2cccc;

  border-radius: 7px;

  background: #fff5f5;

  color: #cc4949;

  font-size: 9px;
}

.skitch-signup-page-error.active {
  display: block;
}

/* =========================================================
   SUBMIT BUTTON
========================================================= */

.skitch-signup-page-submit {
  width: 100%;

  min-height: 58px;

  padding: 6px 7px 6px 19px;

  border: none;

  border-radius: 9px;

  background: #173d20;

  color: #ffffff;

  display: flex;
  align-items: center;
  justify-content: space-between;

  cursor: pointer;

  transition:
    background 0.3s ease,
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.skitch-signup-page-submit > span {
  text-align: left;

  font-size: 11px;
  font-weight: 800;
}

.skitch-signup-page-submit small {
  display: block;

  margin-bottom: 1px;

  color: rgba(255, 255, 255, 0.52);

  font-size: 7px;
  font-weight: 500;
}

.skitch-signup-page-submit > div {
  width: 43px;
  height: 43px;

  border-radius: 7px;

  background: #69ad38;

  display: flex;
  align-items: center;
  justify-content: center;

  transition: 0.3s ease;
}

.skitch-signup-page-submit:hover {
  background: #27582f;

  transform: translateY(-2px);

  box-shadow: 0 12px 28px rgba(28, 80, 34, 0.18);
}

.skitch-signup-page-submit:hover > div {
  transform: translateX(-3px);
}

/* =========================================================
   DIVIDER
========================================================= */

.skitch-signup-page-divider {
  position: relative;

  margin: 25px 0;

  text-align: center;
}

.skitch-signup-page-divider::before {
  content: "";

  position: absolute;

  top: 50%;
  left: 0;

  width: 100%;
  height: 1px;

  background: #e7ece5;
}

.skitch-signup-page-divider span {
  position: relative;

  z-index: 2;

  padding: 0 11px;

  background: #ffffff;

  color: #979f98;

  font-size: 8px;
}

/* =========================================================
   LOGIN BUTTON
========================================================= */

.skitch-signup-page-login-btn {
  width: 100%;
  min-height: 49px;
  border: 1px solid #dfe6dc;
  border-radius: 8px;
  background: #ffffff;
  color: #354a39 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-decoration: none !important;
  font-size: 13px;
  font-weight: 800;

  transition: 0.3s ease;
}

.skitch-signup-page-login-btn:hover {
  border-color: #76b44e;

  background: #f4f9f1;

  color: #5b9835 !important;

  transform: translateY(-2px);
}

/* =========================================================
   SECURE NOTE
========================================================= */

.skitch-signup-page-secure {
  margin-top: 18px;

  padding: 11px 12px;

  border-radius: 8px;

  background: #f5f9f2;

  color: #89948b;

  display: flex;
  align-items: center;

  gap: 7px;

  font-size: 8px;

  line-height: 1.5;
}

.skitch-signup-page-secure i {
  color: #62a438;
}

/* =========================================================
   ENTRY ANIMATIONS
========================================================= */

.skitch-signup-page-brand-content {
  animation: skitchSignupLeft 0.8s ease both;
}

.skitch-signup-page-form-inner {
  animation: skitchSignupRight 0.8s ease 0.12s both;
}

@keyframes skitchSignupLeft {
  from {
    opacity: 0;
    transform: translateX(-25px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes skitchSignupRight {
  from {
    opacity: 0;
    transform: translateY(25px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 991px) {
  .skitch-signup-page-section {
    padding: 70px 0;
  }

  .skitch-signup-page-brand,
  .skitch-signup-page-brand-content {
    min-height: auto;
  }

  .skitch-signup-page-brand-content {
    padding: 45px;
  }

  .skitch-signup-page-form-panel {
    min-height: auto;

    padding: 45px 38px;
  }
}

@media (max-width: 767px) {
  .skitch-signup-page-section {
    padding: 55px 0;
  }

  .skitch-signup-page-wrapper {
    border-radius: 20px;
  }

  .skitch-signup-page-brand-content {
    padding: 36px 28px;
  }

  .skitch-signup-page-form-panel {
    padding: 38px 28px;
  }

  .skitch-signup-page-brand-content h2 {
    font-size: 37px;
  }
}

@media (max-width: 575px) {
  .skitch-signup-page-section {
    padding: 40px 0;
  }

  .skitch-signup-page-wrapper {
    border-radius: 16px;
  }

  .skitch-signup-page-brand-content {
    padding: 30px 20px;
  }

  .skitch-signup-page-form-panel {
    padding: 32px 18px;
  }

  .skitch-signup-page-logo img {
    width: 145px;
    height: 55px;
  }

  .skitch-signup-page-brand-content h2 {
    font-size: 30px;
  }

  .skitch-signup-page-brand-content > p {
    font-size: 11px;
  }

  .skitch-signup-page-heading h1 {
    font-size: 31px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .skitch-signup-page-brand-content,
  .skitch-signup-page-form-inner {
    animation: none;
  }
}
/* ======================================= singup section end  */

/* =========================== profile start section =========================== */
/* =========================================
   SKITCH PROFILE
========================================= */

.sk-profile-section {
  width: 100%;
  padding: 70px 20px;

  background: linear-gradient(180deg, #f8faf7 0%, #ffffff 100%);

  font-family: inherit;

  color: #182019;
}

.sk-profile-container {
  width: min(1380px, 100%);
  margin: auto;

  display: grid;
  grid-template-columns: 300px 1fr;

  gap: 28px;
}

/* =========================================
   SIDEBAR
========================================= */

.sk-profile-sidebar {
  background: #ffffff;

  border: 1px solid #e5ebe2;

  border-radius: 22px;

  padding: 28px 18px;

  height: fit-content;

  position: sticky;
  top: 100px;

  box-shadow: 0 15px 50px rgba(29, 56, 32, 0.07);
}

.sk-profile-avatar {
  width: 100px;
  height: 100px;

  margin: 0 auto 22px;

  border-radius: 50%;

  background: linear-gradient(135deg, #6db52f, #4f9822);

  color: #ffffff;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 30px;
  font-weight: 900;

  border: 5px solid #f1f7ed;

  box-shadow: 0 10px 25px rgba(87, 164, 38, 0.2);
}

.sk-profile-welcome {
  min-height: 76px;

  padding: 12px 16px;

  border-radius: 15px;

  background: #f1f8ec;

  display: flex;
  align-items: center;

  gap: 13px;
}

.sk-profile-user-icon {
  width: 44px;
  height: 44px;

  flex-shrink: 0;

  border-radius: 12px;

  background: #67ad2c;

  color: #ffffff;

  display: flex;
  align-items: center;
  justify-content: center;
}

.sk-profile-welcome small {
  display: block;

  margin-bottom: 3px;

  color: #71806e;

  font-size: 11px;
}

.sk-profile-welcome strong {
  display: block;

  font-size: 15px;
}

.sk-profile-divider {
  height: 1px;

  background: #e7ece5;

  margin: 20px 4px 12px;
}

/* NAV */

.sk-profile-nav {
  display: flex;

  flex-direction: column;

  gap: 4px;
}

.sk-profile-nav-item {
  width: 100%;

  min-height: 52px;

  padding: 0 15px;

  border: none;

  border-radius: 11px;

  background: transparent;

  color: #3e473e;

  display: flex;
  align-items: center;

  gap: 13px;

  text-decoration: none;

  font-size: 14px;
  font-weight: 700;

  cursor: pointer;

  text-align: left;

  transition: all 0.3s ease;
}

.sk-profile-nav-item i {
  width: 22px;

  color: #6d796c;

  font-size: 16px;

  transition: all 0.3s ease;
}

.sk-profile-nav-item:hover {
  background: #f2f8ed;

  color: #4f9624;

  transform: translateX(3px);
}

.sk-profile-nav-item:hover i {
  color: #62a92b;
}

.sk-profile-nav-active {
  background: #eaf5e3 !important;

  color: #4f9624 !important;
}

.sk-profile-nav-active i {
  color: #5da52a !important;
}

.sk-profile-logout {
  margin-top: 8px;

  color: #a24747;
}

.sk-profile-logout:hover {
  background: #fff2f2;

  color: #c34141;
}

/* =========================================
   CONTENT
========================================= */

.sk-profile-content {
  min-width: 0;
}

.sk-profile-tab {
  display: none;

  animation: skProfileFade 0.45s ease;
}

.sk-profile-tab-active {
  display: block;
}

@keyframes skProfileFade {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.sk-profile-heading {
  margin-bottom: 25px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 20px;
}

.sk-profile-eyebrow,
.sk-profile-mini-title {
  display: block;

  margin-bottom: 7px;

  color: #65a92c;

  font-size: 11px;

  font-weight: 900;

  letter-spacing: 1.5px;
}

.sk-profile-heading h2 {
  margin: 0;

  color: #172018;

  font-size: 32px;

  line-height: 1.2;

  font-weight: 800;
}

.sk-profile-heading p {
  margin: 8px 0 0;

  color: #788177;

  font-size: 14px;
}

/* =========================================
   STATS
========================================= */

.sk-profile-stats {
  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 15px;

  margin-bottom: 22px;
}

.sk-profile-stat-card {
  min-height: 120px;

  padding: 20px;

  border-radius: 17px;

  background: #ffffff;

  border: 1px solid #e5ebe2;

  display: flex;
  align-items: center;

  gap: 15px;

  transition: all 0.3s ease;
}

.sk-profile-stat-card:hover {
  transform: translateY(-4px);

  box-shadow: 0 15px 35px rgba(36, 71, 35, 0.08);
}

.sk-profile-stat-icon {
  width: 50px;
  height: 50px;

  flex-shrink: 0;

  border-radius: 14px;

  background: #eef8e9;

  color: #5da62a;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 18px;
}

.sk-profile-stat-card strong {
  display: block;

  font-size: 25px;
}

.sk-profile-stat-card span {
  color: #788177;

  font-size: 12px;
}

/* =========================================
   BOX
========================================= */

.sk-profile-box {
  background: #ffffff;

  border: 1px solid #e5ebe2;

  border-radius: 20px;

  padding: 25px;

  box-shadow: 0 12px 45px rgba(30, 60, 31, 0.05);
}

.sk-profile-box-header {
  padding-bottom: 18px;

  border-bottom: 1px solid #e8ede6;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 15px;
}

.sk-profile-box-header h3 {
  margin: 0;

  font-size: 20px;
}

.sk-profile-box-header p {
  margin: 5px 0 0;

  color: #899189;

  font-size: 13px;
}

.sk-profile-view-btn {
  border: none;

  background: #60aa2b;

  color: #ffffff;

  border-radius: 9px;

  padding: 11px 16px;

  font-size: 12px;

  font-weight: 800;

  cursor: pointer;

  transition: 0.3s ease;
}

.sk-profile-view-btn:hover {
  background: #4d9220;

  transform: translateY(-2px);
}

/* =========================================
   ORDER ROW
========================================= */

.sk-profile-order-list {
  padding-top: 18px;
}

.sk-profile-order-row {
  padding: 16px;

  border: 1px solid #e5ebe2;

  border-radius: 14px;

  display: grid;

  grid-template-columns: 1fr 1.6fr 1fr 0.8fr auto auto;

  align-items: center;

  gap: 15px;
}

.sk-profile-order-row small,
.sk-profile-order-id small,
.sk-profile-order-date small,
.sk-profile-order-total small {
  display: block;

  margin-bottom: 6px;

  color: #909890;

  font-size: 9px;

  font-weight: 800;

  letter-spacing: 0.8px;
}

.sk-profile-order-row strong {
  font-size: 13px;
}

.sk-profile-order-product {
  display: flex;
  align-items: center;
  gap: 10px;
}

.sk-profile-product-placeholder {
  width: 52px;
  height: 52px;

  flex-shrink: 0;

  border-radius: 11px;

  background: #eef6e9;

  color: #5ca42b;

  display: flex;
  align-items: center;
  justify-content: center;
}

.sk-profile-order-product small,
.sk-profile-table-product small {
  display: block;

  color: #8a9289;

  font-size: 11px;

  margin-top: 4px;
}

/* STATUS */

.sk-profile-status {
  padding: 6px 10px;

  border-radius: 6px;

  display: inline-block;

  width: fit-content;

  font-size: 10px;

  font-weight: 800;
}

.sk-profile-status.pending {
  background: #fff7e8;

  color: #b47819;
}

/* EYE */

.sk-profile-eye-btn {
  width: 38px;
  height: 38px;

  border: 1px solid #dce4da;

  border-radius: 9px;

  background: #ffffff;

  color: #617061;

  cursor: pointer;

  transition: 0.3s ease;
}

.sk-profile-eye-btn:hover {
  background: #60aa2b;

  color: #ffffff;

  border-color: #60aa2b;
}

/* =========================================
   PROFILE FORM
========================================= */

.sk-profile-form {
  padding-top: 22px;
}

.sk-profile-form-grid {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 20px;
}

.sk-profile-field {
  margin-bottom: 19px;
}

.sk-profile-field label {
  display: block;

  margin-bottom: 8px;

  color: #344034;

  font-size: 13px;

  font-weight: 800;
}

.sk-profile-input-wrap {
  position: relative;
}

.sk-profile-input-wrap > i {
  position: absolute;

  left: 16px;

  top: 50%;

  transform: translateY(-50%);

  color: #72a44e;

  font-size: 14px;

  z-index: 2;
}

.sk-profile-input-wrap input {
  width: 100%;

  height: 52px;

  padding: 0 45px;

  border: 1px solid #dfe6dc;

  border-radius: 11px;

  outline: none;

  background: #fbfcfb;

  color: #293229;

  font-family: inherit;

  font-size: 14px;

  transition: 0.3s ease;

  box-sizing: border-box;
}

.sk-profile-input-wrap input:focus {
  border-color: #68ad31;

  background: #ffffff;

  box-shadow: 0 0 0 4px rgba(104, 173, 49, 0.08);
}

.sk-profile-primary-btn {
  min-height: 48px;

  padding: 0 20px;

  border: none;

  border-radius: 10px;

  background: #60aa2b;

  color: #ffffff;

  font-size: 13px;

  font-weight: 800;

  display: inline-flex;

  align-items: center;

  gap: 10px;

  cursor: pointer;

  transition: 0.3s ease;
}

.sk-profile-primary-btn:hover {
  background: #4d9220;

  transform: translateY(-2px);
}

/* =========================================
   WISHLIST
========================================= */

.sk-profile-wishlist-grid {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 18px;
}

.sk-profile-wishlist-card {
  position: relative;

  padding: 16px;

  border: 1px solid #e4ebe0;

  border-radius: 17px;

  background: #ffffff;

  display: flex;

  gap: 15px;

  transition: 0.3s ease;
}

.sk-profile-wishlist-card:hover {
  transform: translateY(-4px);

  box-shadow: 0 15px 35px rgba(35, 65, 30, 0.08);
}

.sk-profile-wishlist-image {
  width: 115px;

  min-height: 135px;

  border-radius: 13px;

  background: #eff7eb;

  color: #62a82b;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 30px;
}

.sk-profile-wishlist-info {
  padding: 5px 25px 5px 0;
}

.sk-profile-wishlist-info span {
  color: #6ba43f;

  font-size: 10px;

  font-weight: 800;
}

.sk-profile-wishlist-info h3 {
  margin: 6px 0;

  font-size: 15px;
}

.sk-profile-wishlist-info strong {
  display: block;

  margin-bottom: 12px;
}

.sk-profile-wishlist-info button {
  border: none;

  border-radius: 7px;

  padding: 9px 12px;

  background: #60aa2b;

  color: #ffffff;

  font-size: 10px;

  font-weight: 800;

  cursor: pointer;
}

.sk-profile-remove-wishlist {
  position: absolute;

  right: 13px;
  top: 13px;

  border: none;

  background: transparent;

  color: #a7afa5;

  cursor: pointer;
}

/* =========================================
   ORDER SEARCH
========================================= */

.sk-profile-order-search {
  position: relative;

  width: 230px;
}

.sk-profile-order-search i {
  position: absolute;

  left: 13px;

  top: 50%;

  transform: translateY(-50%);

  color: #8c958a;

  font-size: 12px;
}

.sk-profile-order-search input {
  width: 100%;

  height: 43px;

  padding: 0 12px 0 37px;

  border: 1px solid #dfe7db;

  border-radius: 9px;

  outline: none;

  box-sizing: border-box;
}

.sk-profile-order-search input:focus {
  border-color: #67ad30;
}

/* =========================================
   ORDER TABLE
========================================= */

.sk-profile-orders-box {
  overflow: hidden;
}

.sk-profile-order-table-head {
  display: grid;

  grid-template-columns: 1fr 1.8fr 1.2fr 1fr 0.7fr 0.8fr 0.5fr;

  gap: 15px;

  padding: 5px 14px 17px;

  color: #687167;

  font-size: 9px;

  font-weight: 900;

  letter-spacing: 0.8px;
}

.sk-profile-order-table-row {
  display: grid;

  grid-template-columns: 1fr 1.8fr 1.2fr 1fr 0.7fr 0.8fr 0.5fr;

  align-items: center;

  gap: 15px;

  padding: 17px 14px;

  border: 1px solid #e4ebe0;

  border-radius: 14px;

  color: #626b61;

  font-size: 12px;
}

.sk-profile-order-number strong {
  color: #4f8f29;
}

.sk-profile-table-product {
  display: flex;
  align-items: center;

  gap: 10px;
}

.sk-profile-table-product strong {
  display: block;

  color: #273127;

  font-size: 13px;
}

.sk-profile-table-product small {
  display: block;
}

.sk-profile-table-price {
  color: #2d372d;

  font-weight: 900;
}

.sk-mobile-label {
  display: none;
}

/* =========================================
   PASSWORD
========================================= */

.sk-profile-security-icon {
  width: 48px;
  height: 48px;

  border-radius: 13px;

  background: #edf7e9;

  color: #60a62c;

  display: flex;
  align-items: center;
  justify-content: center;
}

.sk-profile-password-layout {
  display: grid;

  grid-template-columns: 280px 1fr;

  gap: 20px;
}

.sk-profile-password-info {
  padding: 28px;

  border-radius: 19px;

  background: linear-gradient(145deg, #eff8eb, #f8fbf6);

  border: 1px solid #e0ebdb;
}

.sk-profile-security-large {
  width: 58px;
  height: 58px;

  border-radius: 16px;

  background: #60aa2b;

  color: #ffffff;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 22px;

  margin-bottom: 20px;
}

.sk-profile-password-info h3 {
  margin: 0 0 9px;

  font-size: 20px;
}

.sk-profile-password-info p {
  margin: 0;

  color: #758073;

  line-height: 1.7;

  font-size: 13px;
}

.sk-profile-password-info ul {
  padding: 0;

  margin: 22px 0 0;

  list-style: none;
}

.sk-profile-password-info li {
  margin-bottom: 11px;

  color: #536052;

  font-size: 12px;
}

.sk-profile-password-info li i {
  margin-right: 7px;

  color: #60aa2b;
}

.sk-profile-password-box {
  padding: 28px;
}

.sk-password-toggle {
  position: absolute;

  right: 13px;

  top: 50%;

  transform: translateY(-50%);

  border: none;

  background: transparent;

  color: #7d897b;

  cursor: pointer;
}

.sk-password-message {
  display: none;

  margin: -5px 0 17px;

  padding: 10px 12px;

  border-radius: 8px;

  background: #fff1f1;

  color: #c04444;

  font-size: 12px;
}

/* =========================================
   ORDER MODAL
========================================= */

.sk-order-modal {
  position: fixed;

  inset: 0;

  z-index: 99999;

  display: none;

  align-items: center;
  justify-content: center;

  padding: 20px;
}

.sk-order-modal.sk-modal-active {
  display: flex;
}

.sk-order-modal-overlay {
  position: absolute;

  inset: 0;

  background: rgba(12, 20, 13, 0.72);

  backdrop-filter: blur(5px);
}

.sk-order-modal-box {
  position: relative;

  z-index: 2;

  width: min(900px, 100%);

  max-height: 92vh;

  overflow-y: auto;

  background: #ffffff;

  border-radius: 20px;

  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.25);

  animation: skModalIn 0.35s ease;
}

@keyframes skModalIn {
  from {
    opacity: 0;
    transform: translateY(20px) scale(0.97);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.sk-order-modal-header {
  padding: 25px 28px;

  border-bottom: 1px solid #e5ebe3;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 15px;
}

.sk-order-modal-header > div:first-child span {
  color: #7c877b;

  font-size: 10px;

  font-weight: 900;

  letter-spacing: 1px;
}

.sk-order-modal-header h2 {
  margin: 5px 0 0;

  font-size: 22px;
}

.sk-order-modal-actions {
  display: flex;
  align-items: center;

  gap: 10px;
}

.sk-order-download-btn {
  min-height: 40px;

  padding: 0 14px;

  border: none;

  border-radius: 8px;

  background: #60aa2b;

  color: #ffffff;

  font-size: 11px;

  font-weight: 800;

  cursor: pointer;
}

.sk-order-modal-close {
  width: 40px;
  height: 40px;

  border: none;

  border-radius: 50%;

  background: #f1f4f0;

  color: #556055;

  cursor: pointer;

  font-size: 18px;
}

.sk-order-modal-body {
  padding: 24px 28px;
}

.sk-order-info-grid {
  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 18px;
}

.sk-order-info-card {
  padding: 20px;

  border: 1px solid #e5ebe1;

  border-radius: 15px;

  background: #ffffff;
}

.sk-order-info-title {
  display: flex;
  align-items: center;

  gap: 9px;

  color: #4e8f29;

  margin-bottom: 15px;
}

.sk-order-info-title i {
  width: 30px;
  height: 30px;

  border-radius: 8px;

  background: #eff7eb;

  display: flex;
  align-items: center;
  justify-content: center;
}

.sk-order-info-card h3 {
  margin: 0 0 10px;

  font-size: 15px;
}

.sk-order-info-card p {
  margin: 7px 0;

  color: #6e776e;

  font-size: 11px;
}

.sk-order-info-card p i {
  width: 17px;

  color: #76a75a;
}

.sk-order-address {
  padding-top: 9px;

  border-top: 1px solid #edf0ec;
}

.sk-order-meta {
  display: flex;

  justify-content: space-between;

  gap: 15px;

  padding: 7px 0;

  color: #727b72;

  font-size: 11px;
}

.sk-order-meta strong {
  color: #344034;
}

.sk-order-placed {
  padding: 5px 9px;

  border-radius: 6px;

  background: #edf8e9;

  color: #5c9f2d;

  font-size: 9px;
}

.sk-order-pending {
  padding: 5px 9px;

  border-radius: 6px;

  background: #fff5e8;

  color: #ae751d;

  font-size: 9px;
}

.sk-order-summary {
  margin-top: 25px;
}

.sk-order-section-title {
  padding-bottom: 12px;

  border-bottom: 1px solid #e7ece5;

  display: flex;

  align-items: center;

  gap: 9px;
}

.sk-order-section-title i {
  color: #5ca32a;
}

.sk-order-section-title h3 {
  margin: 0;

  font-size: 16px;
}

.sk-order-product {
  margin-top: 14px;

  padding: 14px;

  border: 1px solid #e5ebe2;

  border-radius: 14px;

  display: flex;

  align-items: center;

  gap: 14px;
}

.sk-order-product-image {
  width: 60px;
  height: 60px;

  border-radius: 11px;

  background: #eff7eb;

  color: #60a52c;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 20px;
}

.sk-order-product-info {
  flex: 1;
}

.sk-order-product-info strong {
  display: block;

  font-size: 13px;
}

.sk-order-product-info span {
  display: block;

  margin: 4px 0;

  color: #7d867c;

  font-size: 10px;
}

.sk-order-product-info small {
  color: #697369;
}

.sk-order-product-price {
  font-size: 14px;
}

.sk-order-total-box {
  margin-top: 14px;

  padding: 17px;

  border: 1px solid #e5ebe2;

  border-radius: 14px;

  background: #fbfcfa;
}

.sk-order-total-box > div {
  padding: 7px 0;

  display: flex;

  align-items: center;

  justify-content: space-between;

  color: #747d74;

  font-size: 12px;
}

.sk-order-total-box strong {
  color: #455045;
}

.sk-order-grand-total {
  margin-top: 7px;

  padding-top: 13px !important;

  border-top: 1px solid #e4e9e1;
}

.sk-order-grand-total span {
  color: #273127;

  font-size: 15px;

  font-weight: 800;
}

.sk-order-grand-total strong {
  color: #4f8e28;

  font-size: 18px;
}

.sk-order-modal-footer {
  padding: 18px 28px;

  border-top: 1px solid #e5ebe3;

  display: flex;

  justify-content: flex-end;
}

.sk-order-modal-footer button {
  min-height: 42px;

  padding: 0 17px;

  border: 1px solid #dce5d8;

  border-radius: 8px;

  background: #ffffff;

  color: #4e594d;

  font-weight: 800;

  cursor: pointer;
}

/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 1150px) {
  .sk-profile-container {
    grid-template-columns: 250px 1fr;
  }

  .sk-profile-stats {
    grid-template-columns: repeat(2, 1fr);
  }

  .sk-profile-order-row {
    grid-template-columns: 1fr 1.5fr 1fr auto auto;
  }

  .sk-profile-order-date {
    display: none;
  }
}

@media (max-width: 900px) {
  .sk-profile-container {
    grid-template-columns: 1fr;
  }

  .sk-profile-sidebar {
    position: relative;

    top: auto;
  }

  .sk-profile-nav {
    display: grid;

    grid-template-columns: repeat(2, 1fr);
  }

  .sk-profile-password-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .sk-profile-section {
    padding: 40px 14px;
  }

  .sk-profile-heading {
    align-items: flex-start;

    flex-direction: column;
  }

  .sk-profile-heading h2 {
    font-size: 26px;
  }

  .sk-profile-stats {
    grid-template-columns: repeat(2, 1fr);
  }

  .sk-profile-stat-card {
    padding: 14px;
  }

  .sk-profile-stat-icon {
    width: 42px;
    height: 42px;
  }

  .sk-profile-box {
    padding: 17px;
  }

  .sk-profile-form-grid {
    grid-template-columns: 1fr;

    gap: 0;
  }

  .sk-profile-wishlist-grid {
    grid-template-columns: 1fr;
  }

  .sk-profile-order-search {
    width: 100%;
  }

  .sk-profile-heading .sk-profile-order-search {
    width: 100%;
  }

  .sk-profile-order-table-head {
    display: none;
  }

  .sk-profile-order-table-row {
    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 17px;

    padding: 18px;
  }

  .sk-mobile-label {
    display: block;

    margin-bottom: 5px;

    color: #929a91;

    font-size: 9px;

    font-weight: 800;
  }

  .sk-profile-table-product {
    grid-column: 1 / -1;
  }

  .sk-profile-order-number {
    grid-column: 1 / -1;
  }

  .sk-profile-nav {
    grid-template-columns: 1fr;
  }

  .sk-profile-nav-item {
    min-height: 54px;
  }

  .sk-order-info-grid {
    grid-template-columns: 1fr;
  }

  .sk-order-modal {
    padding: 10px;
  }

  .sk-order-modal-box {
    max-height: 95vh;

    border-radius: 15px;
  }

  .sk-order-modal-header {
    padding: 18px;
  }

  .sk-order-modal-body {
    padding: 18px;
  }

  .sk-order-modal-footer {
    padding: 15px 18px;
  }

  .sk-order-download-btn {
    font-size: 0;

    width: 40px;

    padding: 0;
  }

  .sk-order-download-btn i {
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  .sk-profile-stats {
    grid-template-columns: 1fr 1fr;

    gap: 9px;
  }

  .sk-profile-stat-card {
    min-height: 100px;

    flex-direction: column;

    align-items: flex-start;

    gap: 9px;
  }

  .sk-profile-stat-card strong {
    font-size: 21px;
  }

  .sk-profile-welcome {
    padding: 11px;
  }

  .sk-profile-wishlist-card {
    flex-direction: column;
  }

  .sk-profile-wishlist-image {
    width: 100%;

    min-height: 130px;
  }

  .sk-profile-wishlist-info {
    padding-right: 5px;
  }

  .sk-order-product {
    align-items: flex-start;
  }

  .sk-order-product-price {
    margin-left: auto;
  }

  .sk-order-meta {
    flex-direction: column;

    gap: 4px;
  }
}
/* =========================== profile end section =========================== */

/* ============================ product review swction start  */
.sk-review-section {
  padding: 95px 0;
  background: #f7f9f5;
  overflow: hidden;
}

.sk-review-container {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
}

/* Heading */

.sk-review-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 42px;
}

.sk-review-eyebrow {
  display: inline-block;
  margin-bottom: 10px;
  color: #5da82f;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 2px;
}

.sk-review-heading h2,
.sk-review-form-head h2 {
  margin: 0;
  color: #182319;
  /* font-size: clamp(30px, 4vw, 46px); */
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -1px;
}

.sk-review-heading p,
.sk-review-form-head p {
  max-width: 620px;
  margin: 14px 0 0;
  color: #687168;
  font-size: 15px;
  line-height: 1.8;
}

.sk-review-top-btn {
  flex-shrink: 0;
  min-height: 50px;
  padding: 0 22px;
  border-radius: 10px;
  background: #61ad35;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
  transition: all 0.35s ease;
}

.sk-review-top-btn:hover {
  background: #478d25;
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 12px 25px rgba(73, 133, 38, 0.18);
}

/* Summary */

.sk-review-summary {
  display: grid;
  grid-template-columns: 250px 1fr 300px;
  gap: 30px;
  padding: 30px;
  margin-bottom: 55px;
  background: #fff;
  border: 1px solid #e5ebe1;
  border-radius: 20px;
  box-shadow: 0 15px 45px rgba(22, 43, 24, 0.06);
}

/* Overall */

.sk-review-overall {
  padding: 12px 20px;
  border-right: 1px solid #e6ebe3;
  text-align: center;
}

.sk-review-rating-number {
  color: #182319;
  font-size: 55px;
  line-height: 1;
  font-weight: 800;
}

.sk-review-stars,
.sk-review-card-rating {
  display: flex;
  align-items: center;
  gap: 4px;
}

.sk-review-overall .sk-review-stars {
  justify-content: center;
  margin: 13px 0 10px;
}

.sk-review-stars i,
.sk-review-card-rating i {
  color: #f4ae32;
  font-size: 15px;
}

.sk-review-overall p {
  margin: 0 0 12px;
  color: #687168;
  font-size: 13px;
}

.sk-review-trusted {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #5b8f43;
  font-size: 11px;
  font-weight: 700;
}

/* Breakdown */

.sk-review-breakdown {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
}

.sk-review-bar-row {
  display: grid;
  grid-template-columns: 12px 15px 1fr 38px;
  align-items: center;
  gap: 8px;
}

.sk-review-bar-row > span,
.sk-review-bar-row > strong {
  color: #626c64;
  font-size: 12px;
}

.sk-review-bar-row > strong {
  text-align: right;
}

.sk-review-bar-row > i {
  color: #f4ae32;
  font-size: 10px;
}

.sk-review-progress {
  height: 7px;
  overflow: hidden;
  border-radius: 20px;
  background: #edf1eb;
}

.sk-review-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #62ad35;
}

/* CTA */

.sk-review-summary-cta {
  padding: 22px;
  border-radius: 14px;
  background: #f0f7ec;
}

.sk-review-cta-icon {
  width: 42px;
  height: 42px;
  margin-bottom: 14px;
  border-radius: 10px;
  background: #dcefd3;
  color: #579d2e;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
}

.sk-review-summary-cta h4 {
  margin: 0 0 8px;
  color: #1c281d;
  font-size: 17px;
  font-weight: 800;
}

.sk-review-summary-cta p {
  margin: 0 0 15px;
  color: #6b756d;
  font-size: 12px;
  line-height: 1.7;
}

.sk-review-summary-cta a {
  color: #579d2e;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.sk-review-summary-cta a i {
  margin-left: 5px;
  transition: transform 0.3s ease;
}

.sk-review-summary-cta a:hover i {
  transform: translateX(4px);
}

/* Toolbar */

.sk-review-toolbar {
  padding-bottom: 17px;
  margin-bottom: 18px;
  border-bottom: 1px solid #dfe6dc;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.sk-review-count {
  color: #707970;
  font-size: 14px;
}

.sk-review-count strong {
  color: #182319;
  font-size: 16px;
}

.sk-review-filter {
  display: flex;
  align-items: center;
  gap: 10px;
}

.sk-review-filter label {
  color: #777f78;
  font-size: 12px;
}

.sk-review-filter select {
  height: 40px;
  padding: 0 35px 0 12px;
  border: 1px solid #dce4d8;
  border-radius: 8px;
  outline: none;
  background: #fff;
  color: #273128;
  font-size: 12px;
}

/* Review Card */

.sk-review-list {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.sk-review-card {
  padding: 25px 27px;
  background: #fff;
  border: 1px solid #e5ebe1;
  border-radius: 16px;
  transition: all 0.35s ease;
}

.sk-review-card:hover {
  border-color: #cfe2c5;
  transform: translateY(-2px);
  box-shadow: 0 15px 35px rgba(31, 57, 32, 0.06);
}

.sk-review-user {
  display: flex;
  align-items: center;
  gap: 13px;
}

.sk-review-avatar {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  border-radius: 50%;
  background: #dcefd2;
  color: #4f9229;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 800;
}

.sk-avatar-two {
  background: #f4ead5;
  color: #b07c25;
}

.sk-avatar-three {
  background: #e0e9f4;
  color: #4c729f;
}

.sk-review-user-info {
  flex: 1;
}

.sk-review-user-info h4 {
  margin: 0 0 5px;
  color: #202a21;
  font-size: 15px;
  font-weight: 800;
}

.sk-review-meta {
  display: flex;
  align-items: center;
  gap: 15px;
  flex-wrap: wrap;
}

.sk-review-meta span {
  color: #8a938b;
  font-size: 11px;
}

.sk-review-meta span:first-child {
  color: #5e9b3b;
}

.sk-review-meta i {
  margin-right: 4px;
}

.sk-review-content {
  padding: 20px 0 18px 61px;
}

.sk-review-content h3 {
  margin: 0 0 8px;
  color: #202a21;
  font-size: 16px;
  font-weight: 800;
}

.sk-review-content p {
  max-width: 850px;
  margin: 0;
  color: #69736b;
  font-size: 13px;
  line-height: 1.8;
}

.sk-review-card-rating {
  flex-shrink: 0;
}

.sk-review-card-rating i {
  font-size: 12px;
}

.sk-review-footer {
  padding-top: 14px;
  border-top: 1px solid #edf0eb;
  display: flex;
  align-items: center;
  gap: 12px;
}

.sk-review-footer > span {
  color: #8a938b;
  font-size: 11px;
}

.sk-review-helpful,
.sk-review-report {
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 11px;
  transition: all 0.25s ease;
}

.sk-review-helpful {
  padding: 6px 10px;
  border: 1px solid #dfe6dc;
  border-radius: 7px;
  color: #5d685f;
}

.sk-review-helpful:hover,
.sk-review-helpful.sk-helpful-active {
  border-color: #62ad35;
  color: #579d2e;
  background: #f0f7ec;
}

.sk-review-helpful b {
  margin-left: 3px;
}

.sk-review-report {
  color: #999f9a;
}

.sk-review-report:hover {
  color: #d34f4f;
}

/* Load More */

.sk-review-load {
  padding: 30px 0 65px;
  text-align: center;
}

.sk-review-load button {
  min-height: 47px;
  padding: 0 22px;
  border: 1px solid #d6e2d1;
  border-radius: 9px;
  background: #fff;
  color: #4e8f2b;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  transition: all 0.3s ease;
}

.sk-review-load button:hover {
  background: #61ad35;
  border-color: #61ad35;
  color: #fff;
}

.sk-review-load button i {
  margin-left: 8px;
}

/* Review Form */

.sk-review-form-wrapper {
  padding: 38px;
  border: 1px solid #dfe8da;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 15px 45px rgba(22, 43, 24, 0.05);
}

.sk-review-form-head {
  padding-bottom: 25px;
  margin-bottom: 28px;
  border-bottom: 1px solid #e8ede5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.sk-review-form-icon {
  width: 58px;
  height: 58px;
  flex-shrink: 0;
  border-radius: 14px;
  background: #eef7e9;
  color: #5da32f;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 23px;
}

.sk-review-form {
  display: flex;
  flex-direction: column;
  gap: 21px;
}

.sk-review-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.sk-review-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sk-review-field label {
  color: #253027;
  font-size: 12px;
  font-weight: 800;
}

.sk-review-field input,
.sk-review-field textarea {
  width: 100%;
  border: 1px solid #dce4d9;
  border-radius: 9px;
  outline: none;
  background: #fbfcfa;
  color: #202a21;
  font-family: inherit;
  font-size: 13px;
  transition: all 0.3s ease;
  box-sizing: border-box;
}

.sk-review-field input {
  height: 49px;
  padding: 0 15px;
}

.sk-review-field textarea {
  padding: 14px 15px;
  resize: vertical;
  min-height: 135px;
}

.sk-review-field input:focus,
.sk-review-field textarea:focus {
  border-color: #65ae3b;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(101, 174, 59, 0.08);
}

/* Rating Input */

.sk-rating-input {
  display: flex;
  align-items: center;
  gap: 5px;
}

.sk-rating-input button {
  width: 31px;
  height: 31px;
  padding: 0;
  border: none;
  background: transparent;
  color: #d2d8d0;
  cursor: pointer;
  font-size: 20px;
  transition: all 0.2s ease;
}

.sk-rating-input button:hover,
.sk-rating-input button.sk-selected {
  color: #f4ae32;
  transform: scale(1.08);
}

#skRatingText {
  margin-left: 8px;
  color: #8a938b;
  font-size: 11px;
}

/* Form Bottom */

.sk-review-form-bottom {
  padding-top: 7px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.sk-review-checkbox {
  max-width: 620px;
  display: flex;
  align-items: flex-start;
  gap: 9px;
  color: #778078;
  font-size: 11px;
  line-height: 1.6;
  cursor: pointer;
}

.sk-review-checkbox input {
  display: none;
}

.sk-review-checkbox span {
  width: 17px;
  height: 17px;
  flex-shrink: 0;
  margin-top: 1px;
  border: 1px solid #cfd9cc;
  border-radius: 4px;
  background: #fff;
  position: relative;
}

.sk-review-checkbox input:checked + span {
  border-color: #5da52f;
  background: #5da52f;
}

.sk-review-checkbox input:checked + span::after {
  content: "\f00c";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-family: "Font Awesome 6 Free";
  font-size: 9px;
  font-weight: 900;
}

.sk-review-submit {
  min-height: 50px;
  padding: 0 22px;
  flex-shrink: 0;
  border: none;
  border-radius: 9px;
  background: #61ad35;
  color: #fff;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  transition: all 0.3s ease;
}

.sk-review-submit:hover {
  background: #4d9229;
  transform: translateY(-2px);
  box-shadow: 0 10px 25px rgba(83, 145, 44, 0.2);
}

.sk-review-submit i {
  margin-left: 8px;
}

/* Responsive */

@media (max-width: 1050px) {
  .sk-review-summary {
    grid-template-columns: 220px 1fr;
  }

  .sk-review-overall {
    border-right: 1px solid #e6ebe3;
  }

  .sk-review-summary-cta {
    grid-column: 1 / -1;
  }
}

@media (max-width: 768px) {
  .sk-review-section {
    padding: 65px 0;
  }

  .sk-review-container {
    width: min(100% - 28px, 680px);
  }

  .sk-review-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 30px;
  }

  .sk-review-top-btn {
    width: 100%;
  }

  .sk-review-summary {
    grid-template-columns: 1fr;
    padding: 20px;
    gap: 25px;
  }

  .sk-review-overall {
    padding: 10px 0 22px;
    border-right: none;
    border-bottom: 1px solid #e6ebe3;
  }

  .sk-review-summary-cta {
    grid-column: auto;
  }

  .sk-review-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .sk-review-filter {
    width: 100%;
    justify-content: space-between;
  }

  .sk-review-filter select {
    flex: 1;
  }

  .sk-review-card {
    padding: 20px;
  }

  .sk-review-user {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .sk-review-card-rating {
    width: 100%;
    margin-left: 61px;
    margin-top: -5px;
  }

  .sk-review-content {
    padding: 18px 0;
  }

  .sk-review-form-wrapper {
    padding: 25px 20px;
  }

  .sk-review-form-head {
    align-items: flex-start;
  }

  .sk-review-form-grid {
    grid-template-columns: 1fr;
  }

  .sk-review-form-bottom {
    align-items: flex-start;
    flex-direction: column;
  }

  .sk-review-submit {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .sk-review-heading h2,
  .sk-review-form-head h2 {
    font-size: 29px;
  }

  .sk-review-summary {
    border-radius: 14px;
  }

  .sk-review-rating-number {
    font-size: 48px;
  }

  .sk-review-card-rating {
    margin-left: 61px;
  }

  .sk-review-footer {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .sk-review-form-head {
    flex-direction: column;
  }

  .sk-review-form-icon {
    display: none;
  }
}

/* ============================ product review swction end  */

/* =========================================================
   SKITCH BLOG DETAILS
========================================================= */

.sk-blog-details-section {
  width: 100%;
  padding: 80px 0 100px;
  background: #f7f9f6;
  color: #172019;
}

.sk-blog-details-container {
  width: min(1200px, calc(100% - 40px));
  margin: 0 auto;
}

/* Breadcrumb */

.sk-blog-details-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 35px;
  font-size: 13px;
  font-weight: 600;
}

.sk-blog-details-breadcrumb a {
  color: #579f2e;
  text-decoration: none;
}

.sk-blog-details-breadcrumb a:hover {
  color: #3d7d20;
}

.sk-blog-details-breadcrumb span {
  color: #7d877f;
}

.sk-blog-details-breadcrumb i {
  font-size: 10px;
}

/* Main Layout */

.sk-blog-details-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 35px;
  align-items: start;
}

/* Main Article */

.sk-blog-details-main {
  background: #ffffff;
  border: 1px solid #e4e9e2;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 15px 45px rgba(28, 55, 32, 0.06);
}

/* Header */

.sk-blog-details-header {
  padding: 40px 42px 30px;
}

.sk-blog-details-category {
  display: inline-flex;
  padding: 7px 14px;
  border-radius: 50px;
  background: #edf7e9;
  color: #4f9a29;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 17px;
}

.sk-blog-details-header h1 {
  margin: 0;
  max-width: 850px;
  color: #172019;
  /* font-size: clamp(30px, 4vw, 48px); */
  font-size: 35px;
  line-height: 1.12;
  font-weight: 800;
  letter-spacing: -1.4px;
}

.sk-blog-details-meta {
  margin-top: 25px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 17px;
  color: #6c756e;
  font-size: 13px;
}

.sk-blog-author {
  display: flex;
  align-items: center;
  gap: 9px;
}

.sk-blog-author-icon {
  width: 37px;
  height: 37px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #edf7e9;
  color: #579f2e;
}

.sk-blog-author div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sk-blog-author small {
  color: #8b938d;
  font-size: 10px;
}

.sk-blog-author strong {
  color: #263128;
  font-size: 13px;
}

.sk-blog-meta-line {
  width: 1px;
  height: 18px;
  background: #dfe4df;
}

.sk-blog-meta-item {
  display: flex;
  align-items: center;
  gap: 7px;
}

.sk-blog-meta-item i {
  color: #579f2e;
}

/* Featured Image */

.sk-blog-details-image {
  width: 100%;
  height: 480px;
  overflow: hidden;
}

.sk-blog-details-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.7s ease;
}

.sk-blog-details-main:hover .sk-blog-details-image img {
  transform: scale(1.025);
}

/* Content */

.sk-blog-details-content {
  padding: 40px 42px;
}

.sk-blog-details-content p {
  margin: 0 0 20px;
  color: #5f6962;
  font-size: 16px;
  line-height: 1.9;
}

.sk-blog-details-content .sk-blog-details-intro {
  color: #344038;
  font-size: 18px;
  line-height: 1.85;
  font-weight: 500;
}

.sk-blog-details-content h2 {
  margin: 35px 0 16px;
  color: #1d2820;
  font-size: 27px;
  line-height: 1.3;
  font-weight: 800;
}

/* Highlight */

.sk-blog-details-highlight {
  margin: 30px 0;
  padding: 22px 25px;
  display: flex;
  align-items: center;
  gap: 18px;
  border-left: 4px solid #62ad35;
  border-radius: 10px;
  background: #f0f8ed;
}

.sk-blog-highlight-icon {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #62ad35;
  color: #ffffff;
}

.sk-blog-details-highlight strong {
  display: block;
  margin-bottom: 5px;
  color: #274020;
  font-size: 16px;
}

.sk-blog-details-highlight p {
  margin: 0;
  font-size: 13px;
  line-height: 1.6;
}

/* List */

.sk-blog-details-list {
  margin: 25px 0;
  display: flex;
  flex-direction: column;
  gap: 13px;
}

.sk-blog-details-list div {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.sk-blog-details-list span {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  margin-top: 2px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #edf7e9;
  color: #579f2e;
  font-size: 11px;
}

.sk-blog-details-list p {
  margin: 0;
}

/* Quote */

.sk-blog-details-quote {
  position: relative;
  margin: 35px 0;
  padding: 30px 35px;
  border-radius: 15px;
  background: #18241b;
  overflow: hidden;
}

.sk-blog-quote-icon {
  color: #69b13a;
  font-size: 30px;
}

.sk-blog-details-quote p {
  position: relative;
  z-index: 2;
  margin: 12px 0 0;
  color: #ffffff;
  font-size: 20px;
  line-height: 1.6;
  font-weight: 700;
}

/* Bottom */

.sk-blog-details-bottom {
  padding: 25px 42px;
  border-top: 1px solid #e8ece7;
  border-bottom: 1px solid #e8ece7;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}

.sk-blog-tags,
.sk-blog-share {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.sk-blog-bottom-title {
  margin-right: 5px;
  color: #263128;
  font-size: 13px;
  font-weight: 800;
}

.sk-blog-tags a {
  padding: 7px 11px;
  border-radius: 5px;
  background: #f2f5f1;
  color: #59635b;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
  transition: 0.3s ease;
}

.sk-blog-tags a:hover {
  background: #579f2e;
  color: #ffffff;
}

.sk-blog-share a {
  width: 33px;
  height: 33px;
  border: 1px solid #e0e5df;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #566058;
  text-decoration: none;
  transition: 0.3s ease;
}

.sk-blog-share a:hover {
  background: #579f2e;
  border-color: #579f2e;
  color: #ffffff;
  transform: translateY(-2px);
}

/* Author */

.sk-blog-author-box {
  margin: 35px 42px 42px;
  padding: 25px;
  display: flex;
  align-items: center;
  gap: 20px;
  border-radius: 14px;
  background: #f6f8f5;
}

.sk-blog-author-avatar {
  width: 70px;
  height: 70px;
  flex: 0 0 70px;
  border-radius: 50%;
  background: #579f2e;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 25px;
}

.sk-blog-author-info span {
  color: #579f2e;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1px;
}

.sk-blog-author-info h3 {
  margin: 4px 0 5px;
  color: #1d2820;
  font-size: 18px;
}

.sk-blog-author-info p {
  margin: 0;
  color: #6c756e;
  font-size: 13px;
  line-height: 1.7;
}

/* =========================================================
   SIDEBAR
========================================================= */

.sk-blog-details-sidebar {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.sk-blog-sidebar-card {
  padding: 25px;
  border: 1px solid #e3e8e1;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 12px 35px rgba(28, 55, 32, 0.05);
}

.sk-blog-sidebar-card h3 {
  margin: 0 0 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid #e6ebe5;
  color: #1d2820;
  font-size: 19px;
}

/* Search */

.sk-blog-search {
  position: relative;
}

.sk-blog-search input {
  width: 100%;
  height: 48px;
  padding: 0 52px 0 15px;
  border: 1px solid #dfe5dc;
  border-radius: 8px;
  outline: none;
  color: #273128;
  font-size: 13px;
  background: #fafcf9;
}

.sk-blog-search input:focus {
  border-color: #579f2e;
}

.sk-blog-search button {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 38px;
  height: 38px;
  border: none;
  border-radius: 6px;
  background: #579f2e;
  color: #ffffff;
  cursor: pointer;
}

/* Categories */

.sk-blog-category-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sk-blog-category-list li + li {
  border-top: 1px solid #edf0ec;
}

.sk-blog-category-list a {
  padding: 12px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #5b655d;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  transition: 0.3s ease;
}

.sk-blog-category-list a:hover {
  color: #579f2e;
  padding-left: 5px;
}

.sk-blog-category-list span {
  min-width: 25px;
  height: 23px;
  padding: 0 5px;
  border-radius: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f0f6ed;
  color: #579f2e;
  font-size: 10px;
}

/* Recent */

.sk-blog-recent-item {
  display: flex;
  gap: 12px;
  padding: 13px 0;
  border-bottom: 1px solid #edf0ec;
  text-decoration: none;
}

.sk-blog-recent-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.sk-blog-recent-image {
  width: 75px;
  height: 65px;
  flex: 0 0 75px;
  border-radius: 8px;
  overflow: hidden;
}

.sk-blog-recent-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.4s ease;
}

.sk-blog-recent-item:hover img {
  transform: scale(1.08);
}

.sk-blog-recent-content h4 {
  margin: 0 0 7px;
  color: #29342c;
  font-size: 13px;
  line-height: 1.45;
}

.sk-blog-recent-content span {
  color: #8b948d;
  font-size: 10px;
}

/* CTA */

.sk-blog-sidebar-cta {
  padding: 30px 25px;
  border-radius: 17px;
  background: #579f2e;
  color: #ffffff;
  text-align: center;
  box-shadow: 0 18px 40px rgba(87, 159, 46, 0.18);
}

.sk-blog-cta-icon {
  width: 54px;
  height: 54px;
  margin: 0 auto 15px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.16);
  font-size: 21px;
}

.sk-blog-sidebar-cta h3 {
  margin: 0 0 8px;
  color: #ffffff;
  font-size: 21px;
}

.sk-blog-sidebar-cta p {
  margin: 0 0 20px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 13px;
  line-height: 1.7;
}

.sk-blog-sidebar-cta > a {
  min-height: 43px;
  padding: 0 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 7px;
  background: #ffffff;
  color: #3f7f21;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
  transition: 0.3s ease;
}

.sk-blog-sidebar-cta > a:hover {
  transform: translateY(-2px);
}

/* =========================================================
   RELATED BLOGS
========================================================= */

.sk-blog-related {
  margin-top: 80px;
}

.sk-blog-related-heading {
  margin-bottom: 30px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
}

.sk-blog-related-heading span {
  color: #579f2e;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.5px;
}

.sk-blog-related-heading h2 {
  margin: 6px 0 0;
  color: #1d2820;
  font-size: 32px;
}

.sk-blog-related-heading > a {
  color: #579f2e;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
}

.sk-blog-related-heading > a i {
  margin-left: 6px;
  transition: 0.3s ease;
}

.sk-blog-related-heading > a:hover i {
  transform: translateX(4px);
}

.sk-blog-related-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
}

.sk-blog-related-card {
  overflow: hidden;
  border: 1px solid #e3e8e1;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 12px 35px rgba(28, 55, 32, 0.05);
  transition: 0.4s ease;
}

.sk-blog-related-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 45px rgba(28, 55, 32, 0.1);
}

.sk-blog-related-image {
  height: 220px;
  display: block;
  position: relative;
  overflow: hidden;
}

.sk-blog-related-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.5s ease;
}

.sk-blog-related-card:hover .sk-blog-related-image img {
  transform: scale(1.06);
}

.sk-blog-related-image span {
  position: absolute;
  left: 15px;
  top: 15px;
  padding: 7px 10px;
  border-radius: 5px;
  background: #ffffff;
  color: #4c9327;
  font-size: 10px;
  font-weight: 800;
}

.sk-blog-related-content {
  padding: 22px;
}

.sk-blog-related-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: #8a938c;
  font-size: 10px;
}

.sk-blog-related-meta span:first-child {
  display: flex;
  gap: 5px;
  align-items: center;
}

.sk-blog-related-meta i {
  color: #579f2e;
}

.sk-blog-related-content h3 {
  margin: 12px 0 9px;
  color: #263128;
  font-size: 19px;
  line-height: 1.4;
}

.sk-blog-related-content p {
  margin: 0 0 17px;
  color: #737c75;
  font-size: 12px;
  line-height: 1.7;
}

.sk-blog-related-content > a {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #579f2e;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.sk-blog-related-content > a i {
  transition: 0.3s ease;
}

.sk-blog-related-content > a:hover i {
  transform: translateX(4px);
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1100px) {
  .sk-blog-details-layout {
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 25px;
  }

  .sk-blog-details-header,
  .sk-blog-details-content {
    padding-left: 30px;
    padding-right: 30px;
  }

  .sk-blog-details-bottom {
    padding-left: 30px;
    padding-right: 30px;
  }

  .sk-blog-author-box {
    margin-left: 30px;
    margin-right: 30px;
  }
}

@media (max-width: 900px) {
  .sk-blog-details-layout {
    grid-template-columns: 1fr;
  }

  .sk-blog-details-sidebar {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .sk-blog-sidebar-cta {
    grid-column: span 2;
  }

  .sk-blog-details-image {
    height: 420px;
  }

  .sk-blog-related-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 650px) {
  .sk-blog-details-section {
    padding: 55px 0 70px;
  }

  .sk-blog-details-container {
    width: min(100% - 24px, 1200px);
  }

  .sk-blog-details-breadcrumb {
    margin-bottom: 22px;
    gap: 7px;
    font-size: 11px;
  }

  .sk-blog-details-header {
    padding: 25px 20px 22px;
  }

  .sk-blog-details-header h1 {
    font-size: 29px;
    letter-spacing: -0.7px;
  }

  .sk-blog-details-meta {
    gap: 11px;
    font-size: 11px;
  }

  .sk-blog-meta-line {
    display: none;
  }

  .sk-blog-details-image {
    height: 280px;
  }

  .sk-blog-details-content {
    padding: 28px 20px;
  }

  .sk-blog-details-content p {
    font-size: 14px;
    line-height: 1.8;
  }

  .sk-blog-details-content .sk-blog-details-intro {
    font-size: 16px;
  }

  .sk-blog-details-content h2 {
    margin-top: 28px;
    font-size: 23px;
  }

  .sk-blog-details-highlight {
    padding: 18px;
    align-items: flex-start;
  }

  .sk-blog-details-quote {
    padding: 24px 20px;
  }

  .sk-blog-details-quote p {
    font-size: 17px;
  }

  .sk-blog-details-bottom {
    padding: 20px;
    align-items: flex-start;
    flex-direction: column;
  }

  .sk-blog-author-box {
    margin: 25px 20px 25px;
    padding: 20px;
    align-items: flex-start;
  }

  .sk-blog-author-avatar {
    width: 55px;
    height: 55px;
    flex-basis: 55px;
  }

  .sk-blog-details-sidebar {
    display: flex;
  }

  .sk-blog-sidebar-cta {
    width: 100%;
  }

  .sk-blog-related {
    margin-top: 55px;
  }

  .sk-blog-related-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .sk-blog-related-heading h2 {
    font-size: 27px;
  }

  .sk-blog-related-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .sk-blog-related-image {
    height: 230px;
  }
}

@media (max-width: 420px) {
  .sk-blog-details-header h1 {
    font-size: 25px;
  }

  .sk-blog-details-image {
    height: 235px;
  }

  .sk-blog-author-box {
    flex-direction: column;
  }

  .sk-blog-related-heading > a {
    margin-top: 5px;
  }
}

/* ============================ forget password start  */

/* ============================ forget password end  */

@media (max-width: 776px) {
  .sk-profile-order-row {
    padding: 16px;
    border: 1px solid #e5ebe2;
    border-radius: 14px;
    display: block;
    grid-template-columns: 1fr 1.6fr 1fr 0.8fr auto auto;
    align-items: center;
    gap: 15px;
    margin-bottom: 19px;
  }
}


/*===================================================================== product details css */


/* =========================================================
   PRODUCT INFO SECTION
   DESKTOP = RIGHT SIDE
   MOBILE/TABLET = FULL WIDTH
========================================================= */

.sk-product-info-section {
    width: 100%;
    padding: 35px 0 50px;
    background: #ffffff;
}

/*
 * Main page width.
 * Right-side content starts approximately from 50%.
 */
.sk-product-info-container {
    width: calc(50% - 15px);
    max-width: 760px;

    /* IMPORTANT: Push entire section to right */
    margin-left: calc(50% + 15px);
    margin-right: 0;

    padding: 0 30px 0 0;
    box-sizing: border-box;
}


/* =========================================================
   COMMON BLOCK
========================================================= */

.sk-info-block {
    width: 100%;
}

.sk-info-heading {
    display: flex;
    align-items: center;
    gap: 8px;

    margin: 0 0 18px;
    padding: 0;

    color: #17213b;

    font-size: 15px;
    line-height: 1.3;
    font-weight: 700;

    text-transform: uppercase;
}

.sk-info-heading i {
    color: #687386;
    font-size: 14px;
}


/* =========================================================
   BEST OFFERS
========================================================= */

.sk-best-offers {
    width: 100%;
}

.sk-best-price {
    margin: 0 0 15px;

    color: #3f4755;

    font-size: 13px;
    line-height: 1.6;
}

.sk-offer-item {
    width: 100%;
    margin: 0 0 17px;
}

.sk-offer-item h4 {
    margin: 0 0 5px;

    color: #151b2c;

    font-size: 14px;
    line-height: 1.5;
    font-weight: 700;
}

.sk-offer-item ul {
    margin: 0 0 4px;
    padding-left: 17px;
}

.sk-offer-item li {
    color: #3d4553;

    font-size: 12px;
    line-height: 1.55;
}

.sk-terms-btn {
    display: inline-block;

    margin: 0;
    padding: 0;

    border: 0;
    outline: none;

    background: transparent;
    color: #ff3f55;

    font-size: 12px;
    line-height: 1.5;
    font-weight: 500;

    cursor: pointer;
}

.sk-terms-btn:hover {
    color: #dc263c;
    text-decoration: underline;
}


/* =========================================================
   PRODUCT DETAILS
========================================================= */

.sk-product-details-block {
    width: 100%;

    margin-top: 34px;
    padding-top: 28px;

    border-top: 1px solid #d7d9dd;
}

.sk-product-description {
    width: 100%;

    color: #30394a;

    font-size: 13px;
    line-height: 1.6;

    text-align: left;
}

.sk-product-description p {
    margin: 0 0 17px;
}

.sk-product-disclaimer {
    width: 100%;
    max-width: 520px;
}


/* =========================================================
   SIZE / MATERIAL
========================================================= */

.sk-detail-group {
    width: 100%;
    margin-top: 20px;
}

.sk-detail-group h4,
.sk-specification-heading {
    margin: 0 0 7px;

    color: #17213b;

    font-size: 13px;
    line-height: 1.4;
    font-weight: 700;
}

.sk-detail-group p {
    margin: 0;

    color: #30394a;

    font-size: 12px;
    line-height: 1.65;
}


/* =========================================================
   SPECIFICATIONS
========================================================= */

.sk-specification-section {
    width: 100%;
    margin-top: 22px;
}

.sk-specification-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    column-gap: 55px;
    row-gap: 0;

    width: 100%;
    max-width: 680px;
}

.sk-spec-item {
    display: flex;
    flex-direction: column;
    justify-content: center;

    min-height: 58px;

    padding: 8px 0;

    border-bottom: 1px solid #dfe2e6;
}

.sk-spec-item span {
    display: block;

    margin-bottom: 4px;

    color: #8a909b;

    font-size: 10px;
    line-height: 1.3;
}

.sk-spec-item strong {
    display: block;

    color: #253149;

    font-size: 12px;
    line-height: 1.4;
    font-weight: 500;
}


/* =========================================================
   MODAL
========================================================= */

.sk-offer-modal {
    border: 0;
    border-radius: 14px;
    overflow: hidden;
}

.sk-offer-modal .modal-header {
    padding: 18px 20px;
}

.sk-offer-modal .modal-title {
    color: #17213b;
    font-size: 17px;
    font-weight: 700;
}

.sk-offer-modal .modal-body {
    padding: 20px;
}

.sk-offer-modal .modal-body ul {
    margin: 0;
    padding-left: 20px;
}

.sk-offer-modal .modal-body li {
    margin-bottom: 10px;

    color: #4c5564;

    font-size: 13px;
    line-height: 1.6;
}


/* =========================================================
   LARGE DESKTOP
========================================================= */

@media (min-width: 1400px) {

    .sk-product-info-container {
        width: calc(50% - 25px);
        margin-left: calc(50% + 25px);
        padding-right: 45px;
    }

}


/* =========================================================
   TABLET
   Full width from here
========================================================= */

@media (max-width: 991px) {

    .sk-product-info-section {
        padding: 30px 0 45px;
    }

    .sk-product-info-container {
        width: 100%;
        max-width: 100%;

        /* Remove desktop right alignment */
        margin-left: 0;
        margin-right: 0;

        padding: 0 25px;
    }

    .sk-specification-grid {
        column-gap: 35px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .sk-product-info-section {
        padding: 25px 0 35px;
    }

    .sk-product-info-container {
        width: 100%;

        margin: 0;

        padding-left: 15px;
        padding-right: 15px;
    }


    /* Heading */

    .sk-info-heading {
        gap: 6px;

        margin-bottom: 15px;

        font-size: 14px;
    }


    /* Offers */

    .sk-best-price {
        font-size: 12px;
    }

    .sk-offer-item {
        margin-bottom: 17px;
    }

    .sk-offer-item h4 {
        font-size: 13px;
        line-height: 1.55;
    }

    .sk-offer-item li {
        font-size: 12px;
    }

    .sk-terms-btn {
        font-size: 12px;
    }


    /* Product Details */

    .sk-product-details-block {
        margin-top: 27px;
        padding-top: 24px;
    }

    .sk-product-description {
        font-size: 12px;
        line-height: 1.65;
    }

    .sk-detail-group p {
        font-size: 12px;
    }


    /* Specifications */

    .sk-specification-grid {
        grid-template-columns: 1fr;

        column-gap: 0;

        width: 100%;
        max-width: 100%;
    }

    .sk-spec-item {
        min-height: 55px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .sk-product-info-container {
        padding-left: 12px;
        padding-right: 12px;
    }

    .sk-info-heading {
        font-size: 13px;
    }

    .sk-offer-item h4 {
        font-size: 12.5px;
    }

}




/* =========================================================
   DYNAMIC BEST OFFERS DESCRIPTION
   Scoped only to BEST OFFERS. Existing page UI stays intact.
========================================================= */
.sk-best-offers-description {
    width: 100%;
    color: #3d4553;
    font-size: 12px;
    line-height: 1.65;
}

.sk-best-offers-description p {
    margin: 0 0 12px;
    color: #3d4553 !important;
}

.sk-best-offers-description h1,
.sk-best-offers-description h2,
.sk-best-offers-description h3,
.sk-best-offers-description h4,
.sk-best-offers-description h5,
.sk-best-offers-description h6 {
    margin: 18px 0 7px;
    color: #151b2c !important;
    line-height: 1.45;
    font-weight: 700;
}

.sk-best-offers-description h1 { font-size: 17px; }
.sk-best-offers-description h2 { font-size: 16px; }
.sk-best-offers-description h3 { font-size: 15px; }
.sk-best-offers-description h4 { font-size: 14px; }
.sk-best-offers-description h5 { font-size: 13px; }
.sk-best-offers-description h6 { font-size: 12px; }

.sk-best-offers-description h1:first-child,
.sk-best-offers-description h2:first-child,
.sk-best-offers-description h3:first-child,
.sk-best-offers-description h4:first-child,
.sk-best-offers-description h5:first-child,
.sk-best-offers-description h6:first-child,
.sk-best-offers-description p:first-child {
    margin-top: 0;
}

.sk-best-offers-description strong,
.sk-best-offers-description b {
    color: #151b2c;
    font-weight: 700;
}

.sk-best-offers-description ul,
.sk-best-offers-description ol {
    margin: 8px 0 14px;
    padding-left: 19px;
}

.sk-best-offers-description li {
    margin-bottom: 5px;
    color: #3d4553 !important;
    line-height: 1.6;
}

.sk-best-offers-description a {
    color: #ff3f55 !important;
    text-decoration: none;
}

.sk-best-offers-description a:hover {
    color: #dc263c !important;
    text-decoration: underline;
}

/* Responsive rich-content table */
.sk-best-offers-description table {
    width: 100% !important;
    max-width: 100%;
    margin: 14px 0 18px;
    border-collapse: separate !important;
    border-spacing: 0;
    border: 1px solid #dfe2e6 !important;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    font-size: 11px;
}

.sk-best-offers-description thead th,
.sk-best-offers-description tr:first-child th {
    background: #f5f6f8 !important;
    color: #17213b !important;
    font-weight: 700;
}

.sk-best-offers-description th,
.sk-best-offers-description td {
    padding: 9px 10px !important;
    border: 0 !important;
    border-right: 1px solid #e4e6e9 !important;
    border-bottom: 1px solid #e4e6e9 !important;
    color: #3d4553 !important;
    text-align: left;
    vertical-align: middle;
    line-height: 1.5;
}

.sk-best-offers-description th:last-child,
.sk-best-offers-description td:last-child {
    border-right: 0 !important;
}

.sk-best-offers-description tr:last-child th,
.sk-best-offers-description tr:last-child td {
    border-bottom: 0 !important;
}

.sk-best-offers-description tbody tr:nth-child(even) td {
    background: #fafbfc !important;
}

.sk-best-offers-description blockquote {
    margin: 12px 0;
    padding: 10px 14px;
    border-left: 3px solid #ff3f55;
    background: #fafafa;
    color: #4a5260;
}

.sk-best-offers-description img {
    max-width: 100%;
    height: auto;
}

@media (max-width: 575px) {
    .sk-best-offers-description {
        font-size: 12px;
    }

    .sk-best-offers-description {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .sk-best-offers-description table {
        min-width: 520px;
    }
}



/*============================================================= */

/* =========================================================
   SKITCH OUR CLIENTS
   All classes are unique to avoid CSS conflicts
========================================================= */

.sk-client-section {
    width: 100%;
    position: relative;
    overflow: hidden;
    padding: 95px 0;
    background: #f7f9f5;
}

.sk-client-container {
    width: min(1200px, calc(100% - 40px));
    margin: 0 auto;
}


/* =========================================================
   HEADING
========================================================= */

.sk-client-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 35px;
    margin-bottom: 45px;
}

.sk-client-heading-left {
    max-width: 650px;
}

.sk-client-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 12px;
    color: #579f2e;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
}

.sk-client-eyebrow::before {
    content: "";
    width: 28px;
    height: 2px;
    background: #579f2e;
}

.sk-client-heading-left h2 {
    margin: 0;
    color: #172019;
    font-size: clamp(34px, 4vw, 48px);
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -1.5px;
}

.sk-client-heading-left h2 strong {
    color: #579f2e;
}

.sk-client-heading-left p {
    max-width: 590px;
    margin: 15px 0 0;
    color: #6c756e;
    font-size: 14px;
    line-height: 1.8;
}


/* Heading Badge */

.sk-client-heading-badge {
    min-width: 250px;
    padding: 14px 18px;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid #dfe7dc;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 10px 30px rgba(25, 55, 29, .05);
}

.sk-client-badge-icon {
    width: 45px;
    height: 45px;
    flex: 0 0 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #edf7e9;
    color: #579f2e;
    font-size: 18px;
}

.sk-client-heading-badge strong {
    display: block;
    margin-bottom: 3px;
    color: #263128;
    font-size: 13px;
    font-weight: 800;
}

.sk-client-heading-badge small {
    color: #89928b;
    font-size: 10px;
}


/* =========================================================
   CLIENT WRAPPER
========================================================= */

.sk-client-wrapper {
    position: relative;
    padding: 20px;
    border: 1px solid #e1e8de;
    border-radius: 22px;
    background: #ffffff;
    box-shadow: 0 20px 60px rgba(25, 55, 29, .07);
    overflow: hidden;
}


/* Decorative Elements */

.sk-client-decoration {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.sk-client-decoration-one {
    width: 230px;
    height: 230px;
    right: -110px;
    top: -120px;
    background: rgba(87, 159, 46, .055);
}

.sk-client-decoration-two {
    width: 180px;
    height: 180px;
    left: -90px;
    bottom: -100px;
    border: 35px solid rgba(87, 159, 46, .035);
}


/* Grid */

.sk-client-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    overflow: hidden;
    border: 1px solid #e7ece5;
    border-radius: 14px;
    background: #e7ece5;
}


/* =========================================================
   CLIENT CARD
========================================================= */

.sk-client-card {
    position: relative;
    min-height: 190px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #ffffff;
    overflow: hidden;
    transition:
        transform .4s ease,
        background .4s ease,
        box-shadow .4s ease;
}

.sk-client-card::before {
    content: "";
    position: absolute;
    width: 100px;
    height: 100px;
    right: -50px;
    top: -50px;
    border-radius: 50%;
    background: #edf7e9;
    opacity: 0;
    transition: .45s ease;
}

.sk-client-card:hover {
    z-index: 3;
    background: #fbfdf9;
    box-shadow: 0 15px 35px rgba(25, 55, 29, .10);
}

.sk-client-card:hover::before {
    opacity: 1;
    transform: scale(1.8);
}


/* Number */

.sk-client-number {
    position: absolute;
    top: 13px;
    right: 16px;
    color: #cdd6ca;
    font-size: 10px;
    font-weight: 800;
    transition: .3s ease;
}

.sk-client-card:hover .sk-client-number {
    color: #579f2e;
}


/* Logo */

.sk-client-logo-box {
    height: 105px;
    margin-top: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sk-client-logo-box img {
   width: 145px;
    max-width: 90%;
    /* max-height: 75px; */
    object-fit: contain;
    /* filter: grayscale(100%); */
    /* opacity: .62; */
    transition: filter .4s ease, opacity .4s ease, transform .4s ease;
}

.sk-client-card:hover .sk-client-logo-box img {
    filter: grayscale(0);
    opacity: 1;
    transform: scale(1.06);
}


/* Card Footer */

.sk-client-card-footer {
    padding-top: 12px;
    border-top: 1px solid #edf0eb;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #9aa29c;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.sk-client-card-footer i {
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f2f6f0;
    color: #579f2e;
    font-size: 9px;
    transition: .35s ease;
}

.sk-client-card:hover .sk-client-card-footer i {
    color: #ffffff;
    background: #579f2e;
    transform: translateX(3px);
}


/* =========================================================
   TRUST STRIP
========================================================= */

.sk-client-trust-strip {
    margin-top: 28px;
    padding: 18px 25px;
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 25px;
    border: 1px solid #e1e8de;
    border-radius: 14px;
    background: #ffffff;
}

.sk-client-trust-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.sk-client-trust-icon {
    width: 43px;
    height: 43px;
    flex: 0 0 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #edf7e9;
    color: #579f2e;
    font-size: 16px;
}

.sk-client-trust-item strong {
    display: block;
    margin-bottom: 3px;
    color: #2b352d;
    font-size: 12px;
    font-weight: 800;
}

.sk-client-trust-item small {
    color: #8b948d;
    font-size: 10px;
}

.sk-client-trust-divider {
    width: 1px;
    height: 35px;
    background: #e3e8e1;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1000px) {

    .sk-client-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .sk-client-heading {
        align-items: flex-start;
    }

}


@media (max-width: 800px) {

    .sk-client-section {
        padding: 70px 0;
    }

    .sk-client-heading {
        flex-direction: column;
        align-items: flex-start;
    }

    .sk-client-heading-badge {
        min-width: 0;
    }

    .sk-client-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .sk-client-trust-strip {
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .sk-client-trust-divider {
        display: none;
    }

}


@media (max-width: 550px) {

    .sk-client-section {
        padding: 55px 0;
    }

    .sk-client-container {
        width: min(100% - 24px, 1200px);
    }

    .sk-client-heading {
        margin-bottom: 30px;
        gap: 20px;
    }

    .sk-client-heading-left h2 {
        font-size: 34px;
    }

    .sk-client-heading-left p {
        font-size: 13px;
    }

    .sk-client-wrapper {
        padding: 10px;
        border-radius: 15px;
    }

    .sk-client-grid {
        grid-template-columns: repeat(2, 1fr);
        border-radius: 10px;
    }

    .sk-client-card {
        min-height: 165px;
        padding: 13px;
    }

    .sk-client-logo-box {
        height: 90px;
    }

    .sk-client-logo-box img {
        max-width: 85%;
        max-height: 58px;
    }

    .sk-client-card-footer {
        font-size: 8px;
    }

    .sk-client-trust-strip {
        padding: 18px;
        align-items: flex-start;
        flex-direction: column;
        gap: 18px;
    }

    .sk-client-trust-item {
        width: 100%;
    }

}


@media (max-width: 360px) {

    .sk-client-grid {
        grid-template-columns: 1fr;
    }

    .sk-client-card {
        min-height: 175px;
    }

}


