/* VALGO — Montserrat v1.2 · Reducción fuerte de títulos
 * Objetivo: conservar Montserrat Light 300, pero devolver protagonismo
 * a imágenes, productos, botones y contenido comercial.
 * El logotipo SVG de VALGO no se modifica.
 */

:root {
  --valgo-font-display: "Montserrat", Arial, sans-serif;
  --valgo-font-body: "Montserrat", Arial, sans-serif;

  /* Escala más contenida que v1.1 */
  --valgo-hero-size: clamp(2.7rem, 4.15vw, 4.1rem);
  --valgo-section-size: clamp(2rem, 3.05vw, 3.05rem);
  --valgo-feature-size: clamp(2.1rem, 3.15vw, 3.3rem);
  --valgo-dialog-size: clamp(1.8rem, 3vw, 2.65rem);

  /* Tracking más fino para evitar sensación expansiva */
  --valgo-hero-tracking: 0.035em;
  --valgo-section-tracking: 0.035em;
  --valgo-title-tracking: 0.045em;
  --valgo-ui-tracking: 0.045em;
}

html,
body,
button,
input,
select,
textarea {
  font-family: var(--valgo-font-body) !important;
}

body {
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* La marca permanece como archivo gráfico: no se altera su geometría. */
.brand img,
.footer-logo {
  font-family: initial !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.hero-copy h1,
.section-heading h2,
.centered-heading h2,
.catalog-heading h2,
.checkout-dialog h2,
.help-dialog h2,
.legal-dialog__header h2,
.consumer-request-dialog h2,
.legal-dialog__content h1,
.legal-dialog__content h2,
.checkout-step-card__heading,
.shipping-selector__heading {
  font-family: var(--valgo-font-display) !important;
  font-weight: 300 !important;
  letter-spacing: var(--valgo-title-tracking);
}

/* Hero principal: elegante, pero claramente menos invasivo. */
.hero-copy h1 {
  font-size: var(--valgo-hero-size) !important;
  line-height: 1 !important;
  letter-spacing: var(--valgo-hero-tracking) !important;
  max-width: 14.5ch;
  text-wrap: balance;
}

/* Títulos de sección: acompañan a las imágenes en lugar de competir con ellas. */
.section-heading h2,
.centered-heading h2,
.catalog-heading h2 {
  font-size: var(--valgo-section-size) !important;
  line-height: 1.04 !important;
  letter-spacing: var(--valgo-section-tracking) !important;
  max-width: 24ch;
  text-wrap: balance;
}

/* Bloques editoriales y campañas: reducción moderada para conservar impacto. */
.campaign-section h2,
.split-section h2,
.family-section h2,
.social-section h2,
.about h2,
.offers-section h2 {
  font-size: var(--valgo-feature-size) !important;
  line-height: 1.05 !important;
  letter-spacing: 0.04em !important;
  max-width: 19ch;
  text-wrap: balance;
}

.hero-copy h1,
.section-heading h2,
.centered-heading h2,
.catalog-heading h2,
.campaign-section h2,
.family-section h2,
.offers-section h2,
.split-section h2,
.checkout-dialog h2,
.help-dialog h2,
.legal-dialog__header h2,
.consumer-request-dialog h2 {
  text-transform: uppercase;
}

/* Los diálogos conservan su escala funcional. */
.checkout-dialog h2,
.help-dialog h2,
.legal-dialog__header h2,
.consumer-request-dialog h2,
.checkout-success h2,
.cart-header h2 {
  font-size: var(--valgo-dialog-size) !important;
  line-height: 1.08 !important;
  letter-spacing: 0.045em !important;
  text-wrap: balance;
}

p,
li,
small,
.demo-notice,
.checkout-field-help,
.checkout-disclaimer,
.legal-dialog__content p,
.legal-dialog__content li,
.consumer-status-card {
  font-family: var(--valgo-font-body) !important;
  font-weight: 400;
  letter-spacing: 0.005em;
}

nav a,
.header-actions button,
.menu-button,
.button,
button,
.text-button,
.text-link,
.legal-link-button,
.legal-print-button,
.filters button,
.consumer-tabs button,
.legal-dialog__nav button,
.category-card strong,
.eyebrow,
label,
th,
.checkout-step-number,
.payment-option-card,
.shipping-payment-option {
  font-family: var(--valgo-font-body) !important;
  font-weight: 500;
  letter-spacing: var(--valgo-ui-tracking);
}

nav a,
.button,
.header-actions button,
.filters button,
.category-card strong,
.eyebrow,
.legal-print-button {
  text-transform: uppercase;
}

/* Los pequeños encabezados se mantienen discretos y consistentes. */
.eyebrow {
  font-size: clamp(0.68rem, 0.9vw, 0.78rem) !important;
  line-height: 1.25;
  letter-spacing: 0.075em !important;
}

input,
select,
textarea {
  font-weight: 400;
  letter-spacing: 0.01em;
}

input::placeholder,
textarea::placeholder {
  font-family: var(--valgo-font-body);
  font-weight: 400;
  letter-spacing: 0.01em;
}

strong,
b,
.cart-total,
.checkout-summary strong,
.checkout-summary--final strong,
.consumer-result strong {
  font-family: var(--valgo-font-body) !important;
  font-weight: 600;
}

.category-card strong,
.product-grid h3,
.product-grid h4,
.cart-items strong,
.checkout-summary strong {
  letter-spacing: 0.03em;
}

.legal-dialog__header h2,
.consumer-request-dialog h2,
.legal-dialog__content h1,
.legal-dialog__content h2 {
  font-family: var(--valgo-font-display) !important;
}

/* Tablet: evita títulos dominantes y saltos excesivos. */
@media (max-width: 980px) {
  :root {
    --valgo-hero-size: clamp(2.55rem, 6vw, 3.75rem);
    --valgo-section-size: clamp(1.95rem, 4.8vw, 2.85rem);
    --valgo-feature-size: clamp(2rem, 5vw, 3rem);
  }

  .hero-copy h1 {
    max-width: 15.5ch;
  }

  .section-heading h2,
  .centered-heading h2,
  .catalog-heading h2 {
    max-width: 22ch;
  }
}

/* Móvil: escala compacta, legible y sin sensación de cartel. */
@media (max-width: 760px) {
  :root {
    --valgo-hero-size: clamp(2.15rem, 9vw, 2.85rem);
    --valgo-section-size: clamp(1.72rem, 7.2vw, 2.25rem);
    --valgo-feature-size: clamp(1.8rem, 7.5vw, 2.4rem);
    --valgo-dialog-size: clamp(1.65rem, 7vw, 2.2rem);
    --valgo-hero-tracking: 0.025em;
    --valgo-section-tracking: 0.025em;
    --valgo-title-tracking: 0.03em;
    --valgo-ui-tracking: 0.03em;
  }

  .hero-copy h1,
  .section-heading h2,
  .centered-heading h2,
  .catalog-heading h2,
  .campaign-section h2,
  .split-section h2,
  .family-section h2,
  .social-section h2,
  .about h2,
  .legal-dialog__header h2,
  .consumer-request-dialog h2 {
    line-height: 1.06 !important;
  }

  .hero-copy h1,
  .campaign-section h2,
  .split-section h2,
  .family-section h2,
  .social-section h2,
  .about h2,
  .section-heading h2,
  .centered-heading h2,
  .catalog-heading h2 {
    max-width: none;
  }
}

@media (max-width: 430px) {
  :root {
    --valgo-hero-size: clamp(2rem, 8.8vw, 2.55rem);
    --valgo-section-size: clamp(1.58rem, 6.8vw, 2rem);
    --valgo-feature-size: clamp(1.68rem, 7vw, 2.15rem);
  }
}