body {
  background-color: white;
}

/*# sourceMappingURL=styles.css.map */

/* 
  Pagination Styles
*/

.pagination {
  display: flex;
  justify-content: center;
  margin-top: 20px;
  align-items: center;
}

.md-pag-btn,
.md-pag-page,
.md-pag-dots {
  padding: 6px 10px;
  margin: 0 2px;
  border: none;
  background-color: transparent;
  color: #757575;
  font-size: 15px;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.md-pag-btn:hover,
.md-pag-page:hover {
  background-color: rgba(0, 0, 0, 0.04);
}

.md-pag-active {
  background-color: #2196f3;
  color: #fff;
}

.md-pag-dots {
  color: #bdbdbd;
}

.md-pag-prev,
.md-pag-next {
  font-size: 10px;
}

/* 
  floating button
*/
/* floating-table */
.floating-table {
  width: 100%;
}

.product-name {
  width: 90%;
  font-family: Inter;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  /* 24px */
  padding: 16px 12px !important;
  border-bottom: 1px solid #f5f5f5;
}

.woocommerce-cart-form__cart-item:hover {
  background: #ebebeb;
  padding-left: 20px;
}

.woocommerce-cart-form {
  overflow-y: scroll;
  height: 360px;
}

.product-remove {
  width: 10%;
}

.prod-name {
  padding-right: 10px;
  text-wrap: pretty;
}

#floating-menu {
  position: fixed;
  z-index: 9;
  bottom: 28px;
  right: 24px;
  width: 390px;
  height: 72px;
  background-color: #eff2f5;
  transition: height 0.3s ease;
  overflow: hidden;
  border-radius: 12px;
  padding: 16px;
  display: flex;
  gap: 16px;
  flex-direction: column;
  max-height: 500px;
  box-shadow: 6px 16px 5px 0px rgba(0, 51, 112, 0),
    4px 10px 4px 0px rgba(0, 51, 112, 0.02),
    2px 2px 5px 0px rgba(0, 51, 112, 0.08);
}

.header-buttons {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 100%;
}

#button-menuwe {
  width: auto;
  height: auto;
  background-color: #cccccc00;
  cursor: pointer;
  border: none;
  padding: 8px;
}

#button-quote {
  display: flex;
  align-items: center;

  justify-content: center;
  padding: 8px 16px;
  border-radius: 8px;
  background: #003370;
  gap: 8px;
  color: var(--Text-on-brand, #fff);
  font-family: "GT Walsheim";
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  height: 40px;
}

#button-quote:hover {
  background-color: #002450;
}

@media screen and (max-width: 420px) {
  #floating-menu {
    width: auto;
    bottom: 16px;
    right: 16px;
    left: 16px;
  }
}

.button-delete {
  display: flex;
  padding: 8px;
  border-radius: 8px;
  background: #fff;
  align-items: center;
  gap: 8px;
  height: 32px;
  width: 32px;
}

.button-delete i {
  font-size: 1.2em;
  color: #333;
}

#container-menu {
  transform: translateY(100%);
  transition: transform 0.3s ease;
  white-space: nowrap;
  overflow-y: auto;
}

#container-menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

#container-menu li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* margin-bottom: 10px; */
}

#floating-menu.open {
  height: auto;
}

#floating-menu.open #container-menu {
  transform: translateY(0);
}

.toast {
  visibility: hidden;
  min-width: 250px;
  margin-left: -125px;
  background-color: #333;
  color: #fff;
  text-align: center;
  border-radius: 2px;
  padding: 16px;
  position: fixed;
  z-index: 999999;
  left: 50%;
  top: 30px;
  /* Cambiado de bottom a top */
  font-size: 17px;
  transition: visibility 0s, opacity 0.5s linear;
  opacity: 0;
}

.toast.show {
  visibility: visible;
  opacity: 1;
}

.sticky-filters {
  position: sticky;
  top: 120px;
  z-index: 97;
  background-color: white;
}

/* ya tienes .sticky-filters; añadimos el estado oculto */
.sticky-filters.is-hidden {
  opacity: 0;
  pointer-events: none;
  transform: translateY(-8px);
  transition: opacity .2s ease, transform .2s ease;
}

@media (max-width: 1076px) {
  .sticky-filters {
    top: 131px;
  }
}

/* Fiters */
.filter-menu {
  position: absolute;
  background-color: white;
  border: 1px solid #ccc;
  /* padding: 0px 0px 24px 24px; */
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  max-height: 454px;
  /* Altura máxima de 454 píxeles */
  overflow-y: auto;
  min-width: 420px;
  width: 420px;
  border-radius: 8px;
  border: 2px solid rgba(30, 31, 32, 0.15);
  overflow-x: hidden;
  /* Permitir desplazamiento vertical */
}

.filter-apply-filters {
  position: sticky;
  bottom: 0;
  z-index: 97;
  background-color: white;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  padding: 12px 24px 8px 24px;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  align-self: stretch;

  border-top: 1px solid rgba(30, 31, 32, 0.05);
  background: white;
}

.apply-filters-footer {
  display: flex;
  height: 32px;
  padding: 8px 16px;
  align-items: center;
  gap: 8px;
  border-radius: 8px;
  background: #003370;
  color: var(--Text-on-brand, #FFF);
  text-align: center;
  font-family: "GT Walsheim";
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: 14px;
  /* 116.667% */
}

.filter-title {
  color: #1F2020;
  font-family: "Public Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  /* 171.429% */
}

.filter-menu-tags {
  position: absolute;
  background-color: white;
  border: 1px solid #ccc;
  padding: 4px 15px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  left: 160px;
  max-height: 454px;
  /* Altura máxima de 454 píxeles */
  overflow-y: auto;
  min-width: 420px;
  width: 420px;
  border-radius: 8px;
  border: 2px solid rgba(30, 31, 32, 0.15);
  overflow-x: hidden;
}

.filter-menu-tags .tag-item {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;

  font-family: "Public Sans";
}

.filter-menu h3 {
  margin-top: 0;
}

.filter-menu div {
  margin-bottom: 10px;
}

/* Estilo para las categorías principales (padres) */
.filter-menu .category-parent,
.filter-menu-tags .category-parent {
  font-weight: bold;
  /* Negrita para categorías padres */
  margin-bottom: 5px;
  display: grid;
  margin-top: 4px;
  grid-template-columns: 10px 14fr;
  align-items: center;
  margin-left: 5px;
  gap: 10px;
  font-size: 14px;
  margin-bottom: 5px;
  line-height: 24px;
  padding: 8px 8px 8px 12px;
  width: 100%;
  font-family: "Public Sans";
  position: sticky;
  top: 40px;
  z-index: 1;
  background: #fff;
  border-bottom: 1px solid #f5f5f5;
  /* Espacio inferior para separación */
}



/* Estilo para las categorías hijas */
.filter-menu .category-child,
.filter-menu-tags .category-child {
  margin-top: 4px;
  /* Margen superior para categorías hijas */
  margin-left: 25px;
  margin-top: 4px;
  display: grid;
  grid-template-columns: 10px 14fr;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  margin-bottom: 5px;
  line-height: 24px;
  padding: 8px;
  width: 100%;
  font-family: "Public Sans";

  /* Margen izquierdo para indentación */
}

/* Estilo para las subcategorías de segundo nivel (tercer nivel en total) */
.filter-menu .category-grandchild,
.filter-menu-tags .category-grandchild {
  margin-top: 4px;
  /* Margen superior para categorías hijas */
  margin-left: 45px;
  display: grid;
  grid-template-columns: 10px 14fr;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  margin-bottom: 5px;
  line-height: 24px;
  padding: 8px;
  width: 100%;
  font-family: "Public Sans";
  /* Margen izquierdo para indentación adicional */
}



#category-list,
#tags-list {
  display: flex;
  gap: 10px;
  overflow-x: auto;
}

.selected-categories,
.selected-tags {
  margin-top: 10px;
  margin-bottom: 20px;
}

#filter-toggle {
  margin-bottom: 10px;
}

.page-link {
  color: #001c3e;
  font-family: "Public Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  margin-left: 6px;
  margin-right: 6px;
}

.page-link.active {
  display: flex;
  width: 40px;
  height: 40px;
  overflow: hidden;
  padding: 6px 12px;
  border-radius: 100px;
  background: #01a2b2;
  justify-content: center;
  align-items: center;
  gap: 10px;
  color: #fff;
}

.small_filters {
  color: #1f2020;
  font-family: "Public Sans";
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 12px;
  text-transform: uppercase;
  padding-bottom: 4px;
}

.filter-button {
  display: inline-flex;
  padding: 8px 16px;
  border-radius: 8px;
  background: #01a2b2;
  align-items: center;
  gap: 8px;
  color: #fff;
  border: none;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  margin-right: 1rem;
}

.list-filters {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  flex-wrap: nowrap;
}

.item-list {
  background: #eff2f5;
  border-radius: 20000px;
  padding: 4px 8px;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 4px;
  color: #1f2020;

  font-family: "GT Walsheim";
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: 14px;
  white-space: nowrap;
  justify-content: center;
  box-shadow: 6px 16px 5px 0px rgba(0, 51, 112, 0),
    4px 10px 4px 0px rgba(0, 51, 112, 0.02);
}

.close-button {
  position: absolute;
  right: 0px;
}

.apply-filters {
  padding: 2px 8px;
  border: none;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  color: #01A2B2;
  font-family: "Public Sans";
  line-height: 171.429%;
  font-size: 0, 875em;

}

/* form blog */

.form-blog-card {
  display: flex;
  width: 100%;
  min-height: 582px;
  /* height: auto; */
  padding: 32px;
  border-radius: 12px;
  background: #003370;
  flex-direction: column;
  align-items: flex-start;
}

@media (max-width: 450px) {
  .form-blog-card {
    width: auto;
  }
}

.flex-label {
  display: flex;
  gap: 16px;
  width: 100%;
  align-items: start;
}

.form-blog-card .wpcf7-form p {
  margin-top: 16px !important;
  line-height: 1;
}

.form-blog-card .wpcf7-form input:not([type="submit"]):not([type="radio"]),
.form-blog-card .wpcf7-form select,
.form-blog-card .wpcf7-form textarea {
  width: 100%;
  border-radius: 8px;
  height: 42px;
  background: rgba(255, 255, 255, 0.1);
  padding: 12px 16px;
  color: rgba(255, 255, 255, 0.75);
  font-family: "Public Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  border: none;
  margin-top: 4px;
}

.form-blog-card .wpcf7-form p:first-child {
  margin-top: 16px !important;
}

.form-blog-card .wpcf7-form label {
  color: #fff;
  font-family: "Public Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  padding-bottom: 4px;
}

.form-blog-card .wpcf7-form input[type="submit"] {
  background: transparent;
  color: #fff;
  font-family: "GT Walsheim";
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;

  padding: 12px 24px;
  border-radius: 8px;
  border: 2px solid #fff;
  align-items: center;
}

.form-blog-card .wpcf7-form textarea {
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.75);
  font-family: "Public Sans";
  font-size: 14px;
  font-style: normal;
  height: 60px;
}

.form-blog-card .wpcf7-form .check-box label {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* page request a qoute */

.title-form {
  color: #1f2020;
  /* Headings DESKTOP/Heading XS */
  font-family: "GT Walsheim";
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 135%;
  margin-bottom: 8px;
}

.form-contact-single-post .title-form {
  color: #1f2020;
  /* Headings DESKTOP/Heading S */
  font-family: var(--Font-Family-heading, "GT Walsheim");
  font-size: var(--Font-Size-6, 32px);
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
}

.form-contact-single-post label {
  align-self: stretch;
  color: #1f2020;
  font-family: "Public Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
}

.form-contact-single-post input[type="submit"],
.form-suscribe input[type="submit"] {
  background: #01a2b2;
  color: #fff;
  font-family: "GT Walsheim";
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  padding: 12px 24px;
  border-radius: 8px;
  align-items: center;
}

.title-details {
  margin-top: 16px !important;
}

.title-form span {
  color: #01a2b2;
}

.request-section {
  display: flex;
  /* width: 100%; */
  justify-content: center;
  gap: 32px;
  margin-top: 24px;
}

.your-selection {
  color: rgba(30, 31, 32, 0.5);
  font-family: "Public Sans";
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
  text-transform: uppercase;
  margin-bottom: 12px;
}

.products-section_request {
  width: 40%;
}

.form-section_request {
  width: 60%;
}

.form-section_request form {
  border-radius: 12px;
  border: 1px solid rgba(30, 31, 32, 0.15);
  display: flex;
  padding: 16px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

@media (min-width:768px) {
  .form-section_request form {
    padding: 32px;
  }
}

.form-contact-single-post {
  border-radius: 12px;
  border: 1px solid rgba(30, 31, 32, 0.15);
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  align-self: stretch;
}

.a2a_kit a {
  padding: 8px !important;
}

@media (min-width:768px) {
  .form-contact-single-post {
    padding: 32px;
  }
}

.form-section_request .wpcf7-form input:not([type="submit"]):not([type="radio"]),
.form-section_request .wpcf7-form select,
.form-contact-single-post input:not([type="submit"]):not([type="radio"]),
.form-contact-single-post .wpcf7-form select {
  width: 100%;
  border-radius: 8px;
  height: 42px;
  padding: 12px 16px;
  background: rgba(30, 31, 32, 0.05);
  gap: 8px;
  border-radius: 8px;

  color: rgba(30, 31, 32, 0.5);

  /* Text/Body M */
  font-family: "Public Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  /* 128.571% */
}

.form-section_request textarea,
.form-contact-single-post textarea {
  width: 100%;
  border-radius: 8px;
  height: 122px;
  display: flex;
  padding: 12px 16px;
  background: rgba(30, 31, 32, 0.05);
  align-items: center;
  gap: 8px;
  border-radius: 8px;

  color: rgba(30, 31, 32, 0.5);

  /* Text/Body M */
  font-family: "Public Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  /* 128.571% */
}

.form-section_request textarea:focus {
  outline: 0;
  border: 1px solid #04A4CC;
}

.flex-label div {
  width: 100%;
}

.form-section_request .wpcf7-form p {
  margin-top: 0;
}

.wpcf7-form p:first-child {
  margin-top: 0 !important;
}

.form-section_request .wpcf7-form label {
  align-self: stretch;
  color: #1f2020;
  font-family: "Public Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
}

.wpcf7-radio span label {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
}

.form-section_request .wpcf7-form input[type="submit"] {
  display: flex;
  padding: 12px 24px;
  border-radius: 8px;
  background: #003370;
  align-items: center;
  gap: 8px;
  color: #ffffff;
  font-family: "GT Walsheim";
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.form-section_request .wpcf7-form input[type="submit"]:hover {
  background: #002450;
}

.products-section_request #product-list li {
  display: flex;
  height: 48px;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 8px 16px;
  overflow: hidden;
  color: #1f2020;
  /* Body/Highlight Bold */
  font-family: GT Walsheim;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  background: #eff2f5;
  border-radius: 8px;
}

#product-list li:not(#empty-cart) {
  display: flex;
  height: 48px;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 8px 16px;
  overflow: hidden;
  color: #1f2020;
  /* Body/Highlight Bold */
  font-family: GT Walsheim;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
}

#container-menu #product-list li:not(#empty-cart):hover {
  border-radius: 8px;
  background: #fff;
}

.products-section_request #product-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

#product-list li a {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

#textarea-products {
  visibility: hidden;
  display: none;
}

@media (max-width: 1000px) {
  .flex-label {
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  .flex-label {
    flex-direction: column;
  }

  .request-section {
    flex-direction: column;
  }

  .products-section_request {
    width: 100%;
  }

  .form-section_request {
    width: 100%;
  }

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

  .masonry {
    grid-template-columns: 1fr !important;
    padding: 16px !important;
  }

  .slider-cards-kids-holiday {
    margin: 32px 16px 0px 16px !important;
  }
}

.hero-request {
  display: flex;
  padding: 62px 88px;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
}

.slider-cards-kids-holiday {
  display: flex;
  flex-direction: column;
  row-gap: 16px;
  margin: 32px 24px 0px 24px;
}

.text-request {
  color: #000;
  font-family: Inter;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
}

.text-about {
  display: grid;
  grid-template-columns: repeat(1fr);
  font-size: 24px;
  font-weight: 700;
  line-height: 135%;
  justify-content: center;
  justify-content: center;
  gap: 20px;
  margin: 40px 80px;
  color: #1f2020;
}

@media (min-width: 991px) {
  .text-about {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}

.pop-section-grid-post {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.pop-article-item-post {
  display: flex;
  align-items: center;
  gap: 1.5em;
}

.pop-section-title-blog {
  display: flex;
  flex-direction: column;
  align-items: start;
}

.pop-section-blog {
  margin: 80px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 60px;
}

.pop-section-title-blog .pop-text-header-base__content h2,
.pop-section-title-blog .pop-text-header-base__content p {
  text-align: start !important;
}

.pop-section-title-blog .pop-text-header-base__content h2 {
  text-transform: uppercase;
  width: 100%;
}

.pop-article-item-post img {
  width: 140px;
  height: 140px;
  object-fit: cover;
  object-position: center;
  border-radius: 8px;
  /*background: radial-gradient(189.03% 72.44% at 50% 8.02%,
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.5) 100%),
    url(<path-to-image>) lightgray 50% / cover no-repeat;*/
}

@media (max-width: 768px) {
  .pop-article-item-post {
    flex-direction: column;
    align-items: center;
    gap: 1.5em;
  }

  .pop-article-item-post img {
    width: 100% !important;
    height: auto;
    aspect-ratio: 4 / 3;
  }

  .pop-labeled-button.pop-labeled-button__medium {
    padding: 8px 16px !important;
  }

  .hero-content {
    padding: 0 0 24px 0 !important;
  }
}

.pop-article-item-post h3 {
  color: #1f2020;
  font-family: "GT Walsheim";
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 135%;
  /* 32.4px */
}

.pop-article-item-post h3:hover {
  color: #01A2B2;
}

.pop-article-item-post p {
  overflow: hidden;
  color: #1f2020;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  font-family: "Public Sans";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
}

.pop-article-item-post .pop-title-description {
  display: flex;
  flex-direction: column;
  row-gap: 6px;
  margin-top: 16px;
}

/* blog */
.hero {
  display: flex;
  background-color: #f5f5f5;
  border-radius: 10px;
  overflow: hidden;
  gap: 32px;
  /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
}

@media (max-width: 1200px) {
  .hero {
    flex-direction: column;
    height: 100%;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
  }
}

.hero-image img {
  width: 100% !important;
  /* height: auto; */
  object-fit: contain;
  background-color: #eff2f5;
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.hero-content {
  padding: 24px 0px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
}

.hero-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  color: #666;
}

.author-image {
  width: 30px;
  height: 30px;
  border-radius: 50%;
}

.hero-tags {
  /* margin: 10px 0; */
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.tag {
  background-color: #e0e0e0;
  font-family: GT Walsheim, "sans-serif";
  font-weight: 700;
  line-height: 14px;
  border-radius: 10000px;
  padding: 4px 8px;
  font-size: 12px;
  /* box-shadow: 6px 16px 5px 0px rgba(0, 51, 112, 0),
    4px 10px 4px 0px rgba(0, 51, 112, 0.02); */
  background-color: #fff;
}

.category-post {
  font-family: GT Walsheim, "sans-serif";
  font-weight: 700;
  line-height: 14px;
  border-radius: 10000px;
  padding: 4px 8px;
  font-size: 12px;
  color: #1f2020;
  box-shadow: 6px 16px 5px 0px rgba(0, 51, 112, 0),
    4px 10px 4px 0px rgba(0, 51, 112, 0.02);
  background-color: #EFF2F5;
  white-space: nowrap;
}

.category-post:hover {

  background-color: #B3B6B9;
}

.categories-product {
  background-color: #eff2f5 !important;
  font-family: GT Walsheim, "sans-serif";
  font-weight: 700;
  line-height: 24px;
  border-radius: 10000px;
  padding: 8px 16px;
  font-size: 12px;
  background-color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

a.categories-product:hover {
  background-color: #B3B6B9 !important;
  color: #1F2220;
}

.hero-title {
  font-size: 24px;
  font-weight: bold;
  margin: 10px 0;
}

.hero-description {
  font-size: 16px !important;
  color: #333;
  margin-bottom: 20px;
}

.hero-button {
  background-color: #007bff;
  color: #fff;
  padding: 10px 20px;
  text-decoration: none;
  border-radius: 5px;
  text-align: center;
  align-self: flex-start;
}

.public-sans {
  font-family: Public Sans, sans-serif;
}

.public-walsheim {
  font-family: GT Walsheim, sans-serif !important;
}

/* form footer */

footer form.wpcf7-form p {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

footer form input:not([type="submit"]),
footer form textarea {
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  border: none !important;
  padding: 8px;
  color: #fff !important;
  width: 100%;
  margin-top: 4px;
}

footer form input:not([type="submit"]) {
  height: 42px;
}

footer form textarea {
  height: 83px;
}

footer form .mailing {
  padding: 8px 8px 8px 0px;
}

footer form label {
  width: 100%;
}

.wpcf7-form-control.wpcf7-checkbox .wpcf7-list-item label {
  display: flex !important;
  gap: 10px;
  align-items: center;
}

form input[type="checkbox"] {
  height: 20px !important;
  width: 20px !important;
  margin-left: -12px;
}

footer form textarea {
  height: 100px;
}

/* Estilos base para los checkboxes */
.custom-checkbox {
  display: flex;
  width: 16px !important;
  height: 16px !important;
  padding: 2px;
  justify-content: center;
  align-items: center;
  position: relative;
  border-radius: 2px;
  /* background:  #003370; */
  appearance: none;
  /* Eliminar el estilo predeterminado del checkbox */
  cursor: pointer;
  margin-left: -12px;
}

.filter-categories label {
  margin-left: -4px;
  max-width: 320px;
}

/* Estilos para los checkboxes seleccionados */
.custom-checkbox:checked {
  background: #003370;
  /* Cambiar el color de fondo cuando está seleccionado */
}

/* Estilos para los checkboxes no seleccionados */
.custom-checkbox:not(:checked) {
  border-radius: 2px;
  border: 1px solid #b3b6b9 !important;
  /* Color de fondo cuando no está seleccionado */
}

.custom-checkbox:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 12px;
  z-index: 99;
  background: url('data:image/svg+xml;utf8,<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.0156 2.48438C11.3203 2.76562 11.3203 3.25781 11.0156 3.53906L5.01562 9.53906C4.73438 9.84375 4.24219 9.84375 3.96094 9.53906L0.960938 6.53906C0.65625 6.25781 0.65625 5.76562 0.960938 5.48438C1.24219 5.17969 1.73438 5.17969 2.01562 5.48438L4.47656 7.94531L9.96094 2.48438C10.2422 2.17969 10.7344 2.17969 11.0156 2.48438Z" fill="white"/></svg>') no-repeat center center;
  transform: translate(-50%, -50%);
}

footer input[type="submit"] {
  border-radius: 8px !important;
  border: 2px solid #fff !important;
  display: flex !important;
  padding: 12px 24px !important;
  align-items: center !important;
  gap: 8px !important;
  color: #fff !important;
  text-align: center !important;
  font-family: "GT Walsheim" !important;
  font-size: 16px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  /* 150% */
  background: transparent !important;
}

footer input[type="submit"]:hover {
  background: white !important;
  color: #002450 !important;
}

footer .wpcf7-form label {
  color: #fff;

  /* Text/Body M */
  font-family: "Public Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  /* 128.571% */
}

.button-header {
  display: none;
}

@media (min-width: 991px) {
  .button-header {
    display: block;
  }
}

.padding-custom-48 {
  padding-left: 48px;
  padding-right: 48px;
}

/* content item product */
#description-product h2 {
  color: #1f2020;
  font-family: "GT Walsheim";
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
}

/* content item product */
#description-product h3 {
  color: #1f2020;
  font-family: "GT Walsheim";
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
}

@media (max-width: 768px) {
  #description-product h2 {
    color: #1f2020;
    font-family: "GT Walsheim";
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 116.7%;
  }

  #description-product h3 {
    color: #1f2020;
    font-family: "GT Walsheim";
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 135%;
  }
}

#description-product ul {
  list-style: disc;
  margin-left: 25px;
}

#description-product p {
  align-self: stretch;
  color: #1f2020;
  font-family: "Public Sans";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

/* Card Styles with button request quote without image */
.card-request {
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 80px 16px 80px 16px;
}

.card-request .card-request-text {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin-bottom: 24px;
}

.card-request-text .card-request-title {
  color: #1f2020;
  -webkit-text-decoration: uppercase;
  -webkit-text-decoration: uppercase;
  text-decoration: uppercase;
  font-family: GT Walsheim, sans-serif;
  font-size: 40px;
  font-weight: 700;
  line-height: 36px;
}

@media screen and (min-width: 641px) {
  .card-request {
    padding: 120px 80px 120px 80px;
  }

  .card-request .card-request-text {
    flex-direction: row;
  }

  .card-request .card-request-title {
    width: 50%;
    -webkit-text-decoration: uppercase;
    -webkit-text-decoration: uppercase;
    text-decoration: uppercase;
    font-family: GT Walsheim, sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 105%;
  }

  .card-request-text .card-request-subtitle {
    width: 50%;
  }
}

.card-request .card-request-title {
  text-transform: uppercase;
}

.card-request .card-request-subtitle {
  color: #1f2020;
  font-family: Public Sans, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.card-request.card-request__primary .card-request-title span {
  color: #003370;
}

.card-request.card-request__secondary .card-request-title span {
  color: #01a2b2;
}

.card-request.card-request__green .card-request-title span {
  color: #015d5d;
}

.card-request.card-request__green-light .card-request-title span {
  color: #95c028;
}

.card-request.card-request__red .card-request-title span {
  color: #bf0133;
}

/* sel;e */
/* Select Multiple Styles */
.components-combobox-control__suggestions-container {
  border-radius: 8px;
  border: 1px solid rgba(30, 31, 32, 0.15);
  background: #fff;
}

.components-form-token-field__input-container {
  border-radius: 8px;
  border: 1px solid rgba(30, 31, 32, 0.15);
  padding: 8px;
  min-height: 42px;
  background: #fff;
}

.components-form-token-field__token {
  background: #e9ecef;
  border-radius: 4px;
  padding: 2px 8px;
  margin: 2px;
  display: inline-flex;
  align-items: center;
  font-size: 14px;
  font-family: "Public Sans";
  border: none;
}

.components-form-token-field__token-text {
  color: #1f2020;
}

.components-form-token-field__remove-token {
  padding: 0 4px;
  margin-left: 4px;
  color: #666;
  border: none;
  background: transparent;
  cursor: pointer;
}

.components-form-token-field__input {
  border: none;
  padding: 4px;
  font-size: 14px;
  font-family: "Public Sans";
  width: 100%;
}

.components-form-token-field__input:focus {
  outline: none;
}

.components-form-token-field__suggestions-list {
  margin: 0;
  padding: 4px;
  list-style: none;
  border-top: 1px solid rgba(30, 31, 32, 0.15);
}

.components-form-token-field__suggestion {
  padding: 8px;
  margin: 2px 0;
  cursor: pointer;
  border-radius: 4px;
  color: #1f2020;
  font-family: "Public Sans";
  font-size: 14px;
}

.components-form-token-field__suggestion:hover {
  background: #e9ecef;
}

.components-form-token-field__suggestion.is-selected {
  background: #003370;
  color: #fff;
}

/* form suscribe */
.form-suscribe-single-post {
  display: flex;
  max-width: 842px;
  padding: 32px;
  border-radius: 12px;
  background: #003370;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  margin-top: 40px;
  margin-bottom: 16px;
}

.form-suscribe {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  flex-direction: column;
}

@media (min-width: 768px) {
  .form-suscribe {
    flex-direction: row;
  }
}

.form-suscribe input:not([type="submit"]) {
  width: 100%;
  display: flex;
  padding: 12px 16px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.1);
  align-items: flex-start;
  gap: 8px;
  flex: 1 0 0;
  align-self: stretch;

  height: 48px;
  flex-direction: column;
  justify-content: center;
  color: rgba(255, 255, 255, 0.75);
  font-family: "Public Sans";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
}

.form-suscribe-single-post .title-suscribe {
  align-self: stretch;
  color: #01a2b2;
  font-family: "GT Walsheim";
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
}

.form-suscribe-single-post .description-suscribe {
  flex: 1 0 0;
  color: #fff;
  font-family: "Public Sans";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

/* Single Post Content */
.content-post {
  display: flex;
  flex-direction: column;
}

.content-post ul {
  list-style: disc;
  margin-left: 25px;
}

.content-post p,
.content-post li {
  color: #1f2020;
  font-family: "Public Sans";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.content-post p {
  margin-bottom: 16px;
}

.content-post h2 {
  color: #1f2020;
  font-family: "GT Walsheim";
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
  margin-top: 24px;
  margin-bottom: 16px;
}

.content-post h3 {
  color: #1f2020;
  font-family: "GT Walsheim";
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 135%;
  margin-top: 24px;
  margin-bottom: 16px;
}

.content-post h4 {
  color: #1f2020;
  font-family: "GT Walsheim";
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
}

.content-post h5 {
  color: #1f2020;
  font-family: "GT Walsheim";
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
}

.content-post h6 {
  color: #1f2020;
  font-family: "GT Walsheim";
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
}

.content-post blockquote {
  display: flex;
  padding: 24px;
  border-radius: 8px;
  background: #eff2f5;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  margin-bottom: 16px;
}

figure.wp-block-gallery.has-nested-images {
  margin-bottom: 16px;
}

@media (min-width: 768px) {
  .content-post blockquote {
    padding: 48px;
  }

}

.content-post blockquote p {
  color: #003370;
  font-family: "GT Walsheim";
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 135%;

}

.content-post a:not(.pop-product-card a) {
  text-decoration: underline;
}

.content-post img {
  overflow: hidden;
  border-radius: 8px;
}

.content-form .is-layout-flex {
  gap: 16px !important;
}

.toc-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.toc-list li a {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  align-self: stretch;
  color: #1f2020;
  font-family: "Public Sans";
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
  text-overflow: ellipsis;
}

.sidebar-toc {
  margin-top: 16px;
  margin-bottom: 32px;
}

.prev {
  rotate: 180deg;
}

/* Mansounry */
/*.masonry {
  columns: 3;
  gap: 26px;
  padding: 16px 80px;
  font-family: GT Walsh;
}*/
.masonry {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  padding: 16px 80px;
  font-family: "GT Walsh";
}

.masonry .column {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.btn-request {
  height: 48px;
  margin-top: 32px;
}

.item {
  max-width: 100%;
  break-inside: avoid;
  background-color: #333;
  border-radius: 8px;
  margin-bottom: 16px;
  padding: 32px;
  overflow: hidden;
}

.item h2 {
  font-family: "GT Walsheim";
  font-size: 24px;
  font-weight: 700;
  margin: 0;
  line-height: 135%;
}

.item p {
  font-family: "Public Sans";
  font-size: 14px;
  font-weight: 400;
  margin: 0 0 4px 0;
  color: #ffffff;
}

.group-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;


}

.item .card-button {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 60px;
}

.card-nine,
.card-twelve {
  background-color: #911232;
  color: #ffffff;
}

.card-eigth,
.card-eleven,
.card-thirteen,
.card-fifteen {
  background-color: #003370;

}

.card-eigth .card,
.card-thirteen .card .group-text,
.card-eleven .card .group-text {
  margin-bottom: 60px;
}

.card-four {
  background-color: #015962;
}

.card-six,
.card-seven,
.card-ten {
  background-color: #95c028;
}

.card-seventeen,
.card-fourteen {
  background-color: #015d5d;
}

.card-one,
.card-three,
.card-sixteen,
.card-eighteen {
  background-color: #01a2b2;
}

.card-two,
.card-five {
  background-color: #bf0133;
  color: #ffffff;
}

.card-eight,
.card-eleven {
  color: #ffffff;
}

.card-six,
.card-seven,
.card-ten {
  color: #015d5d;
}

.card-four,
.card-fourteen,
.card-fifteen,
.card-seventeen {
  color: #95c028;
}

.card-eigth,
.card-eleven,
.card-thirteen {
  color: #01a2b2;
}

.card-one,
.card-three,
.card-sixteen,
.card-eighteen {
  color: #003370;
}

.card-eigth h2,
.card-eleven h2,
.card-thirteen h2 {
  font-size: 32px;
}

.image {
  padding: 0;
}

.item img {
  display: block;
  width: 100%;
  height: auto;
}

/*@media (max-width: 768px) {
  .masonry {
    columns: 2;
    padding: 16px;
  }
}

@media (max-width: 480px) {
 .masonry {
    columns: 1;
  }
}*/

.title-base_cat h2 {
  text-transform: uppercase;
}

.pop-category-page-menu__swiper .pop-category-card {
  height: 259px;
}

/* addd */

.filter-category {
  display: flex;
  border-radius: 2000px;
  background-color: #EFF2F5;
  padding-inline: 16px;
  padding-block: 8px;
  font-size: 14px;
  --tw-leading: 24px;
  line-height: 24px;
  --tw-font-weight: var(--font-weight-bold);
  font-weight: var(--font-weight-bold);
  color: #1F2020;
}

/* .filter-category.active,.filter-category:hover {
  border-radius: 2000px;
  background-color: #01A2B2;
  padding-inline: 16px;
  padding-block: 8px;
  font-size: 14px;
  --tw-leading: 24px;
  line-height: 24px;
  --tw-font-weight: var(--font-weight-bold);
  font-weight: var(--font-weight-bold);
  color: var(--color-white);
} */
/* Estilo base para los botones dentro de li */
.category-list li button {
  transition: background-color 0.3s ease;
}

/* Estilos hover diferentes para cada botón */
.category-list li:nth-child(1) button:hover,
.category-list li:nth-child(1) button.active {
  background-color: #003370;
  color: var(--color-white);
}

.category-list li:nth-child(1) button svg:last-child {
  display: none;
}

.category-list li:nth-child(1) button.active svg:last-child {
  display: block;
}

.category-list li:nth-child(1) button.active svg:first-child {
  display: none;
}

.category-list li:nth-child(2) button:hover,
.category-list li:nth-child(2) button.active {
  background-color: #BF0133;
  color: var(--color-white);
}

.category-list li:nth-child(2) button svg:last-child {
  display: none;
}

.category-list li:nth-child(2) button.active svg:last-child {
  display: block;
}

.category-list li:nth-child(2) button.active svg:first-child {
  display: none;
}

.category-list li:nth-child(3) button:hover,
.category-list li:nth-child(3) button.active {
  background-color: #95C028;
  color: var(--color-white);
}


.category-list li:nth-child(3) button svg:last-child {
  display: none;
}

.category-list li:nth-child(3) button.active svg:last-child {
  display: block;
}

.category-list li:nth-child(3) button.active svg:first-child {
  display: none;
}

.category-list li:nth-child(4) button:hover,
.category-list li:nth-child(4) button.active {
  background-color: #015D5D;
  color: var(--color-white);
}

.category-list li:nth-child(4) button svg:last-child {
  display: none;
}

.category-list li:nth-child(4) button.active svg:last-child {
  display: block;
}

.category-list li:nth-child(4) button.active svg:first-child {
  display: none;
}

.category-list li:nth-child(5) button:hover,
.category-list li:nth-child(5) button.active {
  background-color: #01A2B2;
  color: var(--color-white);
}

.category-list li:nth-child(5) button svg:last-child {
  display: none;
}

.category-list li:nth-child(5) button.active svg:last-child {
  display: block;
}

.category-list li:nth-child(5) button.active svg:first-child {
  display: none;
}

@media (min-width:641px) {
  .center-card {
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding: 24px 80px 24px 80px !important;
  }
}

.content-privacy p {
  margin-bottom: 16px;
  color: var(--Text-dark, #1F2020);

  /* Text/Body L */
  font-family: "Public Sans";
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  /* 150% */
}

.page-title {
  color: #1F2020;

  /* Headings DESKTOP/Heading L */
  font-family: "GT Walsheim";
  font-size: 48px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
  /* 50.4px */
  text-transform: uppercase;
  margin-top: 24px;
  margin-bottom: 60px;
}

.content-privacy h2 {
  color: #1F2020;

  /* Headings DESKTOP/Heading L */
  font-family: "GT Walsheim";
  font-size: 32px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
  /* 50.4px */

  margin-top: 24px;
}

.content-privacy h3 {
  color: #1F2020;

  /* Headings DESKTOP/Heading L */
  font-family: "GT Walsheim";
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
  /* 50.4px */

  margin-top: 24px;
  margin-bottom: 4px;
}

.content-privacy h4 {
  color: #1F2020;

  /* Headings DESKTOP/Heading L */
  font-family: "GT Walsheim";
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
  /* 50.4px */

  margin-top: 24px;
  margin-bottom: 4px;
}

.content-privacy h5 {
  color: #1F2020;

  /* Headings DESKTOP/Heading L */
  font-family: "GT Walsheim";
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
  /* 50.4px */

  margin-top: 24px;
  margin-bottom: 4px;
}

.content-privacy ul {
  list-style: disc;
  margin-left: 25px;
}

.content-privacy a {
  text-decoration: underline;
}

.image-item {

  filter: grayscale(100%);
  transition: transform 0.3s ease, filter 0.3s ease;
}

.image-item:hover {
  filter: grayscale(0%);


}

/* grid */

.parent {
  display: flex;
  flex-direction: column;

  gap: 16px;
  padding: 16px;
}

@media (min-width:641px) {
  .parent {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: repeat(11, 1fr);
    gap: 16px;
    padding: 64px;
  }

  .grid-item-1 {
    grid-column: span 2 / span 2;
    grid-row: span 2 / span 2;
  }

  .grid-item-2 {
    grid-column: span 2 / span 2;
    grid-row: span 3 / span 3;
    grid-column-start: 3;
  }

  .grid-item-3 {
    grid-column: span 2 / span 2;
    grid-row: span 2 / span 2;
    grid-column-start: 5;
  }

  .grid-item-4 {
    grid-column: span 2 / span 2;
    grid-row: span 3 / span 3;
    grid-row-start: 3;
  }

  .grid-item-5 {
    grid-column: span 2 / span 2;
    grid-row: span 3 / span 3;
    grid-column-start: 3;
    grid-row-start: 4;
  }

  .grid-item-6 {
    grid-column: span 2 / span 2;
    grid-row: span 3 / span 3;
    grid-column-start: 5;
    grid-row-start: 3;
  }

  .grid-item-7 {
    grid-column: span 2 / span 2;
    grid-row: span 3 / span 3;
    grid-row-start: 6;
  }

  .grid-item-8 {
    grid-column: span 2 / span 2;
    grid-row: span 2 / span 2;
    grid-column-start: 3;
    grid-row-start: 7;
  }

  .grid-item-9 {
    grid-column: span 2 / span 2;
    grid-row: span 3 / span 3;
    grid-column-start: 5;
    grid-row-start: 6;
  }

  .grid-item-10 {
    grid-column: span 2 / span 2;
    grid-row: span 3 / span 3;
    grid-row-start: 9;
  }

  .grid-item-11 {
    grid-column: span 2 / span 2;
    grid-row: span 2 / span 2;
    grid-column-start: 3;
    grid-row-start: 9;
  }

  .grid-item-12 {
    grid-column: span 2 / span 2;
    grid-row: span 3 / span 3;
    grid-column-start: 5;
    grid-row-start: 9;
  }
}

/* main */
header.header_top {
  position: fixed;
  z-index: 99;
  right: 0;
  left: 0;
  background: white;
}

main {
  padding-top: 130px;
}

@media (min-width:991) {
  main {
    padding-top: 120px;
  }

}

.nav-terms li a:hover {
  text-decoration: underline;
  color: rgba(255, 255, 255, 0.75);
}

.nav-links-footer li a {
  border-radius: 8px;
  background: #fff;
  display: flex;
  padding: 12px 24px;
  align-items: center;
  gap: 8px;
  color: var(--Text-primary, #003370);
  text-align: center;

  /* Button/large */
  font-family: "GT Walsheim";
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  /* 150% */
}

.nav-links-footer li a:hover {

  background: #002450;
  color: #fff;
}

/* filter in blog */
.category-checkbox {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
  pointer-events: none;
}

/*Floating item page product  */
.floating-add-cart {
  position: fixed;
  display: flex;
  left: 24px;
  bottom: 28px;
  width: 390px;
  overflow: hidden;
  padding: 16px;
  border-radius: 12px;
  border: 1px solid rgba(30, 31, 32, 0.15);
  box-shadow: 6px 16px 5px 0px rgba(0, 51, 112, 0.00), 4px 10px 4px 0px rgba(0, 51, 112, 0.02), 2px 2px 5px 0px rgba(0, 51, 112, 0.08);
  background: #fff;
  justify-content: space-between;
  flex-direction: row;

  gap: 16px;
  z-index: 9999;
  align-items: center;
}

@media (max-width: 1024px) {
  .floating-add-cart {
    display: none;
  }
}


.image-product-floating {
  width: 69px;
  height: 46px;
  overflow: hidden;
  padding: 3.2px;
  border-radius: 4px;
  aspect-ratio: 3/2;
  object-fit: cover;
  object-position: center;
  display: block;
}

.product-title-floating {
  align-self: center;
  color: #1F2020;
  font-family: "GT Walsheim";
  font-size: 18px;
  font-style: normal;
  font-weight: 700;
  line-height: 135%;
  max-width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.hero-role {
  color: rgba(30, 31, 32, 0.50);

  /* Labels/Label XS */
  font-family: "Public Sans";
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: 12px;
  /* 120% */
  text-transform: uppercase;
}


/* ANIMATED CARDS */
.swiper-container {
  width: 100%;
  height: 540px;
  max-width: 1400px;
  perspective: 1000px;
  overflow: hidden;
  margin: 0 auto;
}

.swiper-wrapper {
  align-items: center;
}

.swiper-slide {
  width: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.card {
  width: 100%;
  max-width: 450px;
  height: 450px;
  padding: 32px;
  border-radius: 8px;
  position: relative;
  color: #fff;
  transform-style: preserve-3d;
  transition: transform 0.5s ease;
}

.item .card {
  box-shadow: none !important;
}

/* Colores por paso */
.step1 {
  background-color: #95C028;
}

.step2 {
  background-color: #359aa7;
}

.step3 {
  background-color: #12504d;
}

.step4 {
  background-color: #c21e2d;
}

.step5 {
  background-color: #0a265e;
}

.step6 {
  background-color: #01A2B2;
}

.step-label {
  background: rgba(255, 255, 255, 0.8);
  color: #333;
  padding: 5px 10px;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: bold;
  display: inline-block;
  margin-bottom: 10px;
}

.card h3 {
  color: #fff;
  margin-bottom: 8px;
  font-family: GT Walsheim, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 135%;
}

.card p {
  color: #fff;
  font-family: Public Sans, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
}

.badge {
  position: absolute;
  top: -22px;
  right: 60px;
  background: #F9D653;
  border-radius: 2000px;


  font-weight: bold;
  display: flex;
  transform: rotate(-15deg);
  padding: 25px 20px;
  justify-content: center;
  align-items: center;
  gap: 8px;

  color: #1F2020;
  text-align: center;

  font-family: GT Walsheim, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
  text-transform: uppercase;
}

.swiper-button-next:after,
.swiper-button-prev:after {

  color: #fff;
  visibility: visible;
  text-align: center;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  padding: 8px;
  font-family: "Font Awesome 6 Pro";
  font-size: 24px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  display: flex;
  position: absolute;
  background-color: #000;
  border-radius: 50%;
}

.swiper-button-next:after {
  content: "";
}

.swiper-button-prev:after {
  content: "";
}

/* Coverflow effect (manual tilt) */
.swiper-slide-prev .card {
  transform: translateX(-10px) rotateZ(-5deg) scale(0.9);
}

.swiper-slide-next .card {
  transform: translateX(10px) rotateZ(5deg) scale(0.9);
}

.swiper-slide-active .card {
  transform: rotateZ(0deg) scale(1);
}

button,
.pop-labeled-button,
#button-quote {
  transition: all 0.3s ease;
}

.badge {
  position: absolute;
  top: 30px;
  right: 60px;
  display: flex;
  transform: rotate(-15deg);
  justify-content: center;
  align-items: center;
  color: rgb(31, 32, 32);
  text-align: center;
  font-family: "GT Walsheim", sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
  text-transform: uppercase;
  background: rgb(249, 214, 83);
  border-radius: 2000px;
  padding: 25px 20px;
  gap: 8px;
  z-index: 9999;
}

@media (max-width: 960px) {
  .pop-section-blog {
    row-gap: 40px;
    margin: 16px !important;
    grid-template-columns: repeat(1, 1fr);
  }

  .swiper-container {
    width: 390px !important;
    max-width: 390px !important;
    overflow: hidden;
    margin: 0 auto;
  }

  /* Colores por paso */
  .step1 {
    height: 320px;
    margin-bottom: 10px;
    width: 100%;
  }

  .step2 {
    height: 508px;
    margin-bottom: 10px;
    width: 100%;
  }

  .step3 {
    height: 400px;
    margin-bottom: 10px;
    width: 100%;
  }

  .step4 {
    height: 320px;
    margin-bottom: 10px;
    width: 100%;
  }

  .step5 {
    height: 272px;
    margin-bottom: 10px;
    width: 100%;
  }

  .step6 {
    height: 272px;
    margin-bottom: 10px;
    width: 100%;
  }

  .my-10 {
    width: 100%;
    padding: 0 15px;
  }

  .pop-section-colorfull-cards .pop-section-colorfull-cards__wrapper {
    padding: 40px 0 40px 24px;
  }

  .pop-section-colorfull-cards .pop-section-colorfull-cards__content,
  .pop-carousel-nav {
    padding-right: 24px;
  }

  .reviews-section__button div {
    width: 63%;
  }

  .reviews-section__button section {
    width: 35%;
    display: flex;
    justify-content: flex-end;
  }

  .mobile {
    display: grid !important;
    visibility: visible !important;
  }

  .desktop {
    display: none !important;
    visibility: hidden !important;
  }

  .filter-categories label {
    max-width: 120px;
  }

  .filter-menu-tags .filter-categories {
    padding: 0 0 24px 24px;
  }

  .filter-menu-tags {
    min-width: 330px;
    width: 330px;
    left: 16px;
    right: 16px;
    padding: 0 !important;
  }

  .filter-menu {
    min-width: 330px;
    width: 330px;
    left: 16px;
    right: 16px;
  }

  .ti-widget.ti-goog {
    padding: 0 16px !important;
  }
}

@media (min-width: 961px) {
  .mobile {
    display: none !important;
    visibility: hidden !important;
  }

  .desktop {
    display: grid !important;
    visibility: visible !important;
  }
}

/* ===== Mobile drawer (solo móvil) ===== */
/* ===== Mobile drawer solo para el UL (#main-menu) ===== */
/* ==== MOBILE MENU — Drawer + acordeón + espaciados Figma (BLOQUE ÚNICO) ==== */
@media (max-width: 1023px) {

  /* 10) CTA fijo al bottom */
  #cta.cta-button-mobile {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1001;
    border-radius: 0;
    margin: 0;
  }

  /* 11) Accesibilidad: foco visible solo cuando procede */
  #main-menu a:focus {
    outline: none;
  }

  #main-menu a:focus-visible {
    outline: 2px solid #01A2B2;
    outline-offset: 2px;
  }

  #toggle-menu:focus {
    outline: none;
  }

  #toggle-menu:focus-visible {
    outline: 2px solid #01A2B2;
    outline-offset: 4px;
    border-radius: 8px;
  }
}

/* En pantallas táctiles no hay hover: mostramos la flecha siempre
   para que el primer tap navegue de inmediato */
@media (hover: none) and (pointer: coarse) {

  /* El botón con la flecha es hijo directo del article */
  .pop-category-card>button {
    opacity: 1 !important;
    transform: translateY(0) !important;
  }
}

/* Blog Post Content Styles */
.content-post {
  color: var(--Text-dark, #1F2020);
  font-family: var(--Font-Family-body, "Public Sans");
  font-size: var(--Font-Size-3, 16px);
  font-style: normal;
  font-weight: 400;
  line-height: var(--Line-Height-5, 24px);
  /* 150% */
}

.content-post h1,
.content-post h2,
.content-post h3,
.content-post h4,
.content-post h5,
.content-post h6 {
  color: var(--Text-dark, #1F2020);
  font-family: var(--Font-Family-heading, "GT Walsheim");
  font-size: var(--Font-Size-6, 32px);
  font-style: normal;
  font-weight: 700;
  line-height: 105%;
  /* 33.6px */
  margin-top: 1.5em;
  margin-bottom: 0.5em;
  scroll-margin-top: 150px;
  /* Increased offset for sticky header */
}
/* MIT-5980: arrow position. Tailwind class `md:top-[16px]` had no compiled rule,
   so desktop fell to top:auto. Keep `top-[64px]` as the mobile-first base and
   define `md:top-[16px]` for >=768px to override on desktop. */
.top-\[64px\] {
  top: 64px;
}
@media (min-width: 768px) {
  .md\:top-\[16px\] {
    top: 16px;
  }
}