/* =====================================================================
   QWOOD DESIGN SYSTEM — SSOT CANÓNICO DE TOKENS
   =====================================================================
   REGLA: Ningún módulo debe redefinir estas variables en :root.
   Los módulos consumen con: var(--qwood-*, fallback-local).
   Patrón de referencia: wizard.css
   Última consolidación: 2026-04-10
   ===================================================================== */

/* ------- @font-face: Typo Round REMOVED 2026-05-27 ------- */
/* TypoRound eliminado por crear cadena crítica de 3 niveles en Lighthouse.
   El font file sigue en assets/fonts/typo-round/ por si se reactiva.
   Todas las referencias sustituidas por Montserrat stack. */

:root{
  /* ------- TIPOGRAFÍA ------- */
  --qwood-font: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --qwood-font-sans: var(--qwood-font);
  /* Brand-name typography: rounded font for in-copy "QWOOD" mentions.
     TypoRound eliminado 2026-05-27 (cadena crítica Lighthouse).
     Montserrat como fuente brand unificada. */
  --qwood-font-brand: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* ------- MARCA ------- */
  --qwood-color-primary: #1bcf17;
  --qwood-color-primary-dark: #1bcf17;
  --qwood-color-primary-hover: #1bcf17;
  --qwood-color-primary-soft: rgba(27,207,23,.12);
  --qwood-color-primary-ring: rgba(27,207,23,.22);
  /* --qwood-color-accent ELIMINADO — consumidores migrados a --qwood-color-primary */

  /* A11y CONTRAST VARIANTS (WCAG AA 4.5:1 vs white)
     BRAND RULE 2026-04-24: ni #1bcf17 ni #0ea5e9 se oscurecen por a11y.
     Ambos siguen siendo canónicos (botones, kickers, acentos, texto pequeño
     brand-tinted). El trade-off de contraste es aceptado a nivel de marca,
     igual que la regla documentada en home.css.
     Sólo `--qwood-color-muted-contrast` sigue vivo para texto gris
     secundario (donde no hay identidad de marca implicada). */
  --qwood-color-primary-contrast:   #1bcf17;  /* legacy alias — mapea a --qwood-color-primary; no usar para texto brand */
  /* --qwood-color-secondary-contrast: removed 2026-04-24 — celeste brand-locked */
  --qwood-color-muted-contrast:     #5b6167;  /* slate for small gray text — 4.83:1 vs #fff */

  /* ------- INFO (Sky Blue — semántico: estados/notificaciones) ------- */
  --qwood-color-info: #0ea5e9;
  --qwood-color-info-soft: #e0f2fe;
  --qwood-color-info-ring: rgba(14,165,233,.22);

  /* ------- SECUNDARIO (Celeste — 2do color de marca/marketing) ------- */
  --qwood-color-secondary: #0ea5e9;
  --qwood-color-secondary-dark: #0ea5e9;
  --qwood-color-secondary-soft: rgba(14, 165, 233,.12);
  --qwood-color-secondary-ring: rgba(14, 165, 233,.22);

  /* ------- DEEP variants para BG de SECCIÓN (a11y AA con texto blanco) -------
     Reglas (validadas 2026-05-06 por frontend-design + page-cro + marketing-psychology):
     - Brand puro #1bcf17 / #0ea5e9 NO se usa como bg de sección (falla AA con texto blanco).
     - Estos `-deep` SÍ son AA-safe contra blanco (verde-deep 5.8:1, celeste-deep 5.0:1).
     - Brand puro queda reservado para botones/kickers/iconos (donde el text-large bold pasa AA). */
  --qwood-color-primary-deep: #1bcf17;     /* Verde-deep — único usado en S7 trayectoria */
  --qwood-color-secondary-deep: #0ea5e9;   /* Celeste-deep — slate dark, lee como sólido */

  /* ------- FONDOS ------- */
  --qwood-color-bg: #ffffff;
  --qwood-color-bg-alt: #ffffff;
  --qwood-color-card-bg: #ffffff;
  --qwood-color-card-bg-soft: #ffffff;
  --qwood-color-helper-bg: #f8fbf8;

  /* ------- TEXTO ------- */
  --qwood-color-text: #0f172a;
  --qwood-color-text-strong: #0f172a;
  --qwood-color-muted: rgba(15,23,42,.78);
  --qwood-color-muted-soft: rgba(15,23,42,.56);

  /* ------- BORDES ------- */
  --qwood-color-border: rgba(15,23,42,.10);
  --qwood-color-border-soft: rgba(15,23,42,.08);
  --qwood-color-border-strong: rgba(27,207,23,.22);
  --qwood-color-border-emphasis: rgba(27,207,23,.38);
  --qwood-color-line: #e6ecf5;

  /* ------- SEMÁNTICOS (estado) ------- */
  --qwood-color-ok: #1bcf17;
  --qwood-color-warn: #f59e0b;
  --qwood-color-danger: #ef4444;

  /* ------- RADIOS ------- */
  --qwood-radius-xl: 28px;
  --qwood-radius-lg: 24px;              /* antes 22 · unificado con --large (audit 2026-04-20) */
  --qwood-radius-large: var(--qwood-radius-lg);  /* alias deprecado — usar --qwood-radius-lg */
  --qwood-radius-md: 16px;
  --qwood-radius-sm: 12px;
  --qwood-radius-xs: 8px;
  --qwood-radius-pill: 999px;
  --qwood-radius-section: 44px;

  /* ------- SOMBRAS (base: rgba(15,23,42)) ------- */
  --qwood-shadow-xs: 0 1px 3px rgba(15,23,42,.05);
  --qwood-shadow-soft: 0 14px 34px rgba(15,23,42,.06);
  --qwood-shadow-card: 0 18px 42px rgba(15,23,42,.08);
  --qwood-shadow-strong: 0 24px 60px rgba(15,23,42,.12);
  --qwood-shadow-elevated: 0 28px 72px rgba(15,23,42,.18);

  /* ------- TRANSICIONES ------- */
  --qwood-ease: cubic-bezier(.2,.8,.2,1);
  --qwood-ease-spring: cubic-bezier(.34,1.56,.64,1);
  --qwood-speed-fast: 140ms;
  --qwood-speed: 220ms;
  --qwood-speed-slow: 300ms;
  --qwood-speed-reveal: 600ms;
  --qwood-speed-reveal-slow: 800ms;

  /* ------- FOCUS RING ------- */
  --qwood-ring: 0 0 0 3px rgba(27,207,23,.18);
  --qwood-ring-strong: 0 0 0 4px rgba(27,207,23,.28);

  /* ------- ESPACIADO (escala 4px) ------- */
  --qwood-space-1: 4px;
  --qwood-space-2: 8px;
  --qwood-space-3: 12px;
  --qwood-space-4: 16px;
  --qwood-space-5: 20px;
  --qwood-space-6: 24px;
  --qwood-space-8: 32px;
  --qwood-space-10: 40px;
  --qwood-space-12: 48px;
  --qwood-space-16: 64px;

  /* ------- SEMÁNTICOS (soft backgrounds) ------- */
  --qwood-color-ok-soft: rgba(27,207,23,.10);
  --qwood-color-warn-soft: rgba(245,158,11,.10);
  --qwood-color-danger-soft: rgba(239,68,68,.10);

  /* ------- ESCALA TIPOGRÁFICA (audit 2026-04-20) ------- */
  --qwood-fs-xs: 12px;
  --qwood-fs-sm: 13px;
  --qwood-fs-base: 14px;
  --qwood-fs-md: 15px;
  --qwood-fs-lg: 16px;
  --qwood-fs-xl: 18px;
  --qwood-fs-2xl: 22px;
  --qwood-fs-3xl: 28px;
  --qwood-fs-4xl: 36px;
  --qwood-fs-display: clamp(40px, 5vw, 60px);

  --qwood-lh-tight: 1.2;
  --qwood-lh-snug: 1.35;
  --qwood-lh-base: 1.5;
  --qwood-lh-loose: 1.7;

  --qwood-fw-regular: 400;
  --qwood-fw-medium: 500;
  --qwood-fw-semibold: 600;
  --qwood-fw-bold: 700;
  --qwood-fw-extrabold: 800;
  --qwood-fw-black: 900;

  /* ------- ESCALA DE GRISES (slate — formaliza paleta fantasma) ------- */
  --qwood-color-slate-50:  #f8fafc;
  --qwood-color-slate-100: #f1f5f9;
  --qwood-color-slate-200: #e2e8f0;
  --qwood-color-slate-300: #cbd5e1;
  --qwood-color-slate-400: #94a3b8;
  --qwood-color-slate-500: #64748b;
  --qwood-color-slate-600: #475569;
  --qwood-color-slate-700: #334155;

  /* ------- ESCALA Z-INDEX (audit 2026-04-20) ------- */
  --qwood-z-base: 1;
  --qwood-z-dropdown: 10;
  --qwood-z-sticky: 100;
  --qwood-z-header: 500;
  --qwood-z-overlay: 900;
  --qwood-z-modal: 1000;
  --qwood-z-toast: 1100;
  --qwood-z-fab: 1200;
  --qwood-z-cmp: 9999;

  /* ------- REVEAL / ANIMATION ------- */
  --qwood-reveal-distance: 28px;
  --qwood-stagger-base: 0.1s;
  --qwood-parallax-factor: 0.15;
}

body{
  color: var(--qwood-color-text);
  background: var(--qwood-color-bg);
}

/* ============================================================
   SCROLL-REVEAL SYSTEM — Nordic Forest
   Clases utilitarias para animaciones activadas por scroll.
   IntersectionObserver añade .is-visible al entrar en viewport.
   ============================================================ */

/* --- Base: oculto antes de entrar --- */
[data-qw-reveal]{
  opacity: 0;
  will-change: opacity, transform;
  transition:
    opacity var(--qwood-speed-reveal) var(--qwood-ease),
    transform var(--qwood-speed-reveal) var(--qwood-ease);
}

/* --- Visible: estado final --- */
[data-qw-reveal].is-visible{
  opacity: 1;
  transform: none;
}

/* --- Direcciones de entrada --- */
[data-qw-reveal="up"]{ transform: translateY(var(--qwood-reveal-distance)); }
[data-qw-reveal="down"]{ transform: translateY(calc(var(--qwood-reveal-distance) * -1)); }
[data-qw-reveal="left"]{ transform: translateX(calc(var(--qwood-reveal-distance) * -1)); }
[data-qw-reveal="right"]{ transform: translateX(var(--qwood-reveal-distance)); }
[data-qw-reveal="scale"]{ transform: scale(.96); }
[data-qw-reveal="scale-up"]{
  transform: scale(.96) translateY(calc(var(--qwood-reveal-distance) * .6));
}

/* --- Stagger delays (hijos con [data-qw-delay]) --- */
[data-qw-delay="1"]{ transition-delay: calc(var(--qwood-stagger-base) * 1); }
[data-qw-delay="2"]{ transition-delay: calc(var(--qwood-stagger-base) * 2); }
[data-qw-delay="3"]{ transition-delay: calc(var(--qwood-stagger-base) * 3); }
[data-qw-delay="4"]{ transition-delay: calc(var(--qwood-stagger-base) * 4); }
[data-qw-delay="5"]{ transition-delay: calc(var(--qwood-stagger-base) * 5); }
[data-qw-delay="6"]{ transition-delay: calc(var(--qwood-stagger-base) * 6); }
[data-qw-delay="7"]{ transition-delay: calc(var(--qwood-stagger-base) * 7); }
[data-qw-delay="8"]{ transition-delay: calc(var(--qwood-stagger-base) * 8); }

/* --- Slow reveal (secciones grandes) --- */
[data-qw-reveal-slow]{
  opacity: 0;
  will-change: opacity, transform;
  transition:
    opacity var(--qwood-speed-reveal-slow) var(--qwood-ease),
    transform var(--qwood-speed-reveal-slow) var(--qwood-ease);
}
[data-qw-reveal-slow].is-visible{
  opacity: 1;
  transform: none;
}
[data-qw-reveal-slow="up"]{ transform: translateY(36px); }
[data-qw-reveal-slow="scale"]{ transform: scale(.94); }

/* --- Prefers reduced motion: skip all animations --- */
@media (prefers-reduced-motion: reduce){
  [data-qw-reveal],
  [data-qw-reveal-slow]{
    opacity: 1;
    transform: none;
    transition: none;
    will-change: auto;
  }
}

/* ============================================================
   WHATSAPP FAB — botón flotante circular global
   Posición: bottom-left (CMP FAB vive bottom-right)
   En móvil: atenuación sutil idle → plena al interactuar.
   ============================================================ */
.qw-wa-fab{
  position:fixed;
  left:18px;
  bottom:18px;
  z-index:999998;
  width:48px;
  height:48px;
  border-radius:999px;
  background:#25D366;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  box-shadow:0 4px 14px rgba(0,0,0,.18);
  border:none;
  cursor:pointer;
  transition:opacity .25s ease, transform .18s ease, box-shadow .18s ease;
}
.qw-wa-fab svg{ width:24px; height:24px; flex:0 0 auto; }
.qw-wa-fab:hover,
.qw-wa-fab:focus-visible{
  transform:translateY(-2px);
  box-shadow:0 8px 24px rgba(0,0,0,.22);
  opacity:1 !important;
}
.qw-wa-fab:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(37,211,102,.30), 0 8px 24px rgba(0,0,0,.22);
}
.qw-wa-fab:active{ transform:translateY(0); }

@media (max-width:860px){
  .qw-wa-fab{
    opacity:0.72;
    left:14px;
    bottom:14px;
    width:44px;
    height:44px;
  }
  .qw-wa-fab svg{ width:22px; height:22px; }
}

/* ============================================================
   COMPONENT UTILITIES — Shared across installer, customer, admin
   Pattern: .qw-* namespace, consumes SSOT tokens.
   Added: 2026-03-27
   ============================================================ */

/* --- Focus ring unificado --- */
*:focus-visible{
  outline: none;
  box-shadow: var(--qwood-ring);
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline: none;
  box-shadow: var(--qwood-ring-strong);
}

/* --- Badge semántico --- */
.qw-badge{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 12px;
  border-radius: var(--qwood-radius-pill);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1.4;
  white-space: nowrap;
  font-family: var(--qwood-font);
}
.qw-badge--ok{
  background: var(--qwood-color-ok-soft);
  color: #047857;
}
.qw-badge--warn{
  background: var(--qwood-color-warn-soft);
  color: #92400e;
}
.qw-badge--danger{
  background: var(--qwood-color-danger-soft);
  color: #991b1b;
}
.qw-badge--info{
  background: var(--qwood-color-info-soft);
  color: #0369a1;
}
.qw-badge--primary{
  background: var(--qwood-color-primary-soft);
  color: var(--qwood-color-primary-dark);
}
.qw-badge--muted{
  background: rgba(15,23,42,.06);
  color: var(--qwood-color-muted);
}

/* --- Panel card reutilizable --- */
.qw-panel{
  background: var(--qwood-color-card-bg);
  border: 1px solid var(--qwood-color-border);
  border-radius: var(--qwood-radius-lg);
  padding: var(--qwood-space-6);
  box-shadow: var(--qwood-shadow-soft);
  transition: box-shadow var(--qwood-speed) var(--qwood-ease);
}
.qw-panel:hover{
  box-shadow: var(--qwood-shadow-card);
}
.qw-panel__title{
  font-family: var(--qwood-font);
  font-size: clamp(15px, 1.1vw, 17px);
  font-weight: 700;
  color: var(--qwood-color-text);
  margin: 0 0 var(--qwood-space-3);
  letter-spacing: -.01em;
}
.qw-panel__subtitle{
  font-size: 13px;
  color: var(--qwood-color-muted);
  margin: 0 0 var(--qwood-space-4);
  line-height: 1.5;
}

/* --- Botón QWOOD canónico ---
   DUAL NAMING: la base de código usa en paralelo BEM (.qw-btn--primary) y
   concat-guion (.qw-btn-primary). Ambas convenciones comparten estas reglas
   canónicas para asegurar coherencia visual. Audit 2026-04-20. */
.qw-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 22px;
  border: none;
  border-radius: var(--qwood-radius-sm);
  font-family: var(--qwood-font);
  font-size: var(--qwood-fs-base);
  font-weight: var(--qwood-fw-semibold);
  cursor: pointer;
  transition:
    background var(--qwood-speed-fast) var(--qwood-ease),
    box-shadow var(--qwood-speed) var(--qwood-ease),
    transform var(--qwood-speed-fast) var(--qwood-ease);
  text-decoration: none;
  line-height: 1.4;
}
.qw-btn:active{ transform: translateY(1px); }
.qw-btn--primary,
.qw-btn-primary{
  background: var(--qwood-color-primary);
  color: #fff;
}
.qw-btn--primary:hover,
.qw-btn-primary:hover{
  background: var(--qwood-color-primary-hover);
  box-shadow: 0 8px 20px var(--qwood-color-primary-ring);
}
.qw-btn--secondary,
.qw-btn-secondary{
  background: transparent;
  color: var(--qwood-color-text);
  border: 1px solid var(--qwood-color-border);
}
.qw-btn--secondary:hover,
.qw-btn-secondary:hover{
  background: rgba(15,23,42,.04);
  border-color: rgba(15,23,42,.18);
}
.qw-btn--danger,
.qw-btn-danger{
  background: var(--qwood-color-danger);
  color: #fff;
}
.qw-btn--danger:hover,
.qw-btn-danger:hover{
  background: #dc2626;
  box-shadow: 0 8px 20px var(--qwood-color-danger-soft);
}
.qw-btn--sm,
.qw-btn-sm,
.qw-btn-mini{ padding: 6px 14px; font-size: var(--qwood-fs-sm); }
.qw-btn--lg,
.qw-btn-lg{ padding: 14px 28px; font-size: var(--qwood-fs-md); }
.qw-btn[disabled],
.qw-btn.qw-btn-disabled,
.qw-btn.qw-btn--disabled{
  opacity: .45;
  cursor: not-allowed;
  pointer-events: none;
}

/* --- Stat card (dashboard summaries) --- */
.qw-stat{
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: var(--qwood-space-4) var(--qwood-space-5);
  background: var(--qwood-color-card-bg);
  border: 1px solid var(--qwood-color-border);
  border-radius: var(--qwood-radius-md);
}
.qw-stat__label{
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--qwood-color-muted);
}
.qw-stat__value{
  font-family: var(--qwood-font);
  font-size: clamp(22px, 2vw, 28px);
  font-weight: 700;
  color: var(--qwood-color-text);
  line-height: 1.2;
  letter-spacing: -.02em;
}
.qw-stat__value--ok{ color: var(--qwood-color-ok); }
.qw-stat__value--warn{ color: var(--qwood-color-warn); }
.qw-stat__value--danger{ color: var(--qwood-color-danger); }

/* --- Data table clean --- */
.qw-table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
  font-family: var(--qwood-font);
}
.qw-table th{
  text-align: left;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--qwood-color-muted);
  padding: var(--qwood-space-3) var(--qwood-space-4);
  border-bottom: 1px solid var(--qwood-color-border);
  background: var(--qwood-color-card-bg-soft);
}
.qw-table td{
  padding: var(--qwood-space-3) var(--qwood-space-4);
  border-bottom: 1px solid var(--qwood-color-border-soft);
  color: var(--qwood-color-text);
  vertical-align: middle;
}
.qw-table tbody tr:hover td{
  background: rgba(27,207,23,.03);
}
.qw-table tbody tr:last-child td{
  border-bottom: none;
}

/* --- Input field SSOT --- */
.qw-input{
  font-family: var(--qwood-font);
  font-size: 14px;
  padding: 10px 14px;
  border: 1px solid var(--qwood-color-border);
  border-radius: var(--qwood-radius-sm);
  background: var(--qwood-color-card-bg);
  color: var(--qwood-color-text);
  transition: border-color var(--qwood-speed-fast) var(--qwood-ease), box-shadow var(--qwood-speed-fast) var(--qwood-ease);
  width: 100%;
}
.qw-input::placeholder{
  color: var(--qwood-color-muted-soft);
}
.qw-input:focus{
  border-color: var(--qwood-color-primary);
  box-shadow: var(--qwood-ring);
}
.qw-input--error{
  border-color: var(--qwood-color-danger);
  box-shadow: 0 0 0 3px var(--qwood-color-danger-soft);
}

/* --- Empty state --- */
.qw-empty{
  text-align: center;
  padding: var(--qwood-space-12) var(--qwood-space-6);
  color: var(--qwood-color-muted);
}
.qw-empty__icon{
  font-size: 40px;
  margin-bottom: var(--qwood-space-3);
  opacity: .4;
}
.qw-empty__text{
  font-size: 14px;
  max-width: 320px;
  margin: 0 auto;
  line-height: 1.6;
}

/* --- Responsive grid utility --- */
.qw-grid{
  display: grid;
  gap: var(--qwood-space-4);
}
.qw-grid--2{ grid-template-columns: repeat(2, 1fr); }
.qw-grid--3{ grid-template-columns: repeat(3, 1fr); }
.qw-grid--4{ grid-template-columns: repeat(4, 1fr); }
@media (max-width: 768px){
  .qw-grid--2, .qw-grid--3, .qw-grid--4{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 960px){
  .qw-grid--3, .qw-grid--4{
    grid-template-columns: repeat(2, 1fr);
  }
}

/* =====================================================================
   ELIMINACIÓN DE GAP INTER-SECCIÓN
   Aplica a TODAS las páginas EXCEPTO:  home, catálogo, ficha producto
   ===================================================================== */
body:not(.home):not(.post-type-archive-product):not(.single-product):not(.woocommerce-shop) .site-main{
  margin-bottom:0;
}
body:not(.home):not(.post-type-archive-product):not(.single-product):not(.woocommerce-shop) article.hentry{
  margin-bottom:0;
}

/* About page — cerrar gaps entre hero, secciones y CTA */
body.qw-about-page .qw-about .qw-wrap{
  padding-top:0;
  padding-bottom:0;
}
body.qw-about-page .qw-about .qw-sections{
  margin-top:0;
}
body.qw-about-page .qw-about .qw-cta-band{
  margin-top:0;
}

/* Informative landings — cerrar gaps en wraps */
body:not(.home):not(.post-type-archive-product):not(.single-product) .qw-rso .qw-rso__wrap,
body:not(.home):not(.post-type-archive-product):not(.single-product) .qw-la .qw-la__wrap,
body:not(.home):not(.post-type-archive-product):not(.single-product) .qw-du .qw-du__wrap{
  padding-top:0;
  padding-bottom:0;
}

/* Legal / formularios / otras páginas — cerrar gaps wrapper */
body:not(.home):not(.post-type-archive-product):not(.single-product) .qw-legal .qw-legal-wrap{
  padding-top:0;
  padding-bottom:0;
}
body:not(.home):not(.post-type-archive-product):not(.single-product) .qw-careers .qw-careers-wrap{
  padding-top:0;
  padding-bottom:0;
}

/* =====================================================================
   QWOOD BRAND NAME — rounded font for "QWOOD" text mentions (2026-04-09)
   =====================================================================
   Wrapped automatically by assets/js/qw-brand-name.js into:
     <span class="qw-brand">QWOOD</span>
   Renders the brand name with a soft rounded font (Quicksand) instead of
   inheriting Montserrat from surrounding copy. The wrapper preserves the
   surrounding font-size, color and weight by inheriting them — only the
   font-family is overridden.
   ===================================================================== */
.qw-brand{
  font-family: var(--qwood-font-brand, "M PLUS Rounded 1c", "Varela Round", sans-serif);
  font-weight: 800;
  letter-spacing: 0.005em;
  /* Optical adjustment: M PLUS Rounded 1c es ligeramente más compacta que
     Montserrat, por lo que mantenemos 1em (sin shrink) y un letter-spacing
     mínimo positivo para que las letras curvas no se peguen visualmente. */
  font-size: 1em;
}