.elementor-30690 .elementor-element.elementor-element-7f72b98:not(.elementor-motion-effects-element-type-background), .elementor-30690 .elementor-element.elementor-element-7f72b98 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#BFB8B8;}.elementor-30690 .elementor-element.elementor-element-7f72b98{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-30690 .elementor-element.elementor-element-7f72b98 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-30690 .elementor-element.elementor-element-994c076:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-30690 .elementor-element.elementor-element-994c076 > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-30690 .elementor-element.elementor-element-994c076 > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-30690 .elementor-element.elementor-element-994c076 > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-30690 .elementor-element.elementor-element-99cbc4a:not(.elementor-motion-effects-element-type-background), .elementor-30690 .elementor-element.elementor-element-99cbc4a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#BFB8B8;}.elementor-30690 .elementor-element.elementor-element-99cbc4a{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-30690 .elementor-element.elementor-element-99cbc4a > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-30690 .elementor-element.elementor-element-b1d9713:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-30690 .elementor-element.elementor-element-b1d9713 > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-30690 .elementor-element.elementor-element-b1d9713 > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-30690 .elementor-element.elementor-element-b1d9713 > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-30690 .elementor-element.elementor-element-a1dec29:not(.elementor-motion-effects-element-type-background), .elementor-30690 .elementor-element.elementor-element-a1dec29 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#BFB8B8;}.elementor-30690 .elementor-element.elementor-element-a1dec29{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-30690 .elementor-element.elementor-element-a1dec29 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-30690 .elementor-element.elementor-element-d75f526:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-30690 .elementor-element.elementor-element-d75f526 > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-30690 .elementor-element.elementor-element-d75f526 > .elementor-element-populated{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-30690 .elementor-element.elementor-element-d75f526 > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}/* Start custom CSS for html, class: .elementor-element-c90fd25 *//* ======= Imagen centrada y proporcionada en el bloque Hero ======= */
.hero {
  text-align: center;
  padding: 40px 20px 20px;
}

.hero-content {
  max-width: 1200px;          /* mantiene el mismo ancho que el texto */
  margin: 0 auto;
}

.hero-figure {
  display: block;
  margin: 0 auto;  /* centra horizontalmente */
  max-width: 0 auto;          /* 🔹 limita el ancho visual de la imagen */
  width: 100%;
}

.hero-figure img {
   display: block;
   width: 400px;
   margin: 0 auto;
  height: auto;
  border-radius: 14px;
  object-fit: contain;        /* evita que se recorte */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-2ddea1d *//* ======= Imagen centrada y proporcionada en el bloque Hero ======= */
.product-media {
  text-align: center;
  padding: 40px 20px 20px;
}

.product-media {
  max-width: 1200px;          /* mantiene el mismo ancho que el texto */
  margin: 0 auto;
}

.product-media {
  display: block;
  margin: 0 auto;  /* centra horizontalmente */
  max-width: 0 auto;          /* 🔹 limita el ancho visual de la imagen */
  width: 100%;
}

.product-media img {
   display: block;
   width: 400px;
   margin: 0 auto;
  height: auto;
  border-radius: 14px;
  object-fit: contain;        /* evita que se recorte */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-55e0773 *//* ======= Imagen centrada y proporcionada en el bloque Hero ======= */
.product-media {
  text-align: center;
  padding: 40px 20px 20px;
}

.product-media {
  max-width: 1200px;          /* mantiene el mismo ancho que el texto */
  margin: 0 auto;
}

.product-media {
  display: block;
  margin: 0 auto;  /* centra horizontalmente */
  max-width: 0 auto;          /* 🔹 limita el ancho visual de la imagen */
  width: 100%;
}

.product-media img {
   display: block;
   width: 400px;
   margin: 0 auto;
  height: auto;
  border-radius: 14px;
  object-fit: contain;        /* evita que se recorte */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-af166d1 *//* ======= Imagen centrada y proporcionada en el bloque Hero ======= */
.product-media {
  text-align: center;
  padding: 40px 20px 20px;
}

.product-media {
  max-width: 1200px;          /* mantiene el mismo ancho que el texto */
  margin: 0 auto;
}

.product-media {
  display: block;
  margin: 0 auto;  /* centra horizontalmente */
  max-width: 0 auto;          /* 🔹 limita el ancho visual de la imagen */
  width: 100%;
}

.product-media img {
   display: block;
   width: 400px;
   margin: 0 auto;
  height: auto;
  border-radius: 14px;
  object-fit: contain;        /* evita que se recorte */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-59d8ae6 *//* ======= Imagen centrada y proporcionada en el bloque Hero ======= */
.product-media {
  text-align: center;
  padding: 40px 20px 20px;
}

.product-media {
  max-width: 1200px;          /* mantiene el mismo ancho que el texto */
  margin: 0 auto;
}

.product-media {
  display: block;
  margin: 0 auto;  /* centra horizontalmente */
  max-width: 0 auto;          /* 🔹 limita el ancho visual de la imagen */
  width: 100%;
}

.product-media img {
   display: block;
   width: 400px;
   margin: 0 auto;
  height: auto;
  border-radius: 14px;
  object-fit: contain;        /* evita que se recorte */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}/* End custom CSS */
/* Start custom CSS *//* Tipografía base */
body { font-family: 'Lora', serif; color: #3b2f2f; background:#fffaf5; }

/* Estructuras generales */
section { padding: 20px 10px; text-align: center; }
.section-head h2 { font-size: 2rem; margin: 0 0 10px; }
.section-head p { color:#5a4a42; }

/* Botones */
.btn {
  display: inline-block;
  background: #a98778;
  color: #fff;
  text-decoration: none;
  padding: 12px 28px;
  border-radius: 30px;
  font-weight: 500;
  transition: .25s ease;
}

.btn:hover {
  background: #8c7263;       /* más oscuro al pasar el ratón */
  color: #fff;               /* texto blanco siempre */
}

/* Variante clara */
.btn-light {
  background: #f8f5f2;       /* tono crema */
  color: #a98778;            /* texto marrón suave */
  border: 1px solid #a98778;
}

.btn-light:hover {
  background: #a98778;       /* se invierte */
  color: #fff;               /* texto blanco al hacer hover */
  border-color: #a98778;
}


/* Bloque 1: Hero */
.hero { background: linear-gradient(to bottom, #f7f5f2, #ffffff); padding: 30px 30px 0px; }
.hero h1 { font-size: 2.4rem; font-weight:600; margin-bottom: 16px; }
.hero p { font-size:1.08rem; color:#5a4a42; max-width: 720px; margin: 0 auto 26px; }

/* Bloque 2: Categorías */
.categories {
  display: grid;
  gap: 28px;
  grid-template-columns: repeat(3, 1fr); /* ✅ Dos columnas fijas */
  max-width: 1100px; /* Ajuste óptico para mantenerlas centradas */
  margin: 0 auto;
}

@media (max-width: 768px) {
  .categories {
    grid-template-columns: 1fr; /* ✅ Una sola columna en móvil */
    max-width: 100%;
  }
}

.cat-card {
  background: #f8f5f2;
  border-radius: 18px;
  padding: 2px;
  box-shadow: 0 2px 2px rgba(0, 0, 0, .05);
}

.cat-card img {
  width: 100%;
  aspect-ratio: 4 / 3;
  height: 200px;          /* añadido para controlar el alto */
  object-fit: cover;
  border-radius: 14px;
  margin-bottom: 14px;
}

.cat-card h3 {
  margin: 10px 0;
  font-size: 1.15rem;     /* ligeramente más pequeño */
}

.cat-card p {
  color: #5a4a42;
  font-size: .95rem;
  margin-bottom: 18px;
}

/* Bloque 3: Destacados (idéntico a Bloque 2) */
.highlights {
  background: #fff;
}

.highlight-grid {
  display: grid;
  gap: 28px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  max-width: 1100px;
  margin: 30px auto 0;
}

.highlight {
  background: #f8f5f2;
  border-radius: 18px;
  box-shadow: 0 2px 2px rgba(0, 0, 0, .05);
  padding: 2px;
  overflow: hidden;
}

.highlight img {
  width: 100%;
  height: 200px;          /* igual que en .cat-card */
  object-fit: cover;
  border-radius: 14px;
  margin-bottom: 14px;
}

.highlight h4 {
  margin: 10px 0;
  font-size: 1.15rem;
  padding: 0 16px;
}

.highlight p {
  color: #5a4a42;
  font-size: .95rem;
  margin-bottom: 18px;
  padding: 0 16px;
}

/* Responsive ajuste móvil */
@media (max-width: 768px) {
  .categories, .highlight-grid {
    max-width: 95%;
    gap: 20px;
  }

  .cat-card img,
  .highlight img {
    height: 160px;
  }
}


/* Bloque 4: Productos (AAWP o grid manual) */
.products-grid {
  display: grid;
  gap: 28px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  max-width: 1100px;
  margin: 30px auto 0;
}

.product-card {
  background: #f8f5f2;
  border-radius: 18px;
  box-shadow: 0 2px 2px rgba(0, 0, 0, .05);
  padding: 2px;
  overflow: hidden;
}

.product-card img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-radius: 14px;
  margin-bottom: 14px;
}

.product-card h4 {
  margin: 10px 0;
  font-size: 1.15rem;
  padding: 0 16px;
}

.product-card p {
  color: #5a4a42;
  font-size: .95rem;
  margin-bottom: 18px;
  padding: 0 16px;
}

/* Responsive */
@media (max-width: 1024px){
  .categories, .highlight-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px){
  .hero h1 { font-size: 1.9rem; }
  .categories, .highlight-grid { grid-template-columns: 1fr; }
  section { padding: 60px 18px; }
}

/* Bloque: blog-home */
.blog-home img { width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
.blog-home h3 { margin:10px 0; font-size:1.2rem; }
.blog-home p { color:#5a4a42; font-size:.98rem; margin-bottom:20px; }

/* Responsive */
@media (max-width: 900px){
  .footer-grid{ grid-template-columns: 1fr; }
  .footer-social{ margin-top:10px; }
}
/* Picks / Recomendado */
.picks { background:#fff; padding:20px 20px; text-align:center; }
.picks .section-head h2 { font-size:2rem; margin:0 0 12px; }
.picks .section-head p { color:#5a4a42; }
.picks-grid{
  max-width:900px; margin:28px auto 10px;
  display:grid; gap:28px; grid-template-columns: repeat(2, minmax(0, 1fr));
}
.picks-note { margin-top:10px; color:#5a4a42; }
@media (max-width:700px){ .picks-grid{ grid-template-columns:1fr; } }
/* Marco uniforme para imágenes de tarjetas (4:3) */
.img-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 3;      /* todas iguales: 4:3 */
  overflow: hidden;
  border-radius: 14px;
  background: #eee;         /* color de fondo si tarda en cargar */
}
.img-frame img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;        /* recorta sin deformar */
  object-position: center;  /* centra el recorte */
}

/* Espaciado consistente en las tarjetas de categorías */
.cat-card h3 { margin: 12px 0 6px; }
.cat-card p  { margin: 0 0 16px; }
/* ===== BLOG en home ===== */
.blog-home { background:#fff; padding:70px 20px; text-align:center; }
.blog-home .section-head h2 { font-size:2rem; margin:0 0 8px; }
.blog-home .section-head p { color:#5a4a42; }

.post-grid{
  max-width:1100px; margin:28px auto 10px;
  display:grid; gap:28px; grid-template-columns: repeat(3, minmax(0, 1fr));
}
.post-card{
  text-align:left; background:#fff; border:1px solid #eadfd6; border-radius:14px;
  padding:14px; box-shadow:0 2px 8px rgba(0,0,0,.04); position:relative;
}
.post-card a{ color:inherit; text-decoration:none; display:block; }
.post-card h3{ font-size:1.06rem; margin:10px 6px 6px; line-height:1.35; }
.post-card p{ color:#5a4a42; font-size:.95rem; margin:0 6px 8px; }
.post-card .meta{ display:block; color:#8a7a70; font-size:.86rem; margin:0 6px 6px; }

/* pills de categoría */
.pill{
  position:absolute; top:10px; left:10px;
  background:#ffffff; color:#3b2f2f; border:1px solid #eadfd6;
  padding:5px 10px; border-radius:999px; font-size:.8rem; font-weight:600;
}
.pill-rituales{ border-color:#e7d7c9; }
.pill-aroma{ border-color:#d8e6e1; }
.pill-guias{ border-color:#e5d8ea; }

.blog-cta{ margin-top:16px; }

/* responsive */
@media (max-width: 1024px){
  .post-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px){
  .post-grid{ grid-template-columns: 1fr; }
}/* End custom CSS */