nativo del
template (ver functions.php: filtro woocommerce_product_description_heading
con prioridad 20, que gana sobre el __return_empty_string del tema padre;
estilos de color/tamaño/separador del viven ahí mismo, junto al
::after de la hoja, para mantener ambos juntos). Este pseudo-elemento
genérico queda retirado para no duplicar el heading. :first-child porque
algunos productos (ej. Frijol de Palo) traen su PROPIO real dentro
de la descripción (contenido real, no debe heredar este estilo). */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description > h2:first-child {
font-size: 19px;
font-weight: 700;
line-height: 1.3;
}
/* [Fase 2.6, punto 2] Rótulo propio del producto (párrafo pegado a la
lista — dato real de post_content, confirmado con SQL: la mayoría de
productos con checklist traen literalmente "Especificaciones:" antes del
, ej. post 663). Redundante visualmente contra el nuevo heading
"Descripción y especificaciones" ya presente arriba. Se oculta SOLO en
single product vía CSS — el dato sigue en post_content sin tocar, por si
se necesita en otro contexto (feed, admin, etc.). No se borra contenido:
los - con los datos reales siguen intactos e inalterados debajo.
[Corrección — bug real encontrado] Esta regla ocultaba CUALQUIER
pegado a una
, sin distinguir un rótulo corto ("Especificaciones:")
de un párrafo con contenido real. Producto real afectado: Frijol
Canario Peruano en Saco de 25kg (post 358) trae
"![]()
Beneficios y Propiedades:
" pegado a su — la imagen entera desaparecía junto
con el rótulo. Se excluye explícitamente cualquier que contenga una
imagen alineada (:has(img.alignleft), :has(img.alignright)): esos SÍ
deben seguir visibles siempre, es contenido real, no un rótulo vacío. */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description p:has(+ ul):not(:has(img.alignleft)):not(:has(img.alignright)) {
display: none;
}
/* [Fase 2.6, punto 2] Con el rótulo ahora oculto (arriba), la lista ya NO
debe perder su propia divisoria/espaciado — antes esta regla los ponía a
0 asumiendo que el rótulo visible ya aportaba el borde superior. Con el
rótulo display:none, "p + ul" seguía matcheando igual (display:none no
saca al elemento del DOM ni de los selectores de hermanos), así que sin
este ajuste la lista quedaba pegada al heading sin separación. Se deja
que el
use su borde/spacing propio (regla base de arriba) también
en este caso. */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description p + ul::before {
content: none;
}
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul li {
position: relative;
margin: 0;
padding-left: 34px;
}
/* El padre separa ítems con li+li margin-top; aquí manda el row-gap */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul li + li {
margin-top: 0;
}
/* [Fase 2, punto 11] Check minimalista: círculo blanco de 22px con borde y
tilde. Antes usaba var(--oz-brand-accent) = #9bca46 (confirmado en Fase
1.5, riesgo 5) — discrepancia real de 1 unidad por canal RGB contra el
verde que Home usa hardcodeado (#9CCB47) en sus cards/separadores. Se
fija el valor exacto de Home aquí (color LOCAL a esta sección, NO se
toca la variable --oz-brand-accent global ni :root). */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul li::before {
content: "✓";
position: absolute;
left: 0;
top: 0;
width: 22px;
height: 22px;
box-sizing: border-box;
border: 1.5px solid #9CCB47;
border-radius: 50%;
background: #ffffff;
color: #9CCB47;
font-size: 11px;
font-weight: 700;
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
}
/* 6. Responsive: tabs usables, beneficios a 1 columna, menos padding,
sin desbordes. */
@media (max-width: 767px) {
body .oz-single-product .woocommerce-tabs {
padding: 18px 16px 22px;
border-radius: 10px;
}
body .oz-single-product .woocommerce-tabs ul.tabs {
gap: 0 1.25rem;
}
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul {
grid-template-columns: 1fr;
column-gap: 0;
row-gap: 14px;
}
}
/* =========================================================================
SERVICIOS — flujo de 6 etapas (Procesamiento/Distribución sin foto real
todavía). Slot de imagen reservado: aspect-ratio/tamaño fijos vía CSS,
sin texto "placeholder"/"pendiente" visible. Reemplazable desde Medios
por la compañera del cliente sin tocar código. Scoped a la página
Servicios (is_page(136)) desde el bloque que lo usa. */
.oz-servicios-img-slot {
display: block;
width: 100%;
aspect-ratio: 4 / 3;
border-radius: 10px;
background: linear-gradient(135deg, #eef1e8 0%, #e4ebda 100%);
border: 1px solid #dde3d2;
}
/* Botón CTA de WhatsApp al cierre de las 6 etapas (Punto 7, sección 3C del
brief) — banda azul institucional, mismo tono que el resto del sitio.
Botón blanco sobre fondo azul para máximo contraste/legibilidad. */
.oz-servicios-wsp-cta {
display: inline-block;
margin-top: 8px;
padding: 14px 32px;
background: #ffffff;
color: #1F589F;
font-weight: 600;
border-radius: 999px;
text-decoration: none;
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.oz-servicios-wsp-cta:hover,
.oz-servicios-wsp-cta:focus-visible {
color: #1F589F;
transform: translateY(-1px);
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}
/* =========================================================================
NOSOTROS/COMPAÑÍA — sección "Nuestra Trayectoria" (entre Introducción y
Misión/Visión). Slot reservado con el mismo mecanismo de Servicios, pero
look propio (radius mayor, sombra sutil) para que la sección tenga
personalidad distinta al zigzag de Servicios. */
.oz-compania-trayectoria-slot {
display: block;
width: 100%;
height: 100%;
border-radius: 14px;
background: linear-gradient(135deg, #eaf0f8 0%, #dde8f5 100%);
border: 1px solid #cfdcee;
box-shadow: 0 6px 20px rgba(31, 88, 159, 0.08);
overflow: hidden;
}
.oz-compania-trayectoria-slot img {
display: block;
}
@media (max-width: 767px) {
body.page-id-134 .oz-pb-r-2-c-0,
body.page-id-134 .oz-pb-r-2-c-1 {
text-align: center;
}
}
/* =========================================================================
BOTÓN FLOTANTE DE WHATSAPP (Punto 7, sección 5-6 del brief) — implementación
propia, sin plugin externo. Esquina inferior derecha, icono reconocible,
no cubre contenido (tamaño moderado + margen fijo), visible en
desktop/mobile, sin animación de rebote/pulso (solo transform sutil en
hover, respeta prefers-reduced-motion), sin auto-popup. Punto único fijo
en toda la navegación — no compite con otro elemento fixed conocido en
este child theme (.oz-cat-drawer es un overlay de pantalla completa que
solo se activa al abrir el drawer de categorías, no una esquina fija). */
.oz-wsp-float {
position: fixed;
right: 20px;
bottom: 20px;
z-index: 9000;
display: flex;
align-items: center;
justify-content: center;
width: 56px;
height: 56px;
border-radius: 50%;
background: #25D366;
color: #ffffff;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.oz-wsp-float:hover,
.oz-wsp-float:focus-visible {
color: #ffffff;
transform: scale(1.06);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}
@media (max-width: 480px) {
.oz-wsp-float {
right: 14px;
bottom: 14px;
width: 50px;
height: 50px;
}
}
@media (prefers-reduced-motion: reduce) {
.oz-wsp-float {
transition: none;
}
}
/* Presentaciones/formatos reales en ficha de producto mayorista (Cierre de
observaciones, Punto 2) — mismo criterio visual que .oz-envasado-meta,
sin badge de marca (los mayoristas no tienen marca propia). */
.oz-mayorista-meta {
display: flex;
align-items: baseline;
flex-wrap: wrap;
gap: 6px;
/* El bloque ahora se imprime DEBAJO del título + separador (hook de
woocommerce_single_product_summary en prioridad 7, ver functions.php),
así que el aire va arriba y abajo, no solo abajo como cuando iba
encima del título. */
margin: 4px 0 18px;
}
.oz-mayorista-meta__label {
font-size: 12px;
font-weight: 700;
color: #1F589F;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.oz-mayorista-meta__pres {
font-size: 13.5px;
color: #6b7280;
}
/* =========================================================================
NOSOTROS / «NUESTRA COMPAÑÍA» (/compania/, page-id 134) — CAPA VISUAL
Por qué va aquí y no en el CSS Global del maquetador: desde OZ Maquetador
Pro V2 la fuente de verdad de «global-classes.css» es wp_options
(oz_pb_global_classes_css, ver includes/storage.php); el archivo del plugin
quedó como semilla y ya no se lee. Este style.css sí se encola por archivo
(y carga DESPUÉS del
real dentro
de la descripción (contenido real, no debe heredar este estilo). */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description > h2:first-child {
font-size: 19px;
font-weight: 700;
line-height: 1.3;
}
/* [Fase 2.6, punto 2] Rótulo propio del producto (párrafo pegado a la
lista — dato real de post_content, confirmado con SQL: la mayoría de
productos con checklist traen literalmente "Especificaciones:" antes del
, ej. post 663). Redundante visualmente contra el nuevo heading
"Descripción y especificaciones" ya presente arriba. Se oculta SOLO en
single product vía CSS — el dato sigue en post_content sin tocar, por si
se necesita en otro contexto (feed, admin, etc.). No se borra contenido:
los - con los datos reales siguen intactos e inalterados debajo.
[Corrección — bug real encontrado] Esta regla ocultaba CUALQUIER
pegado a una
, sin distinguir un rótulo corto ("Especificaciones:")
de un párrafo con contenido real. Producto real afectado: Frijol
Canario Peruano en Saco de 25kg (post 358) trae
"![]()
Beneficios y Propiedades:
" pegado a su — la imagen entera desaparecía junto
con el rótulo. Se excluye explícitamente cualquier que contenga una
imagen alineada (:has(img.alignleft), :has(img.alignright)): esos SÍ
deben seguir visibles siempre, es contenido real, no un rótulo vacío. */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description p:has(+ ul):not(:has(img.alignleft)):not(:has(img.alignright)) {
display: none;
}
/* [Fase 2.6, punto 2] Con el rótulo ahora oculto (arriba), la lista ya NO
debe perder su propia divisoria/espaciado — antes esta regla los ponía a
0 asumiendo que el rótulo visible ya aportaba el borde superior. Con el
rótulo display:none, "p + ul" seguía matcheando igual (display:none no
saca al elemento del DOM ni de los selectores de hermanos), así que sin
este ajuste la lista quedaba pegada al heading sin separación. Se deja
que el
use su borde/spacing propio (regla base de arriba) también
en este caso. */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description p + ul::before {
content: none;
}
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul li {
position: relative;
margin: 0;
padding-left: 34px;
}
/* El padre separa ítems con li+li margin-top; aquí manda el row-gap */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul li + li {
margin-top: 0;
}
/* [Fase 2, punto 11] Check minimalista: círculo blanco de 22px con borde y
tilde. Antes usaba var(--oz-brand-accent) = #9bca46 (confirmado en Fase
1.5, riesgo 5) — discrepancia real de 1 unidad por canal RGB contra el
verde que Home usa hardcodeado (#9CCB47) en sus cards/separadores. Se
fija el valor exacto de Home aquí (color LOCAL a esta sección, NO se
toca la variable --oz-brand-accent global ni :root). */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul li::before {
content: "✓";
position: absolute;
left: 0;
top: 0;
width: 22px;
height: 22px;
box-sizing: border-box;
border: 1.5px solid #9CCB47;
border-radius: 50%;
background: #ffffff;
color: #9CCB47;
font-size: 11px;
font-weight: 700;
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
}
/* 6. Responsive: tabs usables, beneficios a 1 columna, menos padding,
sin desbordes. */
@media (max-width: 767px) {
body .oz-single-product .woocommerce-tabs {
padding: 18px 16px 22px;
border-radius: 10px;
}
body .oz-single-product .woocommerce-tabs ul.tabs {
gap: 0 1.25rem;
}
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul {
grid-template-columns: 1fr;
column-gap: 0;
row-gap: 14px;
}
}
/* =========================================================================
SERVICIOS — flujo de 6 etapas (Procesamiento/Distribución sin foto real
todavía). Slot de imagen reservado: aspect-ratio/tamaño fijos vía CSS,
sin texto "placeholder"/"pendiente" visible. Reemplazable desde Medios
por la compañera del cliente sin tocar código. Scoped a la página
Servicios (is_page(136)) desde el bloque que lo usa. */
.oz-servicios-img-slot {
display: block;
width: 100%;
aspect-ratio: 4 / 3;
border-radius: 10px;
background: linear-gradient(135deg, #eef1e8 0%, #e4ebda 100%);
border: 1px solid #dde3d2;
}
/* Botón CTA de WhatsApp al cierre de las 6 etapas (Punto 7, sección 3C del
brief) — banda azul institucional, mismo tono que el resto del sitio.
Botón blanco sobre fondo azul para máximo contraste/legibilidad. */
.oz-servicios-wsp-cta {
display: inline-block;
margin-top: 8px;
padding: 14px 32px;
background: #ffffff;
color: #1F589F;
font-weight: 600;
border-radius: 999px;
text-decoration: none;
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.oz-servicios-wsp-cta:hover,
.oz-servicios-wsp-cta:focus-visible {
color: #1F589F;
transform: translateY(-1px);
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}
/* =========================================================================
NOSOTROS/COMPAÑÍA — sección "Nuestra Trayectoria" (entre Introducción y
Misión/Visión). Slot reservado con el mismo mecanismo de Servicios, pero
look propio (radius mayor, sombra sutil) para que la sección tenga
personalidad distinta al zigzag de Servicios. */
.oz-compania-trayectoria-slot {
display: block;
width: 100%;
height: 100%;
border-radius: 14px;
background: linear-gradient(135deg, #eaf0f8 0%, #dde8f5 100%);
border: 1px solid #cfdcee;
box-shadow: 0 6px 20px rgba(31, 88, 159, 0.08);
overflow: hidden;
}
.oz-compania-trayectoria-slot img {
display: block;
}
@media (max-width: 767px) {
body.page-id-134 .oz-pb-r-2-c-0,
body.page-id-134 .oz-pb-r-2-c-1 {
text-align: center;
}
}
/* =========================================================================
BOTÓN FLOTANTE DE WHATSAPP (Punto 7, sección 5-6 del brief) — implementación
propia, sin plugin externo. Esquina inferior derecha, icono reconocible,
no cubre contenido (tamaño moderado + margen fijo), visible en
desktop/mobile, sin animación de rebote/pulso (solo transform sutil en
hover, respeta prefers-reduced-motion), sin auto-popup. Punto único fijo
en toda la navegación — no compite con otro elemento fixed conocido en
este child theme (.oz-cat-drawer es un overlay de pantalla completa que
solo se activa al abrir el drawer de categorías, no una esquina fija). */
.oz-wsp-float {
position: fixed;
right: 20px;
bottom: 20px;
z-index: 9000;
display: flex;
align-items: center;
justify-content: center;
width: 56px;
height: 56px;
border-radius: 50%;
background: #25D366;
color: #ffffff;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.oz-wsp-float:hover,
.oz-wsp-float:focus-visible {
color: #ffffff;
transform: scale(1.06);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}
@media (max-width: 480px) {
.oz-wsp-float {
right: 14px;
bottom: 14px;
width: 50px;
height: 50px;
}
}
@media (prefers-reduced-motion: reduce) {
.oz-wsp-float {
transition: none;
}
}
/* Presentaciones/formatos reales en ficha de producto mayorista (Cierre de
observaciones, Punto 2) — mismo criterio visual que .oz-envasado-meta,
sin badge de marca (los mayoristas no tienen marca propia). */
.oz-mayorista-meta {
display: flex;
align-items: baseline;
flex-wrap: wrap;
gap: 6px;
/* El bloque ahora se imprime DEBAJO del título + separador (hook de
woocommerce_single_product_summary en prioridad 7, ver functions.php),
así que el aire va arriba y abajo, no solo abajo como cuando iba
encima del título. */
margin: 4px 0 18px;
}
.oz-mayorista-meta__label {
font-size: 12px;
font-weight: 700;
color: #1F589F;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.oz-mayorista-meta__pres {
font-size: 13.5px;
color: #6b7280;
}
/* =========================================================================
NOSOTROS / «NUESTRA COMPAÑÍA» (/compania/, page-id 134) — CAPA VISUAL
Por qué va aquí y no en el CSS Global del maquetador: desde OZ Maquetador
Pro V2 la fuente de verdad de «global-classes.css» es wp_options
(oz_pb_global_classes_css, ver includes/storage.php); el archivo del plugin
quedó como semilla y ya no se lee. Este style.css sí se encola por archivo
(y carga DESPUÉS del
pegado a una
- , sin distinguir un rótulo corto ("Especificaciones:")
de un párrafo con contenido real. Producto real afectado: Frijol
Canario Peruano en Saco de 25kg (post 358) trae
"
Beneficios y Propiedades:
- — la imagen entera desaparecía junto
con el rótulo. Se excluye explícitamente cualquier
que contenga una imagen alineada (:has(img.alignleft), :has(img.alignright)): esos SÍ deben seguir visibles siempre, es contenido real, no un rótulo vacío. */ body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description p:has(+ ul):not(:has(img.alignleft)):not(:has(img.alignright)) { display: none; } /* [Fase 2.6, punto 2] Con el rótulo ahora oculto (arriba), la lista ya NO debe perder su propia divisoria/espaciado — antes esta regla los ponía a 0 asumiendo que el rótulo visible ya aportaba el borde superior. Con el rótulo display:none, "p + ul" seguía matcheando igual (display:none no saca al elemento del DOM ni de los selectores de hermanos), así que sin este ajuste la lista quedaba pegada al heading sin separación. Se deja que el
- use su borde/spacing propio (regla base de arriba) también
en este caso. */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description p + ul::before {
content: none;
}
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul li {
position: relative;
margin: 0;
padding-left: 34px;
}
/* El padre separa ítems con li+li margin-top; aquí manda el row-gap */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul li + li {
margin-top: 0;
}
/* [Fase 2, punto 11] Check minimalista: círculo blanco de 22px con borde y
tilde. Antes usaba var(--oz-brand-accent) = #9bca46 (confirmado en Fase
1.5, riesgo 5) — discrepancia real de 1 unidad por canal RGB contra el
verde que Home usa hardcodeado (#9CCB47) en sus cards/separadores. Se
fija el valor exacto de Home aquí (color LOCAL a esta sección, NO se
toca la variable --oz-brand-accent global ni :root). */
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul li::before {
content: "✓";
position: absolute;
left: 0;
top: 0;
width: 22px;
height: 22px;
box-sizing: border-box;
border: 1.5px solid #9CCB47;
border-radius: 50%;
background: #ffffff;
color: #9CCB47;
font-size: 11px;
font-weight: 700;
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
}
/* 6. Responsive: tabs usables, beneficios a 1 columna, menos padding,
sin desbordes. */
@media (max-width: 767px) {
body .oz-single-product .woocommerce-tabs {
padding: 18px 16px 22px;
border-radius: 10px;
}
body .oz-single-product .woocommerce-tabs ul.tabs {
gap: 0 1.25rem;
}
body .oz-single-product .woocommerce-tabs .woocommerce-Tabs-panel--description ul {
grid-template-columns: 1fr;
column-gap: 0;
row-gap: 14px;
}
}
/* =========================================================================
SERVICIOS — flujo de 6 etapas (Procesamiento/Distribución sin foto real
todavía). Slot de imagen reservado: aspect-ratio/tamaño fijos vía CSS,
sin texto "placeholder"/"pendiente" visible. Reemplazable desde Medios
por la compañera del cliente sin tocar código. Scoped a la página
Servicios (is_page(136)) desde el bloque que lo usa. */
.oz-servicios-img-slot {
display: block;
width: 100%;
aspect-ratio: 4 / 3;
border-radius: 10px;
background: linear-gradient(135deg, #eef1e8 0%, #e4ebda 100%);
border: 1px solid #dde3d2;
}
/* Botón CTA de WhatsApp al cierre de las 6 etapas (Punto 7, sección 3C del
brief) — banda azul institucional, mismo tono que el resto del sitio.
Botón blanco sobre fondo azul para máximo contraste/legibilidad. */
.oz-servicios-wsp-cta {
display: inline-block;
margin-top: 8px;
padding: 14px 32px;
background: #ffffff;
color: #1F589F;
font-weight: 600;
border-radius: 999px;
text-decoration: none;
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.oz-servicios-wsp-cta:hover,
.oz-servicios-wsp-cta:focus-visible {
color: #1F589F;
transform: translateY(-1px);
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}
/* =========================================================================
NOSOTROS/COMPAÑÍA — sección "Nuestra Trayectoria" (entre Introducción y
Misión/Visión). Slot reservado con el mismo mecanismo de Servicios, pero
look propio (radius mayor, sombra sutil) para que la sección tenga
personalidad distinta al zigzag de Servicios. */
.oz-compania-trayectoria-slot {
display: block;
width: 100%;
height: 100%;
border-radius: 14px;
background: linear-gradient(135deg, #eaf0f8 0%, #dde8f5 100%);
border: 1px solid #cfdcee;
box-shadow: 0 6px 20px rgba(31, 88, 159, 0.08);
overflow: hidden;
}
.oz-compania-trayectoria-slot img {
display: block;
}
@media (max-width: 767px) {
body.page-id-134 .oz-pb-r-2-c-0,
body.page-id-134 .oz-pb-r-2-c-1 {
text-align: center;
}
}
/* =========================================================================
BOTÓN FLOTANTE DE WHATSAPP (Punto 7, sección 5-6 del brief) — implementación
propia, sin plugin externo. Esquina inferior derecha, icono reconocible,
no cubre contenido (tamaño moderado + margen fijo), visible en
desktop/mobile, sin animación de rebote/pulso (solo transform sutil en
hover, respeta prefers-reduced-motion), sin auto-popup. Punto único fijo
en toda la navegación — no compite con otro elemento fixed conocido en
este child theme (.oz-cat-drawer es un overlay de pantalla completa que
solo se activa al abrir el drawer de categorías, no una esquina fija). */
.oz-wsp-float {
position: fixed;
right: 20px;
bottom: 20px;
z-index: 9000;
display: flex;
align-items: center;
justify-content: center;
width: 56px;
height: 56px;
border-radius: 50%;
background: #25D366;
color: #ffffff;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.oz-wsp-float:hover,
.oz-wsp-float:focus-visible {
color: #ffffff;
transform: scale(1.06);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}
@media (max-width: 480px) {
.oz-wsp-float {
right: 14px;
bottom: 14px;
width: 50px;
height: 50px;
}
}
@media (prefers-reduced-motion: reduce) {
.oz-wsp-float {
transition: none;
}
}
/* Presentaciones/formatos reales en ficha de producto mayorista (Cierre de
observaciones, Punto 2) — mismo criterio visual que .oz-envasado-meta,
sin badge de marca (los mayoristas no tienen marca propia). */
.oz-mayorista-meta {
display: flex;
align-items: baseline;
flex-wrap: wrap;
gap: 6px;
/* El bloque ahora se imprime DEBAJO del título + separador (hook de
woocommerce_single_product_summary en prioridad 7, ver functions.php),
así que el aire va arriba y abajo, no solo abajo como cuando iba
encima del título. */
margin: 4px 0 18px;
}
.oz-mayorista-meta__label {
font-size: 12px;
font-weight: 700;
color: #1F589F;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.oz-mayorista-meta__pres {
font-size: 13.5px;
color: #6b7280;
}
/* =========================================================================
NOSOTROS / «NUESTRA COMPAÑÍA» (/compania/, page-id 134) — CAPA VISUAL
Por qué va aquí y no en el CSS Global del maquetador: desde OZ Maquetador
Pro V2 la fuente de verdad de «global-classes.css» es wp_options
(oz_pb_global_classes_css, ver includes/storage.php); el archivo del plugin
quedó como semilla y ya no se lee. Este style.css sí se encola por archivo
(y carga DESPUÉS del