:root {
    /* Colors */
    --color-reddish: #df334d;
    --color-orange: #e65930;
    --color-orange-lighter: #FC883A;
    --color-purpleish: #833889;
    --color-yellowish: #FFCE08;
    --color-brownish: #574141;
    --color-brown-light: #A26952;
    --color-sand: #EBDFCC;
    --color-greenish: #00B577;

    /* Gradients */
    --gradient-reddish-purpleish: linear-gradient(to right, var(--color-orange), var(--color-reddish), var(--color-purpleish));
}

@font-face {
    font-family: 'DMSans-Regular';
    src: url("../fonts/DMSans-Medium-xrRDBrs.ttf") format('truetype');
    font-weight: normal;
}
@font-face {
    font-family: 'DMSans-Bold';
    src: url("../fonts/DMSans-Bold-10C9xz-.ttf") format('truetype');
    font-weight: normal;
}
@font-face {
    font-family: 'BarlowCondensed-Black';
    src: url("../fonts/BarlowCondensed-Black-9O6_Yku.ttf") format('truetype');
    font-weight: normal;
}

* {
    border-collapse: collapse;
    box-sizing: border-box;
    font-family: inherit;
    font-size: inherit;
    padding: 0;
    margin: 0;
}

html {
    scroll-behavior: smooth;
    /* Spazio della scrollbar sempre riservato: aprendo una modale (.modal-open) la pagina non salta */
    scrollbar-gutter: stable;
}

#section-itinerary,
#section-dettagli,
#section-attivita,
#section-compreso,
#section-date,
#section-details,
#section-prices,
#section-faq,
#feder {
    scroll-margin-top: 150px;
}

header {
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 50px;
    color: white;
    width: 100%;
    z-index: 9999;
    height: 70px;
}
header::before {
    content: '';
    position: absolute;
    inset: 0;
    background: var(--gradient-reddish-purpleish);
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    z-index: -1;
}
.header--background-gradient::before, .header--fixed-background-gradient::before {
    opacity: 1;
}

body {
    font-family: "DMSans-Regular", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a {
    color: inherit;
    text-decoration: none;
}

b, strong, th {
    font-family: "DMSans-Bold", sans-serif;
    font-weight: normal;
}

h1, h2, h3, h4 {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-weight: normal;
    text-transform: uppercase;
}

p {
    line-height: 1.6;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    width: 85%;
}

.btn, .btn-hover-effect {
    transition: transform 0.2s ease;
    cursor: pointer;
}

.btn {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1rem;
    width: 100%;
    max-width: 300px;
    border-radius: 8px;
    padding: 5px 25px;
    min-height: 42px;
    box-sizing: border-box;
    background-color: var(--color-yellowish);
    color: var(--color-brownish);
    border: none;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.btn:hover, .btn-hover-effect:hover {
    transform: scale(1.05) rotate(-1deg);
}
.btn:active {
    transform: scale(0.9) rotate(1deg);
}

.btn--higher {
    min-height: 50px;
}

.btn--gradient {
    background: var(--gradient-reddish-purpleish);
    background: linear-gradient(to bottom, var(--color-orange), var(--color-reddish), var(--color-purpleish));
    color: white;
}

.btn--sand-on-brown {
    background-color: var(--color-brownish);
    color: var(--color-sand);
}

.btn--yellow-on-brown {
    background-color: var(--color-brownish);
    color: var(--color-yellowish);
}

.btn--red-on-white {
    background-color: white;
    color: var(--color-reddish);
}

.btn--orange-on-white {
    background-color: white;
    color: var(--color-orange-lighter);
}

.btn--purple-on-white {
    background-color: white;
    color: var(--color-purpleish);
}

.btn--outlined {
    color: var(--color-brown-light);
    border: solid 2px var(--color-brown-light);
    background: transparent;
}

.btn--whatsapp {
    border: solid 2px #26D466;
    color: #26D466;
    background: transparent;
}

.btn__icon {
    height: 25px;
}

.btn__arrow {
    width: 20px;
}

h1 {
    display: block;
    margin: 70px auto 0 auto;
    font-size: 6.5rem;
    text-align: center;
    max-width: 1000px;
    line-height: 6rem;
}

h2 {
    font-size: 2.6rem;
    text-align: center;
    line-height: 3rem;
    color: var(--color-reddish);
    margin: 0 auto;
}

h3 {
    font-size: 2rem;
    text-align: center;
    color: var(--color-brownish);
}

.top-page-intro {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    min-height: 560px;
    padding: 30px 20px 100px 20px;
    text-align: center;
    color: white;
    background-position: bottom;
    background-size: cover;
    background-repeat: no-repeat;
}

.top-page-intro--cutted-below {
    mask-image: url("../img/masks/cut-bottom-big-mask-LeneXb4.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/cut-bottom-big-mask-LeneXb4.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    margin-bottom: 50px;
}

.top-page-intro--our-belief {
    background-image: url("../img/headers/belief-head--oUHG-q.webp");
}

.top-page-intro--groups {
    background-image: url("../img/headers/groups-head-M5-rAk4.webp");
}

.top-page-intro--experiences {
    background-image: url("../img/headers/experiences-head-wmtzTAk.webp");
}

.top-page-intro--about {
    background-image: url("../img/headers/about-head-9yuRrRl.webp");
}

.top-page-intro--how-work {
    background-image: url("../img/headers/how-work-head-BedFuxt.webp");
}

.top-page-intro--contacts {
    background-image: url("../img/headers/contact-head-YtsX7uS.webp");
}

.top-page-intro--collaboration {
    background-image: url("../img/headers/collaboration-head-YGf7wso.webp");
}

.top-page-intro--magazine {
    background-image: url("../img/headers/magazine-head-QUAHQKc.webp");
}

.top-page-intro--episodes {
    background-image: url("../img/headers/episodes-head-L0clgnu.webp");
}

.top-page-intro--honeymoon {
    background-image: url("../img/headers/honeymoon-head-rlYCLr1.webp");
}

.top-page-intro__subtitle {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.2rem;
    margin-top: 16px;
}

.big-text {
    position: relative;
    margin: auto;
    max-width: 1300px;
}

/* La pagina d'errore generica non ha header né footer (non può interrogare il database),
   quindi lo spazio in cima e il logo se li dà da sé */
.error-page {
    padding-top: 60px;
}

.error-page__logo {
    height: 60px;
    display: block;
    margin: 0 auto 40px auto;
}

.error-page__cta {
    margin: 0 auto 100px auto;
}

.big-text__back-text {
    position: absolute;
    top: 0;
    left: 50%;
    width: 80%;
    max-width: 1000px;
    transform: translateX(-50%);
    font-family: 'BarlowCondensed-Black', sans-serif;
    font-size: 9rem;
    line-height: 8rem;
    text-transform: uppercase;
    text-align: center;
    color: var(--color-yellowish);
    z-index: -2;
    max-height: 400px;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to bottom, black, transparent);
    mask-image: linear-gradient(to bottom, black, transparent);
}

.big-text__back-text--white {
    color: white;
}

.big-text__front {
    position: relative;
    width: 800px;
    padding-top: 32px;
    margin: 0 auto;
    text-align: center;
    color: var(--color-brownish);
    z-index: 10;
}

.big-text__front-icon {
    height: 130px;
}

.big-text__front-title {
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    font-size: 3rem;
    line-height: 3rem;
    margin-bottom: 10px;
}

.big-text__front-description {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.2rem;
    line-height: 1.6rem;
    max-width: 600px;
    margin: 0 auto 50px auto;
}

.carousel-card {
    height: 450px;
    width: 310px;
    background-size: cover;
    background-position: center;
    mask-image: url("../img/image-carousel-mask-IQeXf8i.svg");
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/image-carousel-mask-IQeXf8i.svg");
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
}

.carousel-card--less-tall {
    height: 360px;
    width: 360px;
    mask-image: url("../img/image-carousel-mask-less-tall-wZxSSEE.svg");
    -webkit-mask-image: url("../img/image-carousel-mask-less-tall-wZxSSEE.svg");
}

.carousel-card--lower {
    margin-top: 100px !important;
}

.h2-subtitle {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.2rem;
    text-align: center;
    color: var(--color-brownish);
    max-width: 800px;
    margin: 20px auto 40px auto;
}

.box {
    padding: 32px;
    border-radius: 10px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
    background-color: white;
}

.box--outlined {
    padding: 25px;
    border: solid 2px var(--color-brownish);
    box-shadow: none;
    color: var(--color-brownish);
}

.box--sanded {
    padding: 16px;
    background-color: var(--color-sand);
    box-shadow: none;
    color: var(--color-brownish);
}

.box__generic-title {
    font-size: 1.2rem;
    font-family: "DMSans-Bold", sans-serif;
    margin-bottom: 10px;
}

.box--outlined .box__generic-title {
    font-size: 1.1rem;
    margin-bottom: 8px;
}

.box--margin-bottom {
    margin-bottom: 20px;
}

.form input[type="text"], .form input[type="password"], .form input[type="email"], .form textarea, .form select {
    width: 100%;
    display: block;
    padding: 9px 10px;
    border-radius: 6px;
    border: solid 2px var(--color-brownish);
    box-sizing: border-box;
    color: var(--color-brownish);
    background-color: transparent;
}

.form select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23574141' stroke-width='1.5' d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 15px center;
    padding-right: 40px;
    cursor: pointer;
}

.form input[type="email"]:disabled, .form input[type="text"]:disabled {
    background-color: rgba(0, 0, 0, 0.1);
}

/* Campo in errore: la classe sta sul contenitore e non sull'input, così il rosso trova
   il campo visibile anche dove accanto ce n'è uno nascosto (la data con flatpickr).
   Il testo dell'errore vive sempre nel DOM: vuoto, spariscono div e margine. */
.form .field-invalid input, .form .field-invalid textarea, .form .field-invalid select {
    border-color: var(--color-reddish);
}

.form .field-error {
    color: var(--color-reddish);
    font-size: 0.8rem;
    margin-top: 4px;
}

.form .field-error:empty {
    display: none;
}

.form input[type="radio"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    margin: 0 8px 0 0;
    padding: 0;
    border: solid 3px #ddd;
    border-radius: 50%;
    box-sizing: border-box;
    vertical-align: middle;
    position: relative;
    cursor: pointer;
    flex-shrink: 0;
    transition: border-color 0.15s ease;
}

.form input[type="radio"]:checked {
    border-color: var(--color-reddish);
}

.form input[type="radio"]:checked::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10px;
    height: 10px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background-color: var(--color-reddish);
}

.form input[type="radio"]:focus-visible {
    outline: 2px solid var(--color-reddish);
    outline-offset: 2px;
}

.form input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    margin: 0 8px 0 0;
    padding: 0;
    border: solid 2px var(--color-brownish);
    border-radius: 6px;
    box-sizing: border-box;
    vertical-align: middle;
    position: relative;
    cursor: pointer;
    flex-shrink: 0;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.form input[type="checkbox"]:checked {
    border-color: var(--color-reddish);
    background-color: var(--color-reddish);
}

.form input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    top: 45%;
    left: 50%;
    width: 5px;
    height: 10px;
    transform: translate(-50%, -60%) rotate(45deg);
    border: solid #fff;
    border-width: 0 2px 2px 0;
}

.form input[type="checkbox"]:focus-visible {
    outline: 2px solid var(--color-reddish);
    outline-offset: 2px;
}

.form label {
    font-size: 0.8rem;
    margin-bottom: 4px;
    display: block;
    color: var(--color-brownish);
}

.form label.of-radio {
    display: inline-block;
    margin-bottom: initial;
    font-size: inherit;
    vertical-align: middle;
    cursor: pointer;
    font-size: 0.9rem;
}

.section-contact .form label.of-radio {
    margin-top: -4px;
}

.of-radio a {
    text-decoration: underline;
}

.form input:not([type="radio"]):not([type="checkbox"]):focus, .form textarea:focus, .form select:focus {
    outline: none;
    border-color: var(--color-reddish);
}

.form__columns {
    display: flex;
    gap: 30px;
}

.form__columns > * {
    flex: 1;
}

.visible-link {
    color: var(--color-reddish);
    text-decoration: underline;
}

.visible-link:hover {
    opacity: 0.7;
}

.hidden {
    display: none;
}

/* Sul body finché una modale è aperta: si scorre la modale, non la pagina sotto */
.modal-open {
    overflow: hidden;
}

.masked-with-vertical-paper, .masked-with-narrow-paper {
    background-image: url("../img/backgrounds/paper-large-AdGU2-o.webp");
    background-size: cover;
    background-position: center;
    mask-image: url("../img/masks/paper-narrow-mask-XmREgD2.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-narrow-mask-XmREgD2.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.masked-with-vertical-paper {
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
}

.light-warning {
    text-align: center;
    color: var(--color-brown-light);
    background-color: rgb(162 105 82 / 0.1);
    padding: 15px;
    border-radius: 10px;
}

.light-warning a {
    text-decoration: underline;
}

.error-message {
    color: var(--color-reddish);
    background-color: rgb(223 51 77 / 0.1);
    padding: 15px;
    border-radius: 10px;
    text-align: center;
    margin-top: 10px;
}

.success-message {
    color: green;
    background-color: rgb(0 128 0 / 0.1);
    padding: 15px;
    border-radius: 10px;
    text-align: center;
    margin-top: 10px;
}

/* Toast (toastify-js). La specificità doppia serve a battere il gradiente di default della libreria. */
.toastify.sgt-toast {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 0.9rem;
    white-space: pre-line;
    padding: 15px 20px;
    border-radius: 10px;
    box-shadow: 0 6px 20px rgb(87 65 65 / 0.25);
}

.toastify.sgt-toast--success {
    background: var(--color-brownish);
    color: var(--color-sand);
}

.toastify.sgt-toast--error {
    background: var(--color-reddish);
    color: white;
}

.chip {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 0.7rem;
    padding: 2px 8px;
    color: white;
    background-color: black;
    display: block;
    width: fit-content;
    border-radius: 50px;
}

.chip--green {
    color: white;
    background-color: green;
}

.chip--red {
    color: white;
    background-color: var(--color-reddish);
}

.underline {
    text-decoration: underline;
}

.container--large {
    max-width: initial;
    margin-left: 40px;
    margin-right: 40px;
    width: auto;
}

.container--short {
    max-width: 750px;
}

.editorial {
    color: var(--color-brownish);
}

.editorial p {
    margin-top: 4px;
    margin-bottom: 8px;
}

.editorial h2 {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 2rem;
    margin-top: 64px;
    margin-bottom: 8px;
    color: var(--color-reddish);
    text-align: left;
}
.editorial h2 strong, .editorial h2 b {
    font-family: "BarlowCondensed-Black", sans-serif;
}

.editorial h3 {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 1.7rem;
    margin-top: 32px;
    margin-bottom: 8px;
    text-align: left;
}
.editorial h3 strong, .editorial h3 b {
    font-family: "BarlowCondensed-Black", sans-serif;
}

.editorial p {
    line-height: 1.6;
}

/* L'editor dell'ERP salva una riga vuota come `<p></p>`, che il browser renderebbe alto zero:
   lo spazio non separabile gli dà l'altezza di una riga, come nell'editor */
.editorial p:empty::before {
    content: "\00a0";
}

.editorial li {
    line-height: 1.6;
    margin-left: 32px;
    margin-bottom: 4px;
}

.editorial ul, .editorial ol {
    margin-bottom: 8px;
}

.editorial img {
    display: block;
    max-width: 100%;
    max-height: 1024px;
    height: auto;
    margin: auto;
}

/* Absolute e non fixed: le briciole restano dove sono sempre state — appoggiate sotto l'header,
   sopra l'hero — ma appartengono alla pagina, quindi scorrono via con lei. Il top è misurato dal
   documento, che a pagina ferma è lo stesso punto di prima. z-index sotto quello dell'header (9999),
   così scivolano sotto di lui invece di passargli davanti */
.breadcrumbs {
    position: absolute;
    top: 68px;
    left: 0;
    width: 100%;
    font-size: 0.9rem;
    color: white;
    padding: 0;
    z-index: 9998;
}

.breadcrumbs__chevron {
    height: 15px;
}

.breadcrumbs__inner {
    margin: 0 50px;
    padding: 8px 0;
    border-top: solid 1px white;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.breadcrumbs__link {
    transition: opacity 0.2s ease-in-out;
    cursor: pointer;
}

.breadcrumbs__link:hover {
    opacity: 0.7;
}

.breadcrumbs__link--current {
    font-family: "DMSans-Bold", sans-serif;
}
/* Sulle pagine senza hero dietro: là le briciole hanno bisogno di un fondo per essere leggibili */
.breadcrumbs--fixed-with-background {
    background-color: var(--color-purpleish);
}

.header__logo {
    transition: opacity .2s ease-in-out;
    height: 38px;
}

.header__logo:hover {
    opacity: 0.7;
}

nav {
    display: flex;
    justify-content: center;
    align-content: center;
    gap: 5px;
}

.header__left, .header__right {
    width: 300px;
}

.header__left, .header__right, nav {
    position: relative;
    z-index: 1;
}

.header__right {
    display: flex;
    justify-content: flex-end;
    gap: 40px;
}

.header__icon-btn {
    cursor: pointer;
}

.header__icon-btn img {
    transition: opacity .2s ease-in-out;
}

.header__icon-btn img:hover {
    opacity: 0.6;
}

.home-intro, .home-intro-video {
    height: 750px;
    width: 100%;
}

.home-intro-video {
    object-fit: cover;
    z-index: -1;
}

.home-intro {
    position: absolute;
    z-index: 1;
    margin-top: -755px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color: white;
}

.home-intro__title {
    font-size: 5.5rem;
    line-height: 5.5rem;
    max-width: 900px;
}

.home-intro__subtitle {
    font-size: 1.2rem;
    font-family: "DMSans-Bold", sans-serif;
    margin-top: 30px;
}

.home-intro__chip {
    margin-top: 10px;
    color: var(--color-brownish);
    background-color: var(--color-yellowish);
    padding: 7px 15px;
    border-radius: 100px;
    font-size: 0.9rem;
}

.home-intro__tv {
    margin-top: 50px;
}

.first-invisible-slide {
    width: calc((100vw - min(85vw, 1400px)) / 2);
    height: 1px;
}

footer {
    position: relative;
    background-image: url("../img/backgrounds/base-footer-aMfeCOg.webp");
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    padding-top: 150px;
    padding-bottom: 80px;
    z-index: 0;
    /* Il bordo di carta strappata in cima al footer sale sopra la fascia Trustpilot, che ha un
       margin-bottom negativo: lì il footer è solo decorazione e non deve rubare i tap alle card
       sotto. Alzare la fascia con uno z-index coprirebbe il bordo, quindi si tolgono gli eventi
       alla scatola del footer e si ridanno ai suoi contenuti, che stanno tutti sotto il padding
       e quindi fuori dalla sovrapposizione */
    pointer-events: none;
}

footer > * {
    pointer-events: auto;
}

.footer__columns {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.footer__column--no-title {
    padding-top: 35px;
}

.footer__columns > div {
    flex: 1;
}

.footer__divider {
    height: 2px;
    background: #969696;
    border-radius: 5px;
    margin-top: 30px;
}

.footer__credits {
    margin-top: 20px;
    font-size: 0.9rem;
    opacity: 0.5;
}

.footer__column {
    line-height: 2.2rem;
}

.footer__socials {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 10px;
    margin-bottom: 20px;
    gap: 25px;
}

.footer__social-image {
    height: 22px;
    transition: transform 0.2s ease-in-out;
}
.footer__social-image:hover {
    transform: scale(1.2) rotate(-10deg);
}

.footer__gg-logo {
    height: 20px;
}

.hover-fade {
    transition: opacity 0.3s ease;
}
.hover-fade:hover {
    opacity: 0.4;
}

.dd-section {
    padding: 30px;
    border-bottom: solid 1px #ddd;
}

.dd-section--darker {
    background-color: rgba(0, 0, 0, 0.9);
}

.search-box {
    width: 500px;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
    padding: 10px;
    background: var(--gradient-reddish-purpleish);
    position: relative;
    color: white;
}

/* Where the box sits is up to who hosts it, so the hero spacing is not baked into the component */
.home-intro .search-box {
    margin-top: 30px;
}

.search-box__tabs {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.search-box__tab {
    transition: background-color 0.3s ease;
    padding: 10px 12px;
    border-radius: 10px;
    cursor: pointer;
}

.search-box__tab:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

/* No bold: it would change the width of the tab and shift the other ones on every switch */
.search-box__tab--active {
    background-color: rgba(255, 255, 255, 0.2) !important;
}

.search-box__search-container {
    color: black;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    background-color: white;
    padding: 12px 12px;
    border-radius: 10px;
}

.search-box__search-container-icon {
    height: 20px;
    margin-bottom: -4px;
}

.search-box__search-input {
    border: none;
    outline: none;
    width: 100%;
    color: var(--color-brownish);
}

.search-box__search-input:read-only {
    cursor: pointer;
}

.search-results {
    position: absolute;
    left: 10px;
    right: 10px;
    margin-top: 10px;
    max-height: 380px;
    overflow-y: auto;
    background-color: white;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
    color: var(--color-brownish);
    text-align: left;
    padding: 8px;
    z-index: 10;
}

.search-results__group {
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    font-size: 1.1rem;
    color: var(--color-reddish);
    padding: 8px 8px 4px 8px;
}

.search-results__row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px;
    border-radius: 8px;
    transition: background-color .1s ease-in-out;
}

.search-results__row:hover {
    background-color: rgba(0, 0, 0, 0.04);
}

.search-results__row-image {
    height: 44px;
    width: 60px;
    flex-shrink: 0;
    border-radius: 6px;
    background-color: rgba(0, 0, 0, 0.1);
    background-size: cover;
    background-position: center;
}

.search-results__row-title {
    font-family: "DMSans-Bold", sans-serif;
}

.search-results__row-subtitle {
    font-size: 0.85rem;
    opacity: 0.8;
}

.search-results__empty {
    padding: 16px 8px;
    text-align: center;
}

/* Two columns so the whole window of months is visible without scrolling the dropdown */
.search-results__months {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

/* The same box the hero has, opened from the magnifier in the header. It stays below the header
   (z-index 9999), which keeps the logo and the menu reachable while the search is open */
.search-overlay {
    position: fixed;
    inset: 0;
    z-index: 9998;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    box-sizing: border-box;
    background-color: rgba(87, 65, 65, 0.6);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    animation: communication-overlay-in 0.4s ease;
}

.search-overlay[hidden] {
    display: none;
}

.search-overlay__close {
    position: absolute;
    top: 90px;
    right: 50px;
    background: none;
    border: none;
    color: white;
    font-size: 1.6rem;
    cursor: pointer;
}

.home-flash-callout {
    background-color: black;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 250px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 64px;
    margin-top: -50px;
    position: relative;
    mask-image: url("../img/masks/paper-narrow-mask-XmREgD2.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-narrow-mask-XmREgD2.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.home-flash-callout__text, .home-flash-callout__button {
    flex: 1;
    max-width: 350px;
}

.home-flash-callout__text {
    text-align: right;
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 2.8rem;
    text-transform: uppercase;
}

.home-flash-callout__button {
    text-align: left;
}

.home-intro__tv-text {
    text-align: center;
    margin-bottom: 20px;
    font-size: 0.9rem;
    font-family: "DMSans-Bold", sans-serif;
}

.home-intro__tv-images {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 40px;
}

.home-intro__tv-logo {
    height: 30px;
}

/* As wide as the box it holds: at full width the transparent bands on its sides kept the hover
   alive, so leaving the menu sideways did not close it */
.header__bigbox-container {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    width: fit-content;
    margin: 0 auto;
    padding-top: 15px;
}

.header__bigbox {
    display: flex;
    width: 900px;
    margin: auto;
    background-color: white;
    border-radius: 15px;
    padding: 20px;
    color: var(--color-brownish);
    font-size: 0.9rem;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
}

.header__bigbox--months {
    flex-direction: column;
    gap: 40px;
}

.header__center {
    display: flex;
    justify-content: center;
    align-content: center;
    gap: 30px;
}

.header__link:hover .header__bigbox-container {
    display: block;
}

.header__link-text {
    display: inline-block;
    transition: transform 0.2s ease, background 0.2s ease;
    padding: 5px 10px;
    border-radius: 5px;
    white-space: nowrap;
}

.header__link:hover .header__link-text {
    transform: scale(1.05) rotate(-2deg);
    background: rgba(255, 255, 255, 0.2);
}

.header__bigbox-right {
    border-left: solid 1px rgba(0, 0, 0, 0.2);
    margin-left: 30px;
    padding-left: 30px;
    width: 100%;
    display: none;
}
.header__bigbox-right.active {
    display: flex;
}

.header__bigbox-left-option {
    font-family: "DMSans-Bold", sans-serif;
    transition: background-color .1s ease-in-out;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 220px;
    padding: 8px 5px 8px 15px;
    margin-bottom: 5px;
    border-radius: 5px;
    cursor: pointer;
}

.header__bigbox-left-option:hover {
    background-color: rgba(0, 0, 0, 0.04);
}

.header__bigbox-left-option.active {
    background-color: rgba(0, 0, 0, 0.07);
}

.header__bigbox-left-option-chevron {
    height: 18px;
    opacity: 0.7;
}

.header__bigbox-image {
    height: 100%;
    width: 200px;
    min-width: 200px;
    border-radius: 10px;
    margin-right: 20px;
    background-size: cover;
    background-position: center;
}

.header__bigbox-right-title {
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-reddish);
    font-size: 2rem;
    padding-bottom: 8px;
    display: block;
    text-transform: uppercase;
}

/* Colonna: titolo e viaggi in alto, il "vedi tutti" spinto in fondo dal suo margin-top auto */
.header__bigbox-right-text {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.header__bigbox-right-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.header__bigbox-right-links a:hover {
    opacity: 0.7;
}

/* Porta alla pagina del continente/esperienza, come nel menu laterale */
.header__bigbox-right-link--all {
    font-family: "DMSans-Bold", sans-serif;
    margin-top: auto;
    padding-top: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    width: fit-content;
}

.header__bigbox-right-link--all:hover {
    opacity: 0.7;
}

.header__bigbox-right-link-arrow {
    height: 10px;
}

.header__bigbox-year-name {
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-reddish);
    font-size: 2rem;
    margin-bottom: 10px;
    padding-left: 15px;
}

.header__bigbox-year-months {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    display: grid;
    gap: 10px;
}

.header__bigbox-month-link {
    transition: background-color .1s ease-in-out;
    padding: 10px 15px;
    border-radius: 5px;
    cursor: pointer;
    color: var(--color-brownish);
    font-family: "DMSans-Bold", sans-serif;
}
.header__bigbox-month-link:hover {
    background-color: rgba(0, 0, 0, 0.07);
}

.footer__logo {
    width: 80%;
    max-width: 200px;
    margin-bottom: 20px;
}

.side-menu {
    display: none;
    position: fixed;
    width: 350px;
    /* Il pannello si ferma al viewport e scorre al suo interno: il dvh tiene conto della barra
       degli indirizzi che su mobile compare e sparisce, dove il vh resterebbe più alto dello
       schermo utile. Il vh sopra è il ripiego per chi non conosce il dvh */
    height: 100vh;
    height: 100dvh;
    overflow-y: auto;
    /* Scrollbar nascosta (Firefox + WebKit), lo scroll resta */
    scrollbar-width: none;
    background-color: white;
    top: 0;
    right: 0;
    padding: 30px;
    z-index: 9999;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
    animation-duration: 0.3s !important;
}

.side-menu::-webkit-scrollbar {
    display: none;
}

.side-menu__links {
    display: flex;
    flex-direction: column;
    color: var(--color-brownish);
}

.side-menu__link {
    transition: background-color .2s ease-in-out, transform .2s ease-in-out;
    padding: 10px 15px;
    border-radius: 5px;
    cursor: pointer;
}

.side-menu__link:hover {
    background-color: rgba(0, 0, 0, 0.07);
    transform: rotate(-3deg) scale(1.05);
}

.side-menu__close {
    transition: background-color .2s ease;
    display: flex;
    opacity: 0.6;
    border-radius: 5px;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 20px;
    padding: 5px;
    cursor: pointer;
    width: fit-content;
    margin-left: auto;
}
.side-menu__close:hover {
    background-color: rgba(0, 0, 0, 0.05);
}

.side-menu__close-icon {
    height: 20px;
    margin-top: 1px;
}

/* Navigazione del menu laterale: elenco a due livelli, gruppo (Destinazioni, Partenze, Esperienze)
   e dentro la singola voce coi suoi viaggi. Niente in comune col bigbox dell'header, che è tarato
   sugli 800px del desktop */
.side-menu-nav {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
    color: var(--color-brownish);
}

.side-menu-nav__group-header {
    transition: background-color .2s ease-in-out;
    font-family: "DMSans-Bold", sans-serif;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 15px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 1.2rem;
}

/* Safari non apre niente: è una voce di primo livello che porta fuori dal sito */
.side-menu-nav__group-header--link {
    color: inherit;
    display: block;
}

.side-menu-nav__group-body,
.side-menu-nav__item-body {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .3s ease;
}

.side-menu-nav__group--open > .side-menu-nav__group-body,
.side-menu-nav__item--open > .side-menu-nav__item-body {
    grid-template-rows: 1fr;
}

.side-menu-nav__collapse {
    overflow: hidden;
    min-height: 0;
    padding: 0 0 0 15px;
    transition: padding-top .3s ease, padding-bottom .3s ease;
}

.side-menu-nav__group--open > .side-menu-nav__group-body > .side-menu-nav__collapse {
    padding-top: 4px;
    padding-bottom: 12px;
}

.side-menu-nav__item--open > .side-menu-nav__item-body > .side-menu-nav__collapse {
    padding-bottom: 12px;
}

.side-menu-nav__item-body > .side-menu-nav__collapse {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.side-menu-nav__item-header {
    transition: background-color .2s ease-in-out;
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 1.5rem;
    text-transform: uppercase;
    color: var(--color-reddish);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 15px 8px 0;
    cursor: pointer;
}

.side-menu-nav__chevron {
    transition: transform .2s ease-in-out;
    height: 14px;
    opacity: 0.7;
}

.side-menu-nav__group--open > .side-menu-nav__group-header .side-menu-nav__chevron,
.side-menu-nav__item--open > .side-menu-nav__item-header .side-menu-nav__chevron {
    transform: rotate(90deg);
}

.side-menu-nav__link {
    padding: 6px 0;
    color: var(--color-brownish);
}

.side-menu-nav__link--all {
    font-family: "DMSans-Bold", sans-serif;
}

/* I mesi non hanno un secondo livello da aprire: sono già la foglia dell'albero */
.side-menu-nav__year {
    padding-bottom: 12px;
}

.side-menu-nav__year-name {
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-reddish);
    font-size: 1.6rem;
}

.side-menu-nav__months {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 10px;
}

.side-menu-nav__month {
    padding: 6px 0;
    color: var(--color-brownish);
}

.go-that-country, .things-proud {
    width: 100%;
    padding: 100px 0;
    background-image: url("../img/backgrounds/paper-large-AdGU2-o.webp");
    background-size: cover;
    background-position: center;
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    margin: 100px 0;
}

.go-that-country--honeymoon {
    background-image: url("../img/backgrounds/honeymoon-background-omyK4dl.webp");
    margin-bottom: -120px;
}

.things-proud {
    padding: 80px 0;
    color: var(--color-brownish);
}

.things-proud__things {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 32px;
    gap: 40px;
}

.things-proud__thing {
    flex: 1;
    text-align: center;
}

.things-proud__thing-icon {
    height: 90px;
}

.things-proud__thing-title {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 1.7rem;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.things-proud__thing-subtitle {
    font-family: "DMSans-Bold", sans-serif;
}

/* La card è essa stessa la .splide__slide. La distanza fra le card è l'opzione `gap` passata a
   Splide in index.html.twig (con `breakpoints` per il valore mobile), non un margin-right qui:
   è Splide stesso a scriverlo, così i suoi conti di posizionamento restano coerenti col layout */
.model-box {
    height: 460px;
    width: 300px;
    min-width: 270px;
    background-color: rgba(0, 0, 0, 0.2);
    background-position: center;
    background-size: cover;
    border-radius: 10px;
    padding: 15px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    color: var(--color-brownish);
}

.model-box__infos {
    width: 100%;
}

.model-box__card-cut {
    width: 100%;
    height: 30px;
    display: block;
}

.model-box__infos-top {
    background-color: white;
    padding: 15px;
    padding-bottom: 5px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    height: 90px;
}

.model-box__infos-bottom {
    background-color: white;
    padding: 15px;
    padding-top: 5px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

.model-box__title {
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    font-size: 1.4rem;
}

.model-box__subtitle {
    font-family: "DMSans-Bold", sans-serif;
}

.model-box__calendar {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
}

.model-box__icon-calendar {
    height: 15px;
}

.model-box__columns {
    display: flex;
    justify-content: space-between;
    font-size: 0.8rem;
    margin-bottom: 10px;
}

.model-hero {
    display: flex;
    height: 550px;
    max-height: 550px;
    background-color: #ddd;
    align-items: center;
    box-sizing: border-box;
}

.model-hero--giftcards {
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    margin-bottom: 30px;
}

.model-hero > div {
    width: 50%;
    padding: 50px;
}

.model-hero__video-container {
    padding: 0 !important;
    height: 100%;
}

.model-hero__video-container--giftcards {
    background-size: cover;
    background-position: top;
    background-image: url("../img/headers/giftcard-head-6wlX0yj.webp");
}

.model-hero__video {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.model-hero__box {
    color: var(--color-brownish);
    padding: 20px;
    background-color: white;
    border-radius: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
}

.model-hero__box > div {
    gap: 15px;
}

.model-hero__right {
    height: 100%;
    background-image: url("../img/backgrounds/hero-model-vacation-sib5rZX.webp");
    background-size: cover;
    background-position: center;
    color: white;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.model-hero__ctas {
    flex-direction: column;
    display: flex;
    gap: 10px;
}

.model-hero__overtitle {
    padding-top: 40px;
}

.model-hero__overtitle, .model-hero__subtitle {
    font-size: 1.3rem;
    font-family: "DMSans-Bold", sans-serif;
}

.model-hero__title {
    margin: 0;
    padding: 0;
    text-align: left;
    font-size: 5rem;
    line-height: 5rem;
    margin-bottom: 4px;
}

.model-hero__duration {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    margin-top: 20px;
    font-family: "DMSans-Bold", sans-serif;
}

.model-hero__icon-calendar {
    height: 17px;
}

.model-hero__price {
    font-size: 1.9rem;
    font-family: "DMSans-Bold", sans-serif;
}

.model-hero__price-row {
    margin-bottom: 15px;
}

.model-hero--giftcards .model-hero__price-row {
    margin-bottom: 0;
}

.model-hero__scalapay-row {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 5px;
    font-size: 0.8rem;
    margin-top: 5px;
}

.spacing-for-fixed-header {
    height: 160px;
}

.spacing-for-fixed-header-checkout {
    height: 190px;
}

.groups-rows {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.box-group {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    border-radius: 15px;
    overflow: hidden;
    color: var(--color-brownish);
    background-image: url("../img/box-group-border-Ei3s_Vz.svg");
    background-size: 100% 100%;
}

.box-group > div {
    flex: 1;
}

.box-group__left {
    background: var(--gradient-reddish-purpleish);
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
}

.box-group__left-inner {
    min-height: 155px;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
}

.box-group__left-inner, .box-group__middle, .box-group__right {
    padding: 20px;
}

.box-group__left-model {
    width: 100%;
}

.box-group__right {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 0;
}

.box-group__cta-container {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-right: 16px;
}

.btn--cta-group {
    width: fit-content;
}

.btn--cta-group:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.box-group__status-and-claim {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 16px;
    margin-top: 15px;
}

.box-group__claim {
    color: var(--color-reddish);
    font-family: "DMSans-Bold", sans-serif;
}

.box-group__date {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 1.5rem;
    text-align: center;
    width: 100px;
    min-width: 100px;
    margin-right: 25px;
    border-right: solid 2px white;
}

.box-group__date-day {
    font-size: 2.4rem;
}

.box-group__model-title {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 1.5rem;
    text-transform: uppercase;
    margin: 8px 0;
}

.box-group__installments-notice {
    font-size: 0.8rem;
}

.box-group__scalapay-img {
    height: 25px;
}

.box-group__soldout {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.1rem;
    color: var(--color-reddish);
    text-align: center;
    width: 150px;
    transform: rotate(-4deg);
    text-transform: uppercase;
    letter-spacing: 0.1rem;
}

.box-group__amount {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.5rem;
    white-space: nowrap;
}

.box-group__discount {
    color: var(--color-reddish);
    line-height: 1.2rem;
}

.box-group__discount-deadline {
    font-size: 0.9rem;
}

.box-group__discount-quantity {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.1rem;
}

/* Col prezzo pieno barrato la larghezza si stringe sul testo, altrimenti la riga sborderebbe
   fino al bordo della colonna */
.box-group__base-price--striked {
    position: relative;
    width: fit-content;
}

/* Riga in diagonale da basso-sinistra ad alto-destra. È un box sottile ruotato e non un hard stop
   dentro un gradiente: la rotazione di una superficie piena viene antialiasata, il gradiente no */
.box-group__base-price--striked::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 3px;
    border-radius: 3px;
    background-color: var(--color-reddish);
    transform: rotate(-7deg);
}

.model-metrics {
    width: 100%;
    padding: 60px 0;
    margin-top: -40px;
    margin-bottom: 50px;
}

.model-metrics__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 32px;
}

.model-metrics__metric {
    width: 400px;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 10px;
    color: var(--color-brownish);
}

.model-metrics__key {
    font-family: "DMSans-Bold", sans-serif;
}

.model-metrics__value {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 1.7rem;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.model-metrics__description {
    font-size: 1rem;
}

.model-metrics__icon {
    width: 80px;
}

.model-nav {
    background-color: white;
    padding: 8px 0;
    transition: box-shadow 0.2s ease;
}

/* Solo la navigazione di pagina si incolla: la stessa .model-nav veste anche la riga di tab della
   sezione "importante da sapere", che deve restare dov'è. top = 70px, l'altezza dell'header fisso a
   ogni larghezza (la media query gli cambia solo padding e logo). z-index sopra il contenuto che le
   scorre sotto, ma sotto le modali (1000) */
.model-nav--sticky {
    position: sticky;
    top: 70px;
    z-index: 800;
}

/* Messa da JS quando la barra ha raggiunto l'header: finché è al suo posto nel flusso non ha
   niente da cui staccarsi, l'ombra serve solo quando il contenuto le passa sotto */
.model-nav--stuck {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.model-nav__inner, .working-info__buttons, .magazine-chips {
    display: flex;
    gap: 15px;
}

.model-nav__inner {
    overflow-x: scroll;
    padding: 5px 3px;
    /* Scrollbar nascosta (Firefox + WebKit), lo scroll resta */
    scrollbar-width: none;
}
.model-nav__inner::-webkit-scrollbar {
    display: none;
}

.btn--model-nav, .btn--working-info, .btn--magazine-chip {
    color: var(--color-reddish);
    border-color: var(--color-reddish);
    width: fit-content;
}

.btn--model-infos {
    white-space: nowrap;
}

.model-intro {
    display: flex;
    align-items: flex-start;
    gap: 120px;
    margin-top: 40px;
}

.model-intro__left {
    width: 100%;
}

.model-intro__title {
    text-align: left;
    max-width: initial;
    margin-bottom: 25px;
}

.model-included {
    min-width: 340px;
    padding: 30px;
    margin-bottom: 30px;
    color: var(--color-brownish);
}

.model-included__title {
    font-size: 1.6rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
}

.model-included__subtitle {
    font-size: 1.1rem;
    font-family: "DMSans-Bold", sans-serif;
}

.model-included__item {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
}

.model-included__icon {
    width: 60px;
}

.model-included__entry {
    font-family: "DMSans-Bold", sans-serif;
}

.model-media {
    padding: 100px 0;
    margin-top: 50px;
}

.model-media__gallery {
    margin-top: 60px;
}

.model-media__video {
    display: block;
    width: 1024px;
    height: 512px;
    margin: 50px auto 0 auto;
    border-radius: 10px;
    overflow: hidden;
}

.model-itinerary {
    overflow-x: clip;
}

.model-itinerary__title-header {
    margin-top: 80px;
    display: flex;
    justify-content: space-between;
}

.model-itinerary__title {
    text-align: left;
    width: 100%;
}

.model-itinerary__buttons {
    display: flex;
    gap: 15px;
    padding: 10px 0;
    overflow-x: scroll;
}
.model-itinerary__buttons::-webkit-scrollbar {
    display: none;
}

.btn--itinerary-step {
    min-width: fit-content;
    padding-left: 15px;
    padding-right: 15px;
}

.btn--itinerary-step--active {
    background-color: var(--color-brown-light);
    color: white;
}

.model-itinerary__map {
    position: relative;
    height: 570px;
    border-radius: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
    overflow: hidden;
}

.model-itinerary__map-viewport {
    width: 100%;
    height: 100%;
}

.model-itinerary__map-controls {
    position: absolute;
    right: 15px;
    bottom: 15px;
    z-index: 20;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.model-itinerary__map-zoom {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 50%;
    background-color: white;
    color: var(--color-brownish);
    font-size: 1.8rem;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

.model-itinerary__map-zoom:hover:not(:disabled) {
    transform: scale(1.2) rotate(-10deg);
}

.model-itinerary__map-zoom:disabled {
    cursor: default;
    opacity: 0.4;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.model-itinerary__download {
    color: var(--color-reddish);
    border-color: var(--color-reddish);
}

.model-itinerary__days {
    margin-top: 20px;
}

.model-itinerary__days .splide__track {
    overflow: visible;
    padding: 25px 0;
}

.model-itinerary__day {
    transition: transform .7s ease-in-out;
    width: 380px;
    padding: 40px;
    color: var(--color-brownish);
}

.model-itinerary__day-title {
    font-size: 1.8rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
}

.model-itinerary__day-textnumber {
    font-size: 1.1rem;
    font-family: "DMSans-Bold", sans-serif;
    margin: 5px 0;
}

.model-itinerary__day-text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    overflow: hidden;
}

/* Sempre visibile, anche a testo corto: la tappa per intero si legge nella modale */
.model-itinerary__day-read-more {
    font-family: "DMSans-Bold", sans-serif;
    color: var(--color-brownish);
    background: none;
    border: none;
    padding: 0;
    margin: 8px 0 0 auto;
    display: block;
    cursor: pointer;
}

.model-itinerary__day-image {
    transition: transform 1s ease-in-out;
    height: 200px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

.model-itinerary__day--active .model-itinerary__day-image {
    transform: rotate(-5deg) scale(1.1);
}

.model-itinerary__day-number {
    font-size: 7.5rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-reddish);
    position: absolute;
    margin-top: -220px;
    transform: rotate(-5deg);
}

/* Anchored to the right edge of the card rather than pushed by a margin: the card is narrower on
   mobile and a two-digit day is wider, and whatever leaves the card is cut by its paper mask.
   As far from the edge as the odd ones, which sit on the padding */
.model-itinerary__day-number--2 {
    right: 40px;
    transform: rotate(5deg);
}

.model-itinerary__day-number--3 {
    margin-top: -120px;
    transform: rotate(-5deg);
}

.model-itinerary__day-number--4 {
    margin-top: -120px;
    right: 40px;
    transform: rotate(5deg);
}

.model-infos {
    margin-top: 80px;
}

.model-infos__title {
    margin-bottom: 20px;
    text-align: left;
}

.model-groups {
    margin-top: 80px;
}

.model-groups__title {
    margin-bottom: 10px;
}

.model-groups__open-calendar {
    margin: auto;
    width: fit-content;
    color: var(--color-brown-light);
    border: solid 2px var(--color-brown-light);
    font-family: "DMSans-Bold", sans-serif;
    padding: 4px 8px;
    border-radius: 8px;
    font-size: 0.9rem;
    cursor: pointer;
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    background-color: transparent;
}

/* Senza partenze future il JS nasconde il pulsante: il display: flex qui sopra
   vincerebbe sul [hidden] dell'user agent */
.model-groups__open-calendar[hidden] {
    display: none;
}

/* --- Modale "Guarda il calendario": i mesi delle partenze, disegnati da flatpickr.
   Le regole del contenitore (larghezza, titolo) stanno più in basso, subito dopo quelle
   della modale condivisa: a parità di specificità conta l'ordine, e qui perderebbero. --- */

/* flatpickr calcola le larghezze in pixel e le scrive inline sul calendario e sui mesi:
   senza !important i due mesi resterebbero larghi 307px e le celle non si allargherebbero. */
.groups-calendar .flatpickr-calendar,
.groups-calendar .flatpickr-days {
    width: 100% !important;
    max-width: none !important;
}

.groups-calendar .flatpickr-calendar {
    box-shadow: none;
    font-family: "DMSans-Regular", sans-serif;
    max-height: none;
}

.groups-calendar .flatpickr-days {
    gap: 60px;
    overflow: visible;
}

/* Cambiando mese griglia e nome del mese entrano dal lato da cui si arriva: ridisegnandosi
   sul posto il cambio passerebbe quasi inosservato */
@keyframes groups-calendar-slide-forward {
    from { opacity: 0; transform: translateX(110px); }
    60% { opacity: 1; }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes groups-calendar-slide-back {
    from { opacity: 0; transform: translateX(-110px); }
    60% { opacity: 1; }
    to { opacity: 1; transform: translateX(0); }
}

.groups-calendar--forward .flatpickr-days,
.groups-calendar--forward .flatpickr-current-month {
    animation: groups-calendar-slide-forward 0.45s cubic-bezier(0.23, 1, 0.32, 1);
}

.groups-calendar--back .flatpickr-days,
.groups-calendar--back .flatpickr-current-month {
    animation: groups-calendar-slide-back 0.45s cubic-bezier(0.23, 1, 0.32, 1);
}

/* Scorrendo, la griglia esce dal riquadro: il ritaglio va qui e non sugli elementi che
   traslano (i figli si muovono con loro) né sulla modale, che avendo overflow-y: auto
   si calcola overflow-x: auto e farebbe comparire una barra orizzontale a ogni cambio */
.groups-calendar {
    overflow: hidden;
}

.groups-calendar .dayContainer {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
    max-width: none;
    box-shadow: none;
    padding: 10px 0;
}

.groups-calendar .flatpickr-months {
    gap: 60px;
    margin-bottom: 6px;
}

.groups-calendar .flatpickr-months .flatpickr-month {
    flex: 1 1 0;
    height: 48px;
    color: var(--color-brownish);
}

.groups-calendar .flatpickr-current-month {
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    font-size: 1.6rem;
    padding-top: 8px;
}

/* flatpickr mette il nome del mese a 700: il Barlow ha una faccia sola, quindi il browser
   la ingrasserebbe di suo (come per gli h1-h4, che infatti azzerano il peso allo stesso modo) */
.groups-calendar .flatpickr-current-month span.cur-month {
    font-weight: normal;
}

/* L'anno è un number input: le sue frecce di spinner non servono, si naviga con i mesi */
.groups-calendar .numInputWrapper span {
    display: none;
}

/* L'anno è un input che flatpickr disabilita quando min/maxDate ne fissano il range,
   e da disabilitato se lo dipinge grigio: va ricolorato anche in quello stato */
.groups-calendar .flatpickr-current-month input.cur-year,
.groups-calendar .flatpickr-current-month input.cur-year[disabled],
.groups-calendar .flatpickr-current-month input.cur-year[disabled]:hover {
    color: var(--color-reddish);
    pointer-events: none;
}

.groups-calendar .flatpickr-months .flatpickr-prev-month,
.groups-calendar .flatpickr-months .flatpickr-next-month {
    fill: var(--color-brown-light);
    padding: 8px;
}

.groups-calendar .flatpickr-months .flatpickr-prev-month:hover svg,
.groups-calendar .flatpickr-months .flatpickr-next-month:hover svg {
    fill: var(--color-reddish);
}

.groups-calendar .flatpickr-weekdays {
    height: auto;
    gap: 60px;
}

.groups-calendar .flatpickr-weekdaycontainer {
    padding: 0 0 10px 0;
    border-bottom: solid 1px var(--color-sand);
}

.groups-calendar span.flatpickr-weekday {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-brown-light);
}

.groups-calendar .flatpickr-day {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    height: 48px;
    max-width: none;
    line-height: 1.1;
    margin-top: 2px;
    border-radius: 10px;
    border-color: transparent;
    color: var(--color-brownish);
}

/* I giorni di spalla degli altri mesi ripeterebbero una partenza già disegnata nel mese
   accanto: restano a occupare la griglia, ma invisibili */
.groups-calendar .flatpickr-day.prevMonthDay,
.groups-calendar .flatpickr-day.nextMonthDay {
    visibility: hidden;
    pointer-events: none;
}

.groups-calendar .flatpickr-day.today {
    border-color: var(--color-sand);
}

.groups-calendar .flatpickr-day.flatpickr-disabled {
    color: rgba(87, 65, 65, 0.35);
    cursor: default;
}

.groups-calendar__day-number {
    font-size: 0.9rem;
}

.groups-calendar__day-price {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 0.68rem;
    color: var(--color-brown-light);
    white-space: nowrap;
}

.groups-calendar .flatpickr-day.groups-calendar__day--departure {
    border-color: var(--color-brown-light);
    color: var(--color-brownish);
}

.groups-calendar .flatpickr-day.groups-calendar__day--departure:hover {
    background-color: var(--color-sand);
}

.groups-calendar .flatpickr-day.groups-calendar__day--soldout,
.groups-calendar .flatpickr-day.groups-calendar__day--soldout:hover {
    background-color: rgba(87, 65, 65, 0.08);
    border-color: transparent;
    color: rgba(87, 65, 65, 0.45);
}

.groups-calendar__day--soldout .groups-calendar__day-price {
    text-decoration: line-through;
    color: rgba(87, 65, 65, 0.45);
}

/* I giorni occupati dal viaggio scelto: una fascia continua da partenza a ritorno,
   arrotondata solo ai due capi */
.groups-calendar .flatpickr-day.groups-calendar__day--in-trip {
    background-color: var(--color-sand);
    border-color: transparent;
    border-radius: 0;
    color: var(--color-brownish);
}

.groups-calendar .flatpickr-day.groups-calendar__day--trip-end {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.groups-calendar .flatpickr-day.groups-calendar__day--trip-start,
.groups-calendar .flatpickr-day.groups-calendar__day--trip-start:hover,
.groups-calendar .flatpickr-day.selected,
.groups-calendar .flatpickr-day.selected:hover,
.groups-calendar .flatpickr-day.selected:focus {
    background: var(--gradient-reddish-purpleish);
    border: none;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    color: white;
}

.groups-calendar .groups-calendar__day--trip-start .groups-calendar__day-price {
    color: white;
}

.groups-calendar__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 20px;
    font-size: 0.8rem;
    color: var(--color-brown-light);
}

.groups-calendar__legend-item {
    display: flex;
    align-items: center;
    gap: 7px;
}

.groups-calendar__legend-swatch {
    width: 16px;
    height: 16px;
    border-radius: 5px;
}

.groups-calendar__legend-swatch--departure {
    border: solid 2px var(--color-brown-light);
}

.groups-calendar__legend-swatch--trip {
    background-color: var(--color-sand);
}

.groups-calendar__legend-swatch--soldout {
    background-color: rgba(87, 65, 65, 0.15);
}

.groups-calendar__selection {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 20px;
    padding-top: 20px;
    border-top: solid 1px var(--color-sand);
}

/* Il display: flex qui sopra batte il display: none che l'user agent dà a [hidden]:
   senza questa regola la barra resterebbe a vista, vuota, prima di scegliere una data */
.groups-calendar__selection[hidden] {
    display: none;
}

.groups-calendar__selection-dates {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: "DMSans-Bold", sans-serif;
    color: var(--color-brownish);
}

.groups-calendar__selection-arrow {
    width: 20px;
}

.groups-calendar__selection-meta {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 6px;
    font-size: 0.85rem;
    color: var(--color-brown-light);
}

.groups-calendar__selection-right {
    display: flex;
    align-items: center;
    gap: 16px;
}

.groups-calendar__selection-price {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.3rem;
    color: var(--color-reddish);
    white-space: nowrap;
}

.model-infos__btn--active, .working-info__btn--active, .magazine-chip--selected {
    color: white;
    background: linear-gradient(to bottom, var(--color-orange), var(--color-reddish), var(--color-purpleish));
    border: none;
}

.model-infos__box-info {
    margin-top: 10px;
    padding: 50px;
    color: var(--color-brownish);
}

.model-infos__box-title {
    font-size: 1.7rem;
    color: var(--color-reddish);
    margin-bottom: 20px;
    text-align: left;
}

.model-whats-included {
    display: flex;
    justify-items: flex-start;
    gap: 50px;
    margin-top: 70px;
}

.model-whats-included__left {
    min-width: 320px;
}

.model-whats-included__title {
    text-align: left;
    font-size: 2.5rem;
    line-height: 2.5rem;
    color: var(--color-brown-light);
}

.model-whats-included__right {
    width: 100%;
}

.model-whats-included__box-title {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 2rem;
    text-transform: uppercase;
}

.model-whats-included__box {
    padding: 20px;
    border-radius: 15px;
    background-color: var(--color-sand);
    color: var(--color-brownish);
    margin-bottom: 15px;
}

.model-whats-included__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.model-whats-included__box-chevron {
    width: 25px;
    transition: transform 0.3s ease-in-out;
    flex-shrink: 0;
}

.model-whats-included__box--open .model-whats-included__box-chevron {
    transform: rotate(180deg);
}

.model-whats-included__box-description {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out;
}

.model-whats-included__box--open .model-whats-included__box-description {
    max-height: 800px;
}

/* Solo nella pagina viaggio: le FAQ oltre le prime quattro restano nascoste finché non si preme
   "Mostra tutte le FAQ" (le altre pagine che riusano il blocco non mettono queste classi) */
.model-whats-included__box--collapsed {
    display: none;
}

.model-whats-included__right--all-faqs .model-whats-included__box--collapsed {
    display: block;
}

.model-faqs__show-all {
    margin: 16px auto 0 auto;
    width: 100%;
    max-width: initial;
}

/* Una volta scoperte tutte le FAQ il JS nasconde il pulsante: il display: flex di .btn
   vincerebbe sul [hidden] dell'user agent */
.model-faqs__show-all[hidden] {
    display: none;
}

.model-whats-included__arrow {
    width: 250px;
    float: right;
    transform: rotate(10deg);
    margin-right: -20px;
}

.model-extras {
    margin-top: 80px;
    padding: 80px 0;
    color: var(--color-brownish);
}

.model-extras__subtitle {
    text-align: center;
    font-size: 1.1rem;
    font-family: "DMSans-Bold", sans-serif;
    max-width: 600px;
    margin: 16px auto;
}

.model-extras__general-description {
    margin: auto;
    max-width: 800px;
    text-align: center;
}

.model-extras__box {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 15px;
    padding: 15px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 400px;
    width: 280px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

.model-extras__box-container {
    background-color: white;
    border-radius: 12px;
    padding: 15px;
}

.model-extras__box--giftcard {
    background-image: url("../img/headers/giftcard-head-6wlX0yj.webp");
}

.model-extras__price {
    font-family: "DMSans-Bold", sans-serif;
    color: white;
    background: var(--color-purpleish);
    border-radius: 100px;
    padding: 5px 15px;
    display: inline-block;
}

.model-extras__title {
    margin-top: 10px;
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 1.6rem;
    text-transform: uppercase;
    height: 75px;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

/* La modale dell'attività ripete il titolo della card e ne mostra la descrizione */
.extra-modal__body {
    display: flex;
    gap: 20px;
}

.extra-modal__image {
    width: 200px;
    min-width: 200px;
    align-self: stretch;
    border-radius: 10px;
    background-size: cover;
    background-position: center;
}

.extra-modal__title {
    font-size: 1.8rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    color: var(--color-brownish);
    margin-bottom: 12px;
    padding-right: 24px;
}

.extra-modal__text {
    color: var(--color-brownish);
    line-height: 1.6;
}

.model-extras__boxes {
    margin-top: 40px;
}

/* Le card degli extra sono poche: quando non riempiono il track restano allineate a sinistra,
   quindi le centriamo come blocco. `safe` fa ricadere su start quando invece traboccano:
   senza, le prime slide finirebbero fuori dal track, clippate e irraggiungibili. */
.model-extras__boxes .splide__list {
    justify-content: safe center;
}

.groups-rows__month-separator {
    text-align: center;
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 2rem;
    color: var(--color-brownish);
    text-transform: uppercase;
    margin-top: 30px;
}

/* Le partenze oltre l'anteprima: già nel DOM (le legge anche chi indicizza la pagina),
   nascoste finché il pulsante "Mostra tutte le partenze" non toglie la classe */
.groups-rows__collapsed {
    display: none;
}

.groups-rows__show-all {
    margin: 30px auto 0 auto;
}

.box-group__row-calendar {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    font-family: "DMSans-Bold", sans-serif;
    margin-bottom: 10px;
}

.box-group__icon-calendar {
    height: 18px;
}

.localguide-box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.localguide-box__image {
    height: 40px;
    width: 40px;
    border-radius: 50%;
    background-position: center;
    background-size: cover;
    border: solid 1px white;
}

.localguide-box__subtitle {
    font-size: 0.8rem;
}

.localguide-box__name {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 0.9rem;
}

.box-group__dates {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
}

.box-group__date-weekday {
    font-size: 0.9rem;
}

.box-group__date-arrow {
    width: 20px;
}

.group-status {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    font-family: "DMSans-Bold", sans-serif;
    font-size: 0.9rem;
    /* Un click sullo stato apre la legenda: l'area cliccabile resta quella dell'etichetta */
    width: fit-content;
    cursor: pointer;
    transition: transform .2s ease-in-out, opacity .2s ease-in-out;
    /* Ancorato a sinistra, altrimenti crescendo si sposterebbe rispetto al resto della colonna */
    transform-origin: left center;
}

.group-status:hover {
    transform: scale(1.05);
    opacity: 0.75;
}

.group-status__status--unconfirmed {
    color: #29B1E2;
}
.group-status__status--almost_confirmed {
    color: #F4A301;
}
.group-status__status--confirmed {
    color: #9eb318;
}
.group-status__status--confirmed_last_seats {
    color: #D81433;
}

.group-status__icon-status {
    height: 25px;
}

.model-reviews {
    width: 100%;
    margin-top: 50px;
    padding: 80px 0;
    background-color: #00B87A;
    color: white;
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
}

.model-reviews__title {
    color: white;
}

.model-dirtbag {
    margin-top: -40px;
    background-color: var(--color-brownish);
    color: var(--color-sand);
    mask-image: url("../img/masks/paper-large-2-mask-ju-sgqn.svg");
    mask-size: contain;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-2-mask-ju-sgqn.svg");
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    padding: 80px 0;
}

.model-dirtbag__logo {
    display: block;
    margin: auto;
    height: 190px;
}

.model-dirtbag__logo-fly-second {
    height: 90px;
    position: absolute;
    left: calc(50% - 100px);
    margin-top: 100px;
    animation: fly-move 6.3s ease-in-out infinite alternate,
    fly-rotate 3.7s ease-in-out infinite alternate;
    animation-delay: -2.1s, -1.4s;
}

.model-dirtbag__logo-fly {
    height: 70px;
    position: absolute;
    left: calc(50% + 130px);
    animation: fly-move 6.3s ease-in-out infinite alternate,
               fly-rotate 3.7s ease-in-out infinite alternate;
}

@keyframes fly-move {
    0%   { translate: 0 -5px; }
    25%  { translate: 13px -20px; }
    50%  { translate: -7px -28px; }
    75%  { translate: 17px -14px; }
    100% { translate: -5px -22px; }
}

@keyframes fly-rotate {
    from { rotate: -8deg; }
    to   { rotate: 8deg; }
}

.model-dirtbag__subtext {
    font-family: "DMSans-Bold", sans-serif;
    text-align: center;
    margin-top: 5px;
    font-size: 1.1rem;
}

.model-dirtbag__slide-container {
    width: 100%;
    display: flex;
    justify-content: center;
}

.model-dirtbag__slide {
    display: flex;
    align-items: center;
    gap: 100px;
    width: 100%;
    max-width: 1024px;
}

.model-dirtbag__carousel .splide__pagination {
    position: relative;
    margin-top: 30px;
}

.model-dirtbag__carousel .splide__pagination__page {
    background-color: var(--color-orange-lighter);
}

.model-dirtbag__carousel .splide__pagination__page.is-active {
    background-color: var(--color-orange-lighter);
    opacity: 1;
}

.model-dirtbag__carousel .splide__arrow {
    background-color: var(--color-orange-lighter);
    opacity: 1;
}

.model-dirtbag__carousel .splide__arrow--prev {
    left: 40px;
}

.model-dirtbag__carousel .splide__arrow--next {
    right: 40px;
}

.model-dirtbag__carousel .splide__arrow svg {
    fill: white;
}

.model-dirtbag__carousel {
    margin-top: 50px;
}

.model-dirtbag__slide-image {
    height: 300px;
    min-width: 300px;
    border-radius: 15px;
    background-color: rgba(0, 0, 0, 0.1);
    background-size: cover;
    background-position: center;
}

.model-dirtbag__slide-title {
    font-size: 2rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-orange-lighter);
    text-transform: uppercase;
}

.model-night {
    margin-top: -50px;
    padding: 100px 0;
    background-image: url("../img/backgrounds/brown-dark-Vu6RNY3.webp");
}

.model-night__video {
    min-width: 512px;
    aspect-ratio: 1;
    border-radius: 15px;
    overflow: hidden;
    margin: auto;
    display: block;
}

.model-night__inner {
    display: flex;
    align-items: center;
    gap: 50px;
}

.model-night__inner > div {
    flex: 1;
}

.model-night__image {
    border-radius: 16px;
    width: 90%;
    margin: 0 auto;
}

.model-night__right {
    text-align: center;
}

.model-night__text {
    color: white;
}

.model-night__title {
    text-align: center;
    margin-bottom: 10px;
    color: white;
}

.model-docus {
    margin-top: -40px;
    padding: 80px 0;
    background-image: url("../img/backgrounds/brown-light-qsOHf24.webp");
    mask-image: url("../img/masks/paper-large-2-mask-ju-sgqn.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-2-mask-ju-sgqn.svg");
    -webkit-mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.model-docus__title {
    color: var(--color-brownish);
}

.model-docus__episode {
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 370px;
    padding-bottom: 10px;
    color: var(--color-brownish);
}

.model-docus__episode-image {
    height: 200px;
    border-radius: 15px;
    background-size: cover;
    background-position: center;
}

.model-docus__episode-title {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 2rem;
    color: var(--color-brownish);
    text-transform: uppercase;
}

.model-docus__carousel .splide__arrow {
    background-color: var(--color-brownish);
    opacity: 1;
}

.model-docus__carousel .splide__arrow svg {
    fill: white;
}

.model-docus__carousel .splide__arrow--prev {
    left: 40px;
}

.model-docus__carousel .splide__arrow--next {
    right: 40px;
}

.model-docus__carousel .splide__pagination {
    position: relative;
    margin-top: 30px;
}

.model-docus__carousel .splide__pagination__page {
    background-color: var(--color-brownish);
}

.model-docus__carousel .splide__pagination__page.is-active {
    background-color: var(--color-brownish);
    opacity: 1;
}

.model-docus__carousel {
    margin-top: 30px;
}

/* Stessa centratura di .model-extras__boxes: `safe` ricade su start quando le card traboccano */
.model-docus__carousel .splide__list {
    justify-content: safe center;
}

.model-docus__episode-btn {
    width: fit-content;
    border-color: var(--color-brownish);
    color: var(--color-brownish);
    max-width: initial;
}

.model-guide {
    background-image: url("../img/backgrounds/brown-dark-Vu6RNY3.webp");
    color: var(--color-sand);
    padding: 90px 0;
    margin-top: -40px;
}

.model-guide__inner {
    display: flex;
    gap: 50px;
}

.model-guide__inner > div {
    flex: 1;
}

.model-guide__title {
    text-align: left;
    color: var(--color-sand);
    max-width: initial;
}

.model-guide__subtitle {
    font-size: 1.1rem;
    font-family: "DMSans-Bold", sans-serif;
    margin-top: 10px;
    margin-bottom: 20px;
}

.model-guide__image {
    width: 500px;
    height: auto;
    display: block;
    margin: auto;
}

.model-correlated {
    padding: 100px 0;
    margin-top: -40px;
    margin-bottom: -40px;
    mask-image: url("../img/masks/paper-large-2-mask-ju-sgqn.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-2-mask-ju-sgqn.svg");
    -webkit-mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.model-correlated__title {
    margin-bottom: 30px;
}

/* Come per .model-extras__boxes: centra il blocco di card quando non riempiono il track,
   `safe` ricade su start quando invece traboccano, per non clipparle fuori schermo. */
.model-correlated__carousel .splide__list {
    justify-content: safe center;
}

.model-washer {
    padding: 80px 0 120px 0;
    color: white;
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/washing-machine-w2Dh5mM.webp");
    mask-image: url("../img/masks/paper-narrow-2-mask-O3YwXvB.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-narrow-2-mask-O3YwXvB.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.model-washer__inner {
    display: flex;
    align-items: center;
    max-width: 1200px;
    gap: 80px;
}

.model-washer__inner > div {
    flex: 1;
}

.model-washer__title {
    font-size: 2.3rem;
    line-height: 2.3rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    min-width: 400px;
}

.model-washer__description {
    font-family: "DMSans-Bold", sans-serif;
    margin-bottom: 20px;
}

.btn--travel-group-heart {
    width: 42px;
    padding: 0;
    border-color: var(--color-reddish);
}

.box-group__icon-heart {
    height: 20px;
}

.header__profile {
    position: relative;
    cursor: pointer;
}

.header__profile-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 12px);
    right: 0;
    flex-direction: column;
    min-width: 160px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
    overflow: hidden;
    z-index: 100;
}

.header__profile-dropdown--open {
    display: flex;
}

.header__profile-dropdown-item {
    padding: 12px 18px;
    font-family: "DMSans-Regular", sans-serif;
    font-size: 0.9rem;
    color: var(--color-brownish);
    text-decoration: none;
    transition: background 0.15s ease;
}

.header__profile-dropdown-item:hover {
    background: #f5f1ec;
}

.box__generic-title-section {
    font-family: "DMSans-Bold", sans-serif;
    margin-bottom: 5px;
}

@keyframes communication-overlay-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes communication-modal-in {
    from { opacity: 0; transform: translateY(12px) scale(0.97); }
    to   { opacity: 1; transform: translateY(0)    scale(1); }
}

.communication-modal-overlay,
.gift-card-modal-overlay,
.auth-modal-overlay,
.review-modal-overlay,
.itinerary-modal-overlay,
.itinerary-pdf-modal-overlay,
.newsletter-modal-overlay,
.favourite-group-modal-overlay,
.extra-modal-overlay,
.cs-modal-overlay,
.group-status-legend-overlay,
.groups-calendar-overlay {
    position: fixed;
    inset: 0;
    background-color: rgba(87, 65, 65, 0.5);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    box-sizing: border-box;
    animation: communication-overlay-in 0.4s ease;
}

.communication-modal-overlay[hidden],
.gift-card-modal-overlay[hidden],
.auth-modal-overlay[hidden],
.review-modal-overlay[hidden],
.itinerary-modal-overlay[hidden],
.itinerary-pdf-modal-overlay[hidden],
.newsletter-modal-overlay[hidden],
.favourite-group-modal-overlay[hidden],
.extra-modal-overlay[hidden],
.cs-modal-overlay[hidden],
.group-status-legend-overlay[hidden],
.groups-calendar-overlay[hidden] {
    display: none;
}

.communication-modal,
.gift-card-modal,
.auth-modal,
.review-modal,
.itinerary-modal,
.itinerary-pdf-modal,
.newsletter-modal,
.favourite-group-modal,
.extra-modal,
.cs-modal,
.group-status-legend,
.groups-calendar-modal {
    background-color: #fff;
    border-radius: 14px;
    padding: 30px;
    max-width: 560px;
    width: 100%;
    position: relative;
    max-height: 80vh;
    overflow-y: auto;
    animation: communication-modal-in 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* +100px sul max-width condiviso dalle altre modali, per fare spazio all'immagine a sinistra */
.extra-modal {
    max-width: 660px;
}

.communication-modal__close,
.gift-card-modal__close,
.auth-modal__close,
.review-modal__close,
.itinerary-modal__close,
.itinerary-pdf-modal__close,
.newsletter-modal__close,
.favourite-group-modal__close,
.extra-modal__close,
.cs-modal__close,
.group-status-legend__close,
.groups-calendar-modal__close {
    position: absolute;
    top: 14px;
    right: 16px;
    background: none;
    border: none;
    font-size: 1.1rem;
    cursor: pointer;
    color: var(--color-brownish);
    opacity: 0.6;
    line-height: 1;
}

.communication-modal__close:hover,
.gift-card-modal__close:hover,
.auth-modal__close:hover,
.review-modal__close:hover,
.itinerary-modal__close:hover,
.itinerary-pdf-modal__close:hover,
.newsletter-modal__close:hover,
.favourite-group-modal__close:hover,
.extra-modal__close:hover,
.cs-modal__close:hover,
.group-status-legend__close:hover,
.groups-calendar-modal__close:hover {
    opacity: 1;
}

.communication-modal__title,
.gift-card-modal__title,
.auth-modal__title,
.review-modal__title,
.itinerary-pdf-modal__title,
.newsletter-modal__title,
.favourite-group-modal__title,
.cs-modal__title,
.group-status-legend__title,
.groups-calendar-modal__title {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.15rem;
    color: var(--color-brownish);
    margin-bottom: 16px;
    padding-right: 24px;
}

/* Il calendario si scosta dalla modale condivisa: due mesi affiancati non stanno nei 560px,
   e il titolo prende il carattere dei titoli di sezione invece di quello delle altre modali */
.groups-calendar-modal {
    max-width: 1100px;
    padding: 36px 44px;
}

.groups-calendar-modal__title {
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    font-size: 2rem;
    margin-bottom: 2px;
}

.groups-calendar-modal__subtitle {
    color: var(--color-brown-light);
    font-size: 0.9rem;
    margin-bottom: 28px;
}

.communication-modal__body,
.gift-card-modal__body,
.itinerary-pdf-modal__body,
.newsletter-modal__body,
.favourite-group-modal__body,
.auth-modal__body {
    color: var(--color-brownish);
    white-space: pre-wrap;
    line-height: 1.6;
}

.gift-card-modal__body,
.itinerary-pdf-modal__body,
.newsletter-modal__body,
.favourite-group-modal__body,
.auth-modal__body {
    white-space: normal;
}

.gift-card-modal__actions,
.auth-modal__actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

/* La legenda vive in fondo al layout, quindi nel DOM precede le modali delle singole pagine:
   a parità di z-index resterebbe sotto a chi la apre (es. il calendario delle partenze) */
.group-status-legend-overlay {
    z-index: 1100;
}

.group-status-legend__row {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 0;
    border-top: solid 1px rgba(87, 65, 65, 0.15);
}

/* Ogni riga riusa il componente dello stato, che nel suo contesto normale sta sotto le date ed è
   cliccabile: qui è solo la voce di legenda, quindi niente cursore né hover */
.group-status-legend__row .group-status {
    margin-top: 0;
    min-width: 160px;
    cursor: default;
}

.group-status-legend__row .group-status:hover {
    transform: none;
    opacity: 1;
}

.group-status-legend__description {
    color: var(--color-brownish);
    font-size: 0.9rem;
    line-height: 1.5;
}

.gift-card-thankyou {
    max-width: 560px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 100px;
}

.checkbox-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.section-contact .checkbox-row {
    align-items: flex-start;
}

.gift-cards-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 20px;
}

.gift-card {
    color: var(--color-brownish);
    font-family: "DMSans-Bold", sans-serif;
}

.gift-card__amount {
    font-size: 3rem;
    font-family: "BarlowCondensed-Black", sans-serif;
}

.terms-and-conditions__versions-title {
    font-size: 1.2rem;
    font-family: "DMSans-Bold", sans-serif;
    margin: 50px auto 10px auto;
}

.terms-and-conditions__version-link {
    color: var(--color-reddish);
    text-decoration: underline;
    display: block;
    margin-bottom: 5px;
}

.terms-and-conditions__version-date {
    margin-top: 10px;
    opacity: 0.5;
}

.group-page__title {
    margin-top: 32px;
}

.group-page__subtitle {
    color: var(--color-brownish);
    font-family: "DMSans-Bold", sans-serif;
    text-align: center;
    margin-top: 16px;
    font-size: 1.1rem;
}

/* Lo scale su hover/attivo dei calendari sborda dal track, che lo taglierebbe: come per
   .model-itinerary, il track lascia sbordare e il viewport ritaglia il solo asse orizzontale */
.group-page__calendars-viewport {
    overflow-x: clip;
}

.group-page__calendars {
    margin: 32px 0 64px 0;
}

.group-page__calendars .splide__track {
    overflow: visible;
    padding: 16px 0;
}

.group-page__calendars .splide__arrow {
    background-color: var(--color-brownish);
    opacity: 1;
}

.group-page__calendars .splide__arrow:disabled {
    opacity: 0.3;
}

.group-page__calendars .splide__arrow svg {
    fill: white;
}

.group-page__month {
    cursor: pointer;
}

.group-page__month-calendar {
    transition: transform .2s ease-in-out;
    background-size: contain;
    background-position: center;
    background-image: url("../img/calendar-illustration-lDGsAR7.webp");
    background-repeat: no-repeat;
    margin: auto;
    height: 130px;
    width: 110px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    padding-top: 16px;
    font-size: 2rem;
    transform: rotate(-4deg);
}

.group-page__month:nth-child(odd) .group-page__month-calendar {
    transform: rotate(4deg);
}

.group-page__month:hover .group-page__month-calendar {
    transform: rotate(0) scale(1.2);
}

.group-page__month-label {
    color: var(--color-brownish);
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    text-align: center;
    font-size: 1.3rem;
    width: 150px;
    padding: 4px 8px;
    border-radius: 4px;
}

.group-page__month-active .group-page__month-label {
    color: var(--color-sand);
    background: var(--color-brownish);
}

.group-page__month-active .group-page__month-calendar.group-page__month-calendar {
    transform: rotate(0) scale(1.2);
}

.group-page__loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    padding: 60px 0;
    color: var(--color-brownish);
    font-family: "DMSans-Bold", sans-serif;
}

.group-page__loading.hidden {
    display: none;
}

.group-page__loading-spinner {
    width: 40px;
    height: 40px;
    border: 4px solid rgba(0, 0, 0, 0.1);
    border-top-color: var(--color-reddish);
    border-radius: 50%;
    animation: group-page-loading-spin 0.8s linear infinite;
}

@keyframes group-page-loading-spin {
    to { transform: rotate(360deg); }
}

.group-page__message {
    padding: 60px 0;
    text-align: center;
    color: var(--color-brownish);
    font-family: "DMSans-Bold", sans-serif;
}

.group-page__load-more {
    display: flex;
    justify-content: center;
    margin: 40px 0;
}

.handmade {
    display: flex;
    align-items: center;
    gap: 32px;
    color: var(--color-brownish);
}

.handmade > div {
    flex: 1;
    text-align: center;
}

.handmade__title {
    font-size: 3.4rem;
    line-height: 3.5rem;
    color: var(--color-yellowish);
    text-transform: uppercase;
    font-family: "BarlowCondensed-Black", sans-serif;
}

.handmade__subtitle {
    font-family: "DMSans-Bold", sans-serif;
    margin: 8px auto;
    font-size: 1.1rem;
}

.handmade__btn {
    width: fit-content;
    margin: 16px auto;
}

.handmade__image {
    width: 90%;
}

.home-safari {
    margin-top: 60px;
    padding: 80px 0;
    background-image: url("../img/backgrounds/brown-light-qsOHf24.webp");
    background-size: cover;
    background-position: center;
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    color: var(--color-brownish);
}

.home-safari__columns {
    display: flex;
    align-items: center;
    gap: 32px;
}

.home-safari__columns > div {
    flex: 1;
}

.home-safari__image {
    width: 100%;
}

.home-safari__btn {
    color: var(--color-sand);
    margin-top: 16px;
    background: linear-gradient(to bottom, var(--color-brownish), var(--color-brown-light));
    width: fit-content;
    max-width: initial;
}

.partners {
    padding: 90px 0 120px 0;
    margin-top: -50px;
    margin-bottom: -70px;
    background-image: url("../img/backgrounds/hero-model-vacation-sib5rZX.webp");
    background-size: cover;
    background-position: center;
    mask-image: url("../img/masks/paper-narrow-mask-XmREgD2.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-narrow-mask-XmREgD2.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    color: white;
}

.partners__title {
    color: white;
}

.partners__brands {
    margin-top: 32px;
}

/* Slide a larghezza libera: i loghi hanno proporzioni diverse, l'altezza fissa tiene la riga ferma.
   La distanza fra i loghi è il margin-right qui sotto e non l'opzione `gap` di Splide, così cambia
   nelle media query: Splide rilegge il margine calcolato, quindi lo scorrimento resta corretto */
.partners__brand {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    margin-right: 120px;
}

.partners__logo {
    max-height: 35px;
    max-width: 150px;
}

.trustpilot-band {
    padding: 80px 0 100px 0;
    margin-top: -50px;
    margin-bottom: -100px;
    background-size: cover;
    background-position: center;
    background-color: var(--color-purpleish);
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.trustpilot-band__title {
    color: white;
    margin-bottom: 32px;
}

.trustpilot-band__row .splide__arrow {
    background-color: white;
    opacity: 1;
}

/* L'opacity qui sopra coprirebbe quella di splide sulla freccia a fine corsa */
.trustpilot-band__row .splide__arrow:disabled {
    opacity: 0.3;
}

.trustpilot-band__row .splide__arrow svg {
    fill: var(--color-purpleish);
}

.trustpilot-band__row .splide__arrow--prev {
    left: 15px;
}

.trustpilot-band__row .splide__arrow--next {
    right: 15px;
}

.trustpilot-box {
    background: white;
    border-radius: 8px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
    width: 300px;
    min-width: 300px;
    min-height: 220px;
}

.trustpilot-box:first-child {
    justify-content: center;
}

.trustpilot-box__rating-days {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.trustpilot-box__rating {
    height: 20px;
}

.trustpilot-box__days {
    font-size: 0.9rem;
    opacity: 0.6;
}

.trustpilot-box__title {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.1rem;
}

.trustpilot-box__review {
    font-size: 0.9rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}

.trustpilot-box__read-more {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 0.9rem;
    color: var(--color-purpleish);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    text-decoration: underline;
    align-self: flex-end;
    margin-top: -6px;
}

.trustpilot-box__reviewer {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 0.9rem;
}

.review-modal__text {
    color: var(--color-brownish);
}

.review-modal__reviewer {
    font-family: "DMSans-Bold", sans-serif;
    color: var(--color-brownish);
    margin-top: 16px;
}

/* La modale della tappa ripete l'intestazione della card: giorno, titolo, testo */
.itinerary-modal__day {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.1rem;
    color: var(--color-brownish);
    padding-right: 24px;
}

.itinerary-modal__title {
    font-size: 1.8rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    color: var(--color-brownish);
    margin-bottom: 12px;
}

.itinerary-modal__text {
    color: var(--color-brownish);
    line-height: 1.6;
}

/* Le altre modali sono di sola lettura: questa è la sola con un form, quindi si dà
   la spaziatura tra i campi che altrove nel sito fanno i <br> del checkout */
.itinerary-pdf-modal__form,
.newsletter-modal__form,
.favourite-group-modal__form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 20px;
}

.itinerary-pdf-modal__consents,
.newsletter-modal__consents,
.favourite-group-modal__consents {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Come nel form contatti: i consensi hanno label lunghe che vanno a capo, quindi la
   casella si allinea in alto alla prima riga invece di centrarsi su tutte */
.itinerary-pdf-modal__consents .checkbox-row,
.newsletter-modal__consents .checkbox-row,
.favourite-group-modal__consents .checkbox-row {
    align-items: flex-start;
}

.itinerary-pdf-modal__actions,
.newsletter-modal__actions,
.favourite-group-modal__actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.trustpilot-box__main-rating {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.3rem;
    text-align: center;
    width: 100%;
    padding-top: 15px;
}

.trustpilot-box__main-stars {
    width: 75%;
    margin: 16px auto;
}

.trustpilot-box__main-text {
    width: 100%;
    text-align: center;
}
.trustpilot-box__main-text a {
    text-decoration: underline;
    font-family: "DMSans-Bold", sans-serif;
}

.trustpilot-box__main-attribution {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    gap: 8px;
}

.trustpilot-box__main-logo {
    height: 20px;
    margin-top: -3px;
}

.section-contact {
    background-size: cover;
    background-position: center;
    background-color: var(--color-sand);
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    margin-top: 80px;
    padding: 90px 0;
}

.section-contact__inner {
    display: flex;
    gap: 32px;
    align-items: center;
}

.section-contact__inner > div {
    flex: 1;
}

.section-contact__image {
    width: 90%;
}

.section-contact__other-title {
    margin: 50px 0 8px;
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 2.2rem;
    text-transform: uppercase;
    color: var(--color-brown-light);
}

.section-contact__other-description {
    color: var(--color-brownish);
    font-family: "DMSans-Bold", sans-serif;
    margin-bottom: 16px;
}

.section-contact__other-btn {
    background-color: var(--color-brown-light);
    color: var(--color-sand);
}

.section-contact__other-btn img {
    height: 20px;
}

.section-contact__thanks {
    color: var(--color-brownish);
}

.section-contact__thanks b {
    font-size: 2rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
}

/* Tema SweetAlert2 allineato al design system (font Barlow/DM Sans, colori brand).
   Sta qui e non in checkout.css perché le modali servono a tutte le aree del sito. */
.swal2-popup {
    font-family: "DMSans-Regular", sans-serif;
    border-radius: 10px;
    color: var(--color-brownish);
}

/* Default swal2-container z-index (1060) sits below the checkout's fixed mobile cart
   elements (up to 10002) and its expiry modal (10010); a site-wide alert must always
   win over any of them. */
.swal2-container {
    z-index: 10020;
}

.swal2-title {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-weight: normal;
    text-transform: uppercase;
    color: var(--color-brownish);
}

.swal2-html-container {
    color: var(--color-brownish);
    white-space: pre-line;
}

.swal2-actions .swal2-confirm.swal2-styled {
    font-family: "DMSans-Bold", sans-serif;
    background-color: var(--color-brownish);
    color: var(--color-sand);
    border-radius: 8px;
    padding: 8px 25px;
}

.swal2-actions .swal2-confirm.swal2-styled:focus {
    box-shadow: none;
}

/* Animazione moderna (fade + slide) al posto del bounce di default di SweetAlert2. */
@keyframes swal2-modern-show {
    from { opacity: 0; transform: translateY(16px) scale(0.98); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes swal2-modern-hide {
    from { opacity: 1; transform: translateY(0) scale(1); }
    to { opacity: 0; transform: translateY(8px) scale(0.98); }
}

.swal2-show--modern {
    animation: swal2-modern-show 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.swal2-hide--modern {
    animation: swal2-modern-hide 0.15s ease-in forwards;
}

.next-departures__dirt {
    height: 250px;
    position: absolute;
    left: 50%;
    margin-top: -80px;
    margin-left: -400px;
    z-index: -1;
}

.next-departures__title {
    color: var(--color-yellowish);
    font-size: 4.5rem;
    line-height: 4.5rem;
    max-width: 600px;
}

/* I caroselli dei viaggi non sono infiniti: quando le slide non riempiono il track restano
   allineate a sinistra e il vuoto si accumula tutto a destra, quindi le centriamo come blocco.
   `safe` fa ricadere su start quando invece traboccano: senza, le prime slide finirebbero
   fuori dal track, clippate e irraggiungibili. */
.continents__models .splide__list,
.experiences__models .splide__list,
.models-carousel .splide__list {
    justify-content: safe center;
}

/* Senza il loop le frecce si disabilitano da sole a fine corsa (o subito, se le slide ci stanno
   tutte): vanno nascoste, perché la regola qui sotto le terrebbe opache come se fossero attive. */
.continents__models .splide__arrow:disabled,
.experiences__models .splide__arrow:disabled,
.models-carousel .splide__arrow:disabled {
    visibility: hidden;
}

.continents__models .splide__arrow,
.experiences__models .splide__arrow {
    background-color: white;
    opacity: 1;
}

.continents__models .splide__arrow svg,
.experiences__models .splide__arrow svg {
    fill: var(--color-reddish);
}

.continents__models .splide__arrow--prev,
.experiences__models .splide__arrow--prev {
    left: 40px;
}

.continents__models .splide__arrow--next,
.experiences__models .splide__arrow--next {
    right: 40px;
}

.other-continents,
.other-experiences {
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/paper-large-AdGU2-o.webp");
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    margin-top: 80px;
    margin-bottom: -60px;
    padding: 100px 0;
}

.other-continents__grid,
.other-experiences__grid {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 32px;
}

.other-continents__box,
.other-experiences__box {
    padding: 32px;
    text-align: center;
    width: 30%;
    aspect-ratio: 4 / 3;
    background-color: var(--color-brownish);
    background-size: cover;
    background-position: center;
    mask-image: url("../img/masks/continent-mask-0UlLwDS.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/continent-mask-0UlLwDS.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 2.5rem;
    color: white;
    text-transform: uppercase;
    position: relative;
    /* Makes the box a stacking context, so the overlay below stays inside it */
    isolation: isolate;
}

/* Darkens the photo to keep the label readable: z-index -1 paints it over the
   background but under the text, which would otherwise end up beneath it */
.other-continents__box::before,
.other-experiences__box::before {
    content: "";
    position: absolute;
    inset: 0;
    background-color: rgb(87 65 65 / 0.5);
    z-index: -1;
}

.continents__explore-btn,
.experiences__explore-btn {
    border-color: var(--color-reddish);
    color: var(--color-reddish);
    background: none;
    min-width: initial;
    max-width: initial;
    width: fit-content;
    margin: 32px auto 128px auto;
}

.about-founders {
    padding: 80px 0;
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/brown-light-qsOHf24.webp");
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    color: var(--color-brownish);
}

.about-founders__columns {
    display: flex;
    align-items: center;
    gap: 32px;
}

.about-founders__columns > div {
    flex: 1;
}

.about-founders__image {
    width: 90%;
}

.about-founders__name {
    color: white;
    font-size: 2.4rem;
    text-align: left;
}

.about-founders__name-description {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.1rem;
    margin: 4px 0 8px 0;
}

.about-founders__title {
    color: white;
}

.about-founders__rows {
    display: flex;
    flex-direction: column;
    gap: 64px;
}

.about-timeline {
    margin-top: 60px;
    /* La riga tratteggiata si posiziona sul centro dello slot dell'icona: le misure stanno qui una
       volta sola, così restano allineate senza ripetere i numeri nelle regole sotto */
    --timeline-icon-height: 70px;
    --timeline-icon-height-selected: 130px;
    --timeline-row-padding: 24px;
}

/* Le jeep della pagina "come funziona" vogliono una tappa selezionata più grande delle banane: basta
   la misura, il resto (slot, riga tratteggiata, larghezza della tappa, margine dell'anno) ne deriva */
.about-timeline--how-work {
    --timeline-icon-height-selected: 170px;
}

.about-timeline__title {
    font-size: 4rem;
    line-height: 4rem;
    color: var(--color-yellowish);
    max-width: 700px;
}

.about-timeline__steps .splide__track {
    padding: var(--timeline-row-padding) 0;
}

/* La riga tratteggiata sta sul track, che non trasla: sulla lista scorrerebbe col carosello e agli
   estremi il suo inizio/fine arriverebbe al centro, lasciando mezza riga scoperta */
.about-timeline__steps .splide__track::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: calc(var(--timeline-row-padding) + var(--timeline-icon-height-selected) / 2);
    border-top: 2px dashed var(--color-brown-light);
}

.about-timeline__steps .splide__arrow {
    background-color: var(--color-brownish);
    opacity: 1;
}

/* L'opacity qui sopra coprirebbe quella di splide sulla freccia a fine corsa */
.about-timeline__steps .splide__arrow:disabled {
    opacity: 0.3;
}

/* Il chevron di splide è un path pieno: per assottigliarlo si rimpicciolisce il glifo, che resta
   dentro al cerchio della freccia (1.2em di default) */
.about-timeline__steps .splide__arrow svg {
    fill: var(--color-yellowish);
    height: 0.9em;
    width: 0.9em;
}

.about-timeline__step {
    cursor: pointer;
    /* Le banane sono quadrate: la tappa è larga quanto l'altezza dell'icona selezionata più un
       margine, altrimenti sarebbe la larghezza a limitarne l'altezza */
    width: calc(var(--timeline-icon-height-selected) + 20px);
    /* Le icone stanno sopra la riga tratteggiata, che è un elemento posizionato */
    position: relative;
    z-index: 1;
}

/* Lo slot tiene l'altezza dell'icona selezionata, così la riga delle tappe non cambia altezza al
   variare della selezione e gli anni restano allineati. Le icone sono centrate: quella selezionata
   cresce nei due versi e sta sulla riga tratteggiata come le altre */
.about-timeline__step-icon-slot {
    height: var(--timeline-icon-height-selected);
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Comanda l'altezza e la larghezza segue le proporzioni: con una larghezza fissa sarebbe il lato
   corto del box a limitare l'icona, che non crescerebbe oltre la larghezza della tappa */
.about-timeline__step-icon {
    display: block;
    height: var(--timeline-icon-height);
    width: auto;
}

/* Icona della tappa selezionata: già nel DOM e nascosta, così al primo click non deve caricarsi */
.about-timeline__step-icon--selected,
.about-timeline__step--active .about-timeline__step-icon--default {
    display: none;
}

.about-timeline__step--active .about-timeline__step-icon--selected {
    display: block;
    height: var(--timeline-icon-height-selected);
}

.about-timeline__step-year {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 1.5rem;
    text-align: center;
    color: var(--color-brownish);
    /* Le icone sono centrate in uno slot alto quanto la selezionata, quindi sotto una banana piccola
       resta metà della differenza fra le due misure: l'anno risale per lasciarne 20px, che è la
       distanza voluta fra banana e anno anche se le due altezze cambiano */
    margin-top: calc(20px - (var(--timeline-icon-height-selected) - var(--timeline-icon-height)) / 2);
    padding: 2px 8px;
    border-radius: 4px;
}

.about-timeline__step--active .about-timeline__step-year {
    color: var(--color-sand);
    background: var(--color-brownish);
}

/* Nella pagina "come funziona" l'etichetta è un numero di passo, non un anno: sta sempre dentro un
   cerchio marrone, e da selezionato i due colori si invertono */
.about-timeline--how-work .about-timeline__step-year {
    width: 44px;
    height: 44px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    /* Il Barlow condensed siede alto nella riga: il padding lo ricentra a occhio nel cerchio */
    padding: 0 0 3px 0;
    color: var(--color-yellowish);
    background: var(--color-brownish);
}

.about-timeline--how-work .about-timeline__step--active .about-timeline__step-year {
    color: var(--color-brownish);
    background: var(--color-yellowish);
}

/* Titolo dentro la tappa, sotto l'etichetta: il nome del passo in "come funziona", quello della
   tappa in "chi siamo" */
.about-timeline__step-title {
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.1rem;
    text-align: center;
    color: var(--color-brownish);
    margin-top: 6px;
}

.about-timeline__contents {
    text-align: center;
    padding-bottom: 100px;
    margin-top: 32px;
}

.about-timeline__content-text {
    color: var(--color-brownish);
    margin-top: 12px;
}

.about-timeline__content h3 {
    color: var(--color-yellowish);
}

/* Variante a due colonne — immagine a sinistra, titolo e testo a destra — della tappa attiva nelle
   timeline di "chi siamo" e "come funziona" */
.about-timeline__content--columns {
    display: flex;
    gap: 32px;
    align-items: flex-start;
    text-align: left;
}

.about-timeline__content--columns.hidden {
    display: none;
}

.about-timeline__content--columns > div {
    flex: 1;
}

.about-timeline__content-image {
    width: 100%;
    display: block;
    mask-image: url("../img/masks/magazine-box-mask-0UlLwDS.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/magazine-box-mask-0UlLwDS.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.about-timeline__content-title {
    font-size: 2.5rem;
    text-align: left;
}

.about-birth {
    padding: 100px 0;
    color: var(--color-brownish);
    margin-bottom: -50px;
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/paper-large-AdGU2-o.webp");
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.about-birth__columns {
    display: flex;
    gap: 32px;
    align-items: center;
}

.about-birth__columns > div {
    flex: 1;
}

.about-birth__image {
    width: 80%;
    display: block;
    margin: auto;
    border-radius: 16px;
}

.about-birth__title {
    font-size: 4rem;
    line-height: 4rem;
    margin-bottom: 16px;
    max-width: 450px;
}

.about-birth__description {
    text-align: center;
}

.about-tavern {
    padding: 70px 0;
    color: var(--color-brownish);
    margin-bottom: -50px;
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/background-tavern-6CHRLVM.webp");
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.about-tavern__title {
    font-size: 4.4rem;
    line-height: 4.4rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-yellowish);
    text-transform: uppercase;
    text-align: center;
    max-width: 550px;
    margin: 0 auto 16px auto;
}

.about-tavern__columns {
    display: flex;
    gap: 32px;
    align-items: center;
}

.about-tavern__columns > div {
    flex: 1;
    position: relative;
}

.about-tavern__plate {
    height: 200px;
}

.about-tavern__plate--n2 {
    position: absolute;
    margin-left: 250px;
}

.about-tavern__text {
    color: white;
    font-family: "DMSans-Bold", sans-serif;
    text-align: center;
}

.about-tavern__plates {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    gap: 32px;
}

.about-fastfood {
    padding: 120px 0;
    background: black;
    color: white;
}

.about-fastfood__columns {
    display: flex;
    gap: 32px;
    margin-top: 32px;
}

.about-fastfood__column-image {
    height: 150px;
    display: block;
    margin: auto;
}

.about-fastfood__column-title {
    color: var(--color-reddish);
    font-family: "DMSans-Bold", sans-serif;
    text-align: center;
    font-size: 1.2rem;
    margin: 8px 0;
}

.about-fastfood__column-description {
    text-align: center;
    font-size: 0.9rem;
}

.about-team {
    padding: 150px 0;
    color: var(--color-brownish);
    margin-bottom: 64px;
    background-size: cover;
    background-position: center;
    background-image: url("../img/about/team-background-LGRL_4k.webp");
    mask-image: url("../img/masks/paper-narrow-2-mask-O3YwXvB.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-narrow-2-mask-O3YwXvB.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    margin-top: -60px;
}

.about-team__title {
    text-align: center;
    color: white;
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 5rem;
    text-transform: uppercase;
}

.about-team__overtitle {
    color: white;
    font-family: "DMSans-Bold", sans-serif;
    text-align: center;
    font-size: 1.2rem;
}

.about-people {
    margin-bottom: 64px;
}

.about-people__person {
    width: 330px;
    margin-right: 64px;
}

.about-people__image {
    max-height: 300px;
    max-width: 100%;
    display: block;
    margin: auto auto 8px;
}

.about-people__title {
    font-size: 3rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-yellowish);
    text-transform: uppercase;
    margin-bottom: 8px;
}
.about-people__title--localguide {
    color: var(--color-orange-lighter);
}

.about-people__subtitle {
    font-size: 1.1rem;
    font-family: "DMSans-Bold", sans-serif;
    color: var(--color-brownish);
}

.about-people__carousel {
    margin-top: 32px;
}

.about-people__carousel .splide__arrow {
    background-color: var(--color-brownish);
    opacity: 1;
}

/* Come nella timeline: il chevron di splide è un path pieno, per assottigliarlo si rimpicciolisce
   il glifo dentro al cerchio della freccia (1.2em di default) */
.about-people__carousel .splide__arrow svg {
    fill: var(--color-yellowish);
    height: 0.9em;
    width: 0.9em;
}

.about-people__carousel--localguide .splide__arrow svg {
    fill: var(--color-orange-lighter);
}

.about-people__carousel .splide__arrow--prev {
    left: 40px;
}

.about-people__carousel .splide__arrow--next {
    right: 40px;
}

.about-people__name {
    text-align: center;
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    font-size: 2.2rem;
    color: var(--color-brownish);
    margin: auto;
}

.about-people__role {
    font-size: 1.6rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    text-align: center;
    text-transform: uppercase;
    color: var(--color-yellowish);
}
.about-people__role--localguide {
    color: var(--color-orange-lighter);
}

.about-people__text {
    text-align: center;
    margin-top: 4px;
    font-size: 0.9rem;
    color: var(--color-brownish);
}

.become-localguide {
    padding: 80px 0 100px;
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/background-orange-Km84hPZ.webp");
    mask-image: url("../img/masks/paper-narrow-2-mask-O3YwXvB.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-narrow-2-mask-O3YwXvB.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.become-localguide__columns {
    display: flex;
    gap: 32px;
}

.become-localguide__columns > div {
    flex: 1;
}

.become-localguide__title, .discover-philosophy__title {
    color: white;
    font-size: 4rem;
    line-height: 4rem;
    max-width: 400px;
    text-align: center;
}

.become-localguide__text {
    color: white;
    text-align: center;
}

.become-localguide__btn {
    margin: auto;
    margin-top: 32px;
}

.discover-philosophy {
    padding: 80px 0 110px;
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/bananas-background-FHegqJ1.webp");
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    margin-bottom: -50px;
    margin-top: -50px;
}

.discover-philosophy__columns {
    display: flex;
    gap: 32px;
    align-items: center;
}

.discover-philosophy__columns > div {
    flex: 1;
}

.discover-philosophy__image {
    width: 80%;
    display: block;
    margin: auto;
    border-radius: 16px;
}

.discover-philosophy__subtitle {
    font-family: "DMSans-Bold", sans-serif;
    color: var(--color-brownish);
    text-align: center;
    margin: 16px 0;
    font-size: 1.1rem;
}

.discover-philosophy__btn {
    margin: 32px auto 0 auto;
}

.our-belief {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}

.our-belief__step {
    position: relative;
    max-width: 450px;
    margin: -200px 550px 0 0;
}

.our-belief__step:first-child {
    margin-top: 0;
}

.our-belief__step:nth-child(even) {
    margin: -250px 0 0 550px;
}

.our-belief__step-image {
    height: 220px;
    display: block;
    margin: auto;
}

.our-belief__step-number {
    position: absolute;
    margin-top: -100px;
    margin-left: 30px;
    font-size: 3.2rem;
    width: 70px;
    height: 70px;
    background: var(--color-brownish);
    color: var(--color-yellowish);
    font-family: "BarlowCondensed-Black", sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    padding-bottom: 6px;
    /* Gira con lo scroll: il valore lo scrive sulla root il JS della pagina filosofia, e senza JS
       il fallback lascia il numero fermo e dritto */
    transform: rotate(var(--scroll-rotation, 0deg));
}

.our-belief__step-title {
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-yellowish);
    text-transform: uppercase;
    font-size: 3.3rem;
    line-height: 3.3rem;
    text-align: center;
}

.our-belief__step-subtitle {
    color: var(--color-brownish);
    font-family: "DMSans-Bold", sans-serif;
    font-size: 1.1rem;
    text-align: center;
    margin: 8px 0;
}

.our-belief__step-description {
    color: var(--color-brownish);
    text-align: center;
}

.our-belief-outro {
    padding: 80px 0 110px;
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/paper-large-AdGU2-o.webp");
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    margin-top: 80px;
}

.our-belief-outro__columns {
    display: flex;
    gap: 32px;
    justify-content: space-between;
    align-items: center;
    margin-top: 32px;
}

.our-belief-outro__box-image {
    height: 110px;
    display: block;
    margin: auto;
}

.our-belief-outro__box-title {
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-brownish);
    font-size: 2rem;
    text-transform: uppercase;
    text-align: center;
    margin: 8px 0;
}

.our-belief-outro__box {
    max-width: 320px;
}

.our-belief-outro__box-description {
    font-family: "DMSans-Bold", sans-serif;
    color: var(--color-brownish);
    text-align: center;
}

.our-belief-path-1 {
    position: absolute;
    margin-top: -150px;
    margin-left: -160px;
}

.our-belief-path-2 {
    position: absolute;
    right: 0;
    margin-top: -160px;
    margin-right: -100px;
}

.our-belief-path-3 {
    position: absolute;
    margin-top: 10px;
    margin-left: -110px;
    height: 100px;
}

.our-belief-path-4 {
    position: absolute;
    right: 0;
    margin-top: -100px;
    margin-right: -100px;
    height: 200px;
}

.our-belief-path-5 {
    position: absolute;
    margin-top: -70px;
    margin-left: -160px;
}

.our-belief-path-6 {
    position: absolute;
    right: 0;
    margin-top: -90px;
    margin-right: -130px;
    height: 230px;
}

.hard-explain {
    padding: 80px 0;
    text-align: center;
    color: var(--color-brownish);
}

.hard-explain__columns {
    display: flex;
    gap: 32px;
    align-items: center;
}

.hard-explain__columns > div {
    flex: 1;
}

.hard-explain__title {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 4rem;
    line-height: 4rem;
    color: var(--color-yellowish);
    text-transform: uppercase;
    text-align: center;
    max-width: 470px;
    margin: auto;
    display: block;
}

.hard-explain__subtitle {
    font-size: 1.1rem;
    font-family: "DMSans-Bold", sans-serif;
    text-align: center;
    color: var(--color-brownish);
    margin: 16px 0;
}

.hard-explain__image {
    width: 90%;
    margin: auto;
    display: block;
}

.hard-explain__btn {
    margin: 32px auto 0 auto;
    border: solid 2px var(--color-brownish);
    color: var(--color-brownish);
}

.working-info {
    padding: 80px 0;
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/paper-large-AdGU2-o.webp");
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.working-info__title {
    margin-bottom: 32px;
}

.working-info__tab {
    display: flex;
    align-items: flex-start;
    gap: 40px;
    margin-top: 40px;
}

.working-info__tab.hidden {
    display: none;
}

.working-info__tab > div {
    flex: 1;
}

.working-info__tab-image {
    max-width: 100%;
    border-radius: 16px;
}

.working-info__tab-title {
    font-size: 2rem;
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    color: var(--color-reddish);
    margin: 0 0 8px 0;
}

.working-info__tab-text {
    color: var(--color-brownish);
}

.other-contacts {
    display: flex;
    gap: 32px;
    align-items: flex-start;
    margin-bottom: 64px;
}

.other-contacts > div {
    flex: 1;
}

.other-contacts .section-contact__other-title {
    color: var(--color-yellowish);
}

.other-contacts .section-contact__other-title.section-contact__other-title--whatsapp {
    color: #59C139;
}

.section-contact__other-btn--whatsapp {
    background: #59C139;
    color: white;
}

.other-contacts__address {
    color: var(--color-brownish);
    font-family: "DMSans-Bold", sans-serif;
}

.ambassador-if {
    padding: 80px 0;
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/paper-large-AdGU2-o.webp");
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
}

.ambassador-if__columns {
    display: flex;
    gap: 32px;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 32px;
}

.ambassador-if__column {
    max-width: 300px;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.ambassador-if__column-image {
    height: 100px;
}

.ambassador-if__column-title {
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-brownish);
    font-size: 1.7rem;
    line-height: 1.6rem;
    text-align: center;
    text-transform: uppercase;
    margin-top: 4px;
}

.ambassador-role {
    padding: 80px 0;

}

.ambassador-role__columns {
    display: flex;
    gap: 100px;
    align-items: flex-start;
}

.ambassador-role__columns > div {
    flex: 1;
}

.ambassador-role__title, .ambassador-role__title-bis {
    color: var(--color-yellowish);
    font-size: 4.1rem;
    line-height: 4rem;
    margin-bottom: 16px;
}

.ambassador-role__title-bis {
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    font-size: 2.4rem;
}

.ambassador-role__description {
    text-align: center;
    color: var(--color-brownish);
}

.ambassador-role__table-container {
    padding: 16px;
    background: var(--color-sand);
    border-radius: 8px;
    color: var(--color-brown-light);
}

.ambassador-role__table th {
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-brownish);
    text-align: left;
    font-size: 1.3rem;
    text-transform: uppercase;
    padding-bottom: 8px;
}

.ambassador-role__table th:first-child {
    border-right: solid 1px var(--color-brownish);
}

.ambassador-role__table th:last-child, .ambassador-role__table td:last-child {
    padding-left: 16px;
}

.ambassador-role__table td {
    font-family: "DMSans-Bold", sans-serif;
    padding: 4px 0;
}

td.ambassador-role__table-bookings {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 1.4rem;
    width: 130px;
    border-right: solid 1px var(--color-brownish);
}

.ambassador-role__table tr {
    border-bottom: solid 1px var(--color-brownish);
}

.fabric-localguide {
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/background-orange-Km84hPZ.webp");
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    padding: 80px 0;
    color: white;
}

.fabric-localguide__columns {
    display: flex;
    align-items: center;
    gap: 32px;
}

.fabric-localguide__columns > div {
    flex: 1;
}

.fabric-localguide__title {
    font-size: 4.1rem;
    line-height: 4rem;
    color: white;
}

.fabric-localguide__description {
    text-align: center;
    margin: 8px 0 32px 0;
}

.fabric-localguide__btn {
    margin: auto;
}

.fabric-localguide__image {
    width: 90%;
    margin: auto;
    display: block;
    border-radius: 16px;
}

.local-dmc {
    padding: 70px;
    color: var(--color-brownish);
}

.local-dmc__columns {
    display: flex;
    align-items: center;
    gap: 32px;
}

.local-dmc__image {
    width: 90%;
    margin: auto;
    display: block;
    border-radius: 16px;
}

.local-dmc__title {
    font-size: 2.5rem;
    color: var(--color-yellowish);
    margin-bottom: 16px;
    text-align: left;
}

.local-dmc__btn {
    margin-top: 32px;
    border: solid 2px var(--color-brownish);
    color: var(--color-brownish);
    width: fit-content;
}


.lets-chat {
    background-size: cover;
    background-position: center;
    background-image: url("../img/backgrounds/collaboration-chat-with-us-3d6PKzN.webp");
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    padding: 140px 0;
    color: white;
    margin-bottom: -40px;
}

.lets-chat__title {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 4.4rem;
    line-height: 4rem;
    max-width: 500px;
    margin: auto;
    text-transform: uppercase;
    text-align: center;
}

.lets-chat__subtitle {
    max-width: 500px;
    margin: 32px auto 32px auto;
    text-align: center;
}

.lets-chat__btn {
    background: transparent;
    color: white;
    border: solid 3px white;
    width: fit-content;
    margin: auto;
}

.magazine-intro {
    display: flex;
    gap: 32px;
    align-items: flex-start;
    padding: 80px 0;
}

.magazine-intro > div {
    flex: 1;
}

.magazine-intro__title {
    font-size: 3.5rem;
    line-height: 3.5rem;
    color: var(--color-yellowish);
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    max-width: 500px;
}

.magazine-intro__description {
    color: var(--color-brownish);
}

.article-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 64px;
    margin-bottom: 30px;
}

.article-box {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: var(--color-brownish);
}

.article-box:hover .article-box__image {
    transform: rotate(2deg) scale(1.05);
}

.article-box__image, .magazine-article__image {
    transition: transform .2s ease-in-out;
    width: 100%;
    aspect-ratio: 16 / 9;
    mask-image: url("../img/masks/magazine-box-mask-0UlLwDS.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/magazine-box-mask-0UlLwDS.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    background-color: var(--color-brownish);
    background-size: cover;
    background-position: center;
}

.article-box__image--rounded {
    mask-image: none;
    -webkit-mask-image: none;
    border-radius: 8px;
}

.article-box__title {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 1.4rem;
}

.article-box__cta {
    font-family: "DMSans-Bold", sans-serif;
    text-decoration: underline;
}

/* Le chip riprendono i pulsanti di "Un po' di cose pratiche": display e colori arrivano dalle loro regole,
   qui restano solo l'andare a capo e lo spazio dalla griglia */
.magazine-chips {
    flex-wrap: wrap;
    padding-bottom: 48px;
}

.magazine-pagination {
    display: flex;
    justify-content: center;
    gap: 15px;
    padding: 0 0 120px 0;
}

.magazine-pagination__btn {
    width: fit-content;
}

.magazine-empty {
    padding: 40px 0 120px 0;
    text-align: center;
    color: var(--color-brownish);
    font-family: "DMSans-Bold", sans-serif;
}

/* Il titolo di un articolo si legge come l'ha scritto la redazione: l'uppercase degli altri h1 qui no */
.magazine-article__title {
    font-size: 3.2rem;
    line-height: 3.2rem;
    color: var(--color-reddish);
    text-transform: none;
    margin-top: 0;
    padding-bottom: 32px;
}

/* La maschera e le proporzioni arrivano dalla regola del box in griglia: qui l'immagine è larga
   quanto la colonna del testo */
.magazine-article__image {
    margin-bottom: 30px;
}

.magazine-article__body {
    color: var(--color-brownish);
    padding-bottom: 80px;
}

.magazine-article__keep-reading {
    padding-bottom: 120px;
}

.magazine-article__keep-reading h2 {
    text-align: center;
    color: var(--color-yellowish);
    text-transform: uppercase;
    font-size: 3.5rem;
    line-height: 3.5rem;
    padding-bottom: 48px;
}

/* Parte fuori schermo e sale quando la pagina è stata scrollata (classe --visible da JS).
   visibility tiene i suoi bottoni fuori dal giro del tab finché la barra non c'è: si spegne
   solo a fine transizione scendendo, mentre salendo torna subito visibile */
.model-fixed-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: white;
    padding: 16px;
    box-shadow: 0 0 16px rgba(0, 0, 0, 0.1);
    color: var(--color-brownish);
    z-index: 900;
    visibility: hidden;
    transform: translateY(100%);
    transition: transform 0.35s ease, visibility 0.35s ease;
}

.model-fixed-bar--visible {
    visibility: visible;
    transform: translateY(0);
}

.model-fixed-bar__columns {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.model-fixed-bar__left {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 32px;
}

.model-fixed-bar__right {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
}

.model-fixed-bar__btn-whatsapp {
    min-width: initial;
    padding: 0;
    height: 50px;
    width: 50px;
}

.model-fixed-bar__btn-whatsapp img {
    height: 25px;
}

.model-fixed-bar__btn-dates {
    height: 50px;
    width: 200px;
}

.model-fixed-bar__title {
    font-family: "BarlowCondensed-Black", sans-serif;
    color: var(--color-reddish);
    text-transform: uppercase;
    font-size: 1.6rem;
}

.model-fixed-bar__duration {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
}

.model-fixed-bar__price {
    font-family: "DMSans-Bold", sans-serif;
}

.honeymoon-types {
    display: flex;
    gap: 32px;
    align-items: flex-start;
}

.honeymoon-types > div {
    flex: 1;
}

.honeymoon-types__box {
    width: 95%;
    margin: 0 auto;
    border-radius: 16px;
    background-image: url("../img/honeymoon/honey-squared-background-4SE0Ii8.webp");
    background-size: cover;
    background-position: center;
    height: 550px;
    padding: 32px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    color: white;
    text-align: center;
}

.honeymoon-types__box-title {
    font-family: "BarlowCondensed-Black", sans-serif;
    text-transform: uppercase;
    font-size: 2.5rem;
}

.honeymoon-types__box-image {
    max-width: 100%;
    max-height: 250px;
}

.honeymoon-kit {
    mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
    -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    -webkit-mask-size:  100% 100%;
    -webkit-mask-repeat: no-repeat;
    background-image: url("../img/backgrounds/honeymoon-purple-background-u6E0QvA.webp");
    background-size: cover;
    background-position: center;
    padding: 50px 0;
    margin-top: -50px;
}

.honeymoon-kit__columns {
    display: flex;
    gap: 32px;
    align-items: center;
    color: white;
}

.honeymoon-kit__columns > div {
    flex: 1;
}

.honeymoon-kit__title {
    font-family: "BarlowCondensed-Black", sans-serif;
    font-size: 2.5rem;
    margin-bottom: 16px;
}

.honeymoon-kit__image {
    max-height: 500px;
    max-width: 100%;
    display: block;
    margin: auto;
}

.carousel-giftcards {
    margin-top: 64px;
}

/* Quale partenza si sta salvando, sotto al testo della modale del cuore */
.favourite-group-modal__departure {
    font-family: "DMSans-Bold", sans-serif;
    color: var(--color-brownish);
    margin-top: 6px;
}

#newsletter-open {
    max-width: initial;
}
































@media screen and (max-width: 1000px) {

    h2 {
        font-size: 2.3rem;
        line-height: 2.4rem;
    }

    .h2-subtitle {
        font-size: 1.1rem;
        padding-left: 20px;
        padding-right: 20px;
    }

    .container {
        width: 90%;
    }

    .box--outlined {
        padding: 20px;
    }

    .btn-hover-effect, .btn:hover, .btn-hover-effect:hover {
        transition: none;
        transform: none;
    }

    .big-text {
        overflow: hidden;
        padding: 0;
    }

    .big-text__back-text {
        width: 140vw;
        font-size: 10rem;
        line-height: 9rem;

    }

    .big-text__front {
        width: auto;
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 0;
    }

    .carousel-card {
        height: 340px;
        width: 250px;
    }

    .carousel-card--less-tall {
        height: 250px;
    }

    h1 {
        font-size: 3.9rem;
        line-height: 3.9rem;
    }

    .top-page-intro {
        min-height: 250px;
        padding: 30px 20px 80px 20px
    }

    .editorial h2 {
        margin-top: 32px;
    }

    header {
        padding: 0 16px;
    }

    .header__logo {
        height: 34px;
    }

    .header__center {
        display: none;
    }

    .header__right {
        gap: 23px;
    }

    footer {
        padding-top: 180px;
        padding-bottom: 100px;
    }

    .footer__columns {
        flex-direction: column;
    }

    .footer__logo {
        display: block;
    }

    .search-box__tab {
        font-size: 0.9rem;
        padding: 8px 10px;
        border-radius: 8px;
    }

    .search-overlay .search-box {
        margin-top: -200px;
    }

    .side-menu {
        padding: 20px;
        width: 100%;
    }

    .side-menu__link:hover {
        background-color: inherit;
        transform: inherit;
    }

    .home-intro__title {
        font-size: 3.5rem;
        line-height: 3.5rem;
        padding: 0 30px;
        margin-top: 30px;
    }

    .home-intro__subtitle {
        width: 250px;
        text-align: center;
        margin-top: 15px;
    }

    .search-box {
        width: 90%;
    }

    .home-intro__chip {
        max-width: 80%;
        text-align: center;
    }

    .home-intro .search-box {
        margin-top: 20px;
    }

    .home-intro__tv {
        margin-top: 30px;
    }

    .home-flash-callout {
        flex-direction: column;
        gap: 15px;
        height: auto;
        padding: 70px 0;
        mask-image: url("../img/masks/paper-narrow-2-mask-O3YwXvB.svg");
        -webkit-mask-image: url("../img/masks/paper-narrow-2-mask-O3YwXvB.svg");
        margin-bottom: 20px;
    }

    .home-flash-callout__text {
        text-align: center;
        font-size: 2.4rem;
        line-height: 2.4rem;
    }

    .go-that-country, .things-proud {
        padding: 70px 0;
        margin: 40px 0;
    }

    .model-box {
        height: 410px;
        width: 270px;
        min-width: 270px;
    }

    .things-proud__things {
        flex-direction: column;
        gap: 25px;
    }

    .things-proud__thing {
        display: flex;
        gap: 16px;
        align-items: flex-start;
    }

    .things-proud__thing-title {
        text-align: left;
    }

    .things-proud__thing-subtitle {
        text-align: left;
    }

    .handmade {
        flex-direction: column;
        gap: 16px;
    }

    .handmade__image {
        width: 100%;
    }

    .home-safari__columns {
        flex-direction: column;
        gap: 16px;
    }

    .home-safari__btn {
        margin: 16px auto 0 auto;
    }

    .partners {
        mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
        -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
        padding: 60px 0 90px 0;
    }

    .partners__brand {
        margin-right: 60px;
    }

    .model-washer {
        mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
        -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    }

    .model-washer__title {
        min-width: auto;
    }

    .model-washer__inner {
        flex-direction: column;
        gap: 20px;
    }

    .trustpilot-band {
        padding: 50px 0 100px 0;
        margin-bottom: -160px;
    }

    .trustpilot-box {
        width: 280px;
        min-width: 280px;
    }

    .footer__column--no-title {
        padding-top: 0;
        margin-top: -20px;
    }

    .search-overlay {
        padding: 0;
    }

    .breadcrumbs__inner {
        margin: 0;
        padding: 8px 16px;
        gap: 4px;
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .about-birth__columns {
        flex-direction: column;
    }

    .about-birth__title {
        font-size: 3rem;
        line-height: 3rem;
    }

    .about-birth__image {
        width: 100%;
    }

    .about-founders__columns {
        flex-direction: column;
    }

    .about-birth {
        margin-bottom: -60px;
    }

    .about-founders__columns--erica > div:first-child {
        order: 2;
    }
    .about-founders__columns--erica > div:last-child {
        order: 1;
    }

    .about-timeline__title {
        font-size: 3rem;
        line-height: 3rem;
    }

    .about-timeline__content--columns {
        flex-direction: column;
        gap: 20px;
    }

    .about-timeline__contents {
        padding-bottom: 60px;
    }

    .about-tavern__columns {
        flex-direction: column;
    }

    .about-tavern {
        padding-top: 100px;
        background-image: url("../img/backgrounds/background-tavern-mobile-M47-4gr.webp");
    }

    .about-tavern__title {
        font-size: 3.5rem;
        line-height: 3.5rem;
    }

    .about-tavern__plates {
        align-items: center;
        gap: 10px;
    }

    .about-tavern__plate {
        height: 250px;
    }

    .about-tavern__plate--n2 {
        position: initial;
        margin-left: inherit;
    }

    .about-fastfood {
        padding: 80px 0;
    }

    .about-fastfood__columns {
        width: 100%;
        overflow-x: scroll;
        gap: 0px;
    }

    .about-fastfood__columns > div {
        padding: 0 20px;
    }

    .about-fastfood__column-image {
        height: 120px;
    }

    .about-fastfood__column-title {
        min-width: 230px;
    }

    .about-team {
        padding: 100px 0;
    }

    .about-people__title {
        font-size: 2.5rem;
        line-height: 2.5rem;
    }

    .about-people__person {
        width: 230px;
        margin-right: 15px;
    }

    .become-localguide__columns {
        flex-direction: column;
        gap: 16px;
    }

    .become-localguide__title, .discover-philosophy__title {
        font-size: 3rem;
        line-height: 3rem;
    }

    .discover-philosophy {
        margin-top: -60px;
    }

    .discover-philosophy__columns {
        flex-direction: column;
    }

    .discover-philosophy__image {
        width: 100%;
    }

    .trustpilot-box__title {
        font-size: 1rem;
    }

    /* Sotto questa soglia il calendario mostra un mese solo (vedi SINGLE_MONTH_QUERY
       in model-groups-calendar.js) e la modale prende tutta l'altezza disponibile */
    .groups-calendar-modal {
        padding: 24px 16px;
        max-height: 75vh;
    }

    .groups-calendar-modal__title {
        font-size: 1.6rem;
    }

    .groups-calendar .flatpickr-day {
        height: 44px;
    }

    .groups-calendar__day-price {
        font-size: 0.62rem;
    }

    .groups-calendar__selection {
        flex-direction: column;
        align-items: flex-start;
    }

    .groups-calendar__selection-right {
        width: 100%;
        justify-content: space-between;
    }

    .side-menu__close:hover {
        background-color: inherit;
    }

    .our-belief__step {
        margin: 0 auto;
    }

    .our-belief__step:nth-child(even) {
        margin: 0 auto;
    }

    .our-belief__step-title {
        font-size: 2.5rem;
        line-height: 2.5rem;
    }

    .our-belief-path-1, .our-belief-path-2, .our-belief-path-3, .our-belief-path-4, .our-belief-path-5, .our-belief-path-6 {
        display: none;
    }

    .our-belief-outro {
        padding-left: 16px;
        padding-right: 16px;
    }

    .our-belief-outro__columns {
        flex-direction: column;
        gap: 32px;
    }

    .hard-explain__title {
        font-size: 3rem;
        line-height: 3rem;
    }

    .hard-explain__columns {
        display: block;
    }

    .hard-explain__image {
        width: 100%;
        margin-top: 32px;
    }

    .working-info__buttons {
        overflow-x: scroll;
        scrollbar-width: none;
        width: 100%;
        padding: 12px 20px;
    }

    .btn--working-info {
        white-space: nowrap;
    }

    .working-info__tab {
        flex-direction: column;
        gap: 20px;
        margin-top: 20px;
    }

    .model-whats-included {
        flex-direction: column;
        gap: 32px;
    }

    .working-info__title {
        margin-bottom: 20px;
    }

    .model-whats-included__arrow {
        display: none;
    }

    .model-hero {
        flex-direction: column;
        height: auto;
        max-height: initial;
    }

    .model-hero > div {
        width: 100%;
        min-height: 400px;
    }

    .model-hero__right {
        justify-content: center;
        padding: 20px !important;
        padding-bottom: 80px !important;
    }

    .model-hero__overtitle {
        padding-top: 0;
    }

    .model-hero__title {
        font-size: 3rem;
        line-height: 3rem;
    }

    .model-intro {
        flex-direction: column;
        gap: 32px;
        margin-top: 20px;
    }

    .model-extras {
        margin-top: 0;
    }

    .model-whats-included__box-title {
        font-size: 1.6rem;
        line-height: 1.6rem;
    }

    .form__columns {
        gap: 20px;
        flex-direction: column;
    }

    .model-included__icon {
        height: 50px;
    }

    .magazine-intro__title {
        font-size: 3rem;
        line-height: 3rem;
    }

    .magazine-intro {
        flex-direction: column;
        gap: 32px;
        padding: 44px 0;
    }

    .article-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .magazine-pagination {
        padding-bottom: 32px;
    }

    .honeymoon-types {
        flex-direction: column;
    }

    .section-contact__inner {
        flex-direction: column;
        gap: 16px;
    }

    .honeymoon-kit__columns {
        flex-direction: column;
    }

    .btn {
        padding: 5px 16px;
        max-width: 88vw;
    }

    .hard-explain {
        padding: 40px 0;
    }

    .ambassador-if__columns {
        flex-direction: column;
        align-items: center;
    }

    .ambassador-role {
        padding: 40px 0;
    }

    .ambassador-role__title, .ambassador-role__title-bis {
        font-size: 2.6rem;
        line-height: 2.6rem;
        text-align: center;
    }

    .ambassador-role__columns {
        flex-direction: column;
        align-items: center;
        gap: 40px;
    }

    .fabric-localguide__columns {
        flex-direction: column;
    }

    .fabric-localguide__title {
        font-size: 3rem;
        line-height: 3rem;
    }

    .fabric-localguide__image, .local-dmc__image {
        width: 100%;
    }

    .local-dmc {
        padding: 40px 0;
    }

    .local-dmc__columns {
        flex-direction: column;
    }

    .lets-chat {
        padding: 80px 0;
    }

    .lets-chat__title {
        font-size: 3rem;
        line-height: 3rem;
    }

    .section-contact {
        margin-top: 0;
    }

    .section-contact__image {
        width: 100%;
    }

    .other-contacts {
        gap: 0;
        flex-direction: column;
    }

    .section-contact__other-title {
        margin: 32px 0 8px 0;
    }

    .group-page__month-label {
        font-size: 1.1rem;
        width: auto;
    }

    .group-page__month-calendar {
        height: 100px;
        width: 85px;
        font-size: 1.7rem;
    }

    .big-text__front-title {
        font-size: 2.6rem;
        line-height: 2.6rem;
    }

    .model-hero__video-container {
        height: 400px;
    }

    .model-hero__video {
        height: 400px;
    }

    .model-metrics__inner {
        flex-direction: column;
        gap: 32px;
    }

    .model-metrics__metric {
        width: initial;
    }

    .masked-with-vertical-paper, .masked-with-narrow-paper {
        mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
        -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    }

    .btn--model-nav, .btn--working-info, .btn--magazine-chip {
        white-space: nowrap;
    }

    .model-itinerary__title-header {
        flex-direction: column;
        gap: 8px;
        margin-top: 40px;
    }

    .container--large {
        margin-left: auto;
        margin-right: auto;
    }

    .model-night__inner {
        gap: 32px;
        flex-direction: column;
    }

    .model-night__image {
        width: 100%;
    }

    .breadcrumbs__link, .breadcrumbs__link--current {
        white-space: nowrap;
    }

    .trustpilot-band__title, .partners__title {
        padding-left: 16px;
        padding-right: 16px;
    }

    .about-founders {
        mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
        -webkit-mask-image: url("../img/masks/paper-large-mask-i__P0_m.svg");
    }

    #btn-back span {
        display: none;
    }

    .progress-buttons {
        gap: 16px;
    }

    .progress-buttons > div:last-child {
        width: 100%;
    }

    #btn-forward {
        width: 100%;
    }

    .other-experiences__grid {
        flex-direction: column;
    }

    .other-continents__box, .other-experiences__box {
        width: 100%;
    }

    .other-continents, .other-experiences {
        margin-top: 40px;
        padding: 60px 0 80px 0;
    }

    .box-group {
        flex-direction: column;
        background-image: url("../img/box-group-border-mobile-qf7GKwT.svg");
    }

    .box-group__left {
        border-top-right-radius: 15px;
        border-bottom-left-radius: 0;
        width: 100%;
    }

    .box-group__left-inner {
        min-height: initial;
        height: 128px;
        width: 100%;
    }

    .box-group__middle {
        width: 95%;
        min-height: 150px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
    }

    .box-group__right {
        width: 95%;
        min-height: 180px;
        padding-left: 20px;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
    }

    .box-group__date {
        width: 80px;
        min-width: 80px;
    }

    .box-group__soldout {
        margin-top: 32px;
    }

    .box-group__cta-container {
        width: 100%;
        margin-top: 12px;
        padding-right: 0;
    }

    .btn--cta-group {
        width: 100%;
    }

    .group-status-legend__row {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .box {
        padding: 20px;
    }

    .model-hero__box {
        flex-direction: column;
        gap: 16px;
    }

    .model-hero__box > div {
        width: 100%;
    }

    .model-hero__price-row {
        margin-bottom: 8px;
    }

    .model-metrics {
        margin-bottom: 32px;
    }

    .model-fixed-bar {
        padding: 12px 0;
    }

    .model-fixed-bar__duration, .model-fixed-bar__price {
        display: none;
    }

    .model-fixed-bar__title {
        width: 100%;
    }

    .model-fixed-bar__left {
        flex: initial;
        width: 100%;
        justify-content: space-between;
    }

    .model-fixed-bar__right {
        width: 100%;
        gap: 10px;
    }

    .model-fixed-bar__btn-dates {
        width: auto;
        padding-left: 0;
        padding-right: 0;
        aspect-ratio: 1;
    }

    .model-fixed-bar__btn-dates span {
        display: none;
    }

    .model-whats-included {
        margin-top: 32px;
    }

    .model-fixed-bar__columns {
        gap: 8px;
    }

    .model-whats-included__title {
        font-size: 2.2rem;
        line-height: 2.2rem;
    }

    .next-departures__title {
        font-size: 3rem;
        line-height: 3rem;
        padding-left: 16px;
        padding-right: 16px;
    }

    .model-itinerary__map {
        height: 390px;
    }

    .model-itinerary__day {
        width: 320px;
        padding: 25px;
    }

    .model-itinerary__day-number--2, .model-itinerary__day-number--4 {
        right: 25px;
    }

    .model-infos {
        margin-top: 32px;
    }

    .model-extras__subtitle, .model-extras__general-description {
        padding-left: 16px;
        padding-right: 16px;
    }

    .model-nav__inner {
        width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }

    .model-infos__box-info {
        padding: 32px;
    }

    .model-night {
        margin-top: -60px;
    }

    .model-nav__inner, .working-info__buttons, .magazine-chips {
        gap: 10px;
    }

    .h2-subtitle {
        margin-bottom: 20px;
    }

    .model-docus__episode {
        width: 300px;
    }

    .model-docus__carousel .splide__arrows {
        display: none;
    }

    .extra-modal__body {
        flex-direction: column;
    }

    .extra-modal__image {
        height: 200px;
        width: auto;
    }

}