/* © Fernando Martínez Marín · VEOVIRTUAL® · veovirtual.com */

/* Base */
body .vvl-caja {
max-width:1240px;
margin:0 auto;
padding:0 clamp(16px, 4vw, 32px);
box-sizing:border-box;
}
body .vvl-oculto {
position:absolute;
width:1px;
height:1px;
overflow:hidden;
clip:rect(0 0 0 0);
white-space:nowrap;
}
body .vvl-ico {
width:1.15em;
height:1.15em;
flex:none;
}
body .vvl-seccion__titulo {
margin:0 0 clamp(16px, 2.5vw, 24px);
font-family:var(--vv-fuente-titulos, inherit);
font-size:clamp(1.4rem, 2.6vw, 1.9rem);
line-height:1.2;
color:var(--vv-oscuro, #1f2429);
}

/* Migas */
body .vvl-migas__lista {
display:flex;
flex-wrap:wrap;
align-items:center;
gap:6px;
margin:0 0 18px;
padding:0;
list-style:none;
font-size:0.9rem;
}
body .vvl-migas__item {
display:flex;
align-items:center;
gap:6px;
}
body .vvl-migas__item + .vvl-migas__item::before {
content:"/";
opacity:0.5;
}
body .vvl-migas__enlace {
display:inline-flex;
align-items:center;
min-height:32px;
color:inherit;
text-decoration:underline;
text-underline-offset:3px;
}
body .vvl-migas__actual {
font-weight:600;
}

/* Botones */
body .vvl-boton {
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;
min-height:46px;
padding:10px 20px;
border:1px solid var(--vv-acento, #3d7f8f);
border-radius:var(--vv-radio, 999px);
background-color:#ffffff;
color:var(--vv-oscuro, #1f2429);
font-weight:600;
text-decoration:none;
transition:background-color 0.2s ease, color 0.2s ease;
}
body .vvl-boton:hover,
body .vvl-boton:focus-visible {
background-color:color-mix(in srgb, var(--vv-acento, #3d7f8f) 10%, #ffffff);
}
body .vvl-boton--principal {
background-color:var(--vv-acento, #3d7f8f);
color:#ffffff;
}
body .vvl-boton--principal:hover,
body .vvl-boton--principal:focus-visible {
background-color:var(--vv-oscuro, #1f2429);
color:#ffffff;
}

/* Hub */
body .vvl-hub__cabecera {
padding:clamp(28px, 5vw, 56px) 0 clamp(8px, 2vw, 16px);
}
body .vvl-hub__titulo {
margin:0;
font-family:var(--vv-fuente-titulos, inherit);
font-size:clamp(2rem, 5vw, 3.2rem);
line-height:1.1;
color:var(--vv-oscuro, #1f2429);
}
body .vvl-hub__cuerpo {
padding-bottom:clamp(40px, 7vw, 80px);
}
body .vvl-hub__intro {
max-width:760px;
margin:0 0 clamp(24px, 4vw, 36px);
font-size:1.1rem;
line-height:1.65;
}

/* Filtros */
body .vvl-filtros {
display:flex;
flex-wrap:wrap;
gap:10px;
margin:0 0 12px;
}
body .vvl-filtros__btn {
min-height:44px;
padding:8px 18px;
border:1px solid color-mix(in srgb, var(--vv-acento, #3d7f8f) 35%, #ffffff);
border-radius:999px;
background-color:#ffffff;
color:var(--vv-oscuro, #1f2429);
font:inherit;
font-weight:600;
cursor:pointer;
transition:background-color 0.2s ease, color 0.2s ease;
}
body .vvl-filtros__btn.is-activo {
border-color:var(--vv-acento, #3d7f8f);
background-color:var(--vv-acento, #3d7f8f);
color:#ffffff;
}
body .vvl-listado__cuenta {
margin:0 0 20px;
font-size:0.9rem;
opacity:0.75;
}

/* Tarjetas */
body .vvl-rejilla {
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
gap:clamp(16px, 2.5vw, 28px);
}
body .vvl-tarjeta[hidden] {
display:none;
}
body .vvl-tarjeta__enlace {
display:flex;
flex-direction:column;
height:100%;
overflow:hidden;
border:1px solid color-mix(in srgb, var(--vv-texto, #20252b) 10%, #ffffff);
border-radius:calc(var(--vv-radio, 14px) * 1);
background-color:#ffffff;
color:inherit;
text-decoration:none;
transition:box-shadow 0.25s ease, transform 0.25s ease;
}
body .vvl-tarjeta__enlace:hover,
body .vvl-tarjeta__enlace:focus-visible {
box-shadow:0 14px 34px color-mix(in srgb, var(--vv-oscuro, #1f2429) 14%, transparent);
transform:translateY(-3px);
}
body .vvl-tarjeta__foto {
position:relative;
flex:none;
height:var(--vvf-foto-alto, clamp(190px, 19vw, 250px));
overflow:hidden;
background-color:color-mix(in srgb, var(--vv-acento, #3d7f8f) 12%, #ffffff);
}
body .vvl-tarjeta__img {
display:block;
width:100%;
height:100%;
object-fit:cover;
transition:transform 0.5s ease;
}
body .vvl-tarjeta__enlace:hover .vvl-tarjeta__img {
transform:scale(1.04);
}
body .vvl-tarjeta__sinfoto {
display:flex;
align-items:center;
justify-content:center;
height:100%;
font-size:2.4rem;
color:var(--vv-acento, #3d7f8f);
}
body .vvl-tarjeta__tipo {
position:absolute;
top:12px;
left:12px;
padding:4px 12px;
border-radius:999px;
background-color:color-mix(in srgb, var(--vv-oscuro, #1f2429) 82%, transparent);
color:#ffffff;
font-size:0.8rem;
font-weight:600;
}
body .vvl-tarjeta__texto {
display:flex;
flex:1;
flex-direction:column;
padding:18px 20px 20px;
}
body .vvl-tarjeta__titulo {
margin:0 0 4px;
font-family:var(--vv-fuente-titulos, inherit);
font-size:1.2rem;
line-height:1.25;
color:var(--vv-oscuro, #1f2429);
}
body .vvl-tarjeta__zona {
margin:0 0 10px;
font-size:0.85rem;
opacity:0.7;
}
body .vvl-tarjeta__resumen {
flex:1;
margin:0 0 14px;
line-height:1.55;
}
body .vvl-tarjeta__mas {
display:inline-flex;
align-items:center;
gap:6px;
font-weight:600;
color:var(--vv-acento, #3d7f8f);
}
@media (max-width:959px) {
body .vvl-rejilla {
grid-template-columns:repeat(2, minmax(0, 1fr));
}
}
@media (max-width:767px) {
body .vvl-tarjeta__foto {
height:var(--vvf-foto-alto-movil, 150px);
}
body .vvl-rejilla {
gap:12px;
}
body .vvl-tarjeta__texto {
padding:12px 12px 14px;
text-align:center;
}
body .vvl-tarjeta__titulo {
font-size:1rem;
}
body .vvl-tarjeta__zona,
body .vvl-tarjeta__resumen {
display:none;
}
body .vvl-tarjeta__mas {
margin:auto auto 0;
font-size:0.85rem;
}
body .vvl-tarjeta__tipo {
top:8px;
left:8px;
font-size:0.72rem;
}
}

/* Ficha: cabecera */
body .vvl-ficha__cabecera {
position:relative;
padding:clamp(28px, 5vw, 56px) 0 clamp(24px, 4vw, 40px);
}
body .vvl-ficha__cabecera--foto {
display:flex;
align-items:flex-end;
min-height:clamp(360px, 62vh, 620px);
color:#ffffff;
}
body .vvl-ficha__fondo {
position:absolute;
inset:0;
overflow:hidden;
}
body .vvl-ficha__fondo::after {
content:"";
position:absolute;
inset:0;
background:linear-gradient(180deg, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0.1) 35%, rgba(0, 0, 0, 0.72) 100%);
}
body .vvl-ficha__fondo-img {
width:100%;
height:100%;
object-fit:cover;
}
body .vvl-ficha__cabecera-caja {
position:relative;
width:100%;
}
body .vvl-ficha__etiquetas {
display:flex;
flex-wrap:wrap;
gap:8px;
margin:0 0 12px;
}
body .vvl-ficha__etiquetas span {
padding:4px 12px;
border:1px solid currentColor;
border-radius:999px;
font-size:0.82rem;
font-weight:600;
}
body .vvl-ficha__titulo {
max-width:900px;
margin:0 0 12px;
font-family:var(--vv-fuente-titulos, inherit);
font-size:clamp(2rem, 5.4vw, 3.6rem);
line-height:1.08;
}
body .vvl-ficha__cabecera--foto .vvl-ficha__titulo {
color:#ffffff;
text-shadow:0 2px 18px rgba(0, 0, 0, 0.35);
}
body .vvl-ficha__resumen {
max-width:720px;
margin:0;
font-size:clamp(1.05rem, 1.6vw, 1.2rem);
line-height:1.55;
}

/* Ficha: cuerpo */
body .vvl-ficha__cuerpo {
display:grid;
grid-template-columns:minmax(0, 1fr) 360px;
gap:clamp(28px, 5vw, 64px);
padding-top:clamp(32px, 5vw, 56px);
padding-bottom:clamp(32px, 5vw, 56px);
}
body .vvl-ficha__texto > p {
margin:0 0 1.1em;
font-size:1.075rem;
line-height:1.75;
}
body .vvl-info {
position:sticky;
top:110px;
padding:24px;
border-radius:var(--vv-radio, 14px);
background-color:color-mix(in srgb, var(--vv-acento, #3d7f8f) 7%, #ffffff);
}
body .vvl-info__titulo {
margin:0 0 16px;
font-family:var(--vv-fuente-titulos, inherit);
font-size:1.25rem;
color:var(--vv-oscuro, #1f2429);
}
body .vvl-info__lista {
margin:0 0 20px;
}
body .vvl-info__fila {
padding:10px 0;
border-top:1px solid color-mix(in srgb, var(--vv-texto, #20252b) 10%, transparent);
}
body .vvl-info__fila dt {
margin:0 0 2px;
font-size:0.8rem;
font-weight:700;
letter-spacing:0.04em;
text-transform:uppercase;
opacity:0.75;
}
body .vvl-info__fila dd {
margin:0;
line-height:1.5;
}
body .vvl-info__botones {
display:flex;
flex-direction:column;
gap:10px;
}
@media (max-width:959px) {
body .vvl-ficha__cuerpo {
grid-template-columns:minmax(0, 1fr);
}
body .vvl-info {
position:static;
}
}
@media (max-width:767px) {
body .vvl-ficha__cabecera--foto {
min-height:clamp(320px, 70vh, 520px);
}
body .vvl-ficha__cabecera-caja {
text-align:center;
}
body .vvl-migas__lista,
body .vvl-ficha__etiquetas {
justify-content:center;
}
body .vvl-ficha__resumen {
margin:auto;
}
}

/* Galería */
body .vvl-galeria {
margin-top:clamp(28px, 4vw, 44px);
}
body .vvl-galeria__lista {
display:grid;
grid-template-columns:repeat(3, minmax(0, 1fr));
gap:10px;
margin:0;
padding:0;
list-style:none;
}
body .vvl-galeria__enlace {
display:block;
aspect-ratio:1 / 1;
overflow:hidden;
border-radius:calc(var(--vv-radio, 14px) * 0.6);
}
body .vvl-galeria__img {
display:block;
width:100%;
height:100%;
object-fit:cover;
transition:transform 0.4s ease;
}
body .vvl-galeria__enlace:hover .vvl-galeria__img {
transform:scale(1.05);
}
@media (max-width:767px) {
body .vvl-galeria__lista {
grid-template-columns:repeat(2, minmax(0, 1fr));
}
}

/* Rutas y otros lugares */
body .vvl-rutas {
padding:clamp(32px, 5vw, 56px) 0;
background-color:color-mix(in srgb, var(--vv-oscuro, #1f2429) 4%, #ffffff);
}
body .vvl-rutas__lista {
display:grid;
grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
gap:12px;
margin:0;
padding:0;
list-style:none;
}
body .vvl-rutas__enlace {
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
min-height:56px;
padding:12px 18px;
border:1px solid color-mix(in srgb, var(--vv-acento, #3d7f8f) 25%, #ffffff);
border-radius:var(--vv-radio, 12px);
background-color:#ffffff;
color:var(--vv-oscuro, #1f2429);
font-weight:600;
text-decoration:none;
}
body .vvl-rutas__enlace:hover,
body .vvl-rutas__enlace:focus-visible {
border-color:var(--vv-acento, #3d7f8f);
}
body .vvl-otros {
padding:clamp(40px, 6vw, 72px) 0;
}
body .vvl-otros__todos {
margin:clamp(24px, 4vw, 36px) 0 0;
text-align:center;
}

/* Visor */
body .vvl-visor {
position:fixed;
inset:0;
z-index:9999;
display:flex;
align-items:center;
justify-content:center;
background-color:rgba(10, 12, 14, 0.92);
}
body .vvl-visor[hidden] {
display:none;
}
body .vvl-visor__img {
max-width:calc(100vw - 32px);
max-height:calc(100dvh - 120px);
object-fit:contain;
}
body .vvl-visor__pie {
position:absolute;
bottom:18px;
left:0;
right:0;
margin:0;
color:#ffffff;
text-align:center;
font-size:0.9rem;
}
body .vvl-visor__btn {
position:absolute;
display:flex;
align-items:center;
justify-content:center;
width:48px;
height:48px;
border:0;
border-radius:50%;
background-color:rgba(255, 255, 255, 0.14);
color:#ffffff;
font-size:1.6rem;
cursor:pointer;
}
body .vvl-visor__btn--cerrar {
top:16px;
right:16px;
}
body .vvl-visor__btn--ant {
left:12px;
top:50%;
translate:0 -50%;
}
body .vvl-visor__btn--sig {
right:12px;
top:50%;
translate:0 -50%;
}

/* Movimiento reducido */
@media (prefers-reduced-motion:reduce) {
body .vvl-tarjeta__enlace,
body .vvl-tarjeta__img,
body .vvl-galeria__img {
transition:none;
}
}