/*
Theme Name:     Hotel El Oso
Theme URI:      n/a
Template:       kadence
Author:         Fernando García Rebolledo
Author URI:     n/a
Description:    Tema personalizado para web de Hotel El Oso
Version:        1.0
License:        GNU General Public License v3.0 (or later)
License URI:    https://www.gnu.org/licenses/gpl-3.0.html
*/
:root{
		--global-palette-danger: #F10000;
		--icons-size-m: 24px;
		--icons-size-lg: 40px;
		--global-palette2-light: #fcf6d9;
		--global-xxxs-spacing: calc(1rem / 4);
		--global-xxs-spacing: calc(1rem / 2);
		--global-xs-spacing: 1rem;
		--global-sm-spacing: 1.5rem;
		--global-md-spacing: 2rem;
		--global-lg-spacing: 2.5rem;
		--global-xl-spacing: 3.5rem;
		--global-xxl-spacing: 5rem;
		--max-width: 1700px;
		/* Colores */
		--negro-oso: #000000;
		--blanco-oso: #ffffff;
		--fondo-oso: #ffffff;
		--rojo-oso: #87322B;
		/* Fuentes */
		--titular-font-family: 'source-serif-4', serif;
}
::selection{
		background-color: var(--negro-oso);
		color: var(--blanco-oso);
}
::-moz-selection{
		background-color: var(--negro-oso);
		color: var(--blanco-oso);
}
mark{
		background-color: var(--global-palette2);
		border-radius: 5px;
		padding: 0px 5px;
}
html{
		scroll-behavior: smooth;
}
.oso-width{
		max-width: var(--max-width);
		margin: 0 auto;
}
/*Espacios*/
body .entry-content-wrap .entry-content >div:not(.oso-no-padding) >div.kt-inside-inner-col,
body .entry-content-wrap .entry-content > div:not(.oso-no-padding)>div.kt-row-column-wrap,
.oso-section{
	padding-top: clamp(4rem, 1.4615rem + 11.2821vw, 15rem);
	padding-bottom: clamp(4rem, 1.4615rem + 11.2821vw, 15rem);
}
body .entry-content-wrap .entry-content >div.oso-no-padding__top,
body .entry-content-wrap .entry-content >div.oso-no-padding__top >div.kt-inside-inner-col{
	padding-top: 0;
}
body .entry-content-wrap .entry-content >div.oso-no-padding__bottom >div.kt-inside-inner-col,
.oso-no-padding__bottom{
	padding-bottom: 0;
}
.entry-content > div:not(.oso-full),
header .site-header-wrap .site-header-inner-wrap .site-header-upper-inner-wrap .site-container,
header .site-mobile-header-wrap .site-header-inner-wrap .site-header-upper-inner-wrap .site-container,
.oso-padding>div,
.oso-servicios-tabla>div{
	padding-right: clamp(0.625rem, 0.4167rem + 0.9259vw, 1.25rem);
	padding-left: clamp(0.625rem, 0.4167rem + 0.9259vw, 1.25rem);
}
@media (max-width: 768px){
		.oso-full:not(.anchocompleto) > div.kt-inside-inner-col{
				padding-right: clamp(0.625rem, 0.4167rem + 0.9259vw, 1.25rem);
				padding-left: clamp(0.625rem, 0.4167rem + 0.9259vw, 1.25rem);
		}
}
.anim-line__item,
.paragraph-line{
	padding-bottom: 15px;
}
/*Tipografia*/
h1,
.oso-h1{
	font-family: var(--titular-font-family);
	font-size: clamp(4.0625rem, 2.8542rem + 5.3704vw, 7.6875rem);
	font-weight: 300;
	line-height: clamp(4.0625rem, 2.5979rem + 6.5093vw, 8.45625rem);
	font-style: italic;
	word-break: keep-all;
}
h2,
.oso-h2{
	font-family: var(--titular-font-family);
	font-size: clamp(2.7rem, 1.5167rem + 5.2593vw, 6.25rem);
	font-weight: 300;
	line-height: 90%; /* 5.625rem */
	font-style: italic;
	text-wrap: wrap;
}
h3,
.oso-h3{
	font-family: var(--titular-font-family);
	font-size: clamp(1.875rem, 1.1667rem + 3.1481vw, 4rem);
	font-weight: 300;
	line-height: clamp(2.0625rem, 1.4167rem + 2.8704vw, 4rem);
	font-style: italic;
}
h4,
.oso-h4{
	font-family: Inter;
	font-size: clamp(0.9375rem, 0.625rem + 1.3889vw, 1.875rem);
	font-weight: 300;
	line-height: 143%;
	text-transform: uppercase;
}
h5,
.oso-h5,
body.single-post article .entry-content p{
	font-family: Inter;
	font-size: clamp(0.875rem, 0.8125rem + 0.2778vw, 1.0625rem);
	font-style: normal;
	font-weight: 300;
	line-height: normal;
}
h6,
.oso-h6{
	font-family: Inter;
	font-size: 1.25rem;
	font-style: normal;
	font-weight: 300;
	line-height: normal;
}
p,
.oso-parrafo{
	font-family: Inter;
	font-size: clamp(0.6875rem, 0.6458rem + 0.1852vw, 0.8125rem);
	font-style: normal;
	font-weight: 300;
	line-height: normal;
	font-size: clamp(0.6875rem, 0.6458rem + 0.1852vw, 0.8125rem);
}
/* Hacer que no se corten las palabras en cualquier parte */
h1, .oso-h1, h2, .oso-h2, h3, .oso-h3, h4, .oso-h4, h5, .oso-h5, h6, .oso-h6, p, .oso-parrafo, li, a, span{
	overflow-wrap: break-word;
	word-wrap: break-word;
	hyphens: inherit;
}
/*Componentes*/
.oso-boton__transparente-blanco{
	background-color: transparent;
	font-family: Inter;
	font-size: clamp(0.8125rem, 0.4583rem + 1.5741vw, 1.875rem);
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	text-transform: uppercase;
	padding: .6rem 1.5rem;
	border: 2px solid #fff;
	border-radius: 1.85538rem;
	transition: all 0.3s ease-in-out;
}
.oso-boton__transparente-negro{
	background-color: transparent;
	color: #000;
	font-family: Inter;
	font-size: clamp(0.8125rem, 0.4583rem + 1.5741vw, 1.875rem);
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	text-transform: uppercase;
	padding: .6rem 1.5rem;
	border: 2px solid #000;
	border-radius: 1.85538rem;
	transition: all 0.3s ease-in-out;
}
.oso-boton__transparente-blanco:hover{
	background-color: #fff;
	color: #000;
}
.oso-boton__transparente-negro:hover{
	background-color: #000;
	color: #fff;
}
/*Header*/
header nav ul li a {
	color: #000;
	font-family: Inter;
	font-size: 1rem;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	text-transform: uppercase;
}
/*Home*/
.oso-expanding-triangle{
	position: absolute;
	bottom: -1px;
	left: 50%;
	transform: translateX(-50%);
	width: 200px;
	height: 100px;
	background: white;
	clip-path: polygon(50% 0%, 100% 38%, 100% 100%, 0 100%, 0% 38%);
	transform-origin: bottom center;
	z-index: 1;
	background: #fff;
	z-index: 99;
}
/* .home-section-2 .home-section-2__content{
	opacity: 0;
		transform: translateY(30px);
} */
.oso-home-comedor svg{
	opacity: 0;
}

.oso-img-arco{
	border-top-left-radius: 25rem;
	border-top-right-radius: 25rem;
	height: 100%;
	overflow: hidden;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	width: 100%;
}

.oso-img-arco img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
}
.oso-parallax {
  position: absolute;
  bottom: -80%;/*-20rem;*/
  right: 0%;
  transform: translateX(0%);
  z-index: 10;         /* por encima de la imagen grande */
  will-change: transform;
}
@media screen and (max-width: 1024px) {
	.oso-parallax {
  		position: relative;
		bottom: 0;
	}
}
.oso-lottie-home dotlottie-player{
	position: absolute;
	left: -5rem;
	bottom: -50%;
	width: 100%;
}
/* Slider*/
.custom-slider-block .owl-stage {
	margin: 15px 0;
	display: flex;
	display: -webkit-flex;
}
.custom-slider-block .owl-stage .owl-item{
	margin-right: 4rem;
}
.custom-slider-block .item {
	margin: 0 15px 60px;
	width: 20vw;
	height: 400px;
	display: flex;
	display: -webkit-flex;
	align-items: flex-end;
	-webkit-align-items: flex-end;
	background: #ffffff no-repeat center center / cover;
	border-radius: 16px;
	overflow: hidden;
	position: relative;
	transition: all 0.4s ease-in-out;
	-webkit-transition: all 0.4s ease-in-out;
	cursor: pointer;
}
.custom-slider-block .item.active {
	width: 25vw;
	box-shadow: 12px 40px 40px rgba(0, 0, 0, 0.25);
	-webkit-box-shadow: 12px 40px 40px rgba(0, 0, 0, 0.25);
}
.custom-slider-block .item:after {
	content: "";
	display: block;
	position: absolute;
	height: 100%;
	width: 100%;
	left: 0;
	top: 0;
	/* background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1)); */
}
.custom-slider-block .item-desc {
	padding: 0 24px 12px;
	color: #fff;
	position: relative;
	z-index: 1;
	overflow: hidden;
	transform: translateY(calc(100% - 54px));
	-webkit-transform: translateY(calc(100% - 54px));
	transition: all 0.4s ease-in-out;
	-webkit-transition: all 0.4s ease-in-out;
}
.custom-slider-block .item.active .item-desc {
	transform: none;
	-webkit-transform: none;
}
.custom-slider-block .item-desc p {
	opacity: 0;
	-webkit-transform: translateY(32px);
	transform: translateY(32px);
	transition: all 0.4s ease-in-out 0.2s;
	-webkit-transition: all 0.4s ease-in-out 0.2s;
}
.custom-slider-block .item.active .item-desc p {
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
}
.custom-slider-block .owl-theme.custom-carousel .owl-dots {
	margin-top: -20px;
	position: relative;
	z-index: 5;
}
/******** Middle section CSS End *******/

/***** responsive css Start ******/

@media (min-width: 992px) and (max-width: 1199px) {
	h2 {
		margin-bottom: 32px;
	}
	h3 {
		margin: 0 0 8px;
		font-size: 24px;
		line-height: 32px;
	}

	/* -------- Landing page ------- */
	.custom-slider-block {
		padding: 50px 30px;
	}
	.custom-slider-block .item {
		margin: 0 12px 60px;
		width: 260px;
		height: 360px;
	}
	.custom-slider-block .item.active {
		width: 400px;
	}
	.custom-slider-block .item-desc {
		transform: translateY(calc(100% - 46px));
		-webkit-transform: translateY(calc(100% - 46px));
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	h2 {
		margin-bottom: 32px;
	}
	h3 {
		margin: 0 0 8px;
		font-size: 24px;
		line-height: 32px;
	}
	.line-title {
		width: 330px;
	}

	/* -------- Landing page ------- */
	.custom-slider-block {
		padding: 50px 30px 40px;
	}
	.custom-slider-block .item {
		margin: 0 12px 60px;
		width: 240px;
		height: 330px;
	}
	.custom-slider-block .item.active {
		width: 360px;
	}
	.custom-slider-block .item-desc {
		transform: translateY(calc(100% - 42px));
		-webkit-transform: translateY(calc(100% - 42px));
	}
}

@media (max-width: 767px) {
	body {
		font-size: 14px;
	}
	h2 {
		margin-bottom: 20px;
	}
	h3 {
		margin: 0 0 8px;
		font-size: 19px;
		line-height: 24px;
	}
	.line-title {
		width: 250px;
	}

	/* -------- Landing page ------- */
	.custom-slider-block {
		padding: 30px 15px 20px;
	}
	.custom-slider-block .item {
		margin: 0 10px 40px;
		width: 200px;
		height: 280px;
	}
	.custom-slider-block .item.active {
		width: 270px;
		box-shadow: 6px 10px 10px rgba(0, 0, 0, 0.25);
		-webkit-box-shadow: 6px 10px 10px rgba(0, 0, 0, 0.25);
	}
	.custom-slider-block .item-desc {
		padding: 0 14px 5px;
		transform: translateY(calc(100% - 42px));
		-webkit-transform: translateY(calc(100% - 42px));
	}
	.custom-slider-block .owl-carousel .owl-stage .owl-item {
		margin-right: 0;
	}
	.custom-slider-block .owl-carousel .owl-stage .owl-item .container{
		flex-direction: column;
		max-width: 100vw;
	}
	.custom-slider-block .owl-carousel .owl-stage .owl-item .container .image-section{
		max-width: 100vw;
		flex: fit-content;
	}
	.custom-slider-block .owl-carousel .owl-stage .owl-item .container .text-section{
		max-width: 90%;
		flex: fit-content;
		gap: 2rem;
	}
}



.container {
	display: flex;
	align-items: end;
	justify-content: center;
	box-sizing: border-box;
	gap: 3rem;
}
.image-section {
	flex: 1.2;
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 60rem;
	height: 40rem;
}
.image-section img {
	width: 50%;
	border-radius: 0;
	object-fit: cover;
	height: 100%;
}
.text-section {
	flex: 1;
	color: #fff;
	display: flex;
	flex-direction: column;
	justify-content: center;
	max-width: 40rem;
	gap: 6rem;
}
.custom-slider-block .title{
	font-family: "Source Serif 4";
}
/* Navegación slider */
.custom-slider-block .owl-nav{
	position: absolute;
	left: 0;
	top: 0;
	display: flex !important;
	width: 100%;
	height: 100%;
}
.custom-slider-block .owl-nav button{
	height: 100%;
	width: 50%;
	box-shadow: none;
}
.custom-slider-block .owl-nav button span{
	display: none;
}
.custom-slider-block .owl-theme .owl-nav [class*="owl-"]:hover{
	background-color: transparent;
}
.custom-slider-block .owl-theme .owl-nav button:hover{
	box-shadow: none;
}
.custom-slider-block .owl-theme .owl-nav button.owl-next:hover{
	cursor: url('./img/right.png')25 52,auto;
}
.custom-slider-block .owl-theme .owl-nav button.owl-prev:hover{
	cursor: url('./img/left.png')25 52,auto;
}
/* Flechas negras en la página de restaurante. */
body.page-id-362 .custom-slider-block .owl-theme .owl-nav button.owl-prev:hover{
	cursor: url('./img/flecha-negra-izda.svg')25 52,auto;
}
body.page-id-362 .custom-slider-block .owl-theme .owl-nav button.owl-next:hover{
	cursor: url('./img/flecha-negra.svg')25 52,auto;
}
/* RESTAURANTE */
.slider-restaurante .title,
.slider-restaurante .desc{
	color: #000;
}
/* TARIFAS */
.oso-lottie-estrella{
    position: absolute;
	left: -60px;
	top: 50%;
    width: 100%;
}
/* SINGLE POST */
body.post-template-default .entry-hero .entry-hero-container-inner .site-container{
	padding-top: clamp(4rem, 1.4615rem + 11.2821vw, 15rem);
}

.anim-texto-revelar{
  	
}