/* ==========================================================================
   PORTADAS NUEVAS · lo común a las tres
   Usan los colores y letras del estilo elegido (Ilustrado), que la tienda ya trae.
   ========================================================================== */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@1,500;1,600;1,700&display=swap");

.amap {
  --amap-crema: var(--color-bg, #fffaf7);
  --amap-rosa: #f3c3cf;
  --amap-rosa-fuerte: var(--color-brand, #b42e58);
  --amap-hoja: #5b6b2f;
  --amap-tinta: var(--tinta, #1f1a1c);
  --amap-suave: var(--color-text-light, #6d6366);
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--amap-crema);
  color: var(--amap-tinta);
  min-height: clamp(560px, calc(100svh - 120px), 880px);
}
html.dark .amap {
  --amap-rosa: #6b3242;
  --amap-hoja: #b9c98c;
}

.amap .logo-noche { display: none; }
html.dark .amap .logo-dia { display: none; }
html.dark .amap .logo-noche { display: block; }

.amap-eslogan {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-style: italic;
  font-weight: 600;
  font-size: clamp(1.35rem, 1.1rem + 1vw, 1.9rem);
  line-height: 1.2;
  color: var(--amap-rosa-fuerte);
  margin: 0;
  text-wrap: balance;
}

.amap-acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.4rem; }
.amap .amap-cta { min-height: 48px; display: inline-flex; align-items: center; padding-inline: 1.6rem; }
.amap-sec {
  font-family: var(--font-body, system-ui, sans-serif);
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--amap-tinta);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-block: 0.15rem;
  transition: color 0.2s ease;
}
.amap-sec:hover { color: var(--amap-rosa-fuerte); }

.amap-cifras {
  display: flex; flex-wrap: wrap; gap: 0.35rem 0.6rem;
  margin: 0;
  font-family: var(--font-body, system-ui, sans-serif);
  font-size: 0.86rem;
  color: var(--amap-suave);
}
.amap-cifras strong { color: var(--amap-tinta); font-weight: 600; }

/* foco visible con teclado en todo lo que se toca */
.amap a:focus-visible, .amap button:focus-visible {
  outline: 2px solid var(--amap-rosa-fuerte);
  outline-offset: 3px;
  border-radius: 6px;
}

/* foto de producto con fondo blanco: sobre el crema, el blanco desaparece */
.amap-funde { mix-blend-mode: multiply; }
html.dark .amap-funde { mix-blend-mode: normal; }

@media (prefers-reduced-motion: reduce) {
  .amap *, .amap *::before, .amap *::after { animation: none !important; transition: none !important; }
}