/**
 * 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: #d8c3a5;
  /* rgba(217, 157, 111, 1); */
  --pastel: #f5f1eb;
  --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);
  text-align: center;
  padding: 0 5%;
}

h2 {
  font-size: clamp(20px, 1.8vw, 24px);
  margin: 0;
}

h2.title-section {
  text-align: center;
  margin: 3em 0 1.5em;
}

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 > div {
  grid-column: span 12;
}

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;
}

textarea {
  height: 200px;
}

*: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;
}

/* */

.field-hidden {
  display: none;
}

#form-select-day-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 1.5em;
}

#form-select-day-wrap .check-buttons label {
  border-radius: 0;
  height: 60px;
}

#form-select-day-wrap .check-buttons input[type="radio"]:checked + label {
  background: transparent;
  border-color: var(--linea-intensa);
  color: var(--pastel);
}

#form-select-day-wrap .check-buttons input[type="radio"]:checked + label::before {
  border-color: var(--pastel);
}

#form-select-day-wrap .check-buttons input#select-otherday[type="radio"]:checked + label .field-hidden {
  display: block;
}

#form-select-day-wrap .check-buttons input#select-otherday[type="radio"]:checked + label span {
  display: none;
}

#form-select-otherday input[type="date"] {
  padding: 0;
  border: 0;
  line-height: 1em;
  height: 30px;
}

/* 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);
}

/* Idiomas
***********************/

#language {
  position: relative;
}

#language-hidden {
  opacity: 0;
  position: absolute;
  z-index: -1;
  pointer-events: none;
  top: -4px;
  transition: all 0.2s;
  border: 1px solid rgba(194, 164, 113, 0.3);
  border-radius: 6px;
  background: var(--base-fondo);
  left: 50%;
  transform: translateX(-50%);
}

#language-hidden a {
  padding: 0.4em 0.5em;
}

#language:hover #language-hidden {
  opacity: 1;
  pointer-events: all;
  z-index: 9 !important;
  top: 25px;
}

.language-active {
  cursor: pointer;
  display: flex;
  flex-wrap: nowrap;
  align-items: baseline;
  padding: 0.2em;
  line-height: 1em;
}

.language-active::after {
  content: "";
  width: 15px;
  height: 15px;
  background: url("../images/arrow-up.png") transparent center / contain no-repeat;
  transform: rotate(180deg);
  transition: all 0.2s;
}

#language:hover .language-active::after {
  transform: rotate(0);
}

#language-responsive {
  border-top: var(--border-intense);
  padding-top: 2rem;
  display: flex;
  justify-content: center;
  gap: 2em;
}

/* 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;
  height: 100dvh !important;
  visibility: hidden;
  opacity: 0;
  z-index: 9;
  overflow: auto;
  transform: translateX(-100%);
  -webkit-transform: translateX(-100%);
  transition: all 0.2s;
}

.overlay.nav-active {
  opacity: 1;
  visibility: visible;
  height: 100vh !important;
  height: 100dvh !important;
  transform: translateX(0%);
  transition: all 0.2s;
}

/* .overlay a {
	pointer-events: none;
} */

.overlay.nav-active a {
  pointer-events: auto;
}

#minicart,
#main-nav-responsive {
  position: fixed;
  z-index: -1;
  top: 0;
  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;
  transition: all 0.2s;
  transform: translateX(-100%);
  -webkit-transform: translateX(-100%);
}

#minicart {
  left: 100%;
}

#main-nav-responsive {
  left: 0;
  padding: 200px 3rem 3rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: 3rem;
  text-align: center;
}

#minicart.overlay.cart-active,
#main-nav-responsive.overlay.nav-active {
  opacity: 1;
  visibility: visible;
  height: 100vh !important;
  height: 100dvh !important;
}

#minicart.overlay.cart-active {
  z-index: 12;
  background-color: rgba(4, 4, 4, 0.8) !important;
}

#main-nav-responsive.nav-active {
  transform: translateX(0%);
  z-index: 8;
  background-color: rgba(4, 4, 4, 1) !important;
}

#minicart-wrap {
  width: 400px;
  height: 100vh;
  height: 100dvh;
  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-content {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  overflow: auto;
  padding-right: 30px;
  height: calc(100% - 250px);
  padding-bottom: 20px;
}

.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-footer {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-right: 30px;
  width: calc(100% - 30px);
  left: 30px;
  background: var(--base-fondo);
  padding-top: 2rem;
  z-index: 999;

  position: sticky;
  bottom: 0;
  padding: 12px 24px calc(16px + env(safe-area-inset-bottom));
} */

.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-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: 7;
  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;*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 130px;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--linea-intensa);
  background-color: rgba(0, 0, 0, 0.7);
}

header::after {
  content: "";
  position: absolute;
  z-index: 7;
  width: 180px;
  height: 93px;
  bottom: -91px;
  left: 50%;
  transform: translateX(-50%);
  background: url(../images/img/estrella-logo.svg) transparent center / contain no-repeat;
}

#logo {
  height: 90px;
  text-align: center;
  position: absolute;
  top: -45px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 11;
}

#logo img {
  width: auto;
  height: 100%;
  margin: auto;
}

/* Nav */

#nav-toggle {
  display: none;
  width: 50px;
  height: 50px;
  border-radius: 50px;
  border: 1px solid transparent;
  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 21.6 14.5" fill="%23D99D6F"><path d="M.8,1.5h20.1c.4,0,.8-.3.8-.8s-.3-.8-.8-.8H.8c-.4,0-.8.3-.8.8s.3.8.8.8Z"/><path d="M20.9,6.5H.8c-.4,0-.8.3-.8.8s.3.8.8.8h20.1c.4,0,.8-.3.8-.8s-.3-.8-.8-.8Z"/><path d="M20.9,13H.8c-.4,0-.8.3-.8.8s.3.8.8.8h20.1c.4,0,.8-.3.8-.8s-.3-.8-.8-.8Z"/></svg>');
  background-size: 60%;
  background-position: center;
  background-repeat: no-repeat;
  font-size: 0;
  cursor: pointer;
  transition: all 0.2s;
}

#nav-toggle.nav-toggle-active {
  position: relative;
  z-index: 12;
  background-size: 40%;
  border: 1px solid var(--barro);
  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>');
}

/* 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-toggle,
#nav-column-main {
  justify-self: start;
}

#nav-logo {
  justify-self: center;
}

#nav-actions {
  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(8, 1fr); */
  grid-template-columns: repeat(auto-fit, minmax(32px, 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);
}

.breadcrumb-item:nth-child(1) span::before {
  content: "1";
}

.breadcrumb-item:nth-child(2) span::before {
  content: "2";
}

.breadcrumb-item:nth-child(3) span::before {
  content: "3";
}

.breadcrumb-item:nth-child(4) span::before {
  content: "4";
}

.breadcrumb-item:nth-child(5) span::before {
  content: "5";
}

.breadcrumb-item:nth-child(6) span::before {
  content: "6";
}

.breadcrumb-item:nth-child(7) span::before {
  content: "7";
}

.breadcrumb-item:nth-child(8) span::before {
  content: "8";
}

.breadcrumb-item:nth-child(9) span::before {
  content: "9";
}

.breadcrumb-item:nth-child(10) span::before {
  content: "10";
}

.breadcrumb-item.active span {
  font-size: var(--text-general-small);
  text-align: center;
  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: 480px;
  border: 1px solid var(--linea-intensa);
  padding: 40px 40px 20px;
  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: 26px;
}

.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);
  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-start;
  align-items: center;
  gap: 1em;
  cursor: pointer;
  margin-bottom: 0;
  height: 100%;
}

.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;
  margin-top: 1.5rem;
}

.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>');
}

/* shipment code */

#shipment-buttons {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 2em;
}

.shipment-buttons-item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  gap: 1.5em;
}

.shipment-buttons-item p {
  font-size: var(--text-general-small);
}

.shipment-buttons-item input[type="radio"] {
  position: absolute;
  visibility: hidden;
}

.shipment-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-start;
  align-items: center;
  gap: 1em;
  cursor: pointer;
  margin-bottom: 0;
  height: 100%;
}

.shipment-buttons-item:hover label {
  border: 1px solid var(--linea-intensa);
}

.shipment-buttons-item input[type="radio"]:checked + label {
  background: var(--linea-intensa);
  border-color: var(--linea-intensa);
}

.shipment-field {
  display: none;
  flex-direction: column;
  gap: 0.5em;
}

.shipment-field input {
  text-align: center;
}

.shipment-buttons-item input[type="radio"]:checked ~ .shipment-field {
  display: flex;
}

.shipment-buttons-item label span {
  padding-top: 1.3em;
  border-top: var(--border-intense);
  font-size: 14px;
}

.shipment-buttons-item label span a {
  color: var(--pastel);
  opacity: 0.6;
  text-decoration: none;
  line-height: 3em;
}

.shipment-buttons-item label a:hover {
  opacity: 1;
  text-decoration: none;
}

.shipment-buttons-item input[type="radio"]:checked ~ label span {
  border-color: var(--barro);
}

.shipment-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;
}

.shipment-buttons-item input[type="radio"]#messaging-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 68.43 72.188" fill="%23D99D6F"><path d="M63.884,0H4.546a4.565,4.565,0,0,0-4.5,3.9,1,1,0,0,0,.231.794l23.915,27.8L7.465,46.881,1.757,40.264A1,1,0,0,0,0,40.918V59.444A4.551,4.551,0,0,0,4.546,63.99H21.04L23.9,67.66,26.1,70.81a3.634,3.634,0,0,0,2.518,1.366q.147.012.294.012a3.844,3.844,0,0,0,2.5-.969,3.176,3.176,0,0,0,1.2-2.047l.769.894a3.764,3.764,0,0,0,6.523-1.624L41.3,70.061a3.76,3.76,0,0,0,6.522-1.628l.688.8a3.763,3.763,0,0,0,5.705-4.908l-.288-.335h9.958a4.551,4.551,0,0,0,4.546-4.546V4.546A4.551,4.551,0,0,0,63.884,0M28.321,2H40.162V24.735H28.321ZM25.5,34.008l5.111,5.942h0a.871.871,0,0,1-.092,1.225L29,42.478l0,0L18,51.944l-2.882,2.48a.872.872,0,0,1-1.227-.093h0L8.771,48.4ZM4.546,61.99A2.549,2.549,0,0,1,2,59.444V43.608L12.374,55.636l0,0a2.872,2.872,0,0,0,4.042.3l.088-.075c.293,2.857,2.6,5.657,2.752,5.836l.225.289Zm47.965,6.125a1.766,1.766,0,0,1-2.486-.187l-6.759-7.857a1.238,1.238,0,0,0-1.744-.13,1.239,1.239,0,0,0-.246,1.6l4.212,4.921a1.765,1.765,0,0,1-.187,2.486,1.72,1.72,0,0,1-1.281.421,1.75,1.75,0,0,1-1.2-.608l-4.152-4.826a1.225,1.225,0,0,0-.846-.428,1.205,1.205,0,0,0-.905.3,1.243,1.243,0,0,0-.129,1.748l.788.917a1.763,1.763,0,0,1-.187,2.485,1.776,1.776,0,0,1-1.28.42,1.747,1.747,0,0,1-1.2-.609l-2.163-2.514a1.388,1.388,0,0,0-1.96-.142,1.36,1.36,0,0,0-.433,1.436c.034.132.073.264.113.4.245.828.346,1.171-.343,1.765a1.844,1.844,0,0,1-1.327.479,1.636,1.636,0,0,1-1.1-.586L25.5,66.473l-4.6-5.926-.123-.142c-.04-.048-3.97-4.8-1.48-6.945l11-9.464a6.532,6.532,0,0,1,4.272-1.129c.4,0,.777.012,1.131.022.385.012.738.022,1.053.019a26.387,26.387,0,0,0,6.063-.667,22.319,22.319,0,0,0,4.243-1.507l.032-.015a1.1,1.1,0,0,1,1.031.786c.3.918-.138,1.8-1.42,2.863a23.556,23.556,0,0,1-4.148,2.306c-4.056,1.53-3.51,3.092-3.51,3.092L52.7,65.63a1.764,1.764,0,0,1-.186,2.485M47.054,40.72l.016,0h0l-.018,0M66.43,59.444a2.549,2.549,0,0,1-2.546,2.546H52.205L41.465,49.506a8.681,8.681,0,0,1,1.855-.981,25.307,25.307,0,0,0,4.664-2.615C49.91,44.314,50.6,42.624,50,40.8a3.13,3.13,0,0,0-2.782-2.084L47.1,38.7l-.048.006h0a1.631,1.631,0,0,0-.444.066,1.538,1.538,0,0,0-.2.068l-.139.065a20.606,20.606,0,0,1-3.929,1.4,23.81,23.81,0,0,1-5.594.607c-.288,0-.617-.008-.971-.018a19.551,19.551,0,0,0-3,.086,2.859,2.859,0,0,0-.641-2.326l0-.005L2.12,3.768A2.561,2.561,0,0,1,4.546,2H26.321V25.735a1,1,0,0,0,1,1H41.162a1,1,0,0,0,1-1V2H63.884A2.548,2.548,0,0,1,66.43,4.546Z"/></svg>');
}

.shipment-buttons-item input[type="radio"]#center + 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.36 71.73" fill="%23D99D6F"><path d="M72.36,69.73h-3.2V31.6h1.06l.29-.5c.58-1.01.88-2.17.88-3.35,0-3.76-3.06-6.82-6.82-6.82s-6.82,3.06-6.82,6.82c0,1.18.3,2.34.88,3.35l.29.5h1.06v4.56h-9.24v-12.6c1.26-2.3,1.93-4.92,1.93-7.58,0-8.81-7.17-15.98-15.98-15.98s-15.98,7.17-15.98,15.98c0,2.67.67,5.28,1.93,7.58v12.6h-9.24v-4.69h1.05l.29-.5s.03-.07.05-.1c0,0,0,0,0-.01.54-.98.83-2.1.83-3.23,0-3.76-3.06-6.82-6.82-6.82s-6.82,3.06-6.82,6.82c0,1.14.29,2.25.83,3.23,0,0,0,0,0,.01.02.03.03.07.05.1l.29.5h1.06v38.26H1c-.55,0-1,.45-1,1s.45,1,1,1h4.18s.01,0,.02,0,.01,0,.02,0h67.14c.55,0,1-.45,1-1s-.45-1-1-1ZM64.56,22.93c2.66,0,4.82,2.16,4.82,4.82,0,.6-.12,1.17-.33,1.71h-8.99c-.21-.54-.33-1.11-.33-1.71,0-2.66,2.16-4.82,4.82-4.82ZM67.15,31.6v29.25h-5.19v-29.25h5.19ZM59.97,38.16v22.7h-9.24v-22.7h9.24ZM46.62,60.86v-12.05l.07-.24c.36-1.28.55-2.64.55-4.02,0-.64-.04-1.23-.11-1.81-.71-5.86-4.82-10.66-10.22-11.92l-.23-.05-.23.05c-5.41,1.27-9.52,6.05-10.22,11.91-.07.59-.11,1.19-.11,1.82,0,1.39.18,2.74.55,4.02l.07.24v12.06h-2.1V24.32h24.1v36.54h-2.1ZM28.73,60.86v-12.2l-.14-.64c-.31-1.11-.47-2.28-.47-3.48,0-.55.03-1.06.1-1.58.59-4.87,4.05-9.01,8.47-10.15,4.48,1.16,7.87,5.21,8.47,10.16.06.5.09,1.01.09,1.56,0,1.2-.16,2.37-.47,3.47l-.11.37-.04,12.48h-15.9ZM36.68,2c7.71,0,13.98,6.27,13.98,13.98,0,2.22-.53,4.4-1.53,6.34h-24.91c-1-1.94-1.53-4.12-1.53-6.34,0-7.71,6.27-13.98,13.98-13.98ZM22.63,38.16v22.7h-9.24v-22.7h9.24ZM8.79,22.8c2.66,0,4.82,2.16,4.82,4.82,0,.65-.12,1.27-.37,1.85H4.34c-.25-.58-.37-1.2-.37-1.85,0-2.66,2.16-4.82,4.82-4.82ZM11.39,31.47v29.39h-5.19v-29.39h5.19ZM6.2,62.86h60.95v6.87H6.2v-6.87Z"/></svg>');
}

.shipment-buttons-item input[type="radio"]#email-shipment + 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.06 69.29" fill="%23D99D6F"><path d="M35.12,39.59c.48.04.96.07,1.43.07,3.02,0,5.9-.89,8.41-2.6.46-.31.57-.93.26-1.39-.31-.46-.93-.57-1.39-.26-2.51,1.71-5.46,2.47-8.53,2.19-6.38-.58-11.43-5.87-11.73-12.29-.17-3.57,1.09-6.96,3.53-9.54,2.45-2.59,5.76-4.03,9.31-4.06h.11c6.84,0,12.64,5.52,12.96,12.35.06,1.37-.08,2.73-.44,4.04-.31,1.13-1.35,1.92-2.54,1.92-1.45,0-2.64-1.18-2.64-2.64v-9.04c0-.55-.45-1-1-1s-1,.45-1,1v1.32c-1.34-1.42-3.23-2.32-5.34-2.32-4.04,0-7.34,3.29-7.34,7.34s3.29,7.33,7.34,7.33c2.32,0,4.39-1.09,5.73-2.77.72,1.63,2.35,2.77,4.24,2.77,2.09,0,3.93-1.39,4.47-3.39.41-1.51.58-3.08.51-4.66-.37-7.88-7.06-14.25-14.96-14.25h-.12c-4.11.03-7.92,1.7-10.75,4.68-2.82,2.98-4.27,6.89-4.08,11.01.35,7.41,6.17,13.51,13.54,14.18ZM36.53,30.02c-2.94,0-5.34-2.39-5.34-5.33s2.39-5.34,5.34-5.34,5.34,2.39,5.34,5.34-2.39,5.33-5.34,5.33Z"/><path d="M68.15,0H4.92C2.21,0,0,2.21,0,4.92v48.1c0,2.71,2.2,4.92,4.91,4.92h20.55l-.71,9.36h-3.64c-.55,0-1,.45-1,1s.45,1,1,1h4.54s.02,0,.03,0c0,0,0,0,0,0h26.25c.55,0,1-.45,1-1s-.45-1-1-1h-3.64l-.71-9.36h20.55c2.71,0,4.92-2.21,4.92-4.92V4.92c0-2.71-2.21-4.92-4.92-4.92ZM4.92,2h63.23c1.61,0,2.92,1.31,2.92,2.92v41.08H2V4.92c0-1.61,1.31-2.92,2.92-2.92ZM46.3,67.29h-19.53l.71-9.36h18.12l.71,9.36ZM68.15,55.93H4.91c-1.61,0-2.91-1.31-2.91-2.92v-5.02h69.06v5.02c0,1.61-1.31,2.92-2.92,2.92Z"/><path d="M37.24,51.16c-.37-.37-1.04-.37-1.41,0-.1.09-.17.2-.22.32-.05.13-.08.26-.08.39,0,.06.01.13.02.19.02.07.03.13.06.19.05.12.12.23.22.32.18.19.44.3.7.3s.52-.11.71-.3c.19-.18.29-.44.29-.7,0-.13-.02-.26-.07-.39-.06-.12-.13-.23-.22-.32Z"/></svg>');
}

/* Shipment summary */

#shipment-total-price {
  background: var(--linea);
  margin-top: var(--pm-block-blend);
  padding: 2em;
  border-radius: var(--radius-10);
}

.shipment-total-price-item {
  display: flex;
  justify-content: space-between;
  padding: 0.8em 0.5em;
  border-bottom: var(--border-intense);
}

.shipment-total-price-item:first-child {
  padding-top: 0;
}

.shipment-total-price-item:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

/* Shift */

#shift-buttons {
  display: grid;
  /* grid-template-columns: repeat(5, 1fr); */
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  grid-gap: 1em;
}

#day-gift-buttons {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 1em;
}

.day-gift-buttons-item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  gap: 1.5em;
  height: 100%;
}

.day-gift-buttons-item input[type="radio"] {
  position: absolute;
  visibility: hidden;
}

.day-gift-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: center;
  align-items: center;
  gap: 1em;
  cursor: pointer;
  height: 100%;
  margin: 0;
}

.day-gift-buttons-item:hover label {
  border: 1px solid var(--linea-intensa);
}

.day-gift-buttons-item input[type="radio"]:checked + label {
  background: var(--barro);
  border-color: var(--barro);
  color: var(--linea);
}

.day-gift-buttons-item input[type="radio"]:checked ~ .discount-field {
  display: flex;
}

/* Person number */

#person-number-buttons {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-gap: 1em;
}

/* Services */

#services {
  display: grid;
  /* grid-template-columns: repeat(4, 1fr); */
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  align-items: stretch;
  grid-gap: 2rem;
}

#services:has(> :only-child) {
  display: flex;
  justify-content: center;
  align-items: stretch;
}

.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;
  max-width: 360px;
}

.services-item:only-child {
  opacity: 1;
  max-width: 800px;
  aspect-ratio: auto;
  min-height: 450px;
}

.services-item:only-child .service-summary {
  max-height: inherit;
  overflow: hidden;
  transition: all 0.5s;
  opacity: 1;
}

.services-item:only-child .service-item-check,
.services-item:only-child .services-info-button {
  display: none;
}

.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) 20%, rgba(0, 0, 0, 0.9) 60%, 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);
  font-size: var(--text-general);
}

.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 span {
  white-space: nowrap;
}

.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;
  display: flex;
  justify-content: center;
  align-items: center;
}

.services-info-button::before,
.services-info-button::after {
  content: "";
  position: absolute;
  background: var(--pastel);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block !important;
}

.services-info-button::before {
  width: 11px;
  height: 1px;
}

.services-info-button::after {
  width: 1px;
  height: 11px;
}

.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;
  margin: 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 {
  position: relative;
  z-index: 9;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  padding: 1em 1em 1em 1.5em;
}

.services-item-actions select {
  height: 50px;
  line-height: 50px;
  padding: 0 10px;
  position: relative;
}

.services-item-actions select::after {
  position: absolute;
  top: 1rem;
  right: 2rem;
  z-index: 9;
  content: "";
  border: 2px solid var(--oro);
  display: block;
}

.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;
  grid-column: span 2;
}

.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>');
}

#services .services-item {
  opacity: 0.3;
  transition: opacity 0.3s ease-in-out;
}

/* Si hay un .more-info dentro de #services, ajustar opacidades */
#services:has(.more-info) .services-item {
  opacity: 0.3;
  /* Todos a 0.5 por defecto */
  pointer-events: none;
}

#services:has(.more-info) .more-info {
  opacity: 1;
  /* El que tiene more-info se mantiene con opacidad 1 */
  pointer-events: all;
}

/* Si no hay ninguno con .more-info, todos a opacidad 1 */
#services:not(:has(.more-info)) .services-item {
  opacity: 1;
}

/* 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);
}

.general-label {
  font-weight: 100;
  font-family: var(--marcellus);
  line-height: 1.3em;
}

.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);
}

.general-price,
.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;
}

.general-price::after,
.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-codpostal,
#form-tel,
#form-confirm-email {
  grid-column: span 6;
}

#form-privacy,
#form-promo,
#form-observaciones,
#form-direccion {
  grid-column: span 12;
}

#form-observaciones textarea {
  height: 120px;
  line-height: 1.5;
  resize: vertical;
}

/* 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;
}

/* Modal
***********************/

#giftbox {
  background: url(../images/img/bg-palacio.jpg) var(--base-fondo) center / cover no-repeat;
}

.modal-page {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100vh;
}

.modal-page::before {
  content: "";
  position: fixed;
  inset: 0;
  background: linear-gradient(rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.9) 100%);
}

.modal-wrap {
  width: 90%;
  max-width: 900px;
  max-height: 90vh;
  max-height: 90dvh;
  z-index: 9;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 2rem;
}

.modal-content {
  width: 100%;
  max-width: 600px;
  background: var(--base-fondo);
  border: var(--border-light);
  border-radius: var(--radius-10);
  padding: var(--pm-block-blend);
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.modal-content-header,
.modal-content-main {
  text-align: center;
}

.modal-content-header h2:first-child {
  margin-top: 0;
  margin-bottom: 1rem;
  color: var(--pastel);
}

.modal-content-main h3 {
  margin-bottom: 1rem;
  color: var(--pastel);
  font-size: var(--text-general);
  text-align: center;
}

.modal-content-footer {
  border-top: var(--border-intense);
  margin-top: 1rem;
  padding-top: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 1rem;
  font-size: var(--text-small);
}

.modal-content-prefooter {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal-content-prefooter div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
}

.modal-content-prefooter div span {
  font-size: var(--text-general);
  color: var(--pastel);
}

.logo-modal {
  height: 70px;
  width: auto;
  display: block;
  margin: 0 auto;
}

/* *******************************************************************
Responsive
*********************************************************************/

@media all and (max-width: 1320px) {
}

@media all and (max-width: 1024px) {
  #main-content.width-limit {
    width: 90%;
  }

  #services {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media all and (max-width: 780px) {
  #language {
    display: none;
  }

  .main-nav {
    width: 90%;
  }

  #toggle,
  #nav-toggle {
    display: block;
  }

  .toggle-cart.toggle-cart-active {
    top: 24px;
    right: 20px;
  }

  #nav-column-main {
    display: none;
  }

  #nav-column-main.overlay.nav-active {
    display: block;
    width: 100%;
    position: fixed;
  }

  form {
    grid-template-columns: 1fr;
  }

  form > div {
    grid-column: span 1 !important;
  }

  header {
    height: 95px;
  }

  header::after {
    width: 100px;
    height: 50px;
    bottom: -50px;
  }

  #logo {
    height: 60px;
    top: -30px;
  }

  main {
    margin-top: 95px;
  }

  #main-header {
    height: inherit;
    padding-top: 80px;
    padding-bottom: 2em;
  }

  #main-content {
    width: 90%;
    margin: 0 auto;
  }

  #breadcrumb {
    width: 90%;
  }

  .breadcrumb-item span,
  .breadcrumb-item.active span {
    width: 32px;
    height: 32px;
    border-radius: 32px;
  }

  .breadcrumb-item.active span {
    border: 1px solid var(--barro);
    font-size: 0;
  }

  .breadcrumb-item span::before {
    font-size: var(--text-general) !important;
  }

  .breadcrumb-item.active::before,
  .breadcrumb-item.active::after,
  .breadcrumb-item.active span::before {
    display: inherit !important;
  }

  .breadcrumb-item::before,
  .breadcrumb-item::after {
    width: calc(50% - 16px);
  }

  .breadcrumb-item.active::after {
    display: none;
  }

  #footer-logo img {
    height: 70px;
  }

  #footer-logo::before,
  #footer-logo::after {
    width: calc(50% - 50px);
  }

  #footer-datos {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 1rem;
    text-align: center;
    margin-bottom: 0;
    padding-bottom: 30px;
    position: relative;
  }

  #footer-datos::before {
    display: none;
  }

  #footer-datos::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    background: var(--linea-intensa);
    bottom: 0;
    left: 0;
  }

  #footer-datos-right,
  #footer-nav {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    text-align: center;
  }

  #services {
    grid-template-columns: 1fr;
  }

  #revision-wrap {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .revision-item {
    grid-column: span 1;
  }

  #revision-item-treatments {
    grid-column: span 1;
    margin-top: 2em;
  }

  .check-buttons label {
    gap: 0.5em;
  }

  .check-buttons input[type="checkbox"]:checked + label::before,
  .check-buttons input[type="radio"]:checked + label::before {
    width: 7px;
    height: 15px;
  }
}

@media all and (max-width: 600px) {
  .calendar {
    width: 100%;
    padding: 30px 20px 10px;
  }

  .month-title {
    font-size: var(--text-subtitle);
  }

  .month-button {
    width: 16px;
    height: 16px;
  }

  #discount-buttons,
  #shipment-buttons {
    grid-template-columns: 1fr;
  }

  #form-actions {
    width: 90%;
  }

  #form-actions button {
    min-width: 49%;
  }

  #shift-buttons {
    grid-template-columns: repeat(4, 1fr);
    grid-gap: .5em;
  }
}
