/* ============================================================
   00. TIPOGRAFÍA KSKINBE
   Títulos: Lato
   Texto general: Roboto
   ============================================================ */

@font-face {
  font-family: "Lato";
  src: url("../fonts/Lato/Lato-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../fonts/Lato/Lato-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../fonts/Lato/Lato-Italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../fonts/Lato/Lato-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../fonts/Lato/Lato-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Lato";
  src: url("../fonts/Lato/Lato-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto/Roboto-VariableFont_wdth,wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto/Roboto-Italic-VariableFont_wdth,wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

:root {
  --font_Lato: "Lato", Arial, sans-serif;
  --font_Roboto: "Roboto", Arial, sans-serif;
  --font_Playfair: "Lato", Arial, sans-serif;
}

html,
body,
p,
span,
a,
li,
label,
input,
textarea,
select,
option,
button,
table,
th,
td,
small,
strong,
em {
  font-family: var(--font_Roboto) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.section-heading__title,
.section-heading__subtitle,
.intro2__content-title,
.intro2__content-subtext,
.category2-item__content-title,
.featured-product-card__content-title,
.featured-product-card__content-title a,
.benefit-card__items-title,
.beauty-feature-item__card1-title,
.beauty-feature-item__card2-title,
.beauty-feature-item__card3-title,
.beauty-feature-item2__card1-title,
.beauty-feature-item2__card2-title,
.beauty-feature-item2__card3-title,
.offertwo-card__content-title,
.offertwo-card__content-title a,
.testimonial2-card__content-title,
.footer2-widget__title,
.footer2-widget__social-title,
.footer2-widget__contact-post-title,
.header-area.header-layoutone .main-menu>ul>li>a,
.header-area.header-layoutone .main-menu>ul>li .dp-menu li a {
  font-family: var(--font_Lato) !important;
}

/* ============================================================
   KSKINBE — HOME THEME
   Paleta principal
   ============================================================ */

:root {
  --kskin-bg: #EAD7CF;
  --kskin-bg-soft: #F3E4DE;
  --kskin-surface: #F8EEEA;
  --kskin-card: #FFF9F6;

  --kskin-accent: #D33B34;
  --kskin-accent-hover: #B92F29;
  --kskin-accent-dark: #9E2823;

  --kskin-text-primary: #111111;
  --kskin-text-secondary: #3A3432;
  --kskin-text-muted: #6C625E;

  --kskin-border: #D8C1B8;
  --kskin-border-soft: rgba(58, 52, 50, 0.12);

  --kskin-white: #FFFFFF;

  --kskin-shadow-sm: 0 6px 20px rgba(58, 52, 50, 0.08);
  --kskin-shadow-md: 0 12px 35px rgba(58, 52, 50, 0.12);

  /*
   * También sobrescribimos las variables originales del template.
   * new.css se carga después de style.css.
   */
  --primary: var(--kskin-bg-soft);
  --primary-two: var(--kskin-accent);
  --secondary: var(--kskin-text-secondary);
  --thardary: var(--kskin-surface);

  --text-color-one: var(--kskin-text-primary);
  --text-color-two: var(--kskin-text-secondary);
  --text-color-three: var(--kskin-text-secondary);
  --text-color-five: var(--kskin-text-secondary);
}


/* ============================================================
   01. BASE
   ============================================================ */

body {
  background-color: var(--kskin-bg);
  color: var(--kskin-text-secondary);
}

main {
  background-color: var(--kskin-bg);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--kskin-text-primary);
}

p {
  color: var(--kskin-text-secondary);
}

a:hover {
  color: var(--kskin-accent);
}


/* ============================================================
   02. TÍTULOS DE SECCIÓN
   ============================================================ */

.section-heading__title {
  color: var(--kskin-text-primary);
}

.section-heading__subtitle {
  color: var(--kskin-accent);
}


/* ============================================================
   03. HERO
   ============================================================ */

.intro2 {
  background-color: var(--kskin-bg);
}

.intro2__content-subtext {
  color: var(--kskin-accent);
}

.intro2__content-title {
  color: var(--kskin-text-primary);
}

.intro2__content-desc {
  color: var(--kskin-text-secondary);
}


/* Botón Hero */

.intro2 .rr-btn-button2 {
  background-color: var(--kskin-accent);
  color: var(--kskin-white);
  border-color: var(--kskin-accent);
}

.intro2 .rr-btn-button2 .text {
  color: var(--kskin-white);
}

.intro2 .rr-btn-button2 .icon {
  background-color: var(--kskin-white);
}

.intro2 .rr-btn-button2 .icon svg path {
  stroke: var(--kskin-text-primary);
}

.intro2 .rr-btn-button2:hover {
  background-color: var(--kskin-accent-hover);
  border-color: var(--kskin-accent-hover);
  color: var(--kskin-white);
}


/* Rating Hero */

.intro2__rating-score {
  color: var(--kskin-text-primary);
}

.intro2__rating-text {
  color: var(--kskin-text-secondary);
}

.intro2__rating-users .add-btn {
  background-color: var(--kskin-accent);
  color: var(--kskin-white);
}

.intro2__rating-users .add-btn:hover {
  background-color: var(--kskin-accent-hover);
  color: var(--kskin-white);
}


/* ============================================================
   04. CATEGORÍAS
   ============================================================ */

.category2 {
  background-color: var(--kskin-surface);
}

.category2-item {
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.category2-item:hover {
  transform: translateY(-6px);
}

.category2-item__thumb {
  overflow: hidden;
}

.category2-item__thumb img {
  transition: transform 0.45s ease;
}

.category2-item:hover .category2-item__thumb img {
  transform: scale(1.04);
}

.category2-item__content-title {
  color: var(--kskin-text-primary);
  transition: color 0.3s ease;
}

.category2-item:hover .category2-item__content-title {
  color: var(--kskin-accent);
}


/* ============================================================
   05. PRODUCTOS DESTACADOS
   ============================================================ */

.featured-product,
.bg-light-pick {
  background-color: var(--kskin-bg-soft) !important;
}

.featured-product .section-heading__title {
  color: var(--kskin-text-primary);
}


/* Botón "Ver todos los productos" */

.featured-product .rr-btn-button {
  background-color: var(--kskin-accent);
  color: var(--kskin-white);
  border-color: var(--kskin-accent);
}

.featured-product .rr-btn-button .text {
  color: var(--kskin-white);
}

.featured-product .rr-btn-button:hover {
  background-color: var(--kskin-accent-hover);
  color: var(--kskin-white);
}


/* Cards */

.featured-product-card {
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.featured-product-card:hover {
  transform: translateY(-5px);
}

.featured-product-card__content-title,
.featured-product-card__content-title a {
  color: var(--kskin-text-primary);
}

.featured-product-card__content-title a:hover {
  color: var(--kskin-accent);
}

.featured-product-card__content-list-point {
  color: var(--kskin-text-primary);
}

.featured-product-card__content-list-text {
  color: var(--kskin-text-muted);
}

.featured-product-card__content-list-start {
  color: var(--kskin-accent);
}

.featured-product-card__content-dollar {
  color: var(--kskin-accent);
}


/* Nuevo / Oferta */

.featured-product-card__thumb-offer,
.featured-product-card__thumb-offer.style {
  background-color: var(--kskin-accent);
  color: var(--kskin-white);
}


/* Agregar al carrito */

.featured-product .rr-btn-button4 {
  background-color: var(--kskin-card);
  color: var(--kskin-text-primary);
}

.featured-product .rr-btn-button4 .text {
  color: var(--kskin-text-primary);
}

.featured-product .rr-btn-button4 .icon {
  background-color: var(--kskin-accent);
  color: var(--kskin-white);
}

.featured-product .rr-btn-button4 .icon svg path {
  stroke: var(--kskin-white);
}

.featured-product .rr-btn-button4:hover {
  background-color: var(--kskin-accent);
  color: var(--kskin-white);
}

.featured-product .rr-btn-button4:hover .text {
  color: var(--kskin-white);
}

.featured-product .rr-btn-button4:hover .icon {
  background-color: var(--kskin-white);
}

.featured-product .rr-btn-button4:hover .icon svg path {
  stroke: var(--kskin-accent);
}


/* ============================================================
   06. BENEFICIOS
   ============================================================ */

.benefit {
  background-color: var(--kskin-bg);
}

.benefit-card {
  border-color: var(--kskin-border-soft);
  transition:
    transform 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease;
}

.benefit-card:hover {
  transform: translateY(-5px);
  border-color: var(--kskin-accent);
  box-shadow: var(--kskin-shadow-sm);
}

.benefit-card__items-title {
  color: var(--kskin-text-primary);
}

.benefit-card__content-subtitle {
  color: var(--kskin-text-secondary);
}


/* ============================================================
   07. CUIDADO REAL PARA TU RUTINA
   ============================================================ */

.beauty-feature {
  background-color: var(--kskin-bg);
}

.beauty-feature-item__card1-title,
.beauty-feature-item__card2-title,
.beauty-feature-item__card3-title,
.beauty-feature-item2__card1-title,
.beauty-feature-item2__card2-title,
.beauty-feature-item2__card3-title {
  color: var(--kskin-text-primary);
}

.beauty-feature-item__card1-dsc,
.beauty-feature-item__card2-dsc,
.beauty-feature-item__card3-dsc,
.beauty-feature-item2__card1-dsc,
.beauty-feature-item2__card2-dsc,
.beauty-feature-item2__card3-dsc {
  color: var(--kskin-text-secondary);
}


/* Hover líneas/puntos */

.beauty-feature-item__card1:hover,
.beauty-feature-item__card2:hover,
.beauty-feature-item__card3:hover,
.beauty-feature-item2__card1:hover,
.beauty-feature-item2__card2:hover,
.beauty-feature-item2__card3:hover {
  border-color: var(--kskin-accent);
}

.beauty-feature-item__card1:hover::before,
.beauty-feature-item__card2:hover::before,
.beauty-feature-item__card3:hover::before,
.beauty-feature-item2__card1:hover::before,
.beauty-feature-item2__card2:hover::before,
.beauty-feature-item2__card3:hover::before {
  background: var(--kskin-accent);
}

.beauty-feature-item__card1:hover::after,
.beauty-feature-item__card2:hover::after,
.beauty-feature-item__card3:hover::after,
.beauty-feature-item2__card1:hover::after,
.beauty-feature-item2__card2:hover::after,
.beauty-feature-item2__card3:hover::after {
  border-color: var(--kskin-accent);
}


/* ============================================================
   08. PROMOCIÓN DEL DÍA
   ============================================================ */

.offertwo {
  background-color: var(--kskin-bg-soft) !important;
}

.offertwo-card__content-title,
.offertwo-card__content-title a {
  color: var(--kskin-text-primary);
}

.offertwo-card__content-title a:hover {
  color: var(--kskin-accent);
}

.offertwo-card__content-list-start {
  color: var(--kskin-accent);
}

.offertwo-card__content-list-point {
  color: var(--kskin-text-primary);
}

.offertwo-card__content-list-text {
  color: var(--kskin-text-muted);
}

.offertwo-card__content-items-price .original-price {
  color: var(--kskin-text-muted);
}

.offertwo-card__content-items-price .offer-price {
  color: var(--kskin-accent);
}


/* Botón promoción */

.offertwo .rr-btn-button5 {
  border-color: var(--kskin-border);
  color: var(--kskin-text-primary);
}

.offertwo .rr-btn-button5 .text {
  color: var(--kskin-text-primary);
}

.offertwo .rr-btn-button5 .icon {
  background-color: var(--kskin-accent);
  color: var(--kskin-white);
}

.offertwo .rr-btn-button5:hover {
  border-color: var(--kskin-accent);
  background-color: var(--kskin-accent);
}

.offertwo .rr-btn-button5:hover .text {
  color: var(--kskin-white);
}

.offertwo .rr-btn-button5:hover .icon {
  background-color: var(--kskin-white);
}

.offertwo .rr-btn-button5:hover .icon svg path {
  fill: var(--kskin-accent);
}


/* Navegación promoción */

.offertwo-controls__arrowLeft,
.offertwo-controls__arrowRight {
  color: var(--kskin-text-secondary);
}

.offertwo-controls__arrowLeft:hover,
.offertwo-controls__arrowRight:hover {
  color: var(--kskin-accent);
}

.offertwo-controls__arrowLeft .icon,
.offertwo-controls__arrowRight .icon {
  border-color: var(--kskin-border);
  color: var(--kskin-text-primary);
}

.offertwo-controls__arrowLeft:hover .icon,
.offertwo-controls__arrowRight:hover .icon {
  background-color: var(--kskin-accent);
  border-color: var(--kskin-accent);
  color: var(--kskin-white);
}


/* ============================================================
   09. TESTIMONIOS
   ============================================================ */

.testimonial2 {
  background-color: var(--kskin-bg);
}

.testimonial2-card {
  border-color: var(--kskin-border-soft);
}

.testimonial2-card__content-title {
  color: var(--kskin-text-primary);
}

.testimonial2-card__content-suntitle {
  color: var(--kskin-text-secondary);
}

.testimonial2-card__content-star {
  color: var(--kskin-accent);
}

.testimonial2-card__content-star i {
  color: var(--kskin-accent);
}


/* Navegación testimonios */

.testimonial2-controls__arrowLeft,
.testimonial2-controls__arrowRight {
  color: var(--kskin-text-secondary);
}

.testimonial2-controls__arrowLeft:hover,
.testimonial2-controls__arrowRight:hover {
  color: var(--kskin-accent);
}

.testimonial2-controls__arrowLeft .icon,
.testimonial2-controls__arrowRight .icon {
  color: var(--kskin-text-primary);
  border-color: var(--kskin-border);
}

.testimonial2-controls__arrowLeft:hover .icon,
.testimonial2-controls__arrowRight:hover .icon {
  color: var(--kskin-white);
  background-color: var(--kskin-accent);
  border-color: var(--kskin-accent);
}


/* ============================================================
   10. INSTAGRAM / BLOG
   ============================================================ */

.instagram2 {
  background-color: var(--kskin-bg);
}

.instagram2-thumb .icon {
  background-color: var(--kskin-accent);
  color: var(--kskin-white);
}

.instagram2-thumb .icon:hover {
  background-color: var(--kskin-accent-hover);
  color: var(--kskin-white);
}


/* ============================================================
   11. ELEMENTOS GLOBALES DEL HOME
   ============================================================ */

main ::selection {
  background-color: var(--kskin-accent);
  color: var(--kskin-white);
}


/* Scrollbar */

::-webkit-scrollbar-thumb {
  background: var(--kskin-accent);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--kskin-accent-hover);
}


/* ============================================================
   12. RESPONSIVE
   ============================================================ */

@media only screen and (max-width: 991px) {

  .intro2,
  .category2,
  .featured-product,
  .benefit,
  .beauty-feature,
  .offertwo,
  .testimonial2,
  .instagram2 {
    overflow: hidden;
  }

}


@media (max-width: 575px) {

  .intro2__content-title {
    color: var(--kskin-text-primary);
  }

  .intro2__content-desc {
    color: var(--kskin-text-secondary);
  }

}

/* ============================================================
   KSKINBE — BOTONES DEL INDEX
   ============================================================ */


/* ------------------------------------------------------------
   01. HERO
   "Descubrir productos"
   Clase: .rr-btn-button2
   ------------------------------------------------------------ */

.intro2 .rr-btn-button2 {
  background: var(--kskin-accent);
  color: #FFFFFF;
  border-color: var(--kskin-accent);
  transition: all 0.3s ease;
}

.intro2 .rr-btn-button2 .text {
  color: #FFFFFF;
  transition: color 0.3s ease;
}

.intro2 .rr-btn-button2 .icon {
  background: #FFFFFF;
  color: var(--kskin-text-primary);
  transition: all 0.3s ease;
}

.intro2 .rr-btn-button2 .icon svg path {
  stroke: var(--kskin-text-primary);
}


/* HOVER */

.intro2 .rr-btn-button2:hover {
  background: var(--kskin-accent-hover);
  border-color: var(--kskin-accent-hover);
  color: #FFFFFF;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(211, 59, 52, 0.20);
}

.intro2 .rr-btn-button2:hover .text {
  color: #FFFFFF;
}

.intro2 .rr-btn-button2:hover .icon {
  background: #FFFFFF;
  transform: rotate(-45deg);
}

.intro2 .rr-btn-button2:hover .icon svg path {
  stroke: var(--kskin-accent);
}



/* ------------------------------------------------------------
   02. PRODUCTOS DESTACADOS
   "Ver todos los productos"
   Clase: .rr-btn-button
   ------------------------------------------------------------ */

.featured-product .rr-btn-button {
  background: var(--kskin-accent);
  color: #FFFFFF;
  border-color: var(--kskin-accent);
  transition: all 0.3s ease;
}

.featured-product .rr-btn-button .text {
  color: #FFFFFF;
}

.featured-product .rr-btn-button .icon {
  background: #FFFFFF;
  color: var(--kskin-text-primary);
  transition: all 0.3s ease;
}

.featured-product .rr-btn-button .icon svg path {
  stroke: var(--kskin-text-primary);
}


/* HOVER */

.featured-product .rr-btn-button:hover {
  background: var(--kskin-accent-hover);
  border-color: var(--kskin-accent-hover);
  color: #FFFFFF;
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(211, 59, 52, 0.20);
}

.featured-product .rr-btn-button:hover .text {
  color: #FFFFFF;
}

.featured-product .rr-btn-button:hover .icon {
  background: #FFFFFF;
  transform: rotate(-45deg);
}

.featured-product .rr-btn-button:hover .icon svg path {
  stroke: var(--kskin-accent);
}



/* ------------------------------------------------------------
   03. TARJETAS DE PRODUCTOS
   "Agregar al carrito"
   Clase: .rr-btn-button4
   ------------------------------------------------------------ */

.featured-product-card .rr-btn-button4 {
  background: #FFFFFF;
  color: var(--kskin-text-primary);
  border: 1px solid var(--kskin-border);
  transition: all 0.3s ease;
}

.featured-product-card .rr-btn-button4 .text {
  color: var(--kskin-text-primary);
  transition: color 0.3s ease;
}

.featured-product-card .rr-btn-button4 .icon {
  background: var(--kskin-accent);
  color: #FFFFFF;
  transition: all 0.3s ease;
}

.featured-product-card .rr-btn-button4 .icon svg path {
  stroke: #FFFFFF;
}


/* HOVER */

.featured-product-card .rr-btn-button4:hover {
  background: var(--kskin-accent);
  border-color: var(--kskin-accent);
  color: #FFFFFF;
  box-shadow: 0 8px 20px rgba(211, 59, 52, 0.18);
}

.featured-product-card .rr-btn-button4:hover .text {
  color: #FFFFFF;
}

.featured-product-card .rr-btn-button4:hover .icon {
  background: #FFFFFF;
  transform: rotate(-45deg);
}

.featured-product-card .rr-btn-button4:hover .icon svg path {
  stroke: var(--kskin-accent);
}



/* ------------------------------------------------------------
   04. PROMOCIÓN DEL DÍA
   "Agregar al carrito"
   Clase: .rr-btn-button5
   ------------------------------------------------------------ */

.offertwo .rr-btn-button5 {
  background: transparent;
  color: var(--kskin-text-primary);
  border: 1px solid var(--kskin-border);
  transition: all 0.3s ease;
}

.offertwo .rr-btn-button5 .text {
  color: var(--kskin-text-primary);
  transition: color 0.3s ease;
}

.offertwo .rr-btn-button5 .icon {
  background: var(--kskin-accent);
  color: #FFFFFF;
  transition: all 0.3s ease;
}

.offertwo .rr-btn-button5 .icon svg path {
  fill: #FFFFFF;
}


/* HOVER */

.offertwo .rr-btn-button5:hover {
  background: var(--kskin-accent);
  border-color: var(--kskin-accent);
  color: #FFFFFF;
  box-shadow: 0 8px 20px rgba(211, 59, 52, 0.18);
}

.offertwo .rr-btn-button5:hover .text {
  color: #FFFFFF;
}

.offertwo .rr-btn-button5:hover .icon {
  background: #FFFFFF;
}

.offertwo .rr-btn-button5:hover .icon svg path {
  fill: var(--kskin-accent);
}



/* ------------------------------------------------------------
   05. PROMOCIÓN DEL DÍA
   Controles ANTERIOR / SIGUIENTE
   ------------------------------------------------------------ */

.offertwo-controls__arrowLeft,
.offertwo-controls__arrowRight {
  color: var(--kskin-text-secondary);
  transition: color 0.3s ease;
}

.offertwo-controls__arrowLeft .icon,
.offertwo-controls__arrowRight .icon {
  color: var(--kskin-text-primary);
  border-color: var(--kskin-border);
  transition: all 0.3s ease;
}

.offertwo-controls__arrowLeft:hover,
.offertwo-controls__arrowRight:hover {
  color: var(--kskin-accent);
}

.offertwo-controls__arrowLeft:hover .icon,
.offertwo-controls__arrowRight:hover .icon {
  background: var(--kskin-accent);
  border-color: var(--kskin-accent);
  color: #FFFFFF;
}



/* ------------------------------------------------------------
   06. TESTIMONIOS
   Controles ANTERIOR / SIGUIENTE
   ------------------------------------------------------------ */

.testimonial2-controls__arrowLeft,
.testimonial2-controls__arrowRight {
  color: var(--kskin-text-secondary);
  transition: color 0.3s ease;
}

.testimonial2-controls__arrowLeft .icon,
.testimonial2-controls__arrowRight .icon {
  color: var(--kskin-text-primary);
  border-color: var(--kskin-border);
  transition: all 0.3s ease;
}

.testimonial2-controls__arrowLeft:hover,
.testimonial2-controls__arrowRight:hover {
  color: var(--kskin-accent);
}

.testimonial2-controls__arrowLeft:hover .icon,
.testimonial2-controls__arrowRight:hover .icon {
  background: var(--kskin-accent);
  border-color: var(--kskin-accent);
  color: #FFFFFF;
}



/* ------------------------------------------------------------
   07. BOTÓN + DEL HERO
   ------------------------------------------------------------ */

.intro2__rating-users .add-btn {
  background: var(--kskin-accent);
  color: #FFFFFF;
  transition: all 0.3s ease;
}

.intro2__rating-users .add-btn i {
  color: #FFFFFF;
}

.intro2__rating-users .add-btn:hover {
  background: var(--kskin-accent-hover);
  color: #FFFFFF;
  transform: scale(1.08);
}

.intro2__rating-users .add-btn:hover i {
  color: #FFFFFF;
}



/* ------------------------------------------------------------
   08. INSTAGRAM
   ------------------------------------------------------------ */

.instagram2-thumb .icon {
  background: var(--kskin-accent);
  color: #FFFFFF;
  transition: all 0.3s ease;
}

.instagram2-thumb .icon i {
  color: #FFFFFF;
}

.instagram2-thumb .icon:hover {
  background: var(--kskin-accent-hover);
  color: #FFFFFF;
  transform: scale(1.08);
}

/* ============================================================
   13. NORMALIZACIÓN FINAL DE BOTONES / CONTROLES DEL INDEX
   Evita que sobrevivan colores rosados hardcodeados del template.
   ============================================================ */

/* CTA Hero */
.intro2 .intro2__content-btn .rr-btn-button2 {
  background: var(--kskin-accent) !important;
  border-color: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.intro2 .intro2__content-btn .rr-btn-button2 .text {
  color: var(--kskin-white) !important;
}

.intro2 .intro2__content-btn .rr-btn-button2 .icon {
  background: var(--kskin-white) !important;
  color: var(--kskin-text-primary) !important;
}

.intro2 .intro2__content-btn .rr-btn-button2 .icon svg path {
  stroke: var(--kskin-text-primary) !important;
}

.intro2 .intro2__content-btn .rr-btn-button2:hover {
  background: var(--kskin-accent-hover) !important;
  border-color: var(--kskin-accent-hover) !important;
}

/* Productos destacados: Ver todos los productos */
.featured-product .featured-product__button .rr-btn-button {
  background: var(--kskin-accent) !important;
  border-color: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.featured-product .featured-product__button .rr-btn-button .text {
  color: var(--kskin-white) !important;
}

.featured-product .featured-product__button .rr-btn-button .icon {
  background: var(--kskin-white) !important;
  color: var(--kskin-text-primary) !important;
}

.featured-product .featured-product__button .rr-btn-button .icon svg path {
  stroke: var(--kskin-text-primary) !important;
  fill: none !important;
}

.featured-product .featured-product__button .rr-btn-button:hover {
  background: var(--kskin-accent-hover) !important;
  border-color: var(--kskin-accent-hover) !important;
}

.featured-product .featured-product__button .rr-btn-button:hover .icon {
  background: var(--kskin-white) !important;
}

.featured-product .featured-product__button .rr-btn-button:hover .icon svg path {
  stroke: var(--kskin-accent) !important;
}

/* Cards: Agregar al carrito */
.featured-product .featured-product-card .rr-btn-button4 {
  background: var(--kskin-white) !important;
  border: 1px solid var(--kskin-border) !important;
  color: var(--kskin-text-primary) !important;
}

.featured-product .featured-product-card .rr-btn-button4 .text {
  color: var(--kskin-text-primary) !important;
}

.featured-product .featured-product-card .rr-btn-button4 .icon {
  background: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.featured-product .featured-product-card .rr-btn-button4 .icon svg path {
  stroke: var(--kskin-white) !important;
  fill: none !important;
}

.featured-product .featured-product-card .rr-btn-button4:hover {
  background: var(--kskin-accent) !important;
  border-color: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.featured-product .featured-product-card .rr-btn-button4:hover .text {
  color: var(--kskin-white) !important;
}

.featured-product .featured-product-card .rr-btn-button4:hover .icon {
  background: var(--kskin-white) !important;
}

.featured-product .featured-product-card .rr-btn-button4:hover .icon svg path {
  stroke: var(--kskin-accent) !important;
}

/* Promoción del día: Agregar al carrito */
.offertwo .offertwo-card .rr-btn-button5 {
  background: transparent !important;
  border: 1px solid var(--kskin-border) !important;
  color: var(--kskin-text-primary) !important;
}

.offertwo .offertwo-card .rr-btn-button5 .text {
  color: var(--kskin-text-primary) !important;
}

.offertwo .offertwo-card .rr-btn-button5 .icon {
  background: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.offertwo .offertwo-card .rr-btn-button5 .icon svg path {
  fill: var(--kskin-white) !important;
}

.offertwo .offertwo-card .rr-btn-button5:hover {
  background: var(--kskin-accent) !important;
  border-color: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.offertwo .offertwo-card .rr-btn-button5:hover .text {
  color: var(--kskin-white) !important;
}

.offertwo .offertwo-card .rr-btn-button5:hover .icon {
  background: var(--kskin-white) !important;
}

.offertwo .offertwo-card .rr-btn-button5:hover .icon svg path {
  fill: var(--kskin-accent) !important;
}

/* Promoción: Anterior */
.offertwo .offertwo-controls__arrowLeft {
  background: transparent !important;
  border: 1px solid var(--kskin-border) !important;
  color: var(--kskin-text-secondary) !important;
}

.offertwo .offertwo-controls__arrowLeft .icon {
  background: var(--kskin-text-primary) !important;
  color: var(--kskin-white) !important;
}

.offertwo .offertwo-controls__arrowLeft:hover {
  background: var(--kskin-accent) !important;
  border-color: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.offertwo .offertwo-controls__arrowLeft:hover .icon {
  background: var(--kskin-white) !important;
  color: var(--kskin-text-primary) !important;
}

/* Promoción: Siguiente */
.offertwo .offertwo-controls__arrowRight {
  background: var(--kskin-accent) !important;
  border: 1px solid var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.offertwo .offertwo-controls__arrowRight .icon {
  background: var(--kskin-white) !important;
  color: var(--kskin-text-primary) !important;
}

.offertwo .offertwo-controls__arrowRight:hover {
  background: var(--kskin-accent-hover) !important;
  border-color: var(--kskin-accent-hover) !important;
  color: var(--kskin-white) !important;
}

.offertwo .offertwo-controls__arrowRight:hover .icon {
  background: var(--kskin-white) !important;
  color: var(--kskin-accent-hover) !important;
}

/* Testimonios: Anterior */
.testimonial2 .testimonial2-controls__arrowLeft {
  background: transparent !important;
  border: 1px solid var(--kskin-border) !important;
  color: var(--kskin-text-secondary) !important;
}

.testimonial2 .testimonial2-controls__arrowLeft .icon {
  background: var(--kskin-text-primary) !important;
  color: var(--kskin-white) !important;
}

.testimonial2 .testimonial2-controls__arrowLeft:hover {
  background: var(--kskin-accent) !important;
  border-color: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.testimonial2 .testimonial2-controls__arrowLeft:hover .icon {
  background: var(--kskin-white) !important;
  color: var(--kskin-text-primary) !important;
}

/* Testimonios: Siguiente */
.testimonial2 .testimonial2-controls__arrowRight {
  background: var(--kskin-accent) !important;
  border: 1px solid var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.testimonial2 .testimonial2-controls__arrowRight .icon {
  background: var(--kskin-white) !important;
  color: var(--kskin-text-primary) !important;
}

.testimonial2 .testimonial2-controls__arrowRight:hover {
  background: var(--kskin-accent-hover) !important;
  border-color: var(--kskin-accent-hover) !important;
  color: var(--kskin-white) !important;
}

.testimonial2 .testimonial2-controls__arrowRight:hover .icon {
  background: var(--kskin-white) !important;
  color: var(--kskin-accent-hover) !important;
}

/* Instagram: el overlay original todavía usa rosa hardcodeado */
.instagram2 .instagram2-thumb::before {
  background: rgba(211, 59, 52, 0.48) !important;
}

.instagram2 .instagram2-thumb .icon,
.instagram2 .instagram2-thumb:hover .icon {
  color: var(--kskin-white) !important;
}

/* ============================================================
   14. HEADER + FOOTER — NORMALIZACIÓN KSKINBE
   Corrige los últimos colores rosados hardcodeados del template
   y mejora el contraste de los textos del footer.
   ============================================================ */

/* ------------------------------------------------------------
   HEADER
   ------------------------------------------------------------ */

.header-area.header-layoutone,
.header-area.header-layoutone.header-sticky,
.header-area.header-layoutone.sticky,
.sticky {
  background: var(--kskin-card) !important;
}

.header-area.header-layoutone .main-menu>ul>li>a {
  color: var(--kskin-text-primary) !important;
}

.header-area.header-layoutone .main-menu>ul>li:hover>a,
.header-area.header-layoutone .main-menu>ul>li>a:hover,
.header-area.header-layoutone .main-menu>ul>li.active>a,
.header-area.header-layoutone .main-menu>ul>li.current-menu-item>a,
.header-area.header-layoutone .main-menu>ul>li.current-menu-parent>a,
.header-area.header-layoutone .main-menu>ul>li.current-menu-ancestor>a {
  color: var(--kskin-accent) !important;
}

.header-area.header-layoutone .main-menu>ul>li>a::after,
.header-area.header-layoutone .main-menu>ul>li>a i {
  color: currentColor !important;
}

.header-area.header-layoutone .main-menu>ul>li .dp-menu {
  background: var(--kskin-card) !important;
  border: 1px solid var(--kskin-border-soft) !important;
  box-shadow: var(--kskin-shadow-md) !important;
}

.header-area.header-layoutone .main-menu>ul>li .dp-menu li a {
  color: var(--kskin-text-primary) !important;
}

.header-area.header-layoutone .main-menu>ul>li .dp-menu li a:hover {
  color: var(--kskin-accent) !important;
  background: var(--kskin-bg-soft) !important;
}

.header-area.header-layoutone .action-btn,
.header-area.header-layoutone .action-btn i,
.header-area.header-layoutone .search-open-btn,
.header-area.header-layoutone .search-open-btn i {
  color: var(--kskin-text-primary) !important;
}

.header-area.header-layoutone .search-open-btn svg path {
  fill: var(--kskin-text-primary) !important;
}

.header-area.header-layoutone .action-btn:hover,
.header-area.header-layoutone .action-btn:hover i,
.header-area.header-layoutone .search-open-btn:hover,
.header-area.header-layoutone .search-open-btn:hover i {
  color: var(--kskin-accent) !important;
}

.header-area.header-layoutone .search-open-btn:hover svg path {
  fill: var(--kskin-accent) !important;
}

.header-area.header-layoutone .badge.bg-danger {
  background-color: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.header-area.header-layoutone .bar-icon span,
.header-area.header-layoutone .side-toggle .bar-icon span {
  background: var(--kskin-text-primary) !important;
}

.header-area.header-layoutone .bar-icon:hover span,
.header-area.header-layoutone .side-toggle:hover .bar-icon span {
  background: var(--kskin-accent) !important;
}

/* ------------------------------------------------------------
   MENÚ MÓVIL / OFFCANVAS
   ------------------------------------------------------------ */

.mobile-menu::-webkit-scrollbar-thumb,
.mobile-menu.mean-container .mean-bar::-webkit-scrollbar-thumb {
  background: var(--kskin-accent) !important;
}

.mobile-menu::-webkit-scrollbar-thumb:hover,
.mobile-menu.mean-container .mean-bar::-webkit-scrollbar-thumb:hover {
  background: var(--kskin-accent-hover) !important;
}

.mobile-menu.mean-container .mean-nav ul li a:hover,
.side-info .mobile-menu .mobile-nav .menu-item-has-children .dp-menu li a:hover,
.side-info .mobile-menu .mobile-nav .menu-item-has-children ul li a:hover {
  color: var(--kskin-accent) !important;
  border-left-color: var(--kskin-accent) !important;
}

.mobile-menu.mean-container .mean-nav ul li a.mean-expand,
.mobile-menu.mean-container .mean-nav ul li a.mean-expand:hover,
.mobile-menu.mean-container .mean-nav ul li a.mean-expand.mean-clicked {
  background: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.offset-social a:hover,
.offset-widget-box .contact-item span a:hover {
  color: var(--kskin-accent) !important;
}

.offset-widget-box .contact-item .icon {
  background: var(--kskin-accent) !important;
}

/* ------------------------------------------------------------
   BOTÓN VOLVER ARRIBA
   ------------------------------------------------------------ */

.progress-wrap,
.progress-wrap.active-progress,
.progress-wrap::after {
  background-color: var(--kskin-accent) !important;
}

.progress-wrap::after {
  color: var(--kskin-white) !important;
}

.progress-wrap:hover,
.progress-wrap.active-progress:hover,
.progress-wrap:hover::after {
  background-color: var(--kskin-accent-hover) !important;
}

.progress-wrap svg path,
.progress-wrap svg.progress-circle path {
  fill: var(--kskin-accent) !important;
  stroke: transparent !important;
}

/* ------------------------------------------------------------
   FOOTER
   ------------------------------------------------------------ */

.footer2 {
  color: var(--kskin-white);
}

.footer2 .footer2-widget__title,
.footer2 .footer2-widget__social-title,
.footer2 .footer2-widget__contact-post-title {
  color: var(--kskin-white) !important;
}

.footer2 .footer2-widget__contact-post-title svg path {
  fill: var(--kskin-accent) !important;
}

.footer2 .footer2-widget__contact-post-link,
.footer2 .footer2-widget__contact-post-link:visited {
  color: #D6CECA !important;
}

.footer2 .footer2-widget__contact-post-link:hover,
.footer2 .footer2-widget__contact-post-link:focus {
  color: var(--kskin-accent) !important;
}

.footer2 .footer2-widget-button-items-btn-wrapper .btn-button2 {
  color: var(--kskin-white) !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
  background: transparent !important;
}

.footer2 .footer2-widget-button-items-btn-wrapper .btn-button2 .text {
  color: var(--kskin-white) !important;
}

.footer2 .footer2-widget-button-items-btn-wrapper .btn-button2 .icon {
  background: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.footer2 .footer2-widget-button-items-btn-wrapper .btn-button2:hover {
  background: var(--kskin-white) !important;
  border-color: var(--kskin-white) !important;
}

.footer2 .footer2-widget-button-items-btn-wrapper .btn-button2:hover .text {
  color: var(--kskin-accent) !important;
}

.footer2 .footer2-widget-button-items-btn-wrapper .btn-button2:hover .icon {
  background: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.footer2 .footer2-widget__social-link span {
  background: rgba(255, 255, 255, 0.12) !important;
  color: var(--kskin-white) !important;
}

.footer2 .footer2-widget__social-link span:hover {
  background: var(--kskin-accent) !important;
  color: var(--kskin-white) !important;
}

.footer2 .footer2-bottom__copyright,
.footer2 .footer2-bottom__copyright a {
  color: #D6CECA !important;
}

.footer2 .footer2-bottom__copyright a:hover {
  color: var(--kskin-accent) !important;
}

.footer2 .footer2-bottom__navs a,
.footer2 .footer2-bottom__navs a:visited {
  color: #D6CECA !important;
}

.footer2 .footer2-bottom__navs a:hover,
.footer2 .footer2-bottom__navs a:focus {
  color: var(--kskin-accent) !important;
}

/* ============================================================
   16. TYPOGRAPHY GUARD — FINAL
   Fuerza la familia correcta por encima del template original.
   ============================================================ */

.intro2__content-title,
.section-heading__title,
.category2-item__content-title,
.featured-product-card__content-title,
.featured-product-card__content-title a,
.benefit-card__items-title,
.beauty-feature-item__card1-title,
.beauty-feature-item__card2-title,
.beauty-feature-item__card3-title,
.beauty-feature-item2__card1-title,
.beauty-feature-item2__card2-title,
.beauty-feature-item2__card3-title,
.offertwo-card__content-title,
.offertwo-card__content-title a,
.testimonial2-card__content-title,
.intro2__rating-score,
.footer2-widget__title,
.footer2-widget__social-title,
.footer2-widget__contact-post-title,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Lato", Arial, sans-serif !important;
}

.intro2__content-desc,
.intro2__rating-text,
.featured-product-card__content-list-point,
.featured-product-card__content-list-text,
.featured-product-card__content-dollar,
.benefit-card__content-subtitle,
.beauty-feature-item__card1-dsc,
.beauty-feature-item__card2-dsc,
.beauty-feature-item__card3-dsc,
.beauty-feature-item2__card1-dsc,
.beauty-feature-item2__card2-dsc,
.beauty-feature-item2__card3-dsc,
.offertwo-card__content-list-point,
.offertwo-card__content-list-text,
.offertwo-card__content-items-price,
.testimonial2-card__content-suntitle,
.footer2-widget__contact-post-link,
.footer2-bottom__copyright,
.footer2-bottom__navs a,
p,
body {
  font-family: "Roboto", Arial, sans-serif !important;
}


/* =========================================
   PRUEBA DEFINITIVA DE FUENTES
   ========================================= */

h1,
h2,
h3,
h4,
h5,
h6,
.intro2__content-title,
.intro2__content-subtext,
.section-heading__title,
.section-heading__subtitle {
  font-family: "Lato", Arial, sans-serif !important;
}

body,
p,
.intro2__content-desc {
  font-family: "Roboto", Arial, sans-serif !important;
}