/* Variables
  **********************************/
@import url("variables.css");
/* ******************************* */

/* Header
***********************/

.region-header {
  display: flex;
  flex-wrap: nowrap;
  gap: 1rem;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  padding: var(--pm-block-blend) var(--pm-block) 0;
}

header.header-fixed {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 99999;
}

#block-eclipse-site-branding {
  block-size: 140px;
  aspect-ratio: 378 / 326;
}

.path-frontpage #block-eclipse-site-branding {
  block-size: 200px;
}

header.header-fixed.header-scroll #block-eclipse-site-branding {
  block-size: 100px;
}

#block-eclipse-site-branding div {
  width: 100%;
  height: 100%;
}

#block-eclipse-site-branding .block-content a {
  display: block;
  inset: 0;
  overflow: hidden;
}

#block-eclipse-site-branding .block-content a img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: top;
}

#block-eclipse-main-menu {
  display: flex;
  justify-content: flex-end;
}

/* Highlighted top
***********************/

.region-highlighted-top {
  /* height: 130vh; */
}

.slider-big {
  position: absolute;
  width: 100%;
  height: 150vh;
  top: 0;
  left: 0;
}

.slider-big * {
  height: 100%;
}

.slider-big-title,
.service-header,
.service-header *,
.contextual,
.contextual * {
  height: auto !important;
}

.service-image,
.slider-big-image {
  overflow: hidden;
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
  height: 150vh;
}

.sevice-image,
#block-sliderhome .swiper-slide {
  overflow: hidden;
  display: block;
}

.service-image img,
#block-sliderhome .swiper-slide img,
.slider-big-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.slider-big .swiper-container {
  position: relative;
}

.service-image::before,
#block-sliderhome .swiper-wrapper::before,
.slider-big-image::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(3, 11, 14, 0.5);
  background: linear-gradient(180deg, rgba(3, 11, 14, 0.65) 0%, rgba(3, 11, 14, 0.3) 20%, rgba(3, 11, 14, 0.6) 40%, rgba(3, 11, 14, 1) 100%);
  z-index: 9;
}

.paragraph--view-mode--slider-home {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
}

.slider-big-title {
  text-align: center;
  color: var(--rosa);
  font-size: calc(var(--text-subtitle) + 0.5rem);
  font-weight: var(--thin);
  margin-block: 0 60vh;
  z-index: 10;
  inline-size: var(--width-reduced);
  line-height: 1.2em;
}

#block-eclipse-destacadoshome {
  top: 100dvh;
  position: relative;
  z-index: 999;
  width: var(--width-base);
  margin-inline: auto;
}

.block-banner-image-circle {
  grid-gap: 6vw;
}

.paragraph--view-mode--imagen-redonda {
  position: relative;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.banner-image-circle-text {
  position: absolute;
  inline-size: 80%;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  z-index: 9;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.banner-image-circle-image {
  overflow: hidden;
  display: block;
  inline-size: 60%;
  aspect-ratio: 1 / 1;
  position: relative;
}

.banner-image-circle-image::before {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  content: "";
  z-index: 1;
  background: rgba(3, 11, 14, 0.2);
  background: linear-gradient(90deg, rgba(77, 0, 0, 0.8) 0%, rgba(3, 11, 14, 0.2) 100%);
}

.banner-image-circle-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 50%;
}

.banner-image-circle-title {
  font-size: var(--text-subtitle);
  color: var(--amarillo);
  margin: 0;
  line-height: 1.2em;
}

/* Tratamientos - Slider */

#block-tratamientos-slider {
  margin-block-start: var(--pm-block);
}

#swiper-tratamientos-slider .swiper-wrapper {
  width: 100%;
  height: 100vh;
  height: 100dvh;
  position: relative;
}

.slider-services-image {
  inset: 0;
  overflow: hidden;
  position: absolute;
  z-index: 1;
}

.slider-services-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.slider-services-image::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(3, 11, 14, 0.5);
  background: linear-gradient(180deg, rgba(3, 11, 14, 0.65) 0%, rgba(3, 11, 14, 0.3) 20%, rgba(3, 11, 14, 0.6) 40%, rgba(3, 11, 14, 1) 100%);
  z-index: 8;
}

.slider-services-icon {
  height: 150px;
  margin-bottom: 2rem;
}

.slider-services-icon > div {
  height: 100%;
  overflow: hidden;
}

.slider-services-icon > div img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.slider-services-content {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  height: 100%;
  aspect-ratio: 1/1;
  z-index: 9;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.slider-services-content::before {
  position: absolute;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: auto;
  height: 90%;
  aspect-ratio: 1/1;
  z-index: 8;
  background: rgba(117, 1, 1, 0.5);
  border-radius: 50%;
  mix-blend-mode: color-burn;
  box-shadow: 0 0 100px rgba(255, 33, 4, 0.7);
}

.slider-services-content:hover::before {
  box-shadow: 0 0 150px rgba(255, 33, 4, 0.9);
}

.slider-services-content * {
  z-index: 9;
}

.slider-services-content h3,
.highlights-services-content h3 {
  font-size: var(--title-section);
  color: var(--amarillo);
  text-align: center;
  margin: 0;
  padding: 0 calc(var(--pm-block) + 30px);
  line-height: 1em;
}

.slider-services-content h4,
.highlights-services-content h4 {
  font-size: var(--text-subtitle);
  padding: 0 calc(var(--pm-block) + 30px);
  text-align: center;
  color: var(--rosa);
  margin: 2rem 0;
  line-height: 1.1em;
}

.highlights-services-content h3,
.highlights-services-content h4 {
  padding: 0;
}

.slider-services-summary {
  padding: 0 calc(var(--pm-block) + 30px);
  margin: 0 0 2rem;
}

.highlights-services-summary {
  margin-bottom: 1.5rem;
}

.slider-services-summary p,
.highlights-services-summary p {
  color: var(--azul);
  font-weight: var(--light);
  line-height: 1.3em;
  text-align: center;
}

.highlights-services {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.highlights-services .views-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: var(--pm-block);
  position: relative;
  text-align: center;
  height: 90vh;
  height: 90dvh;
}

.highlights-services-icon {
  height: 150px;
  margin-bottom: 2rem;
}

.highlights-services-icon > div {
  height: 100%;
  overflow: hidden;
}

.highlights-services-icon > div img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.highlights-services-image {
  position: absolute;
  inset: 0;
  z-index: 8;
  overflow: auto;
}

.highlights-services-image::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9;
  background: rgba(3, 11, 14, 0.5);
  background: linear-gradient(180deg, rgba(3, 11, 14, 0.65) 0%, rgba(3, 11, 14, 0.6) 40%, rgba(3, 11, 14, 1) 100%);
}

.highlights-services-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.highlights-services-content {
  position: relative;
  z-index: 9;
}

/* Tratamientos */

.service-header-wrap .views-row {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
}

.service-header {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: 1rem;
  margin-block: 0 60vh;
  z-index: 10;
  inline-size: 90%;
  text-align: center;
}

.service-header-text {
  inline-size: 100%;
  display: flex;
  flex-direction: column;
}

.service-icon {
  position: relative;
  margin-inline: auto;
}

.service-icon > div {
  block-size: 120px !important;
  margin-bottom: 1rem;
  aspect-ratio: 1 / 1;
  margin-inline: auto;
}

.service-icon img {
  object-fit: contain !important;
}

.service-title {
  color: var(--amarillo);
  font-size: var(--title-section);
  font-weight: var(--thin);
  margin-block: 0.7em 1em;
}

.service-summary {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  color: var(--rosa);
  gap: 1rem;
}

.service-summary p {
  inline-size: 180ex;
  line-height: 1.4em;
}

.service-summary::before,
.service-summary::after {
  content: "";
  height: 1px;
  inline-size: 100%;
  background: var(--barro);
  opacity: 0.5;
}

.service-data {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 2rem;
  padding: 0 2rem;
  inline-size: 100%;
}

.service-data-left {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 3rem;
}

.service-data-right {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-end;
  gap: 1rem;
}

.service-price-wrap {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 3rem;
}

.service-price {
  font-weight: var(--light);
  font-size: calc(var(--text-general) * 2.5) !important;
  display: flex;
  align-items: baseline;
  flex-flow: nowrap;
  gap: 0.1em;
  line-height: 1em;
  color: var(--amarillo);
}

.service-price::after {
  content: "€";
  font-weight: var(--light);
  font-size: calc(var(--text-general) * 1.8) !important;
}

.service-price-old {
  font-size: var(--text-subtitle);
  position: relative;
}

.service-price-old::before {
  position: absolute;
  content: "";
  display: block;
  inline-size: 140%;
  block-size: 1px;
  background: var(--barro);
  top: 50%;
  left: 50%;
  transform: translate(-50%) rotate(-15deg);
}

.service-price-old::after {
  content: "€";
  font-weight: var(--light);
  font-size: var(--text-general);
}

/* Featured top
***********************/

/* Main content
***********************/

.node--type-tratamiento #main-content-wrap {
  inline-size: var(--width-medium);
  margin-inline: auto;
  display: grid;
  grid-template-columns: 7fr 5fr;
  grid-gap: 6vw;
}

.node--type-tratamiento #main-content-wrap:has(> :only-child) {
  grid-template-columns: 1fr;
  inline-size: var(--width-reduced);
  margin-inline: auto;
}

.servicios-incluidos-item {
  display: grid;
  grid-template-columns: 60px auto;
  align-items: center;
  grid-gap: 2rem;
  padding: 1.5rem 0;
  border-bottom: var(--border-light);
  position: relative;
  color: var(--amarillo);
}

/* Servicios incluidos - Campos */

#block-servicios-incluidos-campos {
  margin-block: calc(var(--pm-block) * 2);
}

.servicios-incluidos-campos-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.servicios-incluidos-campos-wrap .views-row {
  position: relative;
}

.texto-icono,
.icono-texto {
  grid-column: span 2;
}

.servicios-incluidos-campos-wrap:has(> .bloque-en-columna:only-child) {
  inline-size: 100%;
  block-size: 90vw;
  block-size: 90dvw;
  grid-column: span 2;
}

/* .servicios-incluidos-campos-wrap:has(> .bloque-en-columna:nth-child(2)):not(:has(> .bloque-en-columna:nth-child(3))) .views-row, */
.bloque-en-columna {
  grid-column: span 1;
}

.servicios-incluidos-campos-wrap .texto-icono,
.servicios-incluidos-campos-wrap .icono-texto {
  position: relative;
  grid-column: span 2;
  aspect-ratio: 2 / 1;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  padding: 0;
  grid-gap: 0;
}

.servicios-incluidos-campos-wrap .texto-icono::before,
.servicios-incluidos-campos-wrap .icono-texto::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 2;
}

.servicios-incluidos-campos-wrap .texto-icono .servicio-wrap-texto::before,
.servicios-incluidos-campos-wrap .texto-icono .servicio-wrap-texto::after {
  position: absolute;
  content: "";
  z-index: 1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 50%;
  background: linear-gradient(to right, rgba(231, 37, 11, 0.3), transparent);
  box-shadow: 0px 0px 100px rgba(255, 71, 46, 0.3);
}

.servicios-incluidos-campos-wrap .icono-texto .servicio-wrap-texto::before,
.servicios-incluidos-campos-wrap .icono-texto .servicio-wrap-texto::after {
  position: absolute;
  content: "";
  z-index: 1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  border-radius: 50%;
  background: transparent;
}

.servicios-incluidos-campos-wrap .icono-texto .servicio-wrap-texto::before {
  box-shadow: 0px 0px 70px -10px rgba(244, 1, 118, 0.6);
}

.servicios-incluidos-campos-wrap .icono-texto .servicio-wrap-texto::after {
  box-shadow: -100px 0px 100px -10px rgba(104, 1, 130, 0.5);
}

.servicio-wrap-icono {
  height: 100%;
  z-index: 2;
}

.servicio-wrap-icono > div {
  height: 100%;
  border-radius: 50%;
  border: var(--border-light);
  display: flex;
  justify-content: center;
  align-items: center;
}

.servicio-wrap-icono > div img {
  block-size: 140px;
  aspect-ratio: 1 / 1;
}

.servicio-imagen {
  overflow: hidden;
  display: block;
  position: absolute;
  inset: 0;
  z-index: 1;
}

.servicio-imagen img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
}

.servicio-wrap-texto {
  height: 100%;
  padding: 0 var(--pm-block);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  position: relative;
  z-index: 3;
}

.servicio-wrap-texto .servicio-titulo {
  font-size: var(--title-section);
  color: var(--amarillo);
  font-weight: var(--thin);
  text-align: center;
  margin-block: 0 1em;
  line-height: 1.1em;
  position: relative;
  z-index: 9;
}

.servicio-wrap-texto .servicio-subtitulo {
  color: var(--rosa);
  inline-size: clamp(150px, 100%, 760px);
  margin-inline: auto;
  position: relative;
  z-index: 9;
}

.bloque-en-columna {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  block-size: 90vh;
  block-size: 90dvh;
}

.bloque-en-columna::before {
  position: absolute;
  content: "";
  z-index: 2;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
}

.bloque-en-columna .servicio-wrap-icono {
  z-index: 9;
  order: 1;
  height: auto;
}

.icono-texto .servicio-wrap-icono {
  order: 1;
}

.bloque-en-columna .servicio-wrap-icono > div {
  height: auto;
  border-radius: inherit;
  border: 0;
}

.bloque-en-columna .servicio-wrap-texto {
  order: 2;
  height: auto;
}

.icono-texto .servicio-wrap-texto {
  order: 2;
}

.bloque-en-columna .servicio-wrap-texto .servicio-titulo {
  margin-block: 1em;
}

#block-texto-presentacion-home {
  width: var(--width-base);
  max-width: var(--width-reduced);
  margin: auto;
  text-align: center;
}

#block-texto-presentacion-home h2 {
  color: var(--amarillo);
  font-size: var(--title-block);
  margin-bottom: 1em;
  line-height: 1.2em;
}

#block-texto-presentacion-home p {
  line-height: 1.3em;
}

/* Footer
***********************/

footer {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 30px;
}

#footer-datos-right {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

#block-eclipse-logofooter .block-content .field .field__item {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-flow: row nowrap;
}

#block-eclipse-logofooter .block-content .field .field__item::before,
#block-eclipse-logofooter .block-content .field .field__item::after {
  content: "";
  width: calc(50% - 160px);
  height: 1px;
  background: var(--linea);
  display: block !important;
}

#block-eclipse-logofooter .block-content .field .field__item img {
  width: auto;
  height: 100px;
}

.footer-datos .field .field__item {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 6rem;
	text-align: center;
	margin-bottom: 30px;
	position: relative;
}

.footer-datos .field .field__item::before {
	content: "";
	position: absolute;
	width: 1px;
	height: 100%;
	background: var(--linea);
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}

.footer-datos .field .field__item p {
	font-size: var(--text-general-small) !important;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.7em;
}

.text-icon::before {
	width: 16px !important;
	height: 16px !important;
  display: block !important;
}

p.telefono::before {
	content: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21.266 26.254" fill="%23D99D6F"><path d="M17.058,26.234c-1.845-.371-4.295-2.009-6.9-4.612a43.168,43.168,0,0,1-4.322-5.091,43.286,43.286,0,0,1-3.506-5.638l-.019-.036C.632,7.581-.177,4.747.033,2.879a1,1,0,0,1,.515-.766L4.2.122a1,1,0,0,1,1.241.23c.07.083.142.171.222.271a11.16,11.16,0,0,1,.672.955A14.548,14.548,0,0,1,7.849,4.854a13.687,13.687,0,0,1,.716,4.707c0,.116-.011.236-.02.354a1,1,0,0,1-.869.915l-2.9.376a42.729,42.729,0,0,0,2.68,4.147,42.855,42.855,0,0,0,3.127,3.821l1.247-2.649a1,1,0,0,1,1.143-.545c.093.023.214.053.34.088a13.675,13.675,0,0,1,4.259,2.123,14.517,14.517,0,0,1,2.655,2.446,11.527,11.527,0,0,1,.7.926l0,.005c.066.1.128.194.191.3a1,1,0,0,1-.162,1.25l-3.011,2.863a1,1,0,0,1-.689.275A.976.976,0,0,1,17.058,26.234ZM12.074,20.7a15.508,15.508,0,0,0,4.9,3.444l1.984-1.886c-.086-.112-.175-.224-.27-.337a12.665,12.665,0,0,0-2.29-2.107,12.352,12.352,0,0,0-3.125-1.661ZM2,3.6A15.519,15.519,0,0,0,3.78,9.318l2.792-.362a12.38,12.38,0,0,0-.625-3.484A12.739,12.739,0,0,0,4.642,2.648c-.079-.125-.159-.245-.239-.36Z"/></svg>');
}

p.email::before {
	content: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 21.053 15.966" fill="%23D99D6F"><path d="M1,15.966a1,1,0,0,1-1-1V1A1,1,0,0,1,1,0H20.053a1,1,0,0,1,1,1V14.966a1,1,0,0,1-1,1Zm1-2H19.053V5.735a10.719,10.719,0,0,1-.914,1.036.937.937,0,0,1-.116.1l-6.906,5.061a1,1,0,0,1-1.182,0l-6.9-5.061a1.09,1.09,0,0,1-.116-.1A10.731,10.731,0,0,1,2,5.734ZM4.278,5.3l6.249,4.58L16.777,5.3A6.921,6.921,0,0,0,18.685,2H2.369A6.93,6.93,0,0,0,4.278,5.3Z"/></svg>');
}

#block-eclipse-copyright {
	width: var(--width-base);
	margin: 2rem auto 3rem;
	text-align: center;
  font-size: var(--text-general-small) !important;
}

.footer-nav ul {
	display: flex;
	justify-content: center;
	list-style: none;
	font-size: var(--text-general-small);
	gap: 3rem;
}

/**********************************************
Responsive
**********************************************/

@media all and (max-width: 1360px) {
}