/**
 * Custom CSS
 * Use this file to override styles if you feel uncomfortable editing
 * component stylesheets.
 ============================================================================ */

/* Fuentes
***********************/

/* --------------------

Marcellus

font-family: "Marcellus", serif;
Regular 400

Overpass

font-family: "Overpass", sans-serif;
100..900

-------------------- */

/* Font size
***********************/

:root {
	--title-section: clamp(34px, 4vw, 76px);
	--text-general-small: clamp(14px, 1.8vw, 16px);
	--text-general: clamp(16px, 2vw, 20px);
	--text-subtitle: clamp(22px, 2vw, 26px);
	--text-small: 18px;
	--text-button: 24px;
	--text-button-small: 20px;
}

/* Font family
***********************/

:root {
	--marcellus: "Marcellus", serif;
	--overpass: "Overpass", sans-serif;
}

/* Font weight
***********************/

:root {
	--light: 300;
	--regular: 400;
	--medium: 600;
	--bold: 700;
}

/* Colores
***********************/

:root {
	--base-fondo: #040404;
	--linea: #281d16;
	/* rgba(40, 29, 22, 1) */
	--linea-intensa: #453224;
	--barro: #d99d6f;
	/* rgba(217, 157, 111, 1); */
	--pastel: #ffd9b6;
	--oro: #ac863e;
}

/* Padding & Margin
***********************/

:root {
	--pm-block: clamp(20px, 9vw, 120px);
	--pm-block-blend: clamp(15px, 5vw, 50px);
}

/* Border
***********************/

:root {
	--border-base: 1px solid var(--linea);
	--border-intense: 1px solid var(--linea-intensa);
	--border-light: 1px solid var(--barro);
	--radius-10: 10px;
}

/* Base width
***********************/

:root {
	--width-base: calc(100% - 160px);
	--width-reduced: 960px;
	--width-medium: 1520px;
	--width-limit: 100%;
}

/* Reset Styles
***********************/

*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

html,
body,
div,
span,
h1,
p,
a,
dl,
dt,
dd,
ol,
ul,
li {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* Base
***********************/

html {
	scroll-behavior: smooth;
}

body {
	font-family: var(--overpass);
	background: var(--base-fondo);
	color: var(--barro);
	font-weight: var(--light);
	line-height: 1em;
	font-size: var(--text-general);
}

h1,
h2,
h3 {
	font-weight: 100;
	font-family: var(--marcellus);
	line-height: 1.3em;
}

h1 {
	font-size: clamp(24px, 2vw, 36px);
	color: var(--pastel);
}

h2 {
	font-size: clamp(20px, 1.8vw, 24px);
	margin: 0;
}

p {
	font-size: var(--text-general);
	line-height: 1.4em;
}

a {
	color: var(--barro);
	text-decoration: none;
	transition: all 0.2s;
}

a:hover {
	text-decoration: underline;
}

img {
	width: 100%;
	height: auto;
}

/* General
***********************/

.image-bg {
	background-color: var(--barro);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.image-bg-top {
	background-position: top;
}

.image-bg-bottom {
	background-position: bottom;
}

.span-2 {
	grid-column: span 2;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 2em;
}

.summary-page {
	text-align: center;
	margin-bottom: 3em;
}

/* Form
***********************/

form {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-gap: 1.5em 1em;
}

form label {
	display: block;
	color: var(--pastel);
	font-weight: var(--width-medium);
	margin-bottom: 0.5em;
}

fieldset {
	border: 0;
	padding: 0;
	margin: 0;
}

input[type="text"],
input[type="date"],
input[type="time"],
input[type="email"],
input[type="number"],
input[type="tel"],
input[type="password"],
input[type="search"],
select,
textarea {
	color: var(--barro);
	border: var(--border-intense);
	line-height: 60px;
	padding: 10px;
	height: 60px;
	width: 100%;
	font-size: var(--text-general);
	text-align: left;
	background-color: transparent;
	-webkit-appearance: none;
	font-family: var(--overpass) !important;
	font-weight: var(--light);
}

input[type="text"]:focus,
input[type="date"]:focus,
input[type="time"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
select:focus,
textarea:focus {
	transition: all 0.2s;
	color: var(--barro);
	border: var(--border-light);
}

input[type="search"]:focus {
	text-align: left;
	text-indent: 0;
}

input[value=""],
input[type="search"]:required:valid {
	text-align: left !important;
	text-indent: 0;
}

*:focus {
	outline: none;
	transition: all 0.2s;
}

::placeholder {
	opacity: 1;
	color: var(--linea-intensa);
}

input[type="search"]:focus::placeholder {
	text-align: left !important;
	text-indent: 0;
}

*:focus::placeholder {
	opacity: 1;
	color: var(--barro);
}

#form-actions {
	width: var(--width-base);
	max-width: var(--width-reduced);
	margin: 0 auto;
	padding: var(--pm-block-blend) 0;
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1em;
}

#form-actions button {
	background: var(--linea-intensa);
	border: var(--border-intense);
	color: var(--barro);
	font-size: var(--text-general);
	min-width: 215px;
	height: 60px;
	padding: 0 2.5em;
	cursor: pointer;
	border-radius: 60px;
	transition: all 0.2s;
	text-transform: uppercase;
}

#form-actions button:hover {
	border: var(--border-light);
}

#form-actions button:disabled {
	background: transparent;
	border: var(--border-base);
	color: var(--linea);
	cursor: url("../images/arrow-up.png"), auto;
}

.form-item-check {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 0.5em;
	flex-flow: nowrap;
}

.form-item-check label {
	margin-bottom: 0;
	font-size: var(--text-general-small);
}

.form-item-check input {
	margin: 0 !important;
}

/* Form - Checkbox / Radio buttons
***********************/

.check-buttons > li,
.check-buttons > div {
	position: relative;
}

.check-buttons input[type="checkbox"],
.check-buttons input[type="radio"] {
	position: absolute;
	opacity: 0;
}

.check-buttons label {
	display: inline-block;
	background-color: transparent;
	border: 1px solid var(--linea);
	color: var(--barro);
	border-radius: 50px;
	margin: 0;
	padding: 1em 1em 0.8em;
	font-size: var(--text-general);
	cursor: pointer;
	width: 100%;
	height: 100%;
	text-align: center;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
	transition: all 0.2s;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.8em;
}

.check-buttons label:hover {
	background-color: var(--linea);
}

.check-buttons input[type="checkbox"]:checked + label,
.check-buttons input[type="radio"]:checked + label {
	background-color: var(--barro);
	border-color: var(--barro);
	color: var(--linea);
}

.check-buttons input[type="checkbox"]:checked + label::before,
.check-buttons input[type="radio"]:checked + label::before {
	border: 2px solid var(--linea);
	border-top: 0;
	border-left: 0;
	transform: rotate(45deg);
	content: "";
	width: 11px;
	height: 20px;
	transition: all 0.2s;
	margin-top: -0.5em;
}

/* Enlaces, iconos y botones
***********************/

.btn {
	display: inline-block;
	color: var(--barro);
	background-color: transparent;
	text-decoration: none;
	transition: all 0.2s;
	text-align: center;
	font-size: var(--text-general-small);
	font-family: var(--overpass) !important;
	text-transform: uppercase;
	line-height: 50px;
	border: var(--border-base);
	padding: 1em;
	cursor: pointer;
	margin: 0;
	text-shadow: none;
	box-shadow: none;
	border-radius: 0 !important;
	height: 50px;
	-webkit-appearance: none;
	width: auto;
}

.btn:hover {
	background-color: var(--barro);
	border: 1px solid var(--barro);
	color: var(--linea);
	text-decoration: none !important;
}

.btn-light:hover {
	background-color: var(--linea);
	border-color: var(--linea);
	color: black;
}

.btn-icon {
	width: 50px;
	height: 50px;
	border-radius: 50px;
	font-size: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--linea);
}

.btn-icon:hover {
	background: var(--linea);
}

.btn-icon img {
	width: 28px;
	height: 28px;
}

.icon-svg {
	width: 40px;
	height: 40px;
}

.icon-svg path,
.icon-svg polygon,
.icon-svg rect {
	fill: var(--barro);
	transition: all 0.2s;
}

.icon-svg circle {
	stroke: var(--barro);
	stroke-width: 1;
	transition: all 0.2s;
}

.icon-svg:hover path,
.icon-svg:hover polygon,
.icon-svg:hover rect {
	fill: var(--barro);
}

.icon-svg:hover circle {
	stroke: var(--barro);
}

/* Iconos personalizados
***********************/

/* Menú principal
***********************/

.hidden-scroll {
	overflow: hidden;
}

/* #toggle {
    display: none;
} */

.toggle-button {
	cursor: pointer;
	z-index: 999;
	position: absolute;
	top: clamp(30px, 5vw, 100px);
	right: 5%;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	border: 1px solid var(--barro);
	background: var(--linea);
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	gap: 8px;
}

.toggle-button.toggle-active {
	position: fixed;
	z-index: 999999;
}

.bar {
	background-color: var(--barro);
	display: block;
	width: 50%;
	height: 1px;
	border: 0;
	-webkit-transition: all 0.35s ease;
	transition: all 0.35s ease;
}

.toggle-button:hover .bar {
	background: var(--barro);
}

.toggle-active .bar {
	background-color: var(--barro);
}

.toggle-active .top {
	-webkit-transform: translateY(9px) translateX(0) rotate(45deg);
}

.toggle-active .middle {
	opacity: 0;
}

.toggle-active .bottom {
	-webkit-transform: translateY(-9px) translateX(0) rotate(-45deg);
}

.overlay {
	position: fixed;
	background: var(--base-fondo);
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh !important;
	visibility: hidden;
	opacity: 0;
	z-index: 99999;
	overflow: auto;
	transform: translateX(-100%);
	-webkit-transform: translateX(-100%);
	transition: all 0.2s;
}

.overlay.nav-active {
	opacity: 1;
	visibility: visible;
	height: 100vh !important;
	transform: translateX(0%);
	transition: all 0.2s;
	z-index: 99999 !important;
}

/* .overlay a {
	pointer-events: none;
} */

.overlay.nav-active a {
	pointer-events: auto;
}

#minicart {
	position: fixed;
	z-index: -1;
	top: 0;
	left: 100%;
	width: 100%;
	height: 100%;
	background-color: rgba(4, 4, 4, 0);
	z-index: 999999;
	overflow: hidden;
	transform: none;
	-webkit-transition: background-color 0.1s ease-in;
	/* Safari */
	transition: background-color 0.1s ease-in;
	-webkit-transition-delay: 0.1s;
	/* Safari */
	transition-delay: 0.1s;
}

.overlay.cart-active {
	opacity: 1;
	visibility: visible;
	height: 100vh !important;
	z-index: 99999 !important;
	left: 0;
	z-index: 9;
	transform: translateX(-100%) !important;
	-webkit-transform: translateX(-100%) !important;
	background-color: rgba(4, 4, 4, 0.8) !important;
}

#minicart-wrap {
	width: 400px;
	height: 100vh;
	top: 0;
	right: -400px;
	position: absolute;
	opacity: 0;
	transition: all 0.2s;
	background: var(--base-fondo);
	border-left: var(--border-base);
	overflow: hidden;
	padding: 30px 0 30px 30px;
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

.overlay.cart-active #minicart-wrap {
	transform: translateX(-400px) !important;
	opacity: 1;
}

#minicart-header {
	background: var(--base-fondo);
	border-bottom: var(--border-intense);
}

.minicart-title {
}

#minicart-content {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	overflow: auto;
	padding-right: 30px;
}

.minicart-item {
	display: grid;
	grid-template-columns: 3fr 9fr;
	grid-gap: 1rem;
	position: relative;
}

.minicart-item-image {
	aspect-ratio: 1/1;
	overflow: hidden;
}

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

.minicart-item-text {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 1rem;
}

.minicart-item-title {
	font-size: var(--text-general-small);
	line-height: 1.3em;
	padding-right: 30px;
}

.minicart-item-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
	font-size: var(--text-general-small);
}

.minicart-item-price {
	font-family: var(--marcellus);
	font-weight: var(--width-medium);
	font-size: var(--text-general-small);
	display: flex;
	align-items: baseline;
	flex-flow: nowrap;
	gap: 0.1em;
	line-height: 1em;
}

.minicart-item-price::after,
.minicart-total::after {
	content: "€";
	font-family: var(--marcellus);
	font-weight: var(--light);
	font-size: var(--text-general-small);
}

.minicart-footer {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding-right: 30px;
	position: fixed;
	width: calc(100% - 30px);
	bottom: 30px;
	left: 30px;
	background: var(--base-fondo);
	padding-top: 2rem;
	z-index: 999;
}

.minicart-total {
	display: flex;
	justify-content: flex-end;
	align-items: baseline;
	font-family: var(--marcellus);
	font-size: var(--text-subtitle);
}

.minicart-total::after {
	font-size: var(--text-general);
}

.minicart-simple-link {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 1em 0 0;
	border-top: var(--border-intense);
}

.minicart-buttons {
	display: flex;
	justify-content: space-between;
	align-items: center;
	text-align: center;
}

.minicart-buttons input[type="submit"] {
	width: 100%;
	padding: 1em;
	text-transform: uppercase;
	color: var(--barro);
	border: var(--border-base);
	background: transparent;
	cursor: pointer;
	transition: all 0.2s;
	font-family: var(--overpass);
	font-size: var(--text-general-small);
}

.minicart-buttons input[type="submit"]:hover {
	color: var(--linea);
	border: var(--border-intense);
	background: var(--barro);
}

.toogle-delete {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 999;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 1rem;
	background-color: rgba(217, 157, 111, 0);
	border: 0;
	transition: all 0.2s;
	padding: 0;
	border-radius: 20px;
	cursor: pointer;
	font-family: var(--overpass);
}

.toogle-delete:hover {
	background-color: rgba(217, 157, 111, 1);
}

.toogle-delete::after {
	width: 24px;
	height: 24px;
	border-radius: 24px;
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 37.51 37.51" fill="%23D99D6F"><path d="M21.23,18.75l15.77-15.77c.68-.68.68-1.79,0-2.47s-1.79-.68-2.47,0l-15.77,15.77L2.99.51C2.3-.17,1.2-.17.51.51S-.17,2.3.51,2.99l15.77,15.77L.51,34.52c-.68.68-.68,1.79,0,2.47.34.34.79.51,1.24.51s.9-.17,1.24-.51l15.77-15.77,15.77,15.77c.34.34.79.51,1.24.51s.9-.17,1.24-.51c.68-.68.68-1.79,0-2.47l-15.77-15.77Z"/></svg>');
	background-size: 40%;
	background-repeat: no-repeat;
	background-position: center;
	background-color: transparent;
	content: "";
	transition: all 0.2s;
	opacity: 1;
}

.toogle-delete:hover::after {
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 37.51 37.51" fill="%23281d16"><path d="M21.23,18.75l15.77-15.77c.68-.68.68-1.79,0-2.47s-1.79-.68-2.47,0l-15.77,15.77L2.99.51C2.3-.17,1.2-.17.51.51S-.17,2.3.51,2.99l15.77,15.77L.51,34.52c-.68.68-.68,1.79,0,2.47.34.34.79.51,1.24.51s.9-.17,1.24-.51l15.77-15.77,15.77,15.77c.34.34.79.51,1.24.51s.9-.17,1.24-.51c.68-.68.68-1.79,0-2.47l-15.77-15.77Z"/></svg>');
	opacity: 0;
}

.toogle-delete span {
	position: absolute;
	top: 50%;
	right: -10px;
	transform: translateY(-50%);
	opacity: 0;
	color: var(--linea);
	transition: all 0.2s;
	background-color: rgba(217, 157, 111, 0);
	height: 24px;
	line-height: 24px;
	padding: 0 0.5em;
	border-radius: 24px;
}

.toogle-delete:hover span {
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	opacity: 1;
	background-color: rgba(217, 157, 111, 1);
}

.toogle-delete:hover ~ * {
	transition: all 0.2s;
	opacity: 0.5;
}

/* */

/* #main-nav {
	padding-top: 120px;
} */

.main-nav-header {
	display: grid;
	grid-template-columns: auto 80px;
	align-items: end;
	grid-gap: 1em;
	padding: 0 20px;
}

.main-nav-header-text h2 {
	margin: 0 0 5px;
	font-size: var(--title-section);
	color: var(--champagne-light);
	line-height: 1.2em;
}

.main-nav-header-text h3 {
	color: var(--champagne);
	font-size: var(--text-small);
	margin: 0;
}

.main-nav-header-image {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	position: relative;
}

.main-nav-header-image img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	object-position: center;
	border-radius: 50%;
	border: 1px solid var(--champagne);
}

#main-nav-menu {
	padding: 40px 0 0 20px;
}

#main-nav-menu li {
	font-size: var(--text-general);
	border-bottom: 1px solid var(--champagne-light-20);
	display: grid;
	grid-template-columns: 30px auto;
	grid-gap: 1em;
	align-items: center;
}

#main-nav-menu li:first-child {
	border-top: 1px solid var(--champagne-light-20);
}

#main-nav-menu li a {
	color: var(--champagne-light) !important;
	background: url(../images/icons/arrow-next.svg) transparent calc(100% - 20px) center / 20px no-repeat;
	padding: 1.1em 0;
	display: block;
}

/* Cart */

.toggle-cart {
	position: relative;
	cursor: pointer;
	width: 25px;
	height: 25px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50.65 58.26" fill="%23D99D6F"><path d="M46.68,18.04c-.09-.89-.84-1.57-1.74-1.57h-7.4v-4.25c0-6.74-5.48-12.22-12.22-12.22s-12.22,5.48-12.22,12.22v4.25h-7.4c-.9,0-1.65.68-1.74,1.57L0,56.33c-.05.49.11.98.44,1.35.33.37.8.58,1.3.58h47.15c.5,0,.97-.21,1.3-.58.33-.37.49-.86.44-1.35l-3.96-38.29ZM16.61,12.22c0-4.81,3.91-8.72,8.72-8.72s8.72,3.91,8.72,8.72v4.25h-17.44v-4.25ZM3.69,54.76l3.6-34.79h5.82v6.7c0,.97.78,1.75,1.75,1.75s1.75-.78,1.75-1.75v-6.7h17.44v6.7c0,.97.78,1.75,1.75,1.75s1.75-.78,1.75-1.75v-6.7h5.82l3.6,34.79H3.69Z"/></svg>');
	background-color: transparent;
	background-repeat: no-repeat;
	background-size: contain;
}

.toggle-cart.toggle-cart-active {
	position: fixed;
	z-index: 999999;
	width: 50px;
	height: 50px;
	border-radius: 50px;
	top: 40px;
	right: 28px;
	border: 1px solid var(--barro);
	gap: 8px;
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 37.51 37.51" fill="%23D99D6F"><path d="M21.23,18.75l15.77-15.77c.68-.68.68-1.79,0-2.47s-1.79-.68-2.47,0l-15.77,15.77L2.99.51C2.3-.17,1.2-.17.51.51S-.17,2.3.51,2.99l15.77,15.77L.51,34.52c-.68.68-.68,1.79,0,2.47.34.34.79.51,1.24.51s.9-.17,1.24-.51l15.77-15.77,15.77,15.77c.34.34.79.51,1.24.51s.9-.17,1.24-.51c.68-.68.68-1.79,0-2.47l-15.77-15.77Z"/></svg>');
	background-size: 40%;
	background-position: center;
}

.toggle-cart.toggle-cart-active:hover {
	border: 1px solid var(--pastel);
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 37.51 37.51" fill="%23ffd9b6"><path d="M21.23,18.75l15.77-15.77c.68-.68.68-1.79,0-2.47s-1.79-.68-2.47,0l-15.77,15.77L2.99.51C2.3-.17,1.2-.17.51.51S-.17,2.3.51,2.99l15.77,15.77L.51,34.52c-.68.68-.68,1.79,0,2.47.34.34.79.51,1.24.51s.9-.17,1.24-.51l15.77-15.77,15.77,15.77c.34.34.79.51,1.24.51s.9-.17,1.24-.51c.68-.68.68-1.79,0-2.47l-15.77-15.77Z"/></svg>');
}

#toggle-cart-items {
	position: absolute;
	z-index: 999;
	bottom: -5px;
	right: -5px;
	padding: 0 0.3em;
	min-width: 18px;
	border-radius: 18px;
	background: var(--barro);
	color: var(--linea);
	font-size: calc(var(--text-small) - 0.2em);
	font-weight: var(--regular);
	display: flex;
	justify-content: center;
	align-items: center;
}

#toggle-cart.toggle-cart-active #toggle-cart-items {
	display: none;
}

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

header {
	position: absolute;
	z-index: 999;
	width: 100%;
	height: 130px;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	border-bottom: 1px solid var(--linea-intensa);
}

/*header::after {
	content: "";
	position: absolute;
	z-index: 10;
	width: 180px;
	height: 93px;
	bottom: -91px;
	left: 50%;
	transform: translateX(-50%);
	background: url(../images/img/logo-eclipse.png) transparent center / contain no-repeat;
}*/

#logo {
	height: 140px;
	text-align: center;
	position: absolute;
	top: -45px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 11;
}

#logo img {
	width: auto;
	height: 100%;
	margin: auto;
}

/* Nav */

/* Maquetación con intems no anidados: main-nav > nav-item
 .main-nav {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    justify-content: space-between;
    align-items: center;
    grid-gap: 1.5rem;
    flex-flow: row wrap;
    width: var(--width-base);
    margin: auto;
}

 .main-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    grid-gap: 1.5rem;
    flex-flow: row wrap;
    width: var(--width-base);
    margin: auto;
} */

/* Maquetación con intems no anidados: main-nav > nav-column > nav-item */

.main-nav {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: center;
	grid-gap: 1.5rem;
	width: var(--width-base);
	margin: auto;
}

.nav-column {
	display: flex;
	align-items: center;
	flex-flow: row nowrap;
	gap: 2em;
	position: relative;
}

.nav-column:nth-child(1) {
	justify-self: start;
}

.nav-column:nth-child(2) {
	justify-self: center;
}

.nav-column:nth-child(3) {
	justify-self: end;
}

.main-nav a {
	text-decoration: none;
	border-radius: 50px;
	color: var(--barro);
	font-size: var(--text-general);
	font-weight: var(--regular);
	display: block;
}

.main-nav a:hover {
	color: var(--pastel);
}

/* Main
***********************/

main {
	margin-top: 130px;
}

/* Main header */

#main-header {
	height: 320px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	gap: 2em;
	position: relative;
	padding-bottom: 3em;
}

#main-header * {
	position: relative;
	z-index: 10;
}

#main-header::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9;
	background: linear-gradient(rgba(4, 4, 4, 0.45) 0%, #040404 100%);
}

/* Breadcrumb */

#breadcrumb {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	justify-content: center;
	align-items: center;
	background: transparent;
	width: var(--width-base);
	max-width: var(--width-medium);
	counter-reset: section;
}

.breadcrumb-item {
	display: flex;
	justify-content: center;
	align-items: center;
	opacity: 0.3;
}

.breadcrumb-item.active {
	opacity: 1;
}

.breadcrumb-item::before,
.breadcrumb-item::after {
	content: "";
	width: calc(50% - 25px);
	height: 1px;
	background: var(--linea-intensa);
}

.breadcrumb-item.active::before,
.breadcrumb-item.active::after {
	display: none;
}

.breadcrumb-item:first-child::before,
.breadcrumb-item:last-child::after {
	background: transparent;
}

.breadcrumb-item span {
	font-size: var(--text-small);
	width: 50px;
	height: 50px;
	border: 1px solid var(--linea-intensa);
	border-radius: 50px;
	font-size: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

.breadcrumb-item span::before {
	z-index: 9;
	margin-top: 4px;
	font-size: var(--text-subtitle);
	counter-increment: section;
	content: counter(section);
}

.breadcrumb-item.active span {
	font-size: var(--text-general-small);
	width: auto;
	height: auto;
	border: 0;
}

.breadcrumb-item.active span::before {
	display: none;
}

.breadcrumb-item.active ~ .breadcrumb-item {
	opacity: 1;
}

/* Main content */

#main-content {
	width: var(--width-base);
	max-width: var(--width-reduced);
	margin: 0 auto;
	padding: 0 0 var(--pm-block-blend);
	position: relative;
}

#main-content.width-limit {
	width: var(--width-base);
	max-width: var(--width-medium);
}

.section h2 {
	font-size: var(--title-section);
	margin-bottom: 0.1em;
}

/* Calendar */

.calendar {
	width: 50%;
	border: 1px solid var(--linea-intensa);
	padding: clamp(20px, 3vw, 40px) clamp(20px, 3vw, 40px) calc(clamp(20px, 3vw, 40px) / 2);
	margin: auto;
}

.calendar-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	padding-bottom: clamp(20px, 3vw, 40px);
}

.month-title {
	font-size: var(--text-subtitle);
}

.month-button {
	width: 25px;
	height: 25px;
	background: transparent;
	border: 0;
	border-top: 2px solid var(--linea-intensa);
	border-right: 2px solid var(--linea-intensa);
	border-radius: 0;
	font-size: 0;
	padding: 0;
	cursor: pointer;
	transition: all 0.2s;
}

.month-button:hover {
	border-color: var(--barro);
}

.month-prev {
	transform: rotate(225deg);
}

.month-next {
	transform: rotate(45deg);
}

.calendar-table {
	width: 100%;
	border: 0;
	text-align: center;
}

.calendar-table tr {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
}

.calendar-table th,
.calendar-table td {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	height: 50px;
}

.calendar-table th {
	color: var(--barro);
	pointer-events: none;
}

.calendar-table td {
	color: var(--pastel);
	cursor: pointer;
}

.calendar-table td.today {
	pointer-events: all;
}

.calendar-table td::before {
	height: 90%;
	aspect-ratio: 1/1;
	content: "";
	position: absolute;
	z-index: -1;
	background: var(--linea);
	border-radius: 100%;
	opacity: 0;
	transition: all 0.2s;
}

.calendar-table td:hover::before {
	opacity: 0.6;
}

.calendar-table td.today::before,
.calendar-table td.today:hover::before {
	opacity: 1;
}

.calendar-table td.past-day {
	color: var(--linea-intensa);
	pointer-events: none;
}

.calendar-table td.day-off {
	opacity: 0;
	pointer-events: none;
}

.calendar-table td.day-off::before {
	display: none;
}

/* Discount code */

#discount-buttons {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	align-items: start;
	grid-gap: 2em;
}

.discount-buttons-item {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	gap: 1.5em;
}

.discount-buttons-item input[type="radio"] {
	position: absolute;
	visibility: hidden;
}

.discount-buttons-item label {
	padding: 2em;
	text-align: center;
	border: 1px solid var(--linea);
	color: var(--barro);
	border-radius: var(--radius-10);
	transition: all 0.2s;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	gap: 1em;
	cursor: pointer;
}

.discount-buttons-item:hover label {
	border: 1px solid var(--linea-intensa);
}

.discount-buttons-item input[type="radio"]:checked + label {
	background: var(--linea-intensa);
	border-color: var(--linea-intensa);
}

.discount-field {
	display: none;
	flex-direction: column;
	gap: 0.5em;
}

.discount-field input {
	text-align: center;
}

.discount-buttons-item input[type="radio"]:checked ~ .discount-field {
	display: flex;
}

.discount-buttons-item input[type="radio"] + label::before {
	content: "";
	aspect-ratio: 1 / 1;
	height: 60px;
	background-size: contain;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
}

.discount-buttons-item input[type="radio"]#promo-code + label::before {
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 73.26 73.26" fill="%23D99D6F"><path d="M69.43,0H3.83C1.72,0,0,1.72,0,3.83v24.43h1c4.62,0,8.37,3.75,8.37,8.37s-3.76,8.37-8.37,8.37H0v24.43c0,2.11,1.72,3.83,3.83,3.83h65.59c2.11,0,3.83-1.72,3.83-3.83V3.83c0-2.11-1.72-3.83-3.83-3.83ZM71.26,69.43c0,1.01-.82,1.83-1.83,1.83H16.25v-4.5c0-.55-.45-1-1-1s-1,.45-1,1v4.5H3.83c-1.01,0-1.83-.82-1.83-1.83v-22.47c5.25-.5,9.37-4.94,9.37-10.32s-4.12-9.82-9.37-10.32V3.83c0-1.01.82-1.83,1.83-1.83h10.41v4.5c0,.55.45,1,1,1s1-.45,1-1V2h53.18c1.01,0,1.83.82,1.83,1.83v65.59Z"/><path d="M15.25,17.55c-.55,0-1,.45-1,1v12.05c0,.55.45,1,1,1s1-.45,1-1v-12.05c0-.55-.45-1-1-1Z"/><path d="M15.25,41.66c-.55,0-1,.45-1,1v12.05c0,.55.45,1,1,1s1-.45,1-1v-12.05c0-.55-.45-1-1-1Z"/><path d="M55.84,24.83c-.39-.39-1.02-.39-1.41,0l-22.2,22.2c-.39.39-.39,1.02,0,1.41.2.2.45.29.71.29s.51-.1.71-.29l22.2-22.2c.39-.39.39-1.02,0-1.41Z"/><path d="M39.79,32.39c1.08-1.08,1.68-2.53,1.68-4.06s-.6-2.98-1.68-4.06c-1.08-1.08-2.53-1.68-4.06-1.68s-2.98.6-4.06,1.68c-1.08,1.08-1.68,2.53-1.68,4.06s.6,2.98,1.68,4.06c1.08,1.08,2.53,1.68,4.06,1.68s2.98-.6,4.06-1.68ZM33.08,30.97c-.71-.71-1.1-1.65-1.1-2.65s.39-1.94,1.1-2.65c.71-.71,1.65-1.1,2.65-1.1s1.94.39,2.65,1.1,1.1,1.65,1.1,2.65-.39,1.94-1.1,2.65c-1.41,1.41-3.88,1.41-5.29,0Z"/><path d="M52.34,39.19c-1.53,0-2.98.6-4.06,1.68-1.08,1.08-1.68,2.53-1.68,4.06s.6,2.98,1.68,4.06c1.08,1.08,2.53,1.68,4.06,1.68s2.98-.6,4.06-1.68c1.08-1.08,1.68-2.53,1.68-4.06s-.6-2.98-1.68-4.06c-1.08-1.08-2.53-1.68-4.06-1.68ZM54.98,47.58c-1.41,1.41-3.88,1.41-5.29,0-.71-.71-1.1-1.65-1.1-2.65s.39-1.94,1.1-2.65c.71-.71,1.65-1.1,2.65-1.1s1.94.39,2.65,1.1,1.1,1.65,1.1,2.65-.39,1.94-1.1,2.65Z"/></svg>');
}

.discount-buttons-item input[type="radio"]#gift-box + label::before {
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 73.26 73.26" fill="%23D99D6F"><path d="M69.43,0H3.83C1.72,0,0,1.72,0,3.83v65.59c0,2.11,1.72,3.83,3.83,3.83h26.83s0,0,0,0,0,0,0,0h11.92s0,0,0,0,0,0,0,0h26.83c2.11,0,3.83-1.72,3.83-3.83V3.83c0-2.11-1.72-3.83-3.83-3.83ZM71.26,3.83v18h-27.67V2h25.83c1.01,0,1.83.82,1.83,1.83ZM31.67,21.84V2h9.93v19.84h-9.93ZM41.08,23.9l-5.3,8.89s0,0,0,0l-5.04,8.44-1.79-5c-.14-.4-.52-.66-.94-.66-.05,0-.1,0-.15.01l-5.25.79,7.44-12.47h11.03ZM31.67,43.57l4.96-8.32,4.96,8.32v27.69h-9.93v-27.69ZM42.53,41.22l-4.73-7.92,5.52-9.24,7.35,12.31-5.25-.79c-.48-.07-.93.2-1.09.65l-1.79,5ZM3.83,2h25.83v19.84H2V3.83c0-1.01.82-1.83,1.83-1.83ZM2,69.43V23.84h25.75l-7.95,13.32c-.2.33-.19.75.03,1.07.22.32.6.48.98.43l6.53-.99,2.23,6.22c.02.07.06.12.1.18v27.19H3.83c-1.01,0-1.83-.82-1.83-1.83ZM69.43,71.26h-25.83v-27.19c.04-.06.07-.12.1-.18l2.23-6.22,6.53.99c.39.05.76-.11.98-.43.22-.32.23-.74.03-1.07l-7.95-13.32h25.75v45.59c0,1.01-.82,1.83-1.83,1.83Z"/></svg>');
}

.discount-buttons-item input[type="radio"]#no-code + label::before {
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 73.26 73.26" fill="%23D99D6F"><path d="M69.43,0H3.83C1.72,0,0,1.72,0,3.83v65.59c0,2.11,1.72,3.83,3.83,3.83h65.59c2.11,0,3.83-1.72,3.83-3.83V3.83c0-2.11-1.72-3.83-3.83-3.83ZM71.26,69.43c0,1.01-.82,1.83-1.83,1.83H3.83c-1.01,0-1.83-.82-1.83-1.83V3.83c0-1.01.82-1.83,1.83-1.83h65.59c1.01,0,1.83.82,1.83,1.83v65.59Z"/><path d="M22.32,20.9c-.39-.39-1.02-.39-1.41,0s-.39,1.02,0,1.41l30.04,30.05c.2.2.45.29.71.29s.51-.1.71-.29c.39-.39.39-1.02,0-1.41l-30.04-30.05Z"/><path d="M23.37,48.48l-2.12,2.12c-.39.39-.39,1.02,0,1.41.2.2.45.29.71.29s.51-.1.71-.29l2.12-2.12c.39-.39.39-1.02,0-1.41s-1.02-.39-1.41,0Z"/><path d="M40.34,33.92c.26,0,.51-.1.71-.29l2.12-2.12c.39-.39.39-1.02,0-1.41s-1.02-.39-1.41,0l-2.12,2.12c-.39.39-.39,1.02,0,1.41.2.2.45.29.71.29Z"/><path d="M32.56,39.29l-2.12,2.12c-.39.39-.39,1.02,0,1.41.2.2.45.29.71.29s.51-.1.71-.29l2.12-2.12c.39-.39.39-1.02,0-1.41s-1.02-.39-1.41,0Z"/><path d="M50.95,20.9l-2.12,2.12c-.39.39-.39,1.02,0,1.41.2.2.45.29.71.29s.51-.1.71-.29l2.12-2.12c.39-.39.39-1.02,0-1.41s-1.02-.39-1.41,0Z"/></svg>');
}

/* Shift */

#shift-buttons {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	grid-gap: 1em;
}

/* Services */

#services {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	align-items: stretch;
	grid-gap: 0;
}

.services-item {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 0;
	margin-left: -1px;
	border: var(--border-intense);
	aspect-ratio: 9/14;
	position: relative;
}

.services-item.more-info {
	box-shadow: 0px 0px 80px rgba(0, 0, 0, 0.8);
	z-index: 99;
	transition: all 0.2s;
}

.services-item::before,
.services-item::after {
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: all 0.2s;
}

.services-item::before {
	background: linear-gradient(rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.9) 80%, rgba(0, 0, 0, 1) 100%);
}

.services-item::after {
	opacity: 0;
	background: linear-gradient(rgba(0, 0, 0, 0.5) 40%, rgba(0, 0, 0, 0.9) 80%, rgba(0, 0, 0, 1) 100%);
}

.services-item.more-info::after {
	opacity: 1;
}

.services-item-content {
	position: relative;
	z-index: 9;
	padding: 0 1.5em;
}

.services-item-content h3 {
	margin: 0;
	color: var(--pastel);
}

.service-info {
	position: relative;
}

.service-info-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-flow: nowrap;
	margin: 1em 0;
	gap: 1em;
}

.service-info-header::before {
	content: "";
	width: 100%;
	height: 1px;
	background: var(--barro);
	order: 2;
	transition: all 0.2s;
}

.services-info-button {
	order: 3;
	font-size: 0;
	height: 25px;
	aspect-ratio: 1/1;
	border-radius: 25px;
	border: 1px solid rgba(217, 157, 111, 0.3);
	position: relative;
	transition: all 0.2s;
}

.services-info-button::before,
.services-info-button::after {
	content: "";
	position: absolute;
	width: 50%;
	height: 1px;
	background: var(--pastel);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.services-info-button::after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.service-item-check:checked ~ .service-info-header .services-info-button::after {
	opacity: 0;
}

.service-item-check:hover ~ .service-info-header .services-info-button {
	border: var(--border-light);
}

.service-item-check {
	position: absolute;
	opacity: 0;
	z-index: 9;
	cursor: pointer;
	width: 25px;
	height: 25px;
	top: 0;
	right: 0;
}

.service-summary {
	max-height: 0;
	overflow: hidden;
	transition: all 0.5s;
	opacity: 0;
}

.service-item-check:checked ~ .service-summary {
	max-height: 1200px;
	opacity: 1;
}

.service-summary {
	font-size: calc(var(--text-small) - 0.1em);
}

.services-item-actions {
	position: relative;
	z-index: 9;
	display: flex;
	justify-content: space-between;
	padding: 1em 1em 1em 1.5em;
	align-items: center;
}

.services-item-actions .btn {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 0.7em;
}

.service-item-dates {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-flow: nowrap;
	gap: 20%;
}

.service-price {
	font-family: var(--marcellus);
	font-weight: var(--width-medium);
	font-size: var(--text-subtitle) !important;
	display: flex;
	align-items: baseline;
	flex-flow: nowrap;
	gap: 0.1em;
	line-height: 1em;
}

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

.service-time {
	display: flex;
	align-items: stretch;
	gap: 0.3em;
	line-height: 1em;
	order: 1;
}

.service-time::after {
	content: "";
	width: 16px;
	margin-top: -5px;
	aspect-ratio: 1/1;
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23.6 23.6" fill="%23D99D6F"><path d="M11.8,0C5.29,0,0,5.29,0,11.8s5.29,11.8,11.8,11.8,11.8-5.29,11.8-11.8S18.31,0,11.8,0ZM11.8,21.6c-5.4,0-9.8-4.4-9.8-9.8S6.4,2,11.8,2s9.8,4.4,9.8,9.8-4.4,9.8-9.8,9.8Z"/><polygon points="11.8 12.39 8.81 9.4 7.4 10.81 11.8 15.21 18.53 8.49 17.11 7.08 11.8 12.39"/></svg>');
	background-size: contain;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
}

.add-cart::before {
	content: "";
	width: 22px;
	aspect-ratio: 1/1;
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50.6 58.3" fill="%23D99D6F"><path d="M46.7,18c0-.9-.8-1.6-1.7-1.6h-7.4v-4.3c0-6.7-5.5-12.2-12.2-12.2s-12.2,5.5-12.2,12.2v4.3h-7.4c-.9,0-1.6.7-1.7,1.6L0,56.3c0,.5.1,1,.4,1.4.3.4.8.6,1.3.6h47.1c.5,0,1-.2,1.3-.6.3-.4.5-.9.4-1.4l-4-38.3ZM16.6,12.2c0-4.8,3.9-8.7,8.7-8.7s8.7,3.9,8.7,8.7v4.3h-17.4v-4.3ZM3.7,54.8l3.6-34.8h5.8v6.7c0,1,.8,1.8,1.8,1.8s1.8-.8,1.8-1.8v-6.7h17.4v6.7c0,1,.8,1.8,1.8,1.8s1.8-.8,1.8-1.8v-6.7h5.8l3.6,34.8H3.7Z"/></svg>');
	background-size: contain;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
}

.add-cart:hover::before {
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50.6 58.3" fill="%23281d16"><path d="M46.7,18c0-1-.9-1.7-1.9-1.6-1,0-1.7,1-1.6,1.9l3.8,36.4H3.7l3.8-36.4c0-1-.6-1.8-1.6-1.9-1-.1-1.8.6-1.9,1.6L0,56.3c0,.5.1,1,.4,1.4.3.4.8.6,1.3.6h47.1c.5,0,1-.2,1.3-.6.3-.4.5-.9.4-1.4l-4-38.3Z"/><path d="M24.8,38.5c0,0,.2.2.3.2,0,0,0,0,.1,0,0,0,.1,0,.2,0,0,0,.1,0,.2,0,0,0,.1,0,.2,0,.1,0,.2,0,.3,0s.2,0,.3,0c0,0,.1,0,.2,0,0,0,.1,0,.2,0,0,0,.1,0,.2,0,0,0,0,0,.1,0,0,0,.2-.1.3-.2l11.9-11.9c.7-.7.7-1.8,0-2.5s-1.8-.7-2.5,0l-8.9,8.9V1.8c0-1-.8-1.8-1.8-1.8s-1.8.8-1.8,1.8v31.3l-8.9-8.9c-.7-.7-1.8-.7-2.5,0-.7.7-.7,1.8,0,2.5l11.9,11.9Z"/></svg>');
}

/* Treatments */

#revision-wrap {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-gap: 3em 0;
}

.revision-item {
	grid-column: span 4;
}

.revision-item-icon {
	display: flex;
	justify-content: center;
	border-bottom: var(--border-intense);
	padding: 1em;
	gap: 1em;
	align-items: center;
}

.revision-item-icon .text-label {
	display: flex;
	flex-flow: nowrap;
	justify-content: flex-start;
	align-items: center;
	gap: 0.5em;
}

.revision-item-icon .text-label::before {
	content: "";
	width: 22px;
	aspect-ratio: 1/1;
	background-size: contain;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
	grid-row: span 2;
}

#revision-item-date .text-label::before {
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 55.89 56.6" fill="%23D99D6F"><path d="M43.18,25.62c-.13.02-.25.06-.38.11-.12.05-.23.11-.34.18-.11.08-.21.16-.3.25-.1.09-.18.2-.25.31-.08.1-.14.22-.19.34-.05.12-.08.25-.11.38-.03.12-.04.26-.04.39s0,.26.04.39c.02.13.06.25.11.37s.11.24.19.35c.07.11.15.21.25.3.37.38.88.59,1.41.59.13,0,.26-.02.39-.04.13-.03.26-.07.38-.11.12-.05.23-.12.34-.19s.21-.16.3-.25c.1-.09.18-.19.26-.3.07-.11.13-.23.18-.35.05-.12.09-.24.11-.37.03-.13.04-.26.04-.39,0-.53-.21-1.05-.59-1.42-.46-.46-1.15-.68-1.8-.54Z"/><path d="M24,25.92c-.11-.07-.23-.13-.35-.18-.12-.05-.24-.09-.37-.11-.65-.14-1.34.08-1.8.54-.38.37-.59.89-.59,1.42,0,.13.01.26.04.39.02.13.06.25.11.37.05.12.11.24.18.35.08.11.16.21.26.3.18.19.4.33.64.44.25.09.5.15.77.15.53,0,1.04-.21,1.41-.59.1-.09.18-.19.25-.3.08-.11.14-.23.19-.35s.09-.24.11-.37c.03-.13.04-.26.04-.39,0-.53-.21-1.05-.59-1.42-.09-.09-.19-.17-.3-.25Z"/><path d="M35.08,26.82c-.05-.12-.12-.24-.19-.34-.07-.11-.15-.22-.25-.31-.09-.09-.19-.17-.3-.25-.11-.07-.22-.13-.34-.18-.13-.05-.25-.09-.38-.11-.65-.14-1.34.08-1.81.54-.37.37-.58.89-.58,1.42,0,.13.01.26.04.39.02.13.06.25.11.37.05.12.11.24.18.35.08.11.16.21.25.3.1.09.2.18.31.25s.22.14.34.19c.12.04.25.08.38.11.13.02.26.04.39.04.53,0,1.04-.21,1.41-.59.1-.09.18-.19.25-.3.08-.11.14-.23.19-.35.05-.12.08-.24.11-.37.03-.13.04-.26.04-.39s0-.27-.04-.39c-.03-.13-.06-.26-.11-.38Z"/><path d="M13.66,34.59c-.11-.07-.22-.14-.34-.19-.13-.05-.25-.09-.38-.11-.26-.05-.52-.05-.78,0-.13.02-.25.06-.37.11-.13.05-.24.12-.35.19-.11.07-.21.15-.3.25-.38.37-.59.89-.59,1.41,0,.27.05.52.15.77.1.24.25.46.44.65.38.37.88.58,1.41.58s1.03-.21,1.41-.58c.19-.19.34-.41.44-.65.1-.25.15-.5.15-.77,0-.52-.21-1.04-.59-1.41-.09-.1-.19-.18-.3-.25Z"/><path d="M44.68,34.59c-.11-.07-.22-.14-.35-.19-.12-.05-.24-.09-.37-.11-.26-.05-.52-.06-.78,0-.13.02-.25.06-.37.11-.13.05-.24.12-.35.19-.11.07-.21.15-.3.25-.38.37-.59.89-.59,1.41s.21,1.04.59,1.42c.38.37.88.58,1.41.58s1.03-.21,1.41-.58c.38-.38.59-.89.59-1.42s-.21-1.04-.59-1.41c-.09-.1-.19-.18-.3-.25Z"/><path d="M24,34.59c-.11-.07-.22-.14-.34-.19-.13-.05-.25-.09-.38-.11-.65-.14-1.34.08-1.81.55-.09.09-.17.19-.24.3-.08.11-.14.22-.19.35-.05.12-.08.24-.11.37-.03.13-.04.26-.04.39,0,.53.21,1.04.58,1.42.1.09.2.17.31.25.11.07.22.13.34.18.12.05.25.09.38.11.13.03.26.04.39.04.53,0,1.04-.21,1.41-.58.19-.19.34-.41.44-.65.1-.25.15-.5.15-.77,0-.52-.21-1.04-.59-1.41-.09-.1-.19-.18-.3-.25Z"/><path d="M35.08,35.5c-.05-.13-.11-.24-.19-.35-.07-.11-.15-.21-.24-.3-.75-.75-2.09-.75-2.83,0-.38.37-.59.89-.59,1.41,0,.27.05.52.15.77.1.24.25.46.44.65.37.37.88.58,1.41.58.13,0,.26,0,.39-.04.13-.02.26-.06.38-.11.12-.05.23-.11.34-.18.11-.08.21-.16.31-.25.37-.38.58-.89.58-1.42,0-.13,0-.26-.04-.39-.03-.13-.06-.25-.11-.37Z"/><path d="M14.4,44.17c-.05-.12-.11-.24-.19-.35-.07-.11-.15-.21-.25-.3-.09-.09-.19-.18-.3-.25-.11-.07-.22-.13-.34-.18-.13-.05-.25-.09-.38-.12-.26-.05-.52-.05-.78,0-.13.03-.25.07-.37.12-.13.05-.24.11-.35.18-.11.07-.21.16-.31.25-.09.09-.17.19-.24.3-.08.11-.14.23-.19.35s-.08.24-.11.37c-.03.13-.04.26-.04.39,0,.54.21,1.04.58,1.42.38.37.89.58,1.42.58s1.03-.21,1.41-.58c.38-.38.59-.88.59-1.42,0-.13-.01-.26-.04-.39-.02-.13-.06-.25-.11-.37Z"/><path d="M24.74,44.17c-.05-.12-.12-.24-.19-.35-.07-.11-.15-.21-.25-.3-.09-.09-.19-.18-.3-.25-.11-.07-.22-.13-.34-.18-.13-.05-.25-.09-.38-.12-.26-.05-.52-.05-.78,0-.13.03-.25.07-.38.12-.12.05-.23.11-.34.18-.11.07-.21.16-.31.25-.09.09-.17.19-.24.3-.08.11-.14.23-.19.35-.05.12-.08.24-.11.37-.03.13-.04.26-.04.39,0,.54.21,1.04.58,1.42.38.37.89.58,1.42.58s1.03-.21,1.41-.58c.38-.38.59-.88.59-1.42,0-.13,0-.26-.04-.39-.02-.13-.06-.25-.11-.37Z"/><path d="M35.08,44.17c-.05-.12-.12-.24-.19-.35-.07-.11-.15-.21-.25-.3-.09-.09-.19-.18-.3-.25-.11-.07-.22-.13-.34-.18-.13-.05-.25-.09-.38-.12-.26-.05-.52-.05-.78,0-.13.03-.25.07-.38.12-.12.05-.23.11-.34.18-.11.07-.21.16-.31.25-.09.09-.17.19-.24.3-.08.11-.14.23-.19.35-.05.12-.09.24-.11.37-.03.13-.04.26-.04.39,0,.54.21,1.04.58,1.42.38.37.89.58,1.42.58s1.03-.21,1.41-.58c.38-.38.59-.88.59-1.42,0-.13,0-.26-.04-.39-.02-.13-.06-.25-.11-.37Z"/><path d="M51.93,5.49h-6.36v-3.49c0-1.1-.9-2-2-2s-2,.9-2,2v3.49H14.55v-3.49c0-1.1-.9-2-2-2s-2,.9-2,2v3.49H3.96c-2.18,0-3.96,1.77-3.96,3.96v43.23c0,2.18,1.77,3.96,3.96,3.96h47.98c2.18,0,3.96-1.77,3.96-3.96V9.44c0-2.18-1.77-3.96-3.96-3.96ZM51.89,52.62l-47.89.04-.04-43.18h6.59s0,3.93,0,3.93c0,1.1.9,2,2,2s2-.9,2-2v-3.94l27.02-.02v3.97c0,1.1.9,2,2,2s2-.9,2-2v-3.97h6.32s0,43.18,0,43.18Z"/></svg>');
}

#revision-item-people .text-label::before {
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 54.58 60.82" fill="%23D99D6F"><path d="M27.29,34.16c6.35,0,11.28-6.79,12.25-16.89.54-5.59-.74-10.42-3.62-13.59-2.19-2.41-5.17-3.68-8.63-3.68s-6.45,1.27-8.63,3.68c-2.88,3.17-4.16,8-3.62,13.59.98,10.1,5.9,16.89,12.25,16.89ZM21.62,6.37c1.43-1.57,3.34-2.37,5.67-2.37s4.24.8,5.67,2.37c2.08,2.29,3.03,6.12,2.6,10.51-.76,7.82-4.16,13.27-8.27,13.27s-7.52-5.46-8.27-13.27c-.43-4.39.52-8.22,2.6-10.51Z"/><path d="M48.91,38s-.08-.05-.12-.07l-9.05-4.77c-.98-.51-2.19-.14-2.7.83-.52.98-.14,2.19.84,2.7l8.99,4.74c2.4,1.5,3.82,4.04,3.71,6.63,0,.19-.01.41-.02.64,0,.49-.02,1.52-.19,1.81-.64,1.08-2.81,3.15-10.14,4.84-8.47,1.96-17.42,1.96-25.89,0-7.32-1.69-9.49-3.76-10.14-4.84-.17-.29-.18-1.31-.19-1.81,0-.23,0-.44-.02-.64-.11-2.59,1.31-5.12,3.71-6.63l8.99-4.74c.98-.51,1.35-1.72.84-2.7-.52-.98-1.73-1.35-2.7-.83l-9.05,4.77s-.08.04-.12.07C2.01,40.27-.16,44.19,0,48.24c0,.16,0,.34.01.53.02,1.09.04,2.59.75,3.79,1.75,2.93,5.89,5.12,12.67,6.69,4.53,1.05,9.19,1.57,13.85,1.57,4.66,0,9.32-.52,13.84-1.57,6.78-1.57,10.93-3.75,12.67-6.69.71-1.2.74-2.7.75-3.79,0-.19,0-.37.01-.53.17-4.05-2-7.97-5.66-10.24Z"/></svg>');
}

#revision-item-shift .text-label::before {
	background-image: url('data:image/svg+xml,<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 23.6 23.6" fill="%23D99D6F"><path d="M11.8,0C5.29,0,0,5.29,0,11.8s5.29,11.8,11.8,11.8,11.8-5.29,11.8-11.8S18.31,0,11.8,0ZM11.8,21.6c-5.4,0-9.8-4.4-9.8-9.8S6.4,2,11.8,2s9.8,4.4,9.8,9.8-4.4,9.8-9.8,9.8Z"/><polygon points="11.8 12.39 8.81 9.4 7.4 10.81 11.8 15.21 18.53 8.49 17.11 7.08 11.8 12.39"/></svg>');
}

#revision-item-treatments {
	grid-column: span 12;
	display: flex;
	flex-direction: column;
	gap: 2em;
}

.text-label {
	font-weight: 100;
	font-family: var(--marcellus);
	line-height: 1.3em;
	color: var(--pastel);
}

.treatment-title {
	font-size: var(--text-subtitle);
	font-family: var(--marcellus);
}

.tops-title {
	line-height: 1.2em;
	font-family: var(--marcellus);
	font-weight: var(--width-medium);
	font-size: var(--text-general);
}

.treatment-wrap,
.tops-wrap {
	display: flex;
	flex-direction: column;
	gap: 1.5em;
}

.treatment-item,
.tops-item {
	display: grid;
	grid-template-columns: 100px auto;
	grid-gap: 1em;
}

.treatment-content,
.tops-content {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 1.5em;
}

.treatment-image,
.tops-image {
	aspect-ratio: 1 / 1;
	overflow: hidden;
}

.treatment-image img,
.tops-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.treatment-footer,
.tops-footer {
	display: flex;
	justify-content: space-between;
	padding-bottom: 0.5em;
	border-bottom: var(--border-base);
}

.treatment-price,
.tops-price {
	font-family: var(--marcellus);
	font-weight: var(--width-medium);
	font-size: var(--text-general);
	display: flex;
	align-items: baseline;
	flex-flow: nowrap;
	gap: 0.1em;
	line-height: 1em;
}

.treatment-price::after,
.tops-price::after {
	content: "€";
	font-family: var(--marcellus);
	font-weight: var(--light);
	font-size: var(--text-general-small);
}

#revision-footer {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

#total-price {
	font-family: var(--marcellus);
	font-weight: var(--light);
	color: var(--pastel);
}

#total-price-number {
	font-family: var(--marcellus);
	font-weight: var(--width-medium);
	font-size: var(--text-subtitle) !important;
	display: flex;
	align-items: baseline;
	flex-flow: nowrap;
	gap: 0.1em;
	line-height: 1em;
	color: var(--pastel);
}

#total-price-number::after {
	content: "€";
	font-family: var(--marcellus);
	font-weight: var(--light);
	font-size: var(--text-general) !important;
}

/* Booking details */

#form-name,
#form-firstname,
#form-email,
#form-confirm-email {
	grid-column: span 6;
}

#form-tel,
#form-privacy,
#form-promo {
	grid-column: span 12;
}

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

#footer-content {
	width: var(--width-limit);
	margin: 0 auto;
	padding: var(--pm-block) 0 30px;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 30px;
}

#footer-logo {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-flow: row nowrap;
}

#footer-logo::before,
#footer-logo::after {
	content: "";
	width: calc(50% - 100px);
	height: 1px;
	background: var(--linea-intensa);
}

#footer-logo img {
	width: auto;
	height: 100px;
}

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

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

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

.text-icon::before {
	width: 16px;
	height: 16px;
}

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>');
}

#copyright {
	width: var(--width-base);
	margin: auto;
	text-align: center;
}

#mapa iframe {
	width: 100%;
	height: 100%;
	border-radius: var(--radius-10);
}

#copyright {
	font-size: var(--text-general-small);
}

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

@media all and (max-width: 1320px) {
	.calendar-table th,
	.calendar-table td {
		height: 80px;
	}
}

@media all and (max-width: 1024px) {
	.calendar-table th,
	.calendar-table td {
		height: 70px;
	}
}

@media all and (max-width: 780px) {
	#toggle {
		display: block;
	}
}

@media all and (max-width: 480px) {
	#logo {
		height: 60px;
	}
}
