/* =====================================================
   FUENTES
===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Inter:wght@400;500;600&display=swap');

/* =====================================================
   BASE GENERAL
===================================================== */
body {
  font-family: 'Inter', sans-serif;
  color: #2b2b2b;
  background-color: #faf7f9;
  line-height: 1.6;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  letter-spacing: -0.3px;
}

/* =====================================================
   HEADER COMPACTO (SIN COMPRESIÓN)
===================================================== */
header {
  background: linear-gradient(135deg, #d9a6cc, #c78bbd);
  box-shadow: 0 4px 20px rgba(0,0,0,0.12);
  padding: 0 !important;
  min-height: 52px !important;
  display: flex;
  align-items: center;
}

header .container,
header .header-inner,
header .row,
header nav {
  padding: 0 !important;
  min-height: 52px !important;
  display: flex;
  align-items: center;
}

/* Logo */
header img {
  max-height: 36px !important;
  border-radius: 8px;
  margin: 0;
}

/* Menú */
header nav a {
  font-weight: 500;
  font-size: 14px;
  color: #ffffff !important;
  padding: 5px 12px !important;
  border-radius: 16px;
  line-height: 1.2;
  transition: all 0.3s ease;
}

header nav a:hover {
  background: rgba(255,255,255,0.25);
}

header nav a.active {
  background: rgba(255,255,255,0.35);
  font-weight: 600;
}

/* Íconos */
header svg,
header i {
  color: #ffffff !important;
  font-size: 16px;
  margin: 0 6px;
}

/* =====================================================
   CATÁLOGO – TARJETAS
===================================================== */
.catalogo,
.products,
.product-list {
  background-color: #faf7f9;
  padding: 40px 0;
}

/* Imagen de producto */
img[src*="products"] {
  border-radius: 18px;
  box-shadow: 0 16px 40px rgba(0,0,0,0.15);
  transition: transform 0.4s ease;
}

img[src*="products"]:hover {
  transform: scale(1.06);
}

/* Contenedor botones */
.product-btn {
  margin-top: 16px;
  gap: 10px;
}

/* Precio */
.product-price,
.price,
.text-price {
  font-size: 18px;
  font-weight: 700;
  color: #9b3f8f;
  font-family: 'Poppins', sans-serif;
}

/* =====================================================
   BOTONES
===================================================== */
.btn-primary.addcart {
  background: linear-gradient(135deg, #9b3f8f, #b85fae);
  border: none;
  border-radius: 999px !important;
  font-weight: 600;
  letter-spacing: 0.5px;
  padding: 12px 18px;
  box-shadow: 0 10px 25px rgba(155, 63, 143, 0.35);
  transition: all 0.3s ease;
}

.btn-primary.addcart:hover {
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 16px 35px rgba(155, 63, 143, 0.45);
}

.btn-outline-primary {
  border-radius: 999px !important;
  border: 2px solid #9b3f8f;
  color: #9b3f8f;
  padding: 10px 18px;
  transition: all 0.3s ease;
}

.btn-outline-primary:hover {
  background: #9b3f8f;
  color: #fff;
}

/* Favoritos */
.btn-favourite button {
  border-radius: 50% !important;
  height: 48px;
  width: 48px;
  transition: all 0.3s ease;
}

.btn-favourite button:hover {
  background: #fff0f7;
  transform: scale(1.1);
}

/* =====================================================
   HOME
===================================================== */
section {
  padding: 80px 0;
}

.section-purple,
.bg-primary {
  background: linear-gradient(135deg, #9b3f8f, #b45aa6);
}

section h2 {
  font-size: 36px;
  margin-bottom: 24px;
}

section h2::after {
  content: "";
  display: block;
  width: 60px;
  height: 4px;
  background: #9b3f8f;
  margin-top: 12px;
  border-radius: 2px;
}

section p {
  font-size: 16px;
  color: #444;
  max-width: 640px;
  line-height: 1.7;
}

/* Imágenes home */
section img {
  border-radius: 18px;
  box-shadow: 0 16px 40px rgba(0,0,0,0.15);
}

/* Cards servicios */
.service-box,
.service-item,
.card {
  background: #ffffff;
  border-radius: 20px;
  padding: 30px;
  box-shadow: 0 18px 45px rgba(0,0,0,0.1);
  transition: all 0.3s ease;
}

.service-box:hover,
.service-item:hover,
.card:hover {
  transform: translateY(-6px);
}

/* =====================================================
   FOOTER
===================================================== */
footer {
  background: linear-gradient(135deg, #6e2964, #4f1d48);
  padding: 60px 20px;
  color: #ffffff;
}

footer a {
  color: #f1d7eb;
}

/* =====================================================
   MOBILE
===================================================== */
@media (max-width: 768px) {

  header {
    min-height: 46px !important;
  }

  header img {
    max-height: 30px !important;
  }

  header nav a {
    font-size: 13px;
    padding: 4px 10px !important;
  }

  section {
    padding: 60px 20px;
  }

  .product-price {
    font-size: 16px;
  }
}