.elementor-kit-6{--e-global-color-primary:#D9AC9C;--e-global-color-secondary:#D9C7AD;--e-global-color-text:#3A342E;--e-global-color-accent:#B4674D;--e-global-color-bone001:#EEE9E2;--e-global-color-crema01:#F5F1EB;--e-global-color-malva01:#E7DCE2;--e-global-color-tierra1:#8A6A55;--e-global-color-minera1:#5F8A93;--e-global-color-cacao01:#54402A;--e-global-color-hover01:#8A4F38;--e-global-color-cuerpo1:#4A443D;--e-global-color-menu001:#D3BCB8;--e-global-color-boton01:#BBA09E;--e-global-typography-primary-font-family:"Cormorant Garamond";--e-global-typography-primary-font-weight:300;--e-global-typography-secondary-font-family:"Cormorant Garamond";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Montserrat";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Montserrat";--e-global-typography-accent-font-weight:600;--e-global-typography-intro01-font-family:"Montserrat";--e-global-typography-intro01-font-size:1.25rem;--e-global-typography-intro01-font-weight:400;--e-global-typography-intro01-line-height:1.85em;--e-global-typography-destac1-font-family:"Montserrat";--e-global-typography-destac1-font-size:1.125rem;--e-global-typography-destac1-font-weight:400;--e-global-typography-destac1-line-height:1.9em;--e-global-typography-menu001-font-family:"Montserrat";--e-global-typography-menu001-font-size:1.0625rem;--e-global-typography-menu001-font-weight:600;--e-global-typography-menu001-text-transform:uppercase;--e-global-typography-menu001-letter-spacing:0.06em;--e-global-typography-antet01-font-family:"Montserrat";--e-global-typography-antet01-font-size:1.125rem;--e-global-typography-antet01-font-weight:600;--e-global-typography-antet01-text-transform:uppercase;--e-global-typography-antet01-letter-spacing:0.2em;--e-global-typography-h1port1-font-family:"Cormorant Garamond";--e-global-typography-h1port1-font-size:4rem;--e-global-typography-h1port1-font-weight:300;--e-global-typography-h1port1-font-style:italic;--e-global-typography-h1port1-line-height:1.08em;--e-global-typography-h1port1-letter-spacing:0.005em;--e-global-typography-cita001-font-family:"Cormorant Garamond";--e-global-typography-cita001-font-size:1.3125rem;--e-global-typography-cita001-font-weight:400;--e-global-typography-cita001-font-style:italic;--e-global-typography-catego1-font-family:"Montserrat";--e-global-typography-catego1-font-size:1.1875rem;--e-global-typography-catego1-font-weight:600;--e-global-typography-catego1-text-transform:uppercase;--e-global-typography-catego1-letter-spacing:0.1em;--e-global-typography-piecol1-font-family:"Montserrat";--e-global-typography-piecol1-font-size:0.75rem;--e-global-typography-piecol1-font-weight:400;--e-global-typography-piecol1-text-transform:uppercase;--e-global-typography-piecol1-letter-spacing:0.22em;--e-global-typography-pieleg1-font-family:"Montserrat";--e-global-typography-pieleg1-font-size:0.6875rem;--e-global-typography-pieleg1-font-weight:400;--e-global-typography-pieleg1-text-transform:uppercase;--e-global-typography-pieleg1-letter-spacing:0.12em;background-color:var( --e-global-color-bone001 );color:var( --e-global-color-cuerpo1 );font-family:"Montserrat", Sans-serif;font-size:1.125rem;font-weight:400;line-height:1.9em;}.elementor-kit-6 button,.elementor-kit-6 input[type="button"],.elementor-kit-6 input[type="submit"],.elementor-kit-6 .elementor-button{background-color:var( --e-global-color-boton01 );font-family:"Montserrat", Sans-serif;font-size:1rem;font-weight:600;text-transform:uppercase;letter-spacing:0.12em;color:var( --e-global-color-text );border-radius:100px 100px 100px 100px;padding:17px 44px 17px 44px;}.elementor-kit-6 button:hover,.elementor-kit-6 button:focus,.elementor-kit-6 input[type="button"]:hover,.elementor-kit-6 input[type="button"]:focus,.elementor-kit-6 input[type="submit"]:hover,.elementor-kit-6 input[type="submit"]:focus,.elementor-kit-6 .elementor-button:hover,.elementor-kit-6 .elementor-button:focus{background-color:var( --e-global-color-text );color:var( --e-global-color-crema01 );}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 a{color:var( --e-global-color-accent );font-family:"Montserrat", Sans-serif;font-size:1rem;}.elementor-kit-6 a:hover{color:var( --e-global-color-hover01 );}.elementor-kit-6 h1{color:var( --e-global-color-cuerpo1 );font-family:"Cormorant Garamond", Sans-serif;font-size:3.875rem;font-weight:300;line-height:1.04em;letter-spacing:0.01em;}.elementor-kit-6 h2{color:var( --e-global-color-cuerpo1 );font-family:"Cormorant Garamond", Sans-serif;font-size:3.5rem;font-weight:300;line-height:1.06em;letter-spacing:0.01em;}.elementor-kit-6 h3{color:var( --e-global-color-cuerpo1 );font-family:"Cormorant Garamond", Sans-serif;font-size:2.5rem;font-weight:300;font-style:italic;line-height:1.3em;}.elementor-kit-6 h4{color:var( --e-global-color-text );font-family:"Montserrat", Sans-serif;font-size:1.1875rem;font-weight:600;letter-spacing:0.1em;}.elementor-kit-6 img{border-radius:0px 0px 0px 0px;}.elementor-kit-6 label{color:var( --e-global-color-tierra1 );font-family:"Montserrat", Sans-serif;font-size:0.6875rem;font-weight:600;text-transform:uppercase;letter-spacing:0.22em;}.elementor-kit-6 input:not([type="button"]):not([type="submit"]),.elementor-kit-6 textarea,.elementor-kit-6 .elementor-field-textual{font-family:"Montserrat", Sans-serif;font-size:1rem;color:var( --e-global-color-text );background-color:#FFFFFF;border-style:none;border-radius:4px 4px 4px 4px;padding:14px 16px 14px 16px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-kit-6{--e-global-typography-h1port1-font-size:3.25rem;font-size:1rem;}.elementor-kit-6 h1{font-size:3rem;}.elementor-kit-6 h2{font-size:2.625rem;}.elementor-kit-6 h3{font-size:2.125rem;}.elementor-kit-6 h4{font-size:1.1875rem;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-6{--e-global-typography-h1port1-font-size:2.375rem;font-size:1.0625rem;}.elementor-kit-6 h1{font-size:2.25rem;}.elementor-kit-6 h2{font-size:2rem;}.elementor-kit-6 h3{font-size:1.75rem;}.elementor-kit-6 h4{font-size:1.125rem;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* --- Cabecera pegada al hacer scroll ---
El diseño la define con position:sticky, no con el sticky de Elementor.
Se replica igual: es CSS plano, no depende de Pro y no hay que adivinar
ninguna clave del widget. El filete inferior es el del diseño. */
.elementor-location-header {
position: sticky;
top: 0;
z-index: 50;
border-bottom: 1px solid rgba(90, 64, 52, 0.14);
}
/* --- Cabecera: item de menú activo ---
El diseño marca la página actual con un subrayado además del cambio de
color. Se añade con currentColor para no inventar un color que no está
en la paleta del kit. */
.elementor-location-header .elementor-nav-menu a.elementor-item-active {
border-bottom: 1px solid currentColor;
}
/* --- Cabecera: el enlace de Instagram como píldora ---
Por href y no por clase: las tools no ponen clases a una entrada de menú.
Acotado a la cabecera o alcanza también al del pie, que no lleva píldora.
El !important del hover es necesario: el color de hover del widget de menú
carga después que esta hoja y gana. */
.elementor-location-header .elementor-nav-menu a.elementor-item[href*="instagram.com"] {
border: 1px solid var(--e-global-color-text);
border-radius: 999px;
padding: 8px 16px;
transition: background-color .3s ease, color .3s ease;
}
.elementor-location-header .elementor-nav-menu a.elementor-item[href*="instagram.com"]:hover,
.elementor-location-header .elementor-nav-menu a.elementor-item[href*="instagram.com"]:focus {
background-color: var(--e-global-color-text);
color: var(--e-global-color-crema01) !important;
}
.elementor-location-header .elementor-nav-menu--dropdown a.elementor-item[href*="instagram.com"] {
display: flex;
min-height: 44px;
margin: 16px 20px 20px;
align-items: center;
justify-content: center;
}
/* --- Retratos girados ---
La guía los define así: rotación ±2.2° y sombra 0 24px 60px
rgba(74,68,61,0.18). El de la izquierda gira al revés que el de la
derecha, como en el diseño. Van por clase del widget porque el CSS por
elemento el conector no lo deja escribir. */
.retrato-izquierda img,
.retrato-derecha img {
box-shadow: 0 24px 60px rgba(74, 68, 61, 0.18);
display: block;
width: 100%;
object-fit: cover;
}
.retrato-izquierda img {
transform: rotate(-2.2deg);
height: 620px;
border-radius: 3px;
object-position: center 30%;
}
.retrato-derecha img {
transform: rotate(2.2deg);
height: 540px;
border-radius: 3px;
object-position: center 40%;
}
@media (max-width: 767px) {
.retrato-izquierda img { height: 420px; transform: rotate(-1.2deg); }
.retrato-derecha img { height: 440px; transform: rotate(1.2deg); }
}
/* --- Tarjetas de categoría ---
380px de alto y radio 4, como el diseño. Sin la altura fija cada foto
manda la suya y la rejilla queda irregular. */
.tarjeta-categoria img {
display: block;
width: 100%;
height: 380px;
object-fit: cover;
border-radius: 4px;
}
/* --- Galería de producto (páginas de categoría) ---
400px de alto y radio 4, como pide el diseño para los seis huecos de la
sección Galería. La clase _css_classes de un widget de imagen cae en el
DIV contenedor del widget, no en el — igual que .tarjeta-categoria,
por eso la regla apunta a ".galeria-foto img" y no a ".galeria-foto" a
secas. Sin esto el conserva su alto natural (aquí 530px sobre
353px de ancho) y desborda su caja, pisando la fila de abajo. */
.galeria-foto img {
display: block;
width: 100%;
height: 400px;
object-fit: cover;
border-radius: 4px;
}
/* La segunda fila arranca desplazada media tarjeta, para que las tres
últimas queden centradas bajo las cuatro de arriba.
NOTA: esta regla no llega a aplicarse — _css_classes en un contenedor no
se renderiza en el HTML (confirmado en Elementor 4.2.2, ver
ampliar-widgets.md). Queda de documentación de la intención de diseño;
el centrado real lo da flex-wrap + justify-content:center del padre. */
@media (min-width: 1025px) {
.segunda-fila-inicio {
margin-left: calc(12.5% + 13px);
}
}
/* --- Cita dentro del párrafo ---
Cormorant cursiva 21px, en el flujo del texto y no como línea aparte. */
.cita-meraki {
font-family: 'Cormorant Garamond', serif;
font-style: italic;
font-size: 21px;
}
/* --- Migas de pan de la cabecera de categoría ---
Los enlaces heredan el color y el tamaño del span que los envuelve, en
vez de coger el accent y el 1rem del enlace global del kit. Sin
font-size:inherit el texto sale a 16px en vez de a los 11px del diseño,
aunque el contenedor mida bien: el tamaño del no hereda solo. */
.migas-categoria a {
color: inherit;
font-size: inherit;
text-decoration: none;
}
/* --- Espaciado y color del formulario de contacto ---
El label no tenía separación con su campo (0px) y los campos entre sí
quedaban a 10px de fábrica; el diseño pide 10px label-campo y 26px entre
campos. No son ajustes del kit — son clases fijas de Elementor Forms
(elementor-field-group, elementor-field-label), estables entre webs.
El !important es necesario en las tres propiedades: Elementor genera por
cada página su propia regla para el label del formulario
(.elementor-widget-form .elementor-field-group > label), que en
especificidad le gana a esta porque además de las dos clases suma el
propio elemento