/**
 * Theme Name:     Divi 5 Child
 * Author:         Nicolas Magunacelaya
 * Template:       Divi
 * Text Domain:	   divi-5-child
 * Description:    Divi 5 child theme
 * Version:        1.0
 */
/*
 * AGREGAR AL FINAL del style.css del child theme
 * (después del header /* Theme Name: ... que ya está)
 */

:root {
  --dn-green-900: #1F2A24;
  --dn-green-700: #2E4632;
  --dn-green-600: #3B5B3E;
  --dn-green-400: #74A47A;
  --dn-green-100: #E4EFE2;

  --dn-beige-50:  #FBF8F2;
  --dn-beige-100: #F5EFE6;
  --dn-beige-200: #ECE3D2;

  --dn-orange-600: #E56001;
  --dn-orange-500: #F2792A;
  --dn-orange-100: #FCE4D1;

  --dn-text-900: #1F2A24;
  --dn-text-700: #3B4640;
  --dn-text-500: #6B7771;
  --dn-text-300: #A3ACA7;

  --dn-white:   #FFFFFF;
  --dn-bg-soft: #FBF8F2;

  --dn-font-heading:   "DM Sans", system-ui, sans-serif;
  --dn-font-body:      "Inter", system-ui, sans-serif;
  --dn-font-editorial: "Instrument Serif", Georgia, serif;

  --dn-text-xs:   0.75rem;
  --dn-text-sm:   0.875rem;
  --dn-text-base: 1rem;
  --dn-text-lg:   1.125rem;
  --dn-text-xl:   1.25rem;
  --dn-text-2xl:  1.5rem;
  --dn-text-3xl:  1.875rem;
  --dn-text-4xl:  2.25rem;
  --dn-text-5xl:  3rem;
  --dn-text-6xl:  3.75rem;

  --dn-space-1:  0.25rem;
  --dn-space-2:  0.5rem;
  --dn-space-3:  0.75rem;
  --dn-space-4:  1rem;
  --dn-space-6:  1.5rem;
  --dn-space-8:  2rem;
  --dn-space-10: 2.5rem;
  --dn-space-12: 3rem;
  --dn-space-16: 4rem;
  --dn-space-24: 6rem;

  --dn-radius-sm:   8px;
  --dn-radius-md:   12px;
  --dn-radius-lg:   16px;
  --dn-radius-xl:   24px;
  --dn-radius-pill: 999px;

  --dn-shadow-sm: 0 1px 2px rgba(31, 42, 36, 0.05);
  --dn-shadow-md: 0 4px 12px rgba(31, 42, 36, 0.08);
  --dn-shadow-lg: 0 12px 32px rgba(31, 42, 36, 0.10);

  --dn-container-xl: 1240px;
}

/* Contenedor global */
.dn-container {
  width: 100%;
  max-width: var(--dn-container-xl);
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

@media (max-width: 639px) {
  .dn-container {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

/* Botones base */
.dn-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-family: var(--dn-font-body);
  font-weight: 600;
  font-size: 1rem;
  border-radius: var(--dn-radius-md);
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  border: none;
  line-height: 1;
}
.dn-btn--primary  { background: var(--dn-green-600); color: #fff; padding: 14px 28px; }
.dn-btn--primary:hover  { background: var(--dn-green-700); color: #fff; }
.dn-btn--secondary { background: transparent; color: var(--dn-green-600); border: 1.5px solid var(--dn-green-600); padding: 13px 27px; }
.dn-btn--secondary:hover { background: var(--dn-green-100); color: var(--dn-green-700); }
.dn-btn--text { background: transparent; color: var(--dn-green-600); padding: 0; font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
.dn-btn--text:hover { color: var(--dn-green-700); }

/* Badges */
.dn-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--dn-radius-pill); font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; line-height: 1; }
.dn-badge--nuevo   { background: var(--dn-orange-100); color: var(--dn-orange-600); }
.dn-badge--elegido { background: var(--dn-green-100);  color: var(--dn-green-700); }
.dn-badge--hotsale { background: #FFE4D6; color: #B83A00; }
.dn-badge--promo   { background: var(--dn-beige-200);  color: var(--dn-green-700); }

/* Eyebrow */
.dn-eyebrow { display: inline-block; font-family: var(--dn-font-body); font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--dn-orange-600); margin-bottom: 0.75rem; }