/* Tipografía de la tienda: fuente de verdad de tokens y reglas base.
   Se carga al final del <head> para prevalecer sobre store/theme/luxora/home-*.
   Familias: las del tema activo (--theme-body-font / --theme-display-font).
   Pesos permitidos: 400 / 500 / 600 / 700. */

:root{
  --font-body:var(--theme-body-font,system-ui,sans-serif);
  --font-display:var(--theme-display-font,system-ui,sans-serif);

  --fw-regular:400;
  --fw-medium:500;
  --fw-semibold:600;
  --fw-bold:700;

  /* Escalan con el "tamaño base" del admin (Diseño global) vía --theme-text-scale; xs y sm conservan su suelo de 12/14px. */
  --text-xs:max(12px,calc(12px*var(--theme-text-scale,1)));
  --text-sm:max(14px,calc(14px*var(--theme-text-scale,1)));
  --text-base:calc(16px*var(--theme-text-scale,1));
  --text-lg:calc(18px*var(--theme-text-scale,1));
  --text-xl:calc(22px*var(--theme-text-scale,1));
  --text-2xl:calc(28px*var(--theme-text-scale,1));
  --text-3xl:calc(36px*var(--theme-text-scale,1));
  --text-4xl:calc(48px*var(--theme-text-scale,1));

  --lh-tight:1.15;
  --lh-snug:1.3;
  --lh-normal:1.5;
  --lh-relaxed:1.6;

  --tracking-display:-0.02em;
  --tracking-label:0.06em;
  --tracking-heading:-0.01em;
  --tracking-brand:-0.05em;

  --tap-min:44px;

  --price-sale:#ba0000;
}
@media(max-width:768px){
  :root{--text-xl:calc(20px*var(--theme-text-scale,1));--text-2xl:calc(24px*var(--theme-text-scale,1));--text-3xl:calc(30px*var(--theme-text-scale,1));--text-4xl:calc(34px*var(--theme-text-scale,1))}
}

/* Único punto donde se define el root: los tamaños se ajustan con tokens, no escalando html. */
html{font-size:100%}

body,body[class*="home-template-"],body.site-template-v2{
  font-family:var(--font-body);font-size:var(--text-base);line-height:var(--lh-relaxed);font-weight:var(--theme-body-weight,var(--fw-regular))
}
button,input,select,textarea{font-family:inherit}

/* Encabezados: familia display del tema, sin transformación ni tracking */
h1,h2,h3,
body.site-template-v2 h1,body.site-template-v2 h2,body.site-template-v2 h3,
body[class*="home-template-"] .section-title,
body[class*="home-template-"] .lux-section-heading h2{
  font-family:var(--font-display)!important;text-transform:none!important;letter-spacing:0!important
}
h1,body[class*="home-template-"] .lux-bento-copy h1,body[class*="home-template-"] .lux-hero-banner-copy h1,body[class*="home-template-"] .lux-hero-split-copy h1,.hero h1,.product-info h1{
  font-size:var(--text-3xl)!important;line-height:var(--lh-tight)!important
}
h2,body[class*="home-template-"] .section-title,body[class*="home-template-"] .lux-section-heading h2,body[class*="home-template-"] .catalog-copy h2,body[class*="home-template-"] .offer-box h2{
  font-size:var(--text-2xl)!important;line-height:var(--lh-snug)!important
}
h3,body[class*="home-template-"] .lux-campaign-grid h3,.why-item h3{
  font-size:var(--text-lg)!important;line-height:var(--lh-snug)!important
}

/* Blog: titulares del listado (superan h1/h3 globales por especificidad) */
.blog-hero h1{font-size:var(--text-2xl)!important}
.blog-card-body h3,body[class*="home-template-"] .lux-story-grid h3{font-size:var(--text-xl)!important}
/* El enlace del título hereda el tamaño del h3 (antes lo pisaba .lux-story-grid a:last-child, pensado para el CTA) */
.lux-story-grid h3 a:last-child,.blog-card-body h3 a{font-size:inherit}

/* Texto pequeño / etiquetas */
small,.eyebrow,.tag,.badge,.badge-stack .badge,
body[class*="home-template-"] .eyebrow,body[class*="home-template-"] .tag,body[class*="home-template-"] .badge-stack .badge{
  font-size:var(--text-xs)!important;line-height:var(--lh-normal)
}

/* Enlaces-etiqueta: son interactivos, por eso no bajan de --text-sm */
a.eyebrow,.eyebrow-link,.lux-toplinks a{font-size:var(--text-sm)!important}

/* Controles: alto táctil mínimo en todos los tamaños */
.btn-outline,.article-share button,.article-share a,.lux-product-tabs button,.search-page-form button{min-height:var(--tap-min)}

/* Navegación */
.nav a,.s8-nav a,nav a{font-size:var(--text-sm);font-weight:var(--fw-semibold)}

/* Botones */
.btn,button.add,.add,.action-btn,.cart-drawer-whatsapp,body[class*="home-template-"] .offer .btn{
  font-family:var(--font-body);font-size:var(--text-sm)!important;font-weight:var(--fw-semibold)!important;text-transform:none;min-height:var(--tap-min)
}

/* Precios */
.price,.price-row,.price-line,.lux-product-price,.cart-drawer-item-price{font-weight:var(--fw-bold)}
.price-sale,.sale-price,.price ins,.price-line .sale,.lux-product-price .sale{color:var(--price-sale)}

/* Áreas táctiles (móvil): controles con al menos --tap-min de alto. Los enlaces dentro de texto corrido quedan fuera (excepción WCAG 2.5.8). */
@media(max-width:768px){
  .lux-action,.lux-menu-btn,.heart{min-height:var(--tap-min)}
  .lux-menu-btn{min-width:var(--tap-min)}
  .heart{width:var(--tap-min);height:var(--tap-min)}
  .lux-product-tabs button,.blog-filters a{min-height:var(--tap-min)}
  .s8-footer-col a,.footer-col a{display:flex;align-items:center;min-height:var(--tap-min);margin:0}
  .lux-brand,.lux-story-grid article>div>a,.lux-campaign-grid article>div>a,.lux-section-heading a,.blog-card-body a{display:inline-flex;align-items:center;min-height:var(--tap-min)}
  input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]),select,textarea{min-height:var(--tap-min)}
}
