/* ============================================
   VARIABLES
============================================ */
:root {
    --color-azul: #203696;
    --color-texto: #f5f5f5;
    --color-fondo: #ffffff;
    --color-gris: #f5f5f5;
    --font-titulo: 'Cheltenham', serif;
    --font-cuerpo: 'GT America Extended Medium', sans-serif;
	 
}

/* ============================================
   HERO
============================================ */
.single-local .site-content-contain #content{padding:0;}
.single-local header.hero{position:fixed;top:0;z-index:100;box-shadow:none;}
.admin-bar .single-local header.hero{top:32px;}
.restaurant-hero {
    position: relative;
    min-height: 100vh;
    background-size: cover;
    background-position: top center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    padding: 4rem 1.5rem;
	max-width:100%
}

.restaurant-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
}

.hero-content {
    position: relative;
    z-index: 2;
    max-width: 1000px;
	width:100%;
	    display: flex;
    flex-direction: column;
    align-items: center;
}

h1.hero-title{width:600px;max-width:100%;}
h1.hero-title img{width:100%;height:auto;}
.hero-claim {
    font-family: var(--font-titulo);
    font-size: 60px;
    margin: 2rem 0 2.5rem;
	line-height:0.95;
}

/* Menú horizontal azul */
.hero-menu {
    background: var(--color-azul);
    padding: 20px 50px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    
    border-radius: 40px;
    margin-bottom: 2.5rem;
	width:100%;max-width:900px;
	
}

.hero-menu a {
	font-family:'GT America Extended Regular';
	font-weight:400;
    color: #fff;
    text-decoration: none;
    font-size: 16px;
	letter-spacing: 3%;
    text-transform: uppercase;
    transition: opacity 0.2s;
	
}

.hero-menu a:hover { opacity: 0.7; }

.hero-horario {
	position:absolute;
	left:40px;
	bottom:100px;
    font-size: 17px;
    text-transform: uppercase;
	max-width:284px;
	text-align:left;
	
}

/* ============================================
   EXPERIENCIA
============================================ */
.restaurant-experiencia {
    position: relative;
    padding: 6rem 1.5rem 10rem;
    background-size: cover;
    background-position: center;
    text-align: center;
    color: #fff;
}

.experiencia-inner {
    max-width: 1000px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

.restaurant-experiencia h2 {
	color:var(--color-texto);
  font-family: var(--font-titulo);
    font-size: 60px;
    margin-bottom: 1.5rem;
	line-height:1;
}

.experiencia-texto {
	font-family:var(--font-cuerpo);
    font-size: 24px;
	font-weight:500;
    line-height: 1.11;
	letter-spacing:3%;
    
    margin: 0 auto 2rem;
	text-align:center;
	

}

.experiencia-horario {
	font-family:var(--font-cuerpo);
    display: inline-block;
	font-weight:500;
    font-size: 17px;
	line-height: 1.11;
	letter-spacing:3%;
    text-transform: uppercase;
    margin-bottom: 3rem;
}

.experiencia-imagen {
    max-width:1366px;
	max-height:85vh;
    margin: 0 auto;
    border-radius: 32px;
    overflow: hidden;
    
}

.experiencia-imagen img {
    width: 100%;
    height: auto;
    display: block;
}
.experiencia-imagen .media-video{height:100%;width:auto;border-radius:32px;overflow:hidden;}
/* ============================================
   EVENTOS
============================================ */
.restaurant-eventos {
    padding: 6rem 1.5rem;
    background: #fff;
    text-align: center;
}

.restaurant-eventos h2 {
   color: var(--color-azul);
	font-family: var(--font-titulo);
	font-weight: 300;
    font-size: 60px;
    line-height: 95%;
    text-align: center;
    margin-bottom: 40px;
	text-transform:uppercase;
	margin-bottom:44px;
}

.eventos-grid {
    
    max-width: 1366px;
    margin: 0 auto;
	padding:0;
	
	display: flex;
    gap: 22px;
    overflow-x: auto;
    cursor: grab;
    scroll-behavior: smooth;

    /* Ocultar barra de scroll */
    scrollbar-width: none;      /* Firefox */
    -ms-overflow-style: none;   /* IE / Edge antiguo */
}
.eventos-grid::-webkit-scrollbar {
    display: none;
}

/* Mientras se arrastra */
.eventos-grid.dragging {
    cursor: grabbing;
    scroll-behavior: auto; /* sin "smooth" para que siga al ratón al instante */
}
.evento-card {
	 user-select: none;
	width:33vw;min-width:365px;
    position: relative;
    aspect-ratio: 3 / 4;
    border-radius: 16px;
    overflow: hidden;
    text-decoration: none;
    color: #fff;
    display: flex;
	justify-content:center;align-items:center;
	
}

.evento-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
	 pointer-events: none; /* evita el "arrastre fantasma" de la imagen */
}

.evento-card:hover img { transform: scale(1.05); }

.evento-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.7) 0%, transparent 60%);
}
.evento-card a{position:absolute;max-width:calc( 100% - 80px);z-index:10;cursor:pointer;}
.evento-card h3 {
    
    z-index: 2;
    font-family: var(--font-titulo);
    color: #f5f5f5;
	font-weight: 300;
    font-size: 60px;
    line-height: 95%;
    text-align: center;
    background:transparent;
	
	
}

/* ============================================
   CARTAS
============================================ */
.restaurant-cartas {
    padding: 6rem 1.5rem;
    background: #fff;
    text-align: center;
}

.restaurant-cartas h2 {
    color: var(--color-azul);
	font-family: var(--font-titulo);
	font-weight: 300;
    font-size: 60px;
    line-height: 95%;
    text-align: center;
    margin-bottom: 40px;
	text-transform:uppercase;
	margin-bottom:44px;
}

.cartas-lista {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    max-width: 1366px;
    display: flex;
    flex-direction: column;
    gap: 17px;
}
.carta-item{}
.carta-item a,
.carta-item span {
    display: block;
    background: rgba(234, 234, 234, 0.87);
    color: var(--color-azul);
    padding: 30px;
    border-radius: 20px;
    text-decoration: none;
    text-transform: uppercase;
    transition: background 0.25s;
	font-family: var(--font-cuerpo);
	font-weight: 500;
	font-size: 32px;
	line-height: 1.11;
	letter-spacing: 3%;
	text-align: center;
	vertical-align: middle;
	

}

.carta-item a:hover { background: #dcdcdc; }

/* ============================================
   GALERÍA
============================================ */
.restaurant-galeria {
    padding: 4rem 1.5rem 6rem;
    background: #fff;
}

.galeria-carrusel {
    max-width: 1366px;
    margin: 0 auto;
    padding-bottom: 0rem;
	position:relative;


}

.galeria-slide img {
    width: 100%;
aspect-ratio:4/2.5;
    object-fit: cover;
    border-radius: 12px;
    display: block;
}
/* Puntos de paginación blancos sobre la imagen */


.galeria-carrusel .swiper-pagination {
    position: absolute;
    bottom: 1.2rem;
    left: 0;
    right: 0;
    z-index: 5;
}
.galeria-carrusel .swiper-button-prev,
.galeria-carrusel .swiper-button-next{color:#fff;}
.galeria-carrusel .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    background: #fff;
    opacity: 0.5;
    margin: 0 5px !important;
    transition: opacity 0.2s, transform 0.2s;
}

.galeria-carrusel .swiper-pagination-bullet-active {
    opacity: 1;
    transform: scale(1.2);
}

.restaurant-footer{max-width:100%;margin:0 auto;display:flex;padding:0 20px;width:1406px;overflow:hidden;}
.restaurant-footer h2{
   color: var(--color-azul);
	font-family: var(--font-titulo);
	font-weight: 300;
    font-size: 60px;
    line-height: 95%;
    text-align: left;
    margin-bottom: 40px;
	text-transform:uppercase;
	margin-bottom:33px;
}
.donde{display:flex;flex-direction:column;align-items:center;margin-right:100px;min-width:431px;width:431px;}
.contactos{display:flex;padding-top:90px;flex-direction:column;justify-content: space-between;}
.contactos .linea{width:100%;display:flex;flex-direction:row;margin-bottom:15px;}
.contactos .redes .linea{margin-bottom:30px;}
.contactos .linea div{width:417px;}
.direc{margin-bottom:5px;}
.contactos .linea a, .contactos .linea .direc{
	font-family:var(--font-cuerpo);
    font-size: 28px;
	font-weight:500;
    line-height: 1.14;
	letter-spacing:0%;
    color:var(--color-azul);
	}
.instagram a, .facebook a, .tiktok a, .comollegar a{text-decoration:underline;}
.logosc{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;}

.logosc .logo-vbp{margin-left:40px;}
.logosc img{max-height:75px;}
.contactos .lineas{display:flex;flex-wrap:wrap;}
.web a{text-decoration:underline;}
.contactoslineas{margin-bottom:10px;}
/* ============================================
   RESPONSIVE
============================================ */
@media (max-width: 1374px) {
.contactos .lineas{display:flex;flex-wrap:wrap;}	
}
@media (max-width: 1000px) {
	.restaurant-footer{flex-direction:column;justify-content:center;max-width:471px;width:100%;}
    .donde{max-width:100%;text-align:center;align-items:center;margin:0;min-width:1px;}
	.logosc{flex-direction:column;}
	.contactos{text-align:center;padding-top:20px;}
	.logosc .logo-vbp{margin:0;}
	.donde-img{border-radius:20px;}
	.donde-img img{width:100%;hegiht:100%;object-fit:cover;}
	.contactoslineas,.redes{width:100%;}
}
@media (max-width: 768px) {
	
	
	
	
	.hero-menu {
        
        padding: 0.8rem 1.2rem;
    }
    .hero-menu a { font-size: 0.75rem; }
    

}
@media (max-width: 620px) {
		.contactos .linea a, .contactos .linea .direc, .comollegar a{font-size:22px;}
	.contactos .linea{margin-bottom:10px;}
	.hero-menu a{width:50%;text-align:left;font-size:16px;padding:5px 0}
	.hero-menu a:nth-child(2n){text-align:right;padding:5px 0}
	.hero-menu{padding:8px 40px;border-radius:40px;}
	.hero-horario{display:none;}
	.carta-item a, .carta-item span{font-size:24px;}
	.restaurant-eventos h2,.restaurant-cartas h2,.restaurant-footer h2{font-size:52px;}
	.hero-claim{font-size:36px;}
	.experiencia-texto{font-size:18px}
	.galeria-carrusel .swiper-button-prev,
.galeria-carrusel .swiper-button-next{display:none;}
}
@media (max-width: 470px) {
		.contactos .linea a, .contactos .linea .direc, .comollegar a{font-size:18px;}
		
	
}