Envíos a toda Colombia
Envíos a toda Colombia
Mr & Mrs.
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 4.25rem | 3rem | 2.25rem |
| line-height | 1.02em | hereda | hereda |
| letter-spacing | -0.02em | hereda | hereda |
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 3.375rem | 2.5rem | 2.5rem |
| line-height | 1.05em | hereda | hereda |
| letter-spacing | -0.02em | hereda | hereda |
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 3.25rem | 2.375rem | 2.2rem |
| line-height | 1.08em | hereda | hereda |
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 2.5rem | 2rem | 1.625rem |
| line-height | 1.02em | hereda | hereda |
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 2.25rem | 1.875rem | 1.8rem |
| line-height | 1.12em | hereda | hereda |
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 1.75rem | 1.5rem | 1.25rem |
| line-height | 1.02em | hereda | hereda |
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 1.5rem | 1.375rem | 1.25rem |
| line-height | 1.2em | hereda | hereda |
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 1.25rem | 1.1rem | 1.0625rem |
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 1.1rem | 1rem | 1.1rem |
| line-height | 1.6em | hereda | hereda |
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 1rem | 0.95rem | 0.85rem |
| line-height | 1.5em | hereda | hereda |
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 1rem | 0.85rem | hereda |
El veloz murciélago hindú comía feliz cardillo y kiwi
| Propiedad | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| font-size | 0.85rem | 0.85rem | hereda |
| line-height | 1em | hereda | hereda |
| letter-spacing | 0.14em | hereda | hereda |
Párrafo de texto corrido para evaluar el ritmo de lectura y el interlineado definidos en Theme Style. Incluye un enlace de ejemplo, texto en negrita y en cursiva.
Estos elementos no llevan estilos propios: heredan directamente lo definido en Site Settings → Theme Style.
.mm-btn--primary
CTA principal de marketing. Uno por bloque.
.mm-btn--secondary
Acción de menor prioridad. Siempre acompañando a un primary, nunca sola.
.mm-btn--dark
Utilidad y consentimiento. Único elemento del sistema con 4px de radio.
.mm-btn--link
Acción terciaria, texto subrayado sin caja. Sin padding: el tamaño solo cambia la letra.
Modificadores
Se suman a cualquier variante y tamaño.
Los botones no varían por breakpoint: mismos valores en desktop, tablet y mobile.
.pad-card
padding (4 lados)
Padding interno de una tarjeta: el aire entre el borde de la tarjeta y su contenido.
| Breakpoint | Valor |
|---|---|
| Desktop | 32px |
| Tablet | 24px |
| Mobile | 16px |
Container que actúa como tarjeta (ej. columna de "Cómo funciona", card de producto).
La trama diagonal es el espacio que genera la clase.
Medido en el navegador: —.section-y
padding-top + padding-bottom
Aire vertical arriba y abajo de una sección completa, para separarla de la sección anterior y la siguiente.
| Breakpoint | Valor |
|---|---|
| Desktop | 96px |
| Tablet | 64px |
| Mobile | 48px |
Container exterior que envuelve una sección entera de la página.
La trama diagonal es el espacio que genera la clase.
Medido en el navegador: —.gap-stack
gap
Separación entre elementos apilados verticalmente dentro de un mismo Container (ícono → título → texto).
| Breakpoint | Valor |
|---|---|
| Desktop | 24px |
| Tablet | 24px |
| Mobile | 16px |
Container con Direction: Column, cuando sus hijos van uno debajo del otro.
La trama diagonal es el espacio que genera la clase.
Medido en el navegador: —.gap-inline
gap
Separación entre elementos puestos en fila (ícono + texto corto, por ejemplo un badge).
| Breakpoint | Valor |
|---|---|
| Desktop | 12px |
| Tablet | 12px |
| Mobile | 12px |
Container con Direction: Row, con pocos elementos cortos adentro.
La trama diagonal es el espacio que genera la clase.
Medido en el navegador: —| ✓ | Una clase de padding + una de gap.pad-card gap-stack |
| ✕ | Dos clases de padding juntas.pad-card + section-y compiten por padding-top/bottom → anidar en vez de combinar. |
| ✕ | Dos clases de gap juntas.gap-stack + gap-inline compiten por gap → cada Container usa una sola. |
| Ajuste | Desktop | Tablet ≤ 1024px | Mobile ≤ 767px |
|---|---|---|---|
| Ancho de contenedor | 1200px | hereda | hereda |
| Espacio entre widgets | 16px | hereda | hereda |
"Hereda" significa que ese breakpoint no tiene valor propio en el kit y usa el del breakpoint mayor. No es un dato faltante: es una decisión de diseño.