:root {
--verde:          #038101;   /* 5,07 sobre blanco */
--verde-fuerte:   #026001;   /* 7,85 con texto blanco */
--naranja-marca:  #FD6700;   /* 5,76 con --texto. NUNCA con texto blanco: da 2,95 */
--naranja:        #BC4A00;   /* 5,10 con texto blanco. Es el botón principal */
--texto:          #1A1D1A;   /* 17,01 sobre blanco */
--texto-2:        #585E58;   /* 6,65 sobre blanco */
--blanco:         #FFFFFF;
--superficie:     #F6F7F5;
--divisor:        #E3E6E3;
--borde-control:  #7E857E;   /* 3,79, que es lo que pide un borde de control */
--wa:             #25D366;   /* 10,59 con negro. SOLO el botón de WhatsApp */
--error:          #B3261E;   /* 6,54 con texto blanco */
--pie-fondo:      #0F1310;   /* 18,73 con blanco */
--pie-texto:      #E6EAE4;   /* 15,39 sobre --pie-fondo */
--pie-verde:      #57C355;   /* 8,33 sobre --pie-fondo. Enlaces e iconos */
--pie-divisor:    #2C332B;   /* 1,44 sobre --pie-fondo: separa sin gritar */
--franja:         #EDF5EC;   /* 1,11 con blanco · 1,04 con el cuerpo · verde 4,55 */
--ok:             #1B5E20;   /* 7,87 con texto blanco */
--e1:  4px;
--e2:  8px;
--e3: 12px;
--e4: 16px;
--e5: 24px;
--e6: 32px;
--e7: 48px;
--e8: 64px;
--fuente: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
--fuente-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
--fuente-titulos: "Outfit", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
--tactil: 44px;
--ancho-caracter: 0.72rem;
--ancho-acciones: calc(14rem + 2 * var(--e2));
--alto-cabecera: 72px;
--transicion: 180ms cubic-bezier(0.2, 0, 0.2, 1);
--ancho-texto: 42rem;
--ancho-ancho: 68rem;
--radio-chico:   6px;    /* chips, celdas, controles chicos */
--radio-tarjeta: 10px;   /* tarjetas y paneles */
--radio-boton: 12px;
--radio-boton-chico: 8px;
--sombra-tarjeta: 0 1px 2px rgb(26 29 26 / 0.05);
--verde-tenue: #F2F9F2;
}
@font-face {
font-family: "Inter";
font-style: normal;
font-weight: 400 700;
font-display: swap;
src: url("../fonts/inter-var.woff2") format("woff2-variations");
}
@font-face {
font-family: "Outfit";
font-style: normal;
font-weight: 400 700;
font-display: swap;
src: url("../fonts/outfit-var.woff2") format("woff2-variations");
}
@font-face {
font-family: "IBM Plex Mono";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("../fonts/ibm-plex-mono-400.woff2") format("woff2");
}
h1,
h2,
h3,
.agl-canal__titulo,
.agl-cifra__numero,
.agl-grilla__nombre {
font-family: var(--fuente-titulos);
overflow-wrap: break-word;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
-webkit-text-size-adjust: 100%;
}
body {
margin: 0;
background: var(--superficie);
color: var(--texto);
font-family: var(--fuente);
font-size: 1rem;
line-height: 1.55;
text-rendering: optimizeLegibility;
}
h1, h2, h3, h4 {
margin: 0 0 var(--e4);
font-weight: 600;
line-height: 1.2;
text-wrap: balance;
}
h1 { font-size: clamp(1.75rem, 1.2rem + 2vw, 2.5rem); }
h2 { font-size: clamp(1.35rem, 1.1rem + 1vw, 1.75rem); }
h3 { font-size: 1.15rem; }
p, ul, ol {
margin: 0 0 var(--e4);
}
p {
max-width: 70ch;
}
a {
color: var(--verde);
text-underline-offset: 0.15em;
}
[id] {
scroll-margin-top: calc(var(--alto-cabecera) + var(--e3));
}
img {
max-width: 100%;
height: auto;
}
:focus-visible {
outline: 3px solid var(--texto);
outline-offset: 2px;
}
code,
kbd,
samp,
.agl-codigo {
font-family: var(--fuente-mono);
font-variant-numeric: tabular-nums;
font-size: 0.95em;
}
button,
input,
select,
textarea {
font: inherit;
color: inherit;
}
input,
select,
textarea {
min-height: var(--tactil);
padding: var(--e2) var(--e3);
border: 1px solid var(--borde-control);
border-radius: var(--radio-chico);
background: var(--blanco);
}
[hidden] {
display: none !important;
}
.agl-boton,
.agl-boton-2 {
display: inline-flex;
align-items: center;
justify-content: center;
gap: var(--e2);
min-height: var(--tactil);
min-width: var(--tactil);
padding: var(--e3) var(--e5);
border: 1px solid transparent;
border-radius: var(--radio-boton);
font-weight: 700;
text-decoration: none;
cursor: pointer;
transition: transform var(--transicion);
}
.agl-boton:hover,
.agl-boton-2:hover,
.agl-boton-wa:hover {
text-decoration: none;
}
@media (hover: hover) {
.agl-boton:hover,
.agl-boton-2:hover,
.agl-boton-wa:hover {
transform: translateY(-2px);
}
}
.agl-boton {
background: var(--verde-fuerte);
color: var(--blanco);
}
.agl-boton-2 {
background: var(--blanco);
border-color: var(--divisor);
color: var(--texto);
}
.agl-boton-2:hover {
border-color: var(--borde-control);
}
.agl-boton-wa {
background: var(--verde-fuerte);
color: var(--blanco);
}
.agl-consulta-barra,
.agl-consulta-etiqueta,
.agl-cta {
background: var(--naranja-marca);
color: var(--texto);
}
.agl-tarjeta {
background: var(--blanco);
border: 1px solid var(--divisor);
border-radius: var(--radio-tarjeta);
box-shadow: var(--sombra-tarjeta);
}
.agl-panel {
background: var(--verde-tenue);
border: 1px solid var(--divisor);
border-radius: var(--radio-tarjeta);
}
.agl-chip {
display: inline-flex;
align-items: center;
padding: 2px var(--e2);
border: 1px solid var(--divisor);
border-radius: var(--radio-chico);
background: var(--superficie);
color: var(--texto);
font-size: 0.75rem;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
white-space: nowrap;
}
.agl-rotulo {
margin: 0;
color: var(--verde);
font-size: 0.8125rem;
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
}
.agl-seccion__encabezado {
display: flex;
flex-wrap: wrap;
align-items: baseline;
justify-content: space-between;
gap: var(--e2) var(--e5);
margin-bottom: var(--e7);
}
.agl-seccion__bajada {
margin: var(--e1) 0 0;
color: var(--texto-2);
}
.agl-contenedor {
width: 100%;
max-width: var(--ancho-ancho);
margin-inline: auto;
padding-inline: var(--e4);
}
.agl-texto {
max-width: var(--ancho-texto);
}
.agl-salto {
position: absolute;
left: -9999px;
top: 0;
z-index: 100;
padding: var(--e3) var(--e4);
background: var(--blanco);
color: var(--texto);
}
.agl-salto:focus {
left: var(--e4);
top: var(--e4);
}
.agl-oculto {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
border: 0;
}
.agl-cabecera {
position: sticky;
top: 0;
z-index: 30;
display: flex;
flex-direction: column;
border-bottom: 1px solid var(--divisor);
background: var(--blanco);
}
.agl-cabecera__fila {
display: flex;
align-items: center;
gap: var(--e4) var(--e5);
min-height: 72px;
padding-block: var(--e3);
flex-wrap: wrap;
}
.agl-cabecera__logo {
display: inline-flex;
flex: 0 0 auto;
order: 1;
}
.agl-nav {
order: 2;
flex: 1 1 auto;
display: none;
justify-content: center;
}
.agl-cabecera[data-agl-menu="abierto"] .agl-nav {
display: flex;
}
.agl-contacto-nav {
display: flex;
align-items: center;
justify-content: flex-end;
flex-wrap: wrap;
gap: 0 var(--e5);
margin: 0;
padding: 0;
list-style: none;
font-size: 0.875rem;
order: 3;
flex: 0 0 auto;
}
.agl-contacto-nav__enlace {
display: inline-flex;
align-items: center;
gap: var(--e2);
min-height: var(--tactil);
color: var(--texto);
text-decoration: none;
white-space: nowrap;
}
.agl-contacto-nav__enlace:hover .agl-contacto-nav__texto {
text-decoration: underline;
}
.agl-contacto-nav__enlace .agl-icono {
color: var(--verde);
}
.agl-cabecera--sobre-hero:not([data-agl-fija]) .agl-contacto-nav__enlace .agl-icono {
color: inherit;
}
.agl-icono {
flex: 0 0 auto;
}
.agl-menu {
display: flex;
flex-wrap: wrap;
gap: 0 var(--e4);
margin: 0;
padding: 0;
list-style: none;
}
.agl-menu li {
margin: 0;
}
.agl-menu a {
display: inline-flex;
align-items: center;
position: relative;
min-height: var(--tactil);
color: var(--texto);
font-weight: 600;
text-decoration: none;
}
.agl-menu a::after {
content: "";
position: absolute;
inset: auto 0 0 0;
height: 3px;
background: var(--verde);
transform: scaleX(0);
transform-origin: center;
transition: transform var(--transicion);
}
@media (hover: hover) {
.agl-menu a:hover::after {
transform: scaleX(1);
}
}
.agl-menu a:focus-visible::after {
transform: scaleX(1);
}
.agl-menu a.es-actual,
.agl-menu .current-menu-item > a,
.agl-menu .current-menu-parent > a,
.agl-menu .current-menu-ancestor > a {
color: var(--verde-fuerte);
}
.agl-menu a.es-actual::after,
.agl-menu .current-menu-item > a::after,
.agl-menu .current-menu-parent > a::after,
.agl-menu .current-menu-ancestor > a::after {
transform: scaleX(1);
}
.agl-hamburguesa {
display: inline-flex;
position: relative;
order: 2;
margin-left: auto;
align-items: center;
justify-content: center;
width: var(--tactil);
height: var(--tactil);
padding: 0;
border: 1px solid var(--borde-control);
border-radius: var(--radio-chico);
background: transparent;
cursor: pointer;
transition: transform var(--transicion);
}
.agl-hamburguesa:active {
transform: scale(0.92);
}
.agl-hamburguesa__barras,
.agl-hamburguesa::before,
.agl-hamburguesa::after {
display: block;
width: 20px;
height: 2px;
border-radius: 1px;
background: currentColor;
}
.agl-hamburguesa::before,
.agl-hamburguesa::after {
content: "";
position: absolute;
left: calc(50% - 10px);
top: calc(50% - 1px);
transition: transform var(--transicion);
}
.agl-hamburguesa::before {
transform: translateY(-6px);
}
.agl-hamburguesa::after {
transform: translateY(6px);
}
.agl-hamburguesa__barras {
transition: opacity 120ms linear 120ms, transform var(--transicion) 120ms;
}
.agl-cabecera[data-agl-menu="abierto"] .agl-hamburguesa__barras {
opacity: 0;
transform: scaleX(0.2);
transition: opacity 100ms linear, transform 100ms linear;
}
.agl-cabecera[data-agl-menu="abierto"] .agl-hamburguesa::before {
transform: rotate(45deg);
transition: transform var(--transicion) 60ms;
}
.agl-cabecera[data-agl-menu="abierto"] .agl-hamburguesa::after {
transform: rotate(-45deg);
transition: transform var(--transicion) 60ms;
}
@media (min-width: 60rem) {
.agl-cabecera__fila {
display: grid;
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
align-items: center;
}
.agl-menu {
justify-content: center;
}
.agl-cabecera__logo {
justify-self: start;
}
.agl-contacto-nav {
justify-self: end;
}
.agl-hamburguesa {
display: none;
}
.agl-nav,
.agl-cabecera[data-agl-menu="abierto"] .agl-nav {
display: block;
}
}
@media (max-width: 59.99rem) {
.agl-contacto-nav {
display: none;
}
.agl-hamburguesa {
order: 2;
margin-left: auto;
}
.agl-nav {
order: 4;
flex-basis: 100%;
}
.agl-menu {
flex-direction: column;
gap: 0;
width: 100%;
}
.agl-menu a {
justify-content: center;
width: 100%;
min-height: 3.5rem;
font-size: 1.125rem;
border-bottom: 1px solid var(--divisor);
}
.agl-menu a::after {
content: none;
}
.agl-menu a.es-actual,
.agl-menu .current-menu-item > a,
.agl-menu .current-menu-parent > a,
.agl-menu .current-menu-ancestor > a {
box-shadow: inset -3px 0 0 var(--verde);
}
}
.agl-cabecera--sobre-hero {
position: sticky;
inset-inline: 0;
top: 0;
z-index: 30;
}
.agl-hero {
margin-top: calc(-1 * var(--alto-cabecera));
}
.agl-centinela {
position: absolute;
inset: 0 0 auto 0;
height: 8px;
pointer-events: none;
}
.agl-cabecera--sobre-hero:not([data-agl-fija]) {
background: transparent;
border-bottom-color: transparent;
}
.agl-cabecera--sobre-hero:not([data-agl-fija]) .agl-cabecera__logo img {
filter: brightness(0) invert(1);
}
.agl-cabecera--sobre-hero:not([data-agl-fija]) .agl-menu a,
.agl-cabecera--sobre-hero:not([data-agl-fija]) .agl-contacto-nav__enlace {
color: var(--blanco);
}
.agl-cabecera--sobre-hero:not([data-agl-fija]) .agl-menu a.es-actual,
.agl-cabecera--sobre-hero:not([data-agl-fija]) .agl-menu .current-menu-item > a {
color: var(--blanco);
}
.agl-cabecera--sobre-hero:not([data-agl-fija]) .agl-menu a::after {
background: var(--blanco);
}
.agl-cabecera--sobre-hero:not([data-agl-fija]) .agl-hamburguesa {
color: var(--blanco);
border-color: var(--blanco);
}
@media (max-width: 59.99rem) {
.agl-cabecera--sobre-hero:not([data-agl-fija])[data-agl-menu="abierto"] {
background: var(--texto);
}
.agl-cabecera--sobre-hero:not([data-agl-fija]) .agl-menu a {
border-bottom-color: rgba(255, 255, 255, 0.25);
}
}
.agl-buscador {
display: flex;
gap: var(--e2);
flex: 1 1 16rem;
min-width: 0;
}
.agl-buscador__campo {
flex: 1 1 auto;
min-width: 0;
font-size: 1rem;
border-radius: var(--radio-boton);
padding-inline: var(--e4);
}
.agl-buscador__enviar {
flex: 0 0 auto;
min-height: var(--tactil);
min-width: var(--tactil);
padding-inline: var(--e4);
border: 0;
border-radius: var(--radio-boton);
background: var(--verde-fuerte);
color: var(--blanco);
cursor: pointer;
}
.agl-buscador__enviar:hover {
background: var(--verde);
}
.agl-buscador__enviar {
transition: transform var(--transicion);
}
@media (hover: hover) {
.agl-buscador__enviar:hover {
transform: translateY(-1px);
}
}
@media (max-width: 640px) {
.agl-cabecera .agl-buscador {
order: 3;
flex-basis: 100%;
}
}
.agl-catalogo__filtros {
display: flex;
flex-wrap: wrap;
align-items: end;
gap: var(--e4);
margin-block: var(--e4);
}
.agl-filtros__campo {
display: flex;
flex-direction: column;
gap: var(--e1);
flex: 1 1 15rem;
max-width: 22rem;
min-width: 0;
margin: 0;
font-size: 0.875rem;
color: var(--texto-2);
}
.agl-filtros__select {
width: 100%;
padding-right: calc( var(--e3) * 2 + 12px );
appearance: none;
-webkit-appearance: none;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23585E58' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 4.5 6 8.5 10 4.5'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: right var(--e3) center;
background-size: 12px 12px;
font-size: 1rem;
color: var(--texto);
text-overflow: ellipsis;
}
.agl-filtros__activos {
display: flex;
flex-wrap: wrap;
gap: var(--e2);
margin-block: var(--e4);
padding: 0;
list-style: none;
}
.agl-filtros__activo {
display: inline-flex;
align-items: center;
gap: var(--e2);
min-height: var(--tactil);
padding-inline: var(--e3);
border: 1px solid var(--divisor);
border-radius: var(--radio-chico);
background: var(--superficie);
font-size: 0.875rem;
}
.agl-filtros__activo button {
min-height: var(--tactil);
min-width: var(--tactil);
border: 0;
background: none;
color: var(--texto-2);
cursor: pointer;
}
.agl-filtros__activo button:hover {
color: var(--texto);
}
.agl-pie {
margin-top: var(--e8);
padding-block: var(--e7);
background: var(--pie-fondo);
color: var(--pie-texto);
font-size: 0.875rem;
}
.agl-pie a {
color: var(--pie-texto);
text-decoration: underline;
}
.agl-pie a:hover {
color: var(--pie-verde);
}
.agl-pie__columna--marca img {
filter: brightness(0) invert(1);
}
.agl-pie__columnas {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
gap: var(--e6) var(--e5);
}
.agl-pie__titulo {
margin: 0 0 var(--e3);
color: var(--pie-verde);
font-size: 1rem;
}
.agl-pie__texto {
margin: var(--e3) 0 0;
max-width: 26rem;
}
.agl-pie__datos,
.agl-pie-nav {
margin: 0;
padding: 0;
list-style: none;
}
.agl-pie__datos li,
.agl-pie-nav li {
display: flex;
align-items: center;
min-height: var(--tactil);
}
.agl-pie__dato--texto {
min-height: 0;
}
.agl-pie__datos li + li,
.agl-pie-nav li + li {
margin-top: var(--e1);
}
.agl-pie__icono {
display: flex;
flex: 0 0 auto;
align-self: center;
margin-right: var(--e2);
color: var(--pie-texto);
}
.agl-pie__dato--texto .agl-pie__icono {
align-self: flex-start;
margin-top: calc((1.55em - 18px) / 2);
}
.agl-pie__datos li > a,
.agl-pie-nav__enlace {
display: flex;
align-items: center;
align-self: stretch;
}
.agl-pie__datos + .agl-boton-wa {
margin-top: var(--e3);
}
.agl-pie .agl-boton-wa {
padding-inline: var(--e3);
font-size: 0.8125rem;
white-space: nowrap;
background: var(--verde);
color: var(--blanco);
text-decoration: none;
}
.agl-pie .agl-boton-wa:hover {
color: var(--blanco);
}
.agl-pie__barra {
margin: var(--e7) 0 0;
padding-top: var(--e4);
border-top: 1px solid var(--pie-divisor);
}
.agl-pie__credito {
margin: var(--e2) 0 0;
}
.agl-pie .agl-pie__credito-enlace {
color: #FFFFFF;
text-decoration: underline;
}
.agl-pie .agl-pie__credito-enlace:hover {
color: #FF9900;
}
@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}
}
[data-agl-aparece="espera"] {
opacity: 0;
transform: translateY(10px);
}
[data-agl-aparece="visible"] {
opacity: 1;
transform: none;
transition: opacity 220ms ease-out, transform 220ms ease-out;
}
.agl-lista-plana {
margin: 0;
padding: 0;
list-style: none;
}
.agl-lista-plana > li + li {
margin-top: var(--e1);
}
.agl-migas {
padding-block: var(--e4) 0;
font-size: 0.875rem;
color: var(--texto-2);
}
.agl-migas__lista {
display: flex;
flex-wrap: wrap;
gap: var(--e1) var(--e2);
margin: 0;
padding: 0;
list-style: none;
}
.agl-migas__item + .agl-migas__item::before {
content: "›";
margin-right: var(--e2);
color: var(--texto-2);
}
.agl-migas__item [aria-current="page"] {
color: var(--texto);
}
.agl-retorno {
margin: var(--e3) 0 0;
font-size: 0.875rem;
}
.agl-ficha {
padding-block: 0 var(--e6);
}
.agl-ficha > * + * {
margin-top: var(--e6);
}
.agl-ficha__encabezado {
margin-top: var(--e5);
}
.agl-ficha__titulo {
margin-bottom: var(--e3);
}
.agl-ficha__codigo {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: var(--e3);
margin-bottom: var(--e2);
max-width: none;
}
.agl-codigo--grande {
font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.125rem);
font-weight: 400;
letter-spacing: 0.02em;
line-height: 1.1;
}
.agl-copiar {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: var(--tactil);
min-width: var(--tactil);
padding: var(--e2) var(--e4);
border: 1px solid var(--borde-control);
border-radius: var(--radio-chico);
background: var(--blanco);
font-size: 0.875rem;
font-weight: 600;
cursor: pointer;
transition: opacity var(--transicion);
}
.agl-copiar:hover {
opacity: 0.8;
}
.agl-copiar__aviso {
min-height: 1.4em;
margin: 0;
font-size: 0.875rem;
color: var(--texto-2);
}
.agl-copiar__aviso:empty {
min-height: 0;
}
.agl-aviso {
margin-block: var(--e4);
padding: var(--e3) var(--e4);
border-left: 4px solid var(--verde);
background: var(--blanco);
max-width: none;
}
.agl-variantes {
margin: var(--e4) 0 0;
padding: 0;
border: 0;
}
.agl-variantes__rotulo {
padding: 0;
font-size: 0.875rem;
font-weight: 600;
color: var(--texto-2);
}
.agl-variantes__opciones {
display: flex;
flex-wrap: wrap;
gap: var(--e2);
margin-top: var(--e2);
}
.agl-variantes__radio {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
min-height: 0;
overflow: hidden;
clip-path: inset(50%);
border: 0;
}
.agl-variantes__opcion {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: var(--tactil);
min-width: var(--tactil);
padding: var(--e2) var(--e5);
border: 1px solid var(--borde-control);
border-radius: var(--radio-chico);
background: var(--blanco);
font-weight: 600;
cursor: pointer;
transition: opacity var(--transicion);
}
.agl-variantes__radio:checked + .agl-variantes__opcion {
border-color: var(--verde-fuerte);
background: var(--verde-fuerte);
color: var(--blanco);
}
.agl-variantes__radio:focus-visible + .agl-variantes__opcion {
outline: 3px solid var(--texto);
outline-offset: 2px;
}
.agl-tecnica {
margin-top: var(--e6);
}
.agl-tecnica__tabla {
width: 100%;
max-width: var(--ancho-texto);
border-collapse: collapse;
text-align: left;
}
.agl-tecnica__tabla th,
.agl-tecnica__tabla td {
padding: var(--e3) 0;
border-bottom: 1px solid var(--divisor);
vertical-align: top;
}
.agl-tecnica__tabla th {
width: 11rem;
padding-right: var(--e4);
font-weight: 600;
color: var(--texto-2);
}
.agl-tecnica__nota {
font-size: 0.875rem;
color: var(--texto-2);
}
@media (max-width: 640px) {
.agl-tecnica__tabla,
.agl-tecnica__tabla tbody,
.agl-tecnica__tabla tr,
.agl-tecnica__tabla th,
.agl-tecnica__tabla td {
display: block;
width: auto;
}
.agl-tecnica__tabla tr {
padding-block: var(--e3);
border-bottom: 1px solid var(--divisor);
}
.agl-tecnica__tabla th,
.agl-tecnica__tabla td {
padding: 0;
border: 0;
}
.agl-tecnica__tabla th {
font-size: 0.875rem;
}
}
.agl-ficha__producto {
display: grid;
gap: var(--e5);
margin-top: var(--e5);
}
.agl-ficha__producto > .agl-ficha__encabezado {
margin-top: 0;
}
@media (min-width: 64rem) {
.agl-ficha__producto {
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
grid-template-rows: auto 1fr;
grid-template-areas:
"galeria encabezado"
"galeria resumen";
column-gap: var(--e7);
row-gap: var(--e5);
align-items: start;
}
.agl-ficha__producto > .agl-ficha__encabezado {
grid-area: encabezado;
}
.agl-ficha__producto > .agl-galeria {
grid-area: galeria;
}
.agl-ficha__producto > .agl-ficha__resumen {
grid-area: resumen;
}
}
.agl-ficha__categoria {
margin: 0 0 var(--e2);
font-size: 0.875rem;
font-weight: 600;
letter-spacing: 0.02em;
}
.agl-galeria {
min-width: 0;
}
.agl-galeria__principal {
margin: 0;
}
.agl-galeria__ampliar {
position: relative;
display: block;
border: 1px solid var(--divisor);
border-radius: var(--radio-tarjeta);
background: var(--blanco);
overflow: hidden;
}
.agl-galeria__img {
display: block;
width: 100%;
height: auto;
aspect-ratio: 1;
object-fit: contain;
}
.agl-galeria__lupa {
position: absolute;
top: var(--e3);
right: var(--e3);
display: flex;
align-items: center;
justify-content: center;
width: var(--tactil);
height: var(--tactil);
border: 1px solid var(--divisor);
border-radius: var(--radio-chico);
background: var(--blanco);
color: var(--texto);
}
.agl-galeria__miniaturas {
display: grid;
grid-template-columns: repeat(6, minmax(0, 1fr));
gap: var(--e2);
margin: var(--e3) 0 0;
padding: 0;
list-style: none;
}
.agl-galeria__mini {
display: block;
border: 1px solid var(--divisor);
border-radius: var(--radio-chico);
background: var(--blanco);
overflow: hidden;
}
.agl-galeria__mini[aria-current="true"] {
border-color: var(--verde-fuerte);
box-shadow: inset 0 0 0 2px var(--verde-fuerte);
}
.agl-galeria__mini-img {
display: block;
width: 100%;
height: auto;
aspect-ratio: 1;
object-fit: cover;
}
@media (hover: hover) {
.agl-galeria__mini:hover {
border-color: var(--borde-control);
}
}
.agl-sinfoto {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: var(--e2);
padding: var(--e6) var(--e5);
border: 2px dashed var(--borde-control);
border-radius: var(--radio-tarjeta);
background: var(--blanco);
text-align: center;
}
@media (min-width: 64rem) {
.agl-sinfoto {
aspect-ratio: 1;
}
}
.agl-sinfoto__icono {
display: flex;
color: var(--texto-2);
}
.agl-sinfoto__titulo,
.agl-sinfoto__categoria,
.agl-sinfoto__codigo {
max-width: none;
margin: 0;
}
.agl-sinfoto__titulo {
font-weight: 600;
}
.agl-sinfoto__categoria {
font-size: 0.875rem;
color: var(--texto-2);
}
.agl-sinfoto__codigo {
font-size: 1.25rem;
}
.agl-sinfoto__pedir {
display: inline-flex;
align-items: center;
gap: var(--e2);
min-height: var(--tactil);
margin-top: var(--e2);
font-weight: 600;
}
.agl-ficha__resumen {
display: grid;
gap: var(--e5);
min-width: 0;
}
.agl-resumen__datos {
display: grid;
gap: var(--e2);
margin: 0;
}
.agl-resumen__dato {
display: grid;
grid-template-columns: 6rem minmax(0, 1fr);
gap: var(--e3);
}
.agl-resumen__dato dt {
font-weight: 600;
color: var(--texto-2);
}
.agl-resumen__dato dd {
margin: 0;
}
.agl-acciones {
padding: var(--e5);
border: 1px solid var(--divisor);
border-radius: var(--radio-chico);
background: var(--blanco);
}
.agl-consultar {
border-top: 3px solid var(--verde-fuerte);
}
.agl-consultar__titulo {
margin: 0;
font-size: 1.125rem;
}
.agl-consultar__bajada {
margin: var(--e2) 0 var(--e4);
font-size: 0.9375rem;
color: var(--texto-2);
}
.agl-acciones__wa {
gap: var(--e2);
transition: opacity var(--transicion);
}
.agl-acciones__wa:hover {
opacity: 0.9;
text-decoration: none;
}
.agl-consultar__wa {
width: 100%;
padding-block: var(--e4);
font-size: 1.0625rem;
text-align: left;
}
.agl-consultar__wa .agl-codigo {
white-space: nowrap;
}
.agl-consultar__telefono {
margin: var(--e4) 0 0;
font-size: 0.9375rem;
color: var(--texto-2);
}
.agl-sumar {
display: inline-flex;
align-items: center;
gap: var(--e3);
min-height: var(--tactil);
margin-top: var(--e4);
padding-right: var(--e3);
cursor: pointer;
}
.agl-sumar__casilla {
width: 24px;
height: 24px;
min-height: 0;
margin: 0;
flex: 0 0 auto;
accent-color: var(--verde-fuerte);
cursor: pointer;
}
.agl-sumar__casilla[aria-disabled="true"] {
opacity: 0.55;
}
.agl-sumar__texto {
font-weight: 600;
}
.agl-sumar__aviso {
margin: var(--e2) 0 0;
font-size: 0.875rem;
color: var(--texto-2);
}
.agl-sumar__aviso:empty {
display: none;
}
.agl-confianza {
margin-top: var(--e6);
padding: var(--e6);
border: 1px solid var(--divisor);
border-left: 4px solid var(--verde);
border-radius: 0 var(--radio-tarjeta) var(--radio-tarjeta) 0;
background: var(--verde-tenue);
}
.agl-confianza h2 {
margin-top: 0;
}
.agl-confianza__intro {
color: var(--texto-2);
}
.agl-confianza__datos {
display: grid;
gap: var(--e5) var(--e6);
grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
margin: 0;
}
.agl-confianza__dato dt {
display: flex;
align-items: center;
gap: var(--e2);
color: var(--verde);
font-size: 0.8125rem;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
}
.agl-confianza__icono {
display: flex;
color: var(--verde);
}
.agl-confianza__dato dd {
margin: var(--e1) 0 0;
}
.agl-confianza__salidas {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--e2) var(--e3);
margin: var(--e5) 0 0;
padding-top: var(--e4);
border-top: 1px solid var(--divisor);
}
.agl-confianza__salida {
display: inline-flex;
align-items: center;
min-height: var(--tactil);
font-weight: 600;
}
.agl-confianza__punto {
color: var(--texto-2);
user-select: none;
}
.agl-capsula__respuesta {
font-size: 1.125rem;
max-width: 62ch;
}
.agl-faq__item + .agl-faq__item {
margin-top: var(--e5);
}
.agl-faq__pregunta {
margin-bottom: var(--e2);
}
.agl-faq__respuesta {
margin: 0;
}
.agl-relacionados__titulo {
margin-top: var(--e5);
margin-bottom: var(--e3);
}
.agl-relacionados__tarjetas {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr));
gap: var(--e3);
margin: 0;
padding: 0;
list-style: none;
}
.agl-relacionados__tarjeta {
position: relative;
padding: var(--e3) var(--e4);
}
.agl-relacionados__tarjeta a {
display: flex;
flex-direction: column;
gap: var(--e1);
min-height: var(--tactil);
text-decoration: none;
}
@media (hover: hover) {
.agl-relacionados__tarjeta a:hover .agl-relacionados__nombre {
text-decoration: underline;
}
}
.agl-relacionados__tarjeta a::after,
.agl-relacionados__categoria a::after {
content: "";
position: absolute;
inset: 0;
border-radius: inherit;
}
.agl-relacionados__nombre {
color: var(--texto);
}
.agl-relacionados__categoria {
position: relative;
display: flex;
align-items: center;
gap: var(--e4);
max-width: 32rem;
margin-top: var(--e5);
padding: var(--e3);
}
.agl-relacionados__foto {
flex: 0 0 auto;
width: 5rem;
height: 5rem;
border-radius: var(--radio-chico);
object-fit: cover;
}
.agl-relacionados__categoria a {
display: flex;
align-items: center;
min-height: var(--tactil);
font-weight: 600;
}
.agl-visor {
width: 100%;
height: 100%;
max-width: none;
max-height: none;
margin: 0;
padding: 0;
border: 0;
background: rgb(15 19 16 / 0.94);
color: var(--blanco);
}
.agl-visor::backdrop {
background: rgb(15 19 16 / 0.94);
}
html:has(.agl-visor[open]) {
overflow: hidden;
}
.agl-visor__marco {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
padding: var(--e8) var(--e4);
touch-action: pan-y pinch-zoom;
}
.agl-visor__img {
max-width: 100%;
max-height: 100%;
object-fit: contain;
background: var(--blanco);
}
.agl-visor__boton {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
width: var(--tactil);
height: var(--tactil);
padding: 0;
border: 1px solid rgb(255 255 255 / 0.6);
border-radius: var(--radio-chico);
background: rgb(15 19 16 / 0.7);
color: var(--blanco);
cursor: pointer;
}
.agl-visor__boton:focus-visible {
outline-color: var(--blanco);
}
.agl-visor__cerrar {
top: var(--e3);
right: var(--e3);
}
.agl-visor__anterior,
.agl-visor__siguiente {
top: 50%;
transform: translateY(-50%);
}
.agl-visor__anterior {
left: var(--e3);
}
.agl-visor__siguiente {
right: var(--e3);
}
.agl-visor__cuenta {
position: absolute;
bottom: var(--e4);
left: 50%;
margin: 0;
transform: translateX(-50%);
font-variant-numeric: tabular-nums;
}
.agl-relacionados__enlace {
margin: var(--e3) 0 0;
}
.agl-relacionados__enlace a {
display: inline-flex;
align-items: center;
min-height: var(--tactil);
}
.agl-consulta-barra {
position: fixed;
inset-inline: 0;
bottom: 0;
z-index: 50;
padding-block: var(--e4);
border-top: 2px solid var(--texto);
box-shadow: 0 -2px 6px rgb(26 29 26 / 0.16);
}
.agl-consulta-barra[hidden] {
display: none;
}
.agl-consulta-barra__fila {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: var(--e2) var(--e4);
justify-content: space-between;
}
.agl-consulta-barra__estado {
flex: 1 1 10rem;
min-width: 0;
margin: 0;
max-width: none;
font-size: 0.9375rem;
font-weight: 600;
line-height: 1.3;
}
.agl-consulta-barra__acciones {
display: flex;
align-items: center;
gap: var(--e2);
flex-wrap: nowrap;
}
.agl-consulta-barra .agl-boton-plano {
min-width: 0;
padding-inline: var(--e4);
border-color: var(--texto);
border-radius: var(--radio-boton);
background: var(--blanco);
color: var(--texto);
font-size: 0.875rem;
font-weight: 700;
transition: opacity var(--transicion);
}
@media (hover: hover) {
.agl-consulta-barra .agl-boton-plano:hover {
opacity: 0.82;
}
}
.agl-consulta-barra__salida {
flex-basis: 100%;
margin: 0;
font-size: 0.875rem;
}
.agl-consulta-barra__salida[hidden] {
display: none;
}
.agl-consulta-barra__salida a,
.agl-consulta-barra a {
color: var(--texto);
}
.agl-consulta-barra .agl-boton-wa {
background: var(--texto);
color: var(--blanco);
}
.agl-consulta-barra .agl-boton-wa--destacado {
box-shadow: inset 0 0 0 2px var(--blanco);
}
.agl-boton-plano {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: var(--tactil);
min-width: var(--tactil);
padding: var(--e2) var(--e4);
border: 1px solid var(--texto);
border-radius: var(--radio-boton);
background: transparent;
color: var(--texto);
font-weight: 700;
cursor: pointer;
}
.agl-boton-wa {
display: inline-flex;
align-items: center;
justify-content: center;
gap: var(--e2);
min-height: var(--tactil);
padding: var(--e3) var(--e5);
border-radius: var(--radio-boton);
font-weight: 700;
text-decoration: none;
transition: transform var(--transicion);
}
.agl-boton-wa--destacado {
box-shadow: inset 0 0 0 2px var(--texto);
}
[data-agl-consulta="abierta"] body {
padding-bottom: var(--alto-barra-consulta, 10rem);
}
.agl-listado {
margin-block: var(--e5);
}
.agl-listado__aviso {
max-width: none;
margin: 0 0 var(--e4);
padding: var(--e3) var(--e4);
border-radius: var(--radio-chico);
background: var(--naranja-marca);
color: var(--texto);
font-weight: 600;
}
.agl-listado__marco {
overflow-x: auto;
overflow-y: clip;
border: 1px solid var(--divisor);
border-radius: var(--radio-tarjeta);
background: var(--blanco);
}
@media (min-width: 1100px) {
.agl-listado__marco[data-agl-entra] {
overflow: clip;
}
}
.agl-listado__tabla {
width: 100%;
table-layout: fixed;
border-collapse: separate;
border-spacing: 0;
text-align: left;
}
.agl-listado__caption {
padding-left: var(--e3);
padding-top: var(--e4);
padding-bottom: var(--e3);
border-bottom: 1px solid var(--divisor);
color: var(--texto-2);
text-align: left;
}
.agl-listado__td--marca a {
display: inline-block;
padding: 2px var(--e2);
border: 1px solid var(--divisor);
border-radius: var(--radio-chico);
background: var(--superficie);
font-size: 0.75rem;
font-weight: 600;
letter-spacing: 0.04em;
line-height: 1.5;
text-transform: uppercase;
white-space: normal;
overflow-wrap: normal;
}
.agl-listado__th {
position: sticky;
top: var(--alto-cabecera);
z-index: 2;
padding: var(--e3);
border-bottom: 1px solid var(--divisor);
background: var(--superficie);
font-size: 0.8125rem;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
color: var(--texto-2);
white-space: nowrap;
}
.agl-listado__td {
padding: var(--e3);
border-bottom: 1px solid var(--divisor);
vertical-align: top;
font-weight: 400;
}
.agl-listado__fila:nth-child(even) {
background: var(--franja);
}
.agl-listado__fila:nth-child(even of .agl-listado__fila) {
background: var(--franja);
}
.agl-listado__fila:nth-child(odd of .agl-listado__fila) {
background: var(--blanco);
}
.agl-listado__corte-th {
padding: var(--e2) var(--e3);
border-top: 2px solid var(--divisor);
border-bottom: 1px solid var(--divisor);
background: var(--superficie);
text-align: left;
font-size: 0.8125rem;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
color: var(--texto-2);
}
@media (hover: hover) {
.agl-listado__fila:hover .agl-listado__td {
background: var(--superficie);
box-shadow: inset 0 -1px 0 var(--divisor);
}
.agl-listado__fila:hover .agl-listado__td--codigo {
box-shadow: inset 3px 0 0 var(--verde), inset 0 -1px 0 var(--divisor);
}
}
.agl-listado__th--codigo {
width: auto;
min-width: calc(13 * var(--ancho-caracter) + 2 * var(--e3));
}
.agl-listado__td--codigo {
min-width: calc(13 * var(--ancho-caracter) + 2 * var(--e3));
}
.agl-listado__th--equivalencias {
width: calc(18ch + 2 * var(--e3));
}
.agl-listado__th--aplicacion {
width: calc(15ch + 2 * var(--e3));
}
.agl-listado__th--funcion {
width: calc(12ch + 2 * var(--e3));
}
.agl-listado__th--medida {
width: calc(20ch + 2 * var(--e3));
}
.agl-listado__th--marca {
width: calc(10ch + 2 * var(--e3));
}
.agl-listado__th--maquinas {
width: calc(16ch + 2 * var(--e3));
}
.agl-listado__th--acciones {
width: var(--ancho-acciones);
}
.agl-listado__td {
overflow-wrap: anywhere;
}
.agl-listado__td--codigo .agl-codigo {
white-space: nowrap;
font-weight: 600;
}
.agl-listado__enlace {
display: inline-flex;
align-items: center;
min-height: var(--tactil);
}
.agl-listado__nombre {
display: block;
min-width: 16ch;
}
.agl-listado__variantes {
display: flex;
flex-wrap: wrap;
gap: var(--e2);
margin-top: var(--e1);
}
.agl-listado__variante {
display: inline-flex;
align-items: center;
padding: 2px var(--e2);
border: 1px solid var(--divisor);
border-radius: var(--radio-chico);
background: var(--superficie);
color: var(--texto-2);
font-size: 0.8125rem;
text-decoration: none;
}
.agl-listado__variante:hover {
border-color: var(--borde-control);
text-decoration: underline;
}
.agl-listado__td--acciones,
.agl-listado__th--acciones {
position: sticky;
right: 0;
padding-inline: var(--e2);
border-left: 1px solid var(--divisor);
}
.agl-listado__td--acciones {
background: inherit;
}
.agl-listado__th--acciones {
background: var(--superficie);
}
.agl-listado__td .agl-codigo {
white-space: normal;
overflow-wrap: normal;
}
.agl-listado__wa {
padding: var(--e2) var(--e4);
}
.agl-listado__sumar {
margin-top: var(--e1);
gap: var(--e2);
}
.agl-listado__rotulo {
display: none;
}
.agl-listado__vacio {
margin-block: var(--e5);
}
@media (max-width: 640px) {
.agl-listado__marco {
overflow-x: visible;
}
.agl-listado__tabla,
.agl-listado__tabla tbody {
display: block;
}
.agl-listado__caption {
display: block;
}
.agl-listado__acciones {
align-items: stretch;
min-width: 0;
width: auto;
margin-left: 0;
}
.agl-listado__salidas,
.agl-listado__acciones .agl-sumar {
width: auto;
}
.agl-listado__tabla thead {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
}
.agl-listado__fila {
display: block;
margin-bottom: var(--e4);
padding: var(--e4);
border: 1px solid var(--divisor);
border-radius: var(--radio-chico);
}
.agl-listado__fila:hover {
background: transparent;
}
.agl-listado__corte,
.agl-listado__corte-th {
display: block;
}
.agl-listado__corte {
margin-bottom: var(--e4);
}
.agl-listado__td {
display: block;
padding: 0;
border: 0;
}
.agl-listado__td + .agl-listado__td {
margin-top: var(--e3);
}
.agl-listado__td--vacia {
display: none;
}
.agl-listado__td--codigo .agl-codigo {
font-size: 1.15rem;
}
.agl-listado__td--descripcion {
font-weight: 600;
}
.agl-listado__rotulo {
display: block;
font-size: 0.8125rem;
color: var(--texto-2);
}
.agl-listado__td--acciones {
display: block;
margin-top: var(--e4);
position: static;
border-left: 0;
background: transparent;
}
.agl-listado__acciones {
min-width: 0;
}
.agl-listado__salidas .agl-listado__wa,
.agl-listado__salidas .agl-listado__ver {
flex: 1 1 10rem;
}
.agl-listado__sumar {
margin-top: 0;
}
}
.agl-paginacion {
display: flex;
flex-direction: column;
align-items: center;
gap: var(--e4);
margin-block: var(--e6);
}
.agl-paginacion__estado {
margin: 0;
font-size: 0.9375rem;
color: var(--texto-2);
}
.agl-paginacion__mas {
min-width: 14rem;
justify-content: center;
}
.agl-paginacion__saltos {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: var(--e2) var(--e1);
margin: 0;
padding: 0;
list-style: none;
}
.agl-paginacion__saltos a {
display: inline-flex;
align-items: center;
min-height: var(--tactil);
padding-inline: var(--e3);
}
.agl-paginacion__n a,
.agl-paginacion__n span {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: var(--tactil);
min-height: var(--tactil);
padding-inline: var(--e1);
font-variant-numeric: tabular-nums;
border-radius: var(--radio-chico);
}
.agl-paginacion__n--actual span {
font-weight: 600;
color: var(--blanco);
background: var(--verde-fuerte);
}
.agl-listado__tope {
max-width: var(--ancho-texto);
margin: 0;
text-align: center;
color: var(--texto-2);
}
.agl-catalogo__etiquetas {
display: block;
}
.agl-catalogo__filtros:empty,
.agl-catalogo__etiquetas:empty {
display: none;
}
.agl-catalogo--hub[data-agl-dueno="servidor"] .agl-listado--cascara,
.agl-catalogo--hub[data-agl-dueno="cliente"] .agl-grilla {
display: none;
}
.agl-listado[data-agl-vacio] .agl-listado__marco,
.agl-listado[data-agl-vacio] .agl-paginacion {
display: none;
}
.agl-sin-resultados,
.agl-sin-salida__wa {
margin-block: var(--e5);
}
.agl-sin-resultados__texto {
max-width: var(--ancho-texto);
margin: 0 0 var(--e4);
}
.agl-paginacion__estado:empty {
display: none;
}
.agl-portada__titulo {
max-width: var(--ancho-texto);
}
.agl-portada__entrada {
max-width: var(--ancho-texto);
color: var(--texto-2);
}
.agl-buscador--grande {
max-width: none;
margin-block: var(--e5);
flex-wrap: wrap;
align-items: stretch;
gap: 0;
}
.agl-buscador--grande .agl-buscador__rotulo {
flex: 1 0 100%;
margin-bottom: var(--e2);
font-weight: 600;
}
.agl-buscador__caja {
position: relative;
display: flex;
min-width: 0;
}
.agl-buscador--grande .agl-buscador__caja {
flex: 1 1 8rem;
}
.agl-buscador__lupa {
position: absolute;
top: 50%;
left: var(--e4);
display: flex;
transform: translateY(-50%);
color: var(--texto-2);
pointer-events: none;
}
.agl-buscador--grande .agl-buscador__campo {
flex: 1 1 auto;
min-width: 0;
padding-left: calc(22px + 2 * var(--e4));
padding-right: var(--e4);
font-size: 1.0625rem;
border-right: 0;
border-radius: var(--radio-boton) 0 0 var(--radio-boton);
}
.agl-buscador--grande .agl-buscador__campo,
.agl-buscador--grande .agl-buscador__enviar {
min-height: 3.25rem;
}
.agl-buscador--grande .agl-buscador__enviar {
padding-inline: var(--e5);
border-radius: 0 var(--radio-boton) var(--radio-boton) 0;
font-weight: 600;
}
.agl-buscador__ayuda {
margin: var(--e2) 0 var(--e5);
font-size: 0.875rem;
color: var(--texto-2);
}
.agl-banda-buscador.agl-banda-buscador--compacta {
margin-block: var(--e3) 0;
padding: var(--e2);
}
.agl-buscador--grande.agl-buscador--compacta {
margin-block: 0;
}
.agl-buscador--grande.agl-buscador--compacta .agl-buscador__campo,
.agl-buscador--grande.agl-buscador--compacta .agl-buscador__enviar {
min-height: var(--tactil);
}
.agl-buscador--grande.agl-buscador--compacta .agl-buscador__campo {
font-size: 1rem;
}
.agl-catalogo__entrada {
max-width: var(--ancho-texto);
color: var(--texto-2);
}
.agl-grilla {
margin-block: var(--e8);
}
.agl-grilla__titulo {
margin-bottom: var(--e4);
font-size: clamp(1.5rem, 1.1rem + 1.6vw, 1.875rem);
}
.agl-grilla__lista {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(min(10.5rem, 45%), 1fr));
gap: var(--e4);
margin: 0;
padding: 0;
list-style: none;
}
.agl-grilla__item {
border: 1px solid var(--divisor);
border-radius: var(--radio-tarjeta);
padding: var(--e4);
background: var(--blanco);
transition: transform var(--transicion);
}
.agl-grilla__lista:not(.agl-grilla__lista--fotos) .agl-grilla__nombre {
font-family: var(--fuente-titulos);
font-size: 1.125rem;
font-weight: 700;
line-height: 1.25;
}
.agl-grilla__lista--fotos {
grid-template-columns: repeat(auto-fill, minmax(min(14rem, 45%), 1fr));
gap: var(--e5);
}
.agl-grilla__lista--fotos .agl-grilla__item {
border: 1px solid var(--divisor);
border-radius: var(--radio-tarjeta);
padding: var(--e2);
background: var(--blanco);
transition: transform var(--transicion);
}
.agl-grilla__lista--fotos .agl-grilla__item:hover {
transform: translateY(-1px);
}
.agl-grilla__lista--fotos .agl-grilla__enlace {
gap: 0;
height: 100%;
}
.agl-grilla__foto {
display: block;
aspect-ratio: 1 / 1;
overflow: hidden;
border-radius: var(--radio-chico);
background: var(--superficie);
}
.agl-grilla__img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform var(--transicion);
}
@media (hover: hover) {
.agl-grilla__item:hover .agl-grilla__img {
transform: scale(1.04);
}
}
.agl-grilla__sinfoto {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
color: var(--borde-control);
}
.agl-grilla__lista--fotos .agl-grilla__nombre,
.agl-grilla__lista--fotos .agl-grilla__n {
padding-inline: var(--e2);
}
.agl-grilla__lista--fotos .agl-grilla__nombre {
padding-top: var(--e4);
font-family: var(--fuente-titulos);
font-weight: 700;
line-height: 1.25;
}
.agl-grilla__lista--fotos .agl-grilla__n {
padding-bottom: var(--e3);
}
.agl-grilla__item:hover,
.agl-grilla__item:focus-within {
border-color: var(--verde);
}
.agl-seccion__salida {
display: inline-flex;
align-items: center;
min-height: var(--tactil);
color: var(--verde);
font-size: 0.8125rem;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
text-decoration: underline;
text-decoration-thickness: 2px;
text-underline-offset: 4px;
}
.agl-grilla__item {
position: relative;
}
.agl-grilla__enlace::after {
content: "";
position: absolute;
inset: 0;
border-radius: inherit;
}
.agl-grilla__enlace {
display: flex;
flex-direction: column;
gap: var(--e1);
min-height: var(--tactil);
justify-content: flex-start;
text-decoration: none;
}
.agl-grilla__enlace:hover .agl-grilla__nombre,
.agl-grilla__enlace:focus-visible .agl-grilla__nombre {
text-decoration: underline;
}
.agl-grilla__nombre {
font-weight: 600;
color: var(--texto);
}
.agl-grilla__n,
.agl-grilla__detalle {
font-size: 0.875rem;
color: var(--texto-2);
}
.agl-grilla__detalle {
margin: var(--e2) 0 0;
}
.agl-capsula,
.agl-modelos {
margin-block: var(--e5);
max-width: var(--ancho-texto);
}
.agl-capsula__pregunta {
font-size: 1.125rem;
margin-bottom: var(--e2);
}
.agl-capsula__respuesta {
margin: 0;
}
.agl-modelos__lista {
display: flex;
flex-wrap: wrap;
gap: var(--e2) var(--e3);
margin: var(--e3) 0 0;
padding: 0;
list-style: none;
}
.agl-modelos__item {
background: var(--blanco);
border: 1px solid var(--divisor);
border-radius: var(--radio-chico);
padding: var(--e2) var(--e3);
font-variant-numeric: tabular-nums;
}
.agl-datos {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
gap: var(--e4);
margin-block: var(--e5);
}
.agl-datos__dato dt {
font-weight: 600;
color: var(--texto-2);
font-size: 0.875rem;
}
.agl-datos__dato dd {
margin: var(--e1) 0 0;
}
.agl-representaciones,
.agl-envios,
.agl-pagos {
margin-block: var(--e5);
max-width: var(--ancho-texto);
}
.agl-main--ancho > .agl-contenedor {
padding-block: var(--e6);
}
.agl-hero {
position: relative;
display: grid;
min-height: 35rem;
background: var(--texto);
}
.agl-hero {
--velo-alfa: 0.62;
}
.agl-hero::after {
content: "";
grid-area: 1 / 1;
position: relative;
z-index: 2;
background: rgb(26 29 26 / var(--velo-alfa));
}
.agl-hero::before {
content: "";
grid-area: 1 / 1;
position: relative;
z-index: 2;
background: linear-gradient(
to right,
rgb(26 29 26 / 0.55),
rgb(26 29 26 / 0.25) 45%,
rgb(26 29 26 / 0) 70%
);
}
.agl-hero__foto,
.agl-banda__foto {
grid-area: 1 / 1;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 1;
}
img.agl-hero__foto {
position: absolute;
inset: 0;
}
.agl-banda__foto {
opacity: 0.38;
}
.agl-hero__caja,
.agl-banda__caja {
grid-area: 1 / 1;
position: relative;
z-index: 3;
display: flex;
align-items: center;
padding-block: var(--e8);
color: var(--blanco);
}
.agl-hero__caja {
padding-block: calc(var(--alto-cabecera) + var(--e7)) var(--e7);
align-items: stretch;
}
.agl-hero__centro {
margin-block: auto;
}
.agl-hero__panel {
width: 100%;
max-width: 52rem;
}
.agl-hero__centro {
display: flex;
flex-direction: column;
align-items: flex-start;
text-align: left;
}
.agl-hero__titulo {
max-width: 20ch;
margin: 0;
color: var(--blanco);
font-size: clamp(2rem, 5.5vw, 3.75rem);
line-height: 1.08;
letter-spacing: -0.015em;
}
.agl-hero__quien {
order: -1;
align-self: flex-start;
max-width: 100%;
margin: 0 0 var(--e5);
padding: 0;
color: var(--blanco);
font-family: var(--fuente);
font-size: 0.8125rem;
font-weight: 700;
line-height: 2.1;
letter-spacing: 0.06em;
text-transform: uppercase;
}
.agl-hero__quien-texto {
padding: var(--e1) var(--e2);
background: var(--naranja);
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
}
.agl-hero__corte {
display: none;
}
@media (max-width: 640px) {
.agl-hero__corte {
display: inline;
}
}
.agl-hero__entrada {
max-width: 36rem;
margin: var(--e5) 0 0;
color: var(--blanco);
font-size: 1.125rem;
line-height: 1.6;
}
.agl-hero__accesos {
display: flex;
flex-wrap: wrap;
gap: var(--e4);
align-items: center;
justify-content: center;
margin: var(--e5) 0 0;
}
.agl-hero .agl-buscador--grande {
flex: 0 0 auto;
width: 100%;
max-width: 38rem;
margin-block: var(--e5) 0;
justify-content: center;
}
.agl-hero__salida {
margin: var(--e6) 0 0;
}
.agl-hero__salida .agl-boton {
padding: var(--e4) var(--e6);
font-size: 1rem;
}
.agl-banda-buscador {
margin-block: var(--e4) var(--e6);
padding: var(--e5);
border: 1px solid var(--divisor);
border-radius: var(--radio-tarjeta);
background: var(--verde-tenue);
}
.agl-banda-buscador .agl-buscador {
width: 100%;
}
.agl-grilla__titulo {
scroll-margin-top: var(--e6);
}
.agl-banda {
position: relative;
display: grid;
min-height: 20rem;
margin-block: var(--e8);
background: var(--texto);
}
.agl-banda::before {
content: "";
grid-area: 1 / 1;
position: relative;
z-index: 2;
background: linear-gradient(
to right,
rgb(26 29 26 / 0.5),
rgb(26 29 26 / 0.2) 50%,
rgb(26 29 26 / 0) 75%
);
}
.agl-banda__caja {
padding-block: var(--e7);
}
.agl-banda__titulo {
margin: 0;
color: var(--blanco);
font-size: clamp(1.5rem, 1.1rem + 1.6vw, 1.875rem);
}
.agl-banda__texto {
max-width: 34rem;
margin: var(--e3) 0 0;
color: var(--blanco);
}
.agl-banda__accion {
margin: var(--e6) 0 0;
}
.agl-boton--claro {
background: var(--blanco);
color: var(--texto);
}
@media (max-width: 640px) {
.agl-hero__caja {
padding-block: calc(var(--alto-cabecera) + var(--e6)) var(--e6);
}
.agl-hero {
min-height: 30rem;
}
.agl-banda {
margin-block: var(--e7);
}
.agl-banda__caja {
padding-block: var(--e6);
}
}
.agl-mapa {
display: block;
line-height: 0;
}
.agl-mapa__marco {
display: block;
width: 100%;
height: 400px;
border: 0;
}
.agl-cierre {
display: grid;
gap: var(--e6);
margin-block: var(--e8);
}
@media (min-width: 64rem) {
.agl-cierre {
grid-template-columns: 1fr 1fr;
align-items: stretch;
}
}
.agl-cierre .agl-mapa {
overflow: hidden;
border: 1px solid var(--divisor);
border-radius: var(--radio-tarjeta);
}
.agl-cierre .agl-mapa__marco {
height: 100%;
min-height: 400px;
}
.agl-cierre .agl-confianza {
margin-top: 0;
}
.agl-cierre .agl-confianza__datos {
grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
gap: var(--e5);
}
.agl-pie__horarios {
margin: 0;
}
.agl-pie__horarios dt {
font-weight: 600;
}
.agl-pie__horarios dd {
margin: 0 0 var(--e3);
}
.agl-pie__horarios dd:last-child {
margin-bottom: 0;
}
.agl-pie__envio {
margin: var(--e4) 0 0;
}
.agl-nosotros__titulo {
margin: 0 0 var(--e6);
}
.agl-nosotros__cuerpo {
display: grid;
gap: var(--e5);
}
.agl-nosotros__foto {
width: 100%;
height: auto;
aspect-ratio: 3 / 2;
object-fit: cover;
border-radius: var(--radio-tarjeta);
}
.agl-cifras {
display: grid;
grid-template-columns: 1fr;
gap: var(--e4);
margin: 0;
padding: 0;
list-style: none;
}
.agl-cifra {
padding: var(--e4);
border-radius: var(--radio-tarjeta);
}
.agl-cifra--marca {
background: var(--verde-fuerte);
color: var(--blanco);
}
.agl-cifra--oscura {
background: var(--texto);
color: var(--blanco);
}
.agl-cifra--clara {
background: var(--blanco);
color: var(--texto);
}
.agl-cifra__rotulo {
margin: 0;
font-size: 0.875rem;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.agl-cifra__numero {
margin: var(--e1) 0 0;
font-size: clamp(1.375rem, 1rem + 1vw, 1.75rem);
font-weight: 700;
line-height: 1.1;
font-variant-numeric: tabular-nums;
}
@media (min-width: 60rem) {
.agl-nosotros__cuerpo {
grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
column-gap: var(--e6);
row-gap: 0;
}
.agl-nosotros__foto {
grid-column: 1;
grid-row: 1;
height: 100%;
min-height: 26rem;
aspect-ratio: auto;
}
.agl-nosotros__texto {
grid-column: 2;
grid-row: 1;
}
.agl-cifras {
grid-column: 1 / -1;
grid-row: 2;
margin-top: var(--e6);
grid-template-columns: repeat(3, 1fr);
}
}
.agl-carrusel {
margin-block: var(--e8);
}
.agl-carrusel__encabezado {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: var(--e4);
margin-bottom: var(--e5);
}
.agl-carrusel__titulo {
margin: 0;
}
.agl-carrusel__controles {
display: flex;
align-items: center;
gap: var(--e2);
}
.agl-carrusel__pausa,
.agl-carrusel__flecha {
min-height: var(--tactil);
min-width: var(--tactil);
border: 1px solid var(--divisor);
border-radius: var(--radio-chico);
background: var(--blanco);
color: var(--texto);
font: inherit;
cursor: pointer;
}
.agl-carrusel__pausa {
padding-inline: var(--e4);
}
.agl-carrusel__flecha {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0;
font-size: 1.5rem;
line-height: 1;
}
.agl-carrusel__pausa:hover,
.agl-carrusel__flecha:hover {
background: var(--superficie);
}
.agl-carrusel__pista {
display: flex;
gap: var(--e5);
margin: 0;
padding: 0;
list-style: none;
overflow-x: auto;
scroll-snap-type: x mandatory;
overscroll-behavior-x: contain;
scrollbar-width: none;
-ms-overflow-style: none;
}
.agl-carrusel__pista::-webkit-scrollbar {
display: none;
}
.agl-carrusel__item {
flex: 0 0 auto;
width: 13rem;
padding: var(--e4);
scroll-snap-align: start;
text-align: center;
}
.agl-carrusel__logo {
display: block;
width: 100%;
height: 5rem;
aspect-ratio: 5 / 2;
object-fit: contain;
object-position: center;
margin-inline: auto;
}
.agl-carrusel__nombre {
margin: var(--e3) 0 0;
font-size: 0.8125rem;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
color: var(--texto-2);
}
@media (prefers-reduced-motion: reduce) {
.agl-carrusel__pista {
scroll-behavior: auto;
}
}
.agl-contacto {
display: grid;
gap: var(--e5);
margin-block: var(--e6);
}
@media (min-width: 60rem) {
.agl-contacto {
grid-template-columns: 1fr 1fr;
align-items: start;
}
.agl-contacto__mapa,
.agl-contacto__mapa .agl-mapa {
height: 100%;
}
.agl-contacto__mapa .agl-mapa__marco {
height: 100%;
min-height: 24rem;
border-radius: var(--radio-tarjeta);
}
}
.agl-canales {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
gap: var(--e3);
margin: 0;
padding: 0;
list-style: none;
}
.agl-canal {
display: grid;
grid-template-columns: auto 1fr;
column-gap: var(--e3);
row-gap: var(--e1);
align-items: start;
padding: var(--e4) var(--e5);
}
.agl-canal .agl-icono {
grid-column: 1;
grid-row: 1;
color: var(--verde);
}
.agl-canal > :not(.agl-icono) {
grid-column: 2;
}
.agl-canal__titulo {
margin: 0;
color: var(--verde);
font-size: 0.8125rem;
font-weight: 600;
letter-spacing: 0.06em;
line-height: 1.4;
text-transform: uppercase;
}
.agl-canal__datos {
margin: 0;
padding: 0;
list-style: none;
color: var(--texto);
}
.agl-canal__datos a {
color: inherit;
text-decoration: none;
}
.agl-canal__datos a:hover,
.agl-canal__datos a:focus-visible {
text-decoration: underline;
}
.agl-canales__accion {
margin: var(--e5) 0 0;
}
.agl-canal__datos li + li {
margin-top: var(--e2);
}
.agl-canal__accion {
margin-top: auto;
padding-top: var(--e2);
min-height: var(--tactil);
display: inline-flex;
align-items: center;
font-weight: 600;
}
.agl-entrada {
margin-block: var(--e4) var(--e6);
}
.agl-entrada p {
max-width: none;
}
.agl-envios__salida {
margin-block: var(--e6);
}
.agl-wa-flotante {
position: fixed;
right: var(--e4);
bottom: var(--e4);
z-index: 40;
display: inline-flex;
align-items: center;
justify-content: center;
width: 56px;
height: 56px;
border-radius: 50%;
background: var(--wa);
color: var(--blanco);
box-shadow: 0 2px 8px rgb(26 29 26 / 0.3);
transition: transform var(--transicion);
}
.agl-wa-flotante:hover {
transform: scale(1.06);
}
[data-agl-consulta="abierta"] .agl-wa-flotante {
display: none;
}
@media (prefers-reduced-motion: reduce) {
.agl-wa-flotante:hover {
transform: none;
}
}
.agl-listado__acciones {
display: flex;
flex-direction: column;
align-items: stretch;
gap: var(--e2);
min-width: 0;
width: 100%;
margin-left: auto;
}
.agl-listado__salidas {
display: flex;
flex-wrap: wrap;
gap: var(--e2);
width: 100%;
}
.agl-listado__acciones .agl-sumar {
width: 100%;
min-width: 0;
}
.agl-listado__wa,
.agl-listado__ver {
flex: 0 0 auto;
justify-content: center;
white-space: nowrap;
padding-inline: var(--e4);
font-size: 0.875rem;
}
@media (min-width: 641px) {
.agl-listado__tabla {
min-width: var(--min-tabla, 0);
}
.agl-listado__wa,
.agl-listado__ver,
.agl-listado__sumar {
min-height: 2.25rem;
}
.agl-listado__wa,
.agl-listado__ver {
min-width: 0;
padding-inline: var(--e3);
border-radius: var(--radio-boton-chico);
font-size: 0.8125rem;
}
.agl-listado__wa .agl-icono-caja svg {
width: 16px;
height: 16px;
}
.agl-listado__sumar {
margin-top: 0;
padding-right: 0;
gap: var(--e2);
font-size: 0.8125rem;
min-width: 0;
}
.agl-listado__sumar .agl-sumar__texto {
min-width: 0;
}
.agl-listado__sumar .agl-sumar__casilla {
width: 18px;
height: 18px;
}
}
.agl-icono-caja {
display: inline-flex;
flex: 0 0 auto;
}
.agl-filtros__rotulo {
margin: 0 0 var(--e2);
color: var(--texto-2);
font-size: 0.875rem;
font-weight: 600;
}
.agl-pasos {
margin-block: var(--e7);
}
.agl-pasos__lista {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
gap: var(--e5);
margin: 0;
padding: 0;
list-style: none;
counter-reset: agl-paso;
}
.agl-paso {
padding: var(--e4) var(--e5) var(--e5);
background: var(--blanco);
border: 1px solid var(--divisor);
border-radius: var(--radio-tarjeta);
box-shadow: var(--sombra-tarjeta);
counter-increment: agl-paso;
}
.agl-paso__titulo {
display: flex;
align-items: center;
gap: var(--e3);
margin: 0 0 var(--e2);
font-size: 1.0625rem;
}
.agl-paso__titulo::before {
display: flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
width: 1.75rem;
height: 1.75rem;
border-radius: 50%;
background: var(--verde);
color: var(--blanco);
font-size: 0.9375rem;
content: counter(agl-paso);
}
.agl-paso p {
margin: 0;
color: var(--texto-2);
}
.agl-retiro {
margin-block: var(--e7);
padding: var(--e5);
border: 1px solid var(--divisor);
border-radius: var(--radio-tarjeta);
background: var(--verde-tenue);
}
.agl-retiro h2 {
margin-top: 0;
}
.agl-retiro__dato {
display: flex;
align-items: center;
gap: var(--e2);
margin: 0 0 var(--e2);
}
.agl-retiro__icono {
display: flex;
color: var(--verde);
}
.agl-retiro__mapa {
margin: var(--e3) 0 0;
}
.agl-retiro__mapa a {
display: inline-flex;
align-items: center;
min-height: var(--tactil);
font-weight: 600;
}
.agl-hub-entradas {
margin-block: var(--e7);
}
.agl-hub-entradas__lista {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
gap: var(--e4);
margin: 0;
padding: 0;
list-style: none;
}
.agl-hub-entrada {
display: block;
height: 100%;
padding: var(--e4);
border: 1px solid var(--divisor);
border-left: 3px solid var(--verde);
border-radius: var(--radio-chico);
background: var(--superficie);
color: inherit;
text-decoration: none;
}
.agl-hub-entrada:hover {
border-color: var(--verde);
border-left-color: var(--verde);
}
.agl-hub-entrada__titulo {
display: block;
margin-bottom: var(--e1);
color: var(--verde-fuerte);
font-weight: 600;
}
.agl-hub-entrada__texto {
display: block;
color: var(--texto-2);
font-size: 0.9375rem;
}
@media (max-width: 640px) {
.agl-listado__acciones {
align-items: stretch;
width: auto;
min-width: 0;
margin-left: 0;
}
.agl-listado__salidas {
width: auto;
flex-wrap: wrap;
}
.agl-listado__salidas .agl-listado__wa,
.agl-listado__salidas .agl-listado__ver {
flex: 1 1 10rem;
}
.agl-listado__acciones .agl-sumar {
width: auto;
}
.agl-listado__wa,
.agl-listado__ver {
border-radius: var(--radio-boton-chico);
font-size: 0.875rem;
}
.agl-listado__sumar {
font-size: 0.875rem;
}
.agl-filtros__campo {
flex: 1 1 100%;
max-width: none;
}
.agl-listado__marco {
border: 0;
border-radius: 0;
}
.agl-consulta-barra__fila {
gap: var(--e2);
}
.agl-consulta-barra__estado {
flex: 1 1 100%;
font-size: 0.875rem;
}
.agl-consulta-barra__acciones {
flex: 1 1 100%;
}
.agl-consulta-barra__acciones .agl-boton-plano {
flex: 0 0 auto;
}
.agl-consulta-barra__acciones .agl-boton-wa {
flex: 1 1 auto;
padding-inline: var(--e3);
font-size: 0.9375rem;
}
.agl-banda-buscador {
padding: var(--e4);
}
.agl-buscador--grande .agl-buscador__campo {
padding-left: calc(22px + 2 * var(--e3));
padding-right: var(--e3);
font-size: 1rem;
}
.agl-buscador__lupa {
left: var(--e3);
}
.agl-buscador--grande .agl-buscador__enviar {
padding-inline: var(--e3);
}
.agl-buscador__campo::placeholder {
font-size: 0.9375rem;
}
}
@media (max-width: 359px) {
.agl-buscador__lupa {
display: none;
}
.agl-buscador--grande .agl-buscador__campo {
padding-left: var(--e3);
padding-right: var(--e2);
}
}
.agl-carrusel__destaque {
margin: var(--e1) 0 0;
color: var(--verde);
font-size: 0.75rem;
font-weight: 600;
line-height: 1.4;
text-transform: none;
letter-spacing: 0;
}
@media (max-width: 640px) {
.agl-listado__fila,
.agl-listado__fila:nth-child(even),
.agl-listado__fila:nth-child(even of .agl-listado__fila) {
background: var(--blanco);
}
}