/** Shopify CDN: Minification failed

Line 342:5 Unexpected "{"
Line 912:0 Expected ")" to go with "("

**/
/* Tipografías forzadas sobre variables de Dawn */
:root{

  /* Opcional: pesos base que usan muchos componentes Dawn */
  --font-heading-weight: 600 !important;
  --font-body-weight: 300 !important;   /* sube a 400 si lo ves muy fino */
  --font-body-style: normal !important;
  --font-heading-style: normal !important;
}
/* ==========================
   P — TIPOGRAFÍAS LIMPIAS SIN ARCHIVOS
   ========================== */

/* 1. Importa Inter (desde Google Fonts, fuente libre similar a Helvetica Now) */

/* 2. Declara las variables principales */
:root{
  --font-heading: "Inter", "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
  --font-body: "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
}
/* ===== Suavidad de scroll ===== */
html {
  scroll-behavior: smooth; /* anclas y desplazamientos nativos */
}

/* Momentum en iOS */
* {
  -webkit-overflow-scrolling: touch;
}

/* Transiciones suaves por defecto (sin exagerar) */
:root {
  --radius-s: 8px;
  --radius-m: 12px;
  --radius-l: 20px;
  --elev-1: 0 6px 16px rgba(0,0,0,.08);
  --elev-2: 0 10px 24px rgba(0,0,0,.10);
  --ease: cubic-bezier(.2,.8,.2,1);
  --duration: 250ms;
}

/* Aplica transiciones suaves a elementos interactivos */
a, button, .button, .btn, .card, .media, .product-card, .collection-product-card {
  transition: border-color var(--duration) var(--ease), background-color var(--duration) var(--ease), box-shadow var(--duration) var(--ease), transform var(--duration) var(--ease), opacity var(--duration) var(--ease);
}

/* Respeta accesibilidad: si el usuario prefiere menos movimiento */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { transition: none !important; animation: none !important; }
}

/* Fade-in SOLO para imágenes dentro de bloques que revelamos */
.reveal img, .reveal picture img {
  opacity: 0;
  transition: opacity 400ms var(--ease);
}
.reveal.is-visible img, .reveal.is-visible picture img {
  opacity: 1;
}

/* ================================
   BOTONES – estilo global
   ================================ */

/* Variables por si quieres ajustar rápido */
:root {
  --btn-radius: 12px; /* cambia a 14/16 si quieres más redondo */
  --btn-pad-y: 0.9rem;
  --btn-pad-x: 1.2rem;
  --btn-font-w: 600;
  --btn-shadow-1: 0 6px 16px rgba(0,0,0,.08);
  --btn-shadow-2: 0 10px 24px rgba(0,0,0,.12);
  --btn-ease: cubic-bezier(.2,.8,.2,1);
  --btn-dur: 220ms;
}

/* Cobertura general de botones Dawn */
button, .button, .btn, .shopify-challenge__button, .shopify-payment-button__button--unbranded, .customer button, .cart__checkout-button, .pagination__item, .facets__button, .search__button {
  border-radius: var(--btn-radius) !important;
  padding: var(--btn-pad-y) var(--btn-pad-x);
  line-height: 1.1;
  font-weight: var(--btn-font-w);
  transition: background-color var(--btn-dur) var(--btn-ease), border-color var(--btn-dur) var(--btn-ease), box-shadow var(--btn-dur) var(--btn-ease), transform var(--btn-dur) var(--btn-ease);
}

/* Primario (el que ves como CTA principal) */
.button--primary, button.button--primary, .shopify-payment-button__button--unbranded, .cart__checkout-button {
  box-shadow: var(--btn-shadow-1);
}
.button--primary:hover, button.button--primary:hover, .shopify-payment-button__button--unbranded:hover, .cart__checkout-button:hover {
  transform: translateY(-1px);
  box-shadow: var(--btn-shadow-2);
}

/* Secundario/Terciario: look suave tipo “ghost/soft” */
.button--secondary, .button--tertiary, .btn--secondary, .btn--tertiary, .pagination__item, .facets__button, .search__button {
  background: rgba(0,0,0,.045);
  border: 1px solid rgba(0,0,0,.08);
}
.button--secondary:hover, .button--tertiary:hover, .btn--secondary:hover, .btn--tertiary:hover, .pagination__item:hover, .facets__button:hover, .search__button:hover {
  background: rgba(0,0,0,.065);
}

/* Estados deshabilitado */
button[disabled], .button[disabled], .btn[disabled] {
  opacity: .6;
  cursor: not-allowed;
  transform: none !important;
  box-shadow: none !important;
}

/* Inputs de tipo botón también redondeados */
input[type="submit"], input[type="button"], input[type="reset"] {
  border-radius: var(--btn-radius) !important;
  padding: var(--btn-pad-y) var(--btn-pad-x);
}

/* Píldoras (chips) de filtros/tags si quieres redondeo extra */
a.tag, .facets__item label, .facets__reset {
  border-radius: calc(var(--btn-radius) + 8px);
}

/* Accesibilidad: foco visible y bonito */
button:focus-visible, .button:focus-visible, .btn:focus-visible, a.button:focus-visible {
  outline: 2px solid rgba(0,122,255,.55);
  outline-offset: 2px;
  border-radius: var(--btn-radius);
}

/* Botón “Añadir al carrito” en PDP / Quick add */
.product-form__submit, .quick-add__submit {
  border-radius: var(--btn-radius) !important;
  padding: calc(var(--btn-pad-y) + .1rem) calc(var(--btn-pad-x) + .2rem);
  font-weight: var(--btn-font-w);
  box-shadow: var(--btn-shadow-1);
}
.product-form__submit:hover, .quick-add__submit:hover {
  transform: translateY(-1px);
  box-shadow: var(--btn-shadow-2);
}

/* Botones del slideshow/control (si los usas) */
.slideshow__controls button, .slider-button {
  border-radius: var(--btn-radius);
}

/* Paginación numérica redonda pero consistente */
.pagination__item {
  min-width: 40px;
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: calc(var(--btn-radius) + 8px) !important;
}

/* ==== Forzar radios globales del tema (Dawn usa variables) ==== */
:root {
  --buttons-radius: 12px !important;
  --inputs-radius: 12px !important;
  --card-corner-radius: 20px !important;
  --media-radius: 20px !important;
}

/* ==== Botones más comunes del tema ==== */
button, .button, a.button, .btn, .product-form__submit, .quick-add__submit, .shopify-challenge__button, .cart__checkout-button, .pagination__item, .facets__button, .search__button, .slideshow__controls button, .slider-button {
  border-radius: var(--buttons-radius) !important;
  overflow: hidden; /* recorta pseudo-elementos */
}

/* Algunos temas pintan el fondo en ::before/::after → también redondearlos */
button::before, button::after, .button::before, .button::after, a.button::before, a.button::after, .btn::before, .btn::after, .product-form__submit::before, .quick-add__submit::before, .cart__checkout-button::before, .pagination__item::before, .facets__button::before, .search__button::before, .slider-button::before, .slider-button::after {
  border-radius: inherit !important;
}

/* Casos de botones “fantasma/soft” que heredan borde cuadrado */
.button--secondary, .button--tertiary, .btn--secondary, .btn--tertiary, .pagination__item, .facets__button, .search__button {
  border-radius: var(--buttons-radius) !important;
  border: 1px solid rgba(0,0,0,.08);
}

/* Píldoras de paginación y chips (un poco más redondos) */
.pagination__item {
  min-width: 40px; min-height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: calc(var(--buttons-radius) + 8px) !important;
}

/* ===== Variables rápidas para radios ===== */
:root{
  --media-radius: 20px; /* sube a 24px si quieres más “Apple” */
  --card-radius: 20px;
  --thumb-radius: 10px;
}

/* ===== Contenedores de MEDIA (recortan imagen/video) ===== */
.media, .card__media, .product__media, .product-media-container, .image-with-text__media, .banner__media, .slideshow__media, .article-card__image-wrapper, .collection-card__image-wrapper, .collage-card__image-wrapper, .blog-articles .article-card__image-wrapper, .collection-list .card__inner, .cart-item__image-container, .quick-add-modal__media, .modal__content .product__media, .grid--peek .grid__item .card__inner {
  border-radius: var(--media-radius);
  overflow: hidden; /* recorte perfecto */
  background: #fff; /* evita halos oscuros al redondear */
}

/* ===== Tarjetas (envoltorios) ===== */
.card, .card__inner, .collection-card, .article-card, .collage-card {
  border-radius: var(--card-radius);
  overflow: hidden;
}

/* ===== Imágenes/VIDEOS dentro de contenedores ===== */
.media img, .media video, .card__media img, .product__media img, .product-media-container img, .image-with-text__media img, .banner__media img, .slideshow__media img, .article-card__image-wrapper img, .collection-card__image-wrapper img, .collage-card__image-wrapper img, .cart-item__image-container img, .quick-add-modal__media img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: inherit; /* hereda radio del contenedor */
  object-fit: cover; /* relleno elegante si hay crop */
}

/* ===== Miniaturas (thumbs) de producto/carruseles ===== */
.thumbnail, .thumbnail img, .product__media-item, .product__media-item img, .slider__slide .media, .slider__slide .media img {
  border-radius: var(--thumb-radius);
  overflow: hidden;
}

/* ===== Slideshow / Banners (asegura redondeo en cada slide) ===== */
.slideshow, .slideshow__slide, .slideshow__media, .slideshow__media img {
  border-radius: var(--media-radius);
  overflow: hidden;
}

/* ===== Hover sutil de profundidad en cards ===== */
.card:hover, .collection-card:hover, .article-card:hover, .collage-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0,0,0,.10);
  transition: transform 220ms cubic-bezier(.2,.8,.2,1), box-shadow 220ms cubic-bezier(.2,.8,.2,1);
}

/* ===== Placeholders / loaders también redondeados ===== */
.placeholder, .placeholder-svg, .skeleton-box, .media--placeholder, .card__media .placeholder, .product__media .placeholder {
  border-radius: inherit;
  overflow: hidden;
}

/* ===== Opt-out: zonas que NO quieres redondear ===== */
/* Añade class="no-radius" al contenedor cuando quieras mantener esquinas rectas */
.no-radius, .no-radius * {
  border-radius: 0 !important;
}

/* ====== PADDING LATERAL GLOBAL (aire a los lados) ====== */

/* Aplica a todas las secciones con medios grandes */

/* El header y el footer NO deben heredar ese padding */
header, footer, .shopify-section-header, .shopify-section-footer {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Asegura que el contenido interno se mantenga centrado */
.section .page-width, .banner__content, .slideshow__content, .image-with-text__content, .collection-list__content {
  margin-left: auto;
  margin-right: auto;
}

/* En móvil, reduce un poco el aire */
@media (max-width: 768px) {
  .section, .image-with-text, .slideshow, .banner, .collection-list, .featured-collection, .collage, .video-section, .rich-text, .multicolumn {
    padding-left: 1.2rem;
    padding-right: 1.2rem;
  }
}

/* Evita que el contenido interno quede demasiado estrecho en pantallas grandes */
@media (min-width: 1600px) {
  .section .page-width, .banner__content, .slideshow__content {
    max-width: 1600px; /* puedes subir a 1800px si quieres más aire */
  }
}

/* ===== Radios en secciones con fondo (Dawn) ===== */
:root { --section-radius: 24px; } /* súbelo a 28 si quieres más curvatura */

/* 1) Wrapper de esquema de color: casi todas las secciones lo usan */
.shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .gradient, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-background-1, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-background-2, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-background-3, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-inverse {
  border-radius: var(--section-radius);
  overflow: hidden; /* recorta el color y todo lo interno */
  background-clip: padding-box;
}

/* 2) Algunos layouts pintan el color directamente en el contenedor de la sección */
.shopify-section:not(.shopify-section-header):not(.shopify-section-footer) > .section, .rich-text, .image-with-text, .multicolumn, .collage, .video-section, .banner, .slideshow {
  border-radius: var(--section-radius);
  overflow: hidden;
}

/* 3) Casos puntuales (acordeones / colapsables) */
.collapsible-content, .collapsible-content .accordion, .collapsible-content .accordion summary, .collapsible-content .accordion .accordion__content {
  border-radius: var(--section-radius);
  overflow: hidden;
}

/* 4) Para que no se peguen a los bordes del viewport */

/* ====== CORRIGE DESPLAZAMIENTO DE IMÁGENES ====== */

/* Quita el padding lateral solo en secciones que ya usan "page-width" (colecciones, productos, banners, etc.) */
.shopify-section .section .page-width, .featured-collection .page-width, .collection-list .page-width, .image-with-text .page-width, .slideshow .page-width, .banner .page-width {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Mantén el aire visual del bloque (solo margen externo, sin mover el contenido interno) */
.shopify-section:not(.shopify-section-header):not(.shopify-section-footer) {
  margin-left: clamp(1rem, 4vw, 60px);
  margin-right: clamp(1rem, 4vw, 60px);
}

/* Asegura que las imágenes y videos dentro de estos bloques queden centradas */
.image-with-text__media, .banner__media, .slideshow__media, .collection-card__image-wrapper, .product__media {
  margin: 0 auto;
  display: block;
}

/* Ajuste para "Featured Collection" */
.featured-collection .grid {
  margin-left: auto;
  margin-right: auto;
  justify-content: center;
}

/* Corrige posibles desplazamientos en mobile */
@media (max-width: 768px) {
  .shopify-section:not(.sho
/* Aire lateral usando la variable nativa de Dawn */
:root{
  /* Ajusta el “gutter” lateral en todo el tema */
  --page-width-margin: clamp(12px, 4vw, 64px);
}

/* Limitar ancho máximo del contenido (opcional, look premium) */
@media (min-width: 1600px){
  .page-width{ max-width: 1600px; }
}

/* Asegura que las secciones con fondo también respeten el radio (lo que ya hicimos) */
:root{ --section-radius: 24px; }
.shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .gradient, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-background-1, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-background-2, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-background-3, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-inverse {
  border-radius: var(--section-radius);
  overflow: hidden;
}

/* No toques header/ footer */
.shopify-section-header, .shopify-section-footer { border-radius: 0 !important; }

/* ===========================
   PUNTO 7 — ACABADOS PREMIUM
   =========================== */

/* 7.1 - Header y footer alineados con el contenido principal */
:root { --gutter: var(--page-width-margin, clamp(12px, 4vw, 64px)); }
.header-wrapper, .shopify-section-footer .footer { padding-left: var(--gutter); padding-right: var(--gutter); }

/* 7.2 - Ritmo vertical entre secciones */
.shopify-section + .shopify-section { margin-top: clamp(24px, 4vw, 64px); }

/* 7.3 - Sombras sutiles para secciones con fondo */
.shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .gradient, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-background-1, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-background-2, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-background-3, .shopify-section:not(.shopify-section-header):not(.shopify-section-footer) .color-inverse {
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}

/* 7.4 - Links elegantes (sin afectar botones) */
a:not(.button):not(.btn) {
  text-decoration-thickness: .06em;
  text-underline-offset: .2em;
  transition: text-underline-offset 160ms cubic-bezier(.2,.8,.2,1);
}
a:not(.button):not(.btn):hover { text-underline-offset: .28em; }

/* 7.5 - Navegación con anclas fluida (sin cortes por header fijo) */
:root { --header-offset: 80px; }
@media (max-width: 768px){ :root { --header-offset: 64px; } }
html { scroll-padding-top: calc(var(--header-offset) + 5mm); }

/* 7.6 - Optimización visual y performance */
.card, .button, .btn, .media, .product-card { will-change: transform, box-shadow; }
img { display: block; }

/* ================================
   PUNTO 8 — QA RESPONSIVE
   ================================ */

/* --- 8.1 Aire lateral móvil --- */
@media (max-width: 480px){
  .page-width{ padding-inline: 14px; } /* evita que el contenido toque los bordes */
  .announcement-bar, .header__heading{ padding-inline: 12px; }
}

/* --- 8.2 Header y Footer alineados --- */
.header-wrapper, .shopify-section-footer .footer{
  padding-inline: var(--page-width-margin, clamp(12px,4vw,64px));
}

/* --- 8.3 Banners / Slideshow --- */
@media (max-width: 480px){
  .slideshow__media, .banner__media{ min-height: 48vh; }
  .banner__content{ word-break: break-word; }
}

/* --- 8.4 Image-with-text --- */
@media (max-width: 768px){
  .image-with-text{ padding-inline: clamp(12px,4vw,24px); }
  .image-with-text__content{ padding-top: 12px; }
}

/* --- 8.5 Grid de productos / featured collection --- */
@media (max-width: 480px){
  .grid--collection{
    grid-template-columns: repeat(2,1fr) !important;
    gap: 12px;
  }
}
@media (min-width: 481px) and (max-width: 1023px){
  .grid--collection{
    grid-template-columns: repeat(3,1fr) !important;
    gap: 16px;
  }
}
@media (min-width: 1024px){
  .grid--collection{
    grid-template-columns: repeat(4,1fr) !important;
    gap: 20px;
  }
}

/* --- 8.6 Botones móviles (tap targets) --- */
@media (max-width: 480px){
  .button, .btn, .product-form__submit, .quick-add__submit{
    min-height: 44px;
    padding: 0.9rem 1.1rem;
  }
}

/* --- 8.7 PDP (galería y acordeones) --- */
.product__media-item, .product__media-item img{
  border-radius: var(--thumb-radius);
  overflow: hidden;
}
.collapsible-content, .accordion, .accordion summary, .accordion .accordion__content{
  border-radius: var(--section-radius);
  overflow: hidden;
}

/* --- 8.8 Footer responsive --- */
@media (max-width: 768px){
  .footer-block.grid--4-col-desktop{
    grid-template-columns: 1fr 1fr !important;
  }
}

/* --- 8.9 Max width desktop grande --- */
@media (min-width: 1600px){
  .page-width{ max-width: 1600px; }
}

/* ===== Espacio blanco exacto arriba y abajo ===== */
:root{ --edge-gap: 5mm; }

/* Asegura fondo blanco del lienzo */
html, body{ background:#fff; }

/* ➜ Arriba: antes de la barra de anuncios (dentro del grupo de cabecera) */
.shopify-section-group-header-group, .header-group{
  padding-top: var(--edge-gap) !important;
  background: transparent;
}

/* ➜ Abajo: después del footer (dentro del grupo de footer) */
.shopify-section-group-footer-group, .shopify-section-footer, footer.footer{
  padding-bottom: var(--edge-gap) !important;
}

/* Si algún estilo del tema “pega” el header al borde con top:0, lo neutralizamos */
.header-wrapper, .shopify-section-header{
  top: auto !important;
}

/* DEBUG temporal – quítalo luego */
.shopify-section-group-header-group{ outline: 2px dashed red !important; }
.shopify-section-group-footer-group{ outline: 2px dashed blue !important; }

/* ================================
   PUNTO 9 — MICROINTERACCIONES
   ================================ */

/* --- 9.1 Botones con respuesta sutil --- */
.button, .btn, button, .product-form__submit {
  transform: translateY(0);
  transition: transform 0.25s var(--ease), box-shadow 0.25s var(--ease);
}
.button:hover, .btn:hover, button:hover, .product-form__submit:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0,0,0,0.08);
}
.button:active, .btn:active, button:active, .product-form__submit:active {
  transform: translateY(0);
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

/* --- 9.2 Tarjetas y productos con hover suave --- */
.card, .product-card {
  transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease);
  box-shadow: 0 0 0 rgba(0,0,0,0);
}
.card:hover, .product-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}

/* --- 9.3 Imagen con zoom elegante al pasar --- */
.media img, .card__media img, .product__media img {
  transition: transform 0.4s var(--ease);
}
.media:hover img, .card__media:hover img, .product__media:hover img {
  transform: scale(1.03);
}

/* --- 9.4 Sombras ligeras y coherentes --- */
:root {
  --shadow-soft: 0 4px 12px rgba(0,0,0,0.05);
  --shadow-hover: 0 8px 20px rgba(0,0,0,0.08);
}
.card, .product-card, .media {
  box-shadow: var(--shadow-soft);
}
.card:hover, .product-card:hover, .media:hover {
  box-shadow: var(--shadow-hover);
}

/* --- 9.5 Transiciones globales suaves --- */
*, *::before, *::after {
  transition-timing-function: var(--ease);
}

/* --- 9.6 Ajuste tipográfico base --- */
body {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  line-height: 1.5;
}
/* ==========================
   P — APLICACIÓN GLOBAL DE TIPOGRAFÍAS
   ========================== */

/* Cuerpo general */
html, body, input, textarea, select, button {
  font-family: var(--font-body) !important;
  font-weight: 300; /* delgada y elegante */
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Títulos */
h1,h2,h3,h4,h5,h6,
.h0,.h1,.h2,.h3,.h4,.h5,.h6,
.heading, .title, .card__heading, .product__title {
  font-family: var(--font-heading) !important;
  font-weight: 600;               /* consistente y sobrio */
  letter-spacing: -0.02em;        /* sutil tracking tipo Apple */
  line-height: 1.2;
}

/* Asegura que el header, menú y footer también hereden */
.header__inline-menu a,
.menu-drawer__menu a,
.footer-block__heading,
.footer__content-top,
.card__information .full-unstyled-link,
.price, .price .price-item {
  font-family: inherit !important;
}
/* Aplicación global contundente */
html body,
html body input,
html body textarea,
html body select,
html body button {
  font-weight: var(--font-body-weight, 300);
  font-style: var(--font-body-style, normal);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

html body h1, html body h2, html body h3, html body h4, html body h5, html body h6,
html body .h0, html body .h1, html body .h2, html body .h3, html body .h4, html body .h5, html body .h6,
html body .heading, html body .title, html body .card__heading, html body .product__title {
  font-family: var(--font-heading-family) !important;
  font-weight: var(--font-heading-weight, 600);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

/* Zonas que suelen resistirse en Dawn */
.header__inline-menu a, 
.menu-drawer__menu a,
.footer-block__heading,
.footer__content-top,
.card__information .full-unstyled-link,
.price .price-item,
.rte p, .rte li {
  font-family: inherit !important; /* heredan de las reglas superiores */
}
/* DEBUG temporal: quítalo luego */
body::after{
  content: "custom.css ACTIVO";
  position: fixed; bottom: 8px; right: 8px;
  font: 12px/1 var(--font-heading-family);
  background: rgba(0,0,0,.6); color:#fff; padding:4px 6px; border-radius:4px; z-index:9999;
}
/* ==========================
   TIPOGRAFÍA — CUERPO Y NÚMEROS
   (colocar al FINAL del archivo)
   ========================== */

/* 0) Por si acaso, aseguramos las variables (ya las definiste antes) */
:root{
  /* body: Helvetica/ sistema — lo que ya tengas configurado */
  --font-body-family: "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif !important;
  --font-body-weight: 300 !important;
  --font-body-style: normal !important;

  /* Para números uso Inter (mejor juego de números tabulares) con fallback al body */
  --numeric-font: "Inter", var(--font-body-family) !important;
}

/* 1) Cuerpo global (sin tocar H1–H6) */
html body,
html body p, html body li, html body span, html body a, html body label,
html body small, html body strong, html body em,
html body .rte, html body .rte * ,
html body .footer, html body .footer * ,
html body .menu-drawer, html body .menu-drawer * ,
html body .card__information, html body .card__information * ,
html body .product__info-container, html body .product__info-container * ,
html body .collection, html body .collection * ,
html body .drawer, html body .drawer * ,
html body .modal, html body .modal * {
  font-family: var(--font-body-family) !important;
  font-weight: var(--font-body-weight) !important;
  font-style: var(--font-body-style) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* 2) Reafirmo TITULARES para que no los pise la regla anterior */
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6,
html body .h0, html body .h1, html body .h2, html body .h3, html body .h4, html body .h5, html body .h6,
html body .heading, html body .title, html body .card__heading, html body .product__title {
  /* aquí ya tienes Inter (o la que estableciste para headings) */
  font-weight: 600 !important;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

/* 3) NÚMEROS/PRECIOS: usar cifras forradas y tabulares (alinean columnas) */
.money, .price, .price * ,
.price-item, .price__regular, .price__sale, .unit-price,
[class*="price"], /* abarca muchos bloques de Dawn */
.totals, .totals * ,
.subtotal, .subtotal * ,
.cart__totals, .cart__totals * ,
.cart-item__price, .cart-item__final-price,
.order-summary__section--total, .order-summary__section--discounts,
.product__price, .product__tax,
.quantity, .quantity * , .quantity__input, input[type="number"],
.count-bubble, .badge, .pagination__item, .pagination__item--current {
  font-family: var(--numeric-font) !important;
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1;
  letter-spacing: .01em;
}

/* 4) Formularios y botones (algunos temas los fuerzan aparte) */
input, textarea, select, button {
  font-family: var(--font-body-family) !important;
  font-weight: var(--font-body-weight) !important;
  font-style: var(--font-body-style) !important;
}

/* 5) Zonas que suelen resistirse: heredan del body */
.header__inline-menu a,
.menu-drawer__menu a,
.footer-block__heading,
.footer__content-top,
.card__information .full-unstyled-link,
.rte p, .rte li {
  font-family: inherit !important;
}
/* ==========================
   RESET — USAR FUENTES DE DAWN (DEL THEME)
   (pegar AL FINAL de custom.css)
   ========================== */

/* Cuerpo (usa la familia configurada en el editor del tema) */
html body,
html body p, html body li, html body span, html body a, html body label,
html body small, html body strong, html body em,
html body .rte, html body .rte *,
html body .footer, html body .footer *,
html body .menu-drawer, html body .menu-drawer *,
html body .card__information, html body .card__information *,
html body .product__info-container, html body .product__info-container *,
html body .collection, html body .collection *,
html body .drawer, html body .drawer *,
html body .modal, html body .modal * {
  font-family: var(--font-body-family) !important;
  font-weight: var(--font-body-weight, 400) !important;
  font-style: var(--font-body-style, normal) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Encabezados (usa la familia configurada en el editor del tema) */
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6,
html body .h0, html body .h1, html body .h2, html body .h3, html body .h4, html body .h5, html body .h6,
html body .heading, html body .title, html body .card__heading, html body .product__title {
  font-family: var(--font-heading-family) !important;
  font-weight: var(--font-heading-weight, 600) !important;
  letter-spacing: var(--font-heading-letter-spacing, -0.02em);
  line-height: 1.2;
}

/* Zonas que suelen resistirse: que hereden */
.header__inline-menu a, .menu-drawer__menu a,
.footer-block__heading, .footer__content-top,
.card__information .full-unstyled-link,
.price .price-item, .rte p, .rte li {
  font-family: inherit !important;
}
/* ==========================
   RESET — USAR SOLO FUENTES DEL TEMA DAWN
   (pegar AL FINAL de custom.css)
   ========================== */

/* Cuerpo (usa lo que definiste en el editor del tema) */
html body,
html body p, html body li, html body span, html body a, html body label,
html body small, html body strong, html body em,
html body .rte, html body .rte *,
html body .footer, html body .footer *,
html body .menu-drawer, html body .menu-drawer *,
html body .card__information, html body .card__information *,
html body .product__info-container, html body .product__info-container *,
html body .collection, html body .collection *,
html body .drawer, html body .drawer *,
html body .modal, html body .modal * {
  font-family: var(--font-body-family) !important;
  font-weight: var(--font-body-weight, 400) !important;
  font-style: var(--font-body-style, normal) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Encabezados (heredan la fuente elegida para encabezados en el editor) */
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6,
html body .h0, html body .h1, html body .h2, html body .h3, html body .h4, html body .h5, html body .h6,
html body .heading, html body .title, html body .card__heading, html body .product__title {
  font-family: var(--font-heading-family) !important;
  font-weight: var(--font-heading-weight, 600) !important;
  letter-spacing: var(--font-heading-letter-spacing, -0.02em);
  line-height: 1.2;
}

/* Zonas rebeldes → que hereden */
.header__inline-menu a, .menu-drawer__menu a,
.footer-block__heading, .footer__content-top,
.card__information .full-unstyled-link,
.price .price-item, .rte p, .rte li {
  font-family: inherit !important;
}
/* Multicolumna: estilo de iconos tipo “badge” */
.multicolumn .multicolumn-card__image-wrapper {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #f6f3ee;              /* suave, cambia si quieres */
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 12px;
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
}

.multicolumn .multicolumn-card__image {
  width: 28px;                       /* tamaño del ícono dentro del círculo */
  height: 28px;
  object-fit: contain;
}

/* Títulos y textos más ordenados */
.multicolumn .multicolumn-card__title {
  margin-bottom: 6px;
}

.multicolumn .rte, 
.multicolumn .multicolumn-card__text {
  line-height: 1.5;
  color: var(--text-secondary, #6b6b6b);
}

/* En móvil separa un poco las tarjetas */
@media (max-width: 749px){
  .multicolumn .multicolumn-list__item { margin-bottom: 16px; }
}
/* === Ajuste visual de los íconos en la sección Multicolumna === */
.multicolumn .multicolumn-card__image-wrapper {
  width: 68px;                /* tamaño total del contenedor redondo */
  height: 68px;
  border-radius: 50%;         /* lo hace circular */
  background-color: #f8f6f3;  /* fondo beige suave, puedes cambiarlo */
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 12px;        /* centrado y espacio debajo */
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

.multicolumn .multicolumn-card__image {
  width: 32px;                /* tamaño del icono dentro del círculo */
  height: 32px;
  object-fit: contain;        /* mantiene proporción sin recortar */
  filter: brightness(0) saturate(0) contrast(90%); /* look elegante monocromo */
  opacity: 0.9;
  transition: all 0.3s ease;
}

.multicolumn .multicolumn-card__image:hover {
  transform: scale(1.08);
  opacity: 1;
}
/* === Corrección de tamaño real para íconos Multicolumna === */

/* Ajuste del contenedor del icono */
.multicolumn .multicolumn-card__image-wrapper {
  width: 60px !important;              /* tamaño del círculo */
  height: 60px !important;
  border-radius: 50% !important;
  background-color: #f8f6f3 !important; /* fondo beige suave */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 14px !important;       /* centrado + espacio debajo */
  box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
  overflow: hidden !important;
}

/* Imagen dentro del contenedor */
.multicolumn .multicolumn-card__image {
  width: 32px !important;              /* tamaño real del icono */
  height: 32px !important;
  max-width: 32px !important;
  max-height: 32px !important;
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
  filter: brightness(0) saturate(0) contrast(85%) !important; /* look monocromo elegante */
  opacity: 0.9 !important;
  transition: all 0.3s ease !important;
}

/* Efecto hover sutil */
.multicolumn .multicolumn-card__image:hover {
  transform: scale(1.08) !important;
  opacity: 1 !important;
}

/* Espacio general y centrado de texto */
.multicolumn .multicolumn-card__title {
  font-weight: 600;
  margin-bottom: 4px !important;
}

.multicolumn .multicolumn-card__text {
  font-size: 15px;
  line-height: 1.45;
  color: #444;
}
/* === Texto elegante, limpio y con la tipografía del tema === */
.custom-text-section {
  background-color: transparent;        /* sin fondo, puedes cambiarlo */
  text-align: center;
  padding: 2rem 1rem;
}

.custom-paragraph {
  font-family: inherit;                 /* usa la tipografía del tema Dawn */
  font-size: clamp(16px, 1.2vw, 18px);  /* tamaño adaptable */
  line-height: 1.6;
  color: var(--text-main, #1a1a1a);     /* color del tema */
  font-weight: 400;                     /* peso suave */
  max-width: 650px;
  margin: 0 auto;
  letter-spacing: -0.01em;
}