@charset "UTF-8";

:root {
    --boat-base: clamp(80px, calc(100vw * 0.1667), 480px);
}

/* ----------------------------------------------------------------------
   Reset degli stili (Reset CSS)
---------------------------------------------------------------------- */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    transition: opacity 0.3s ease;
}

html body {
    line-height: 1.5;
    font-family: 'SweetSans-Regular', Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: var(--color-dark-grey);
}

html ul, html ol {
    list-style: none;
    margin-bottom: 0px;
    margin-left: 0px;
}

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

img {
    max-width: 100%;
    height: auto;
    display: block;
}

html button {
    background-color: inherit;
    color: inherit;
    border: inherit;
}

/* ----------------------------------------------------------------------
   Reset degli stili (Reset CSS)
---------------------------------------------------------------------- */

.nav-link:focus-visible,
#fleet-overlay a:focus-visible,
#fleet-overlay button:focus-visible {
    outline: 2px solid var(--color-ottanio);
    outline-offset: 2px;
}

/* ----------------------------------------------------------------------
   Stili globali
---------------------------------------------------------------------- */

html {
    scrollbar-width: none;
    -ms-overflow-style: none; 
    scroll-behavior: smooth;
    -webkit-user-select: none; 
    -ms-user-select: none;
    user-select: none;
}

    html::-webkit-scrollbar {
        width: 0px;
    }

.valign {
    display: table;
    height: 100%;
    width: 100%;
}

.border-top.custom {
    border-top: 1px solid !important;
    color: var(--color-dark-grey);
}

/* ----------------------------------------------------------------------
   Links and Buttons
---------------------------------------------------------------------- */

.btn-ferretti {
    border: 2px solid;
    border-color: var(--color-dark-grey);
    display: inline-block;
    padding-left: 1.375rem;
    padding-right: 4rem;
    position: relative;
    transition: all 0.25s ease-in-out;
    margin-bottom: 0;
    background-color: initial;
}

    .btn-ferretti::after {
        content: "";
        background-image: url("../img/right-arrow.svg");
        width: 20px;
        height: 15px;
        position: absolute;
        top: 50%;
        right: 10%;
        transform: translateY(-45%);
        background-repeat: no-repeat;
    }

    .btn-ferretti:hover,
    .btn-ferretti.active {
        background-color: var(--color-dark-grey);
        color: #FFFFFF;
    }

        .btn-ferretti:hover::after,
        .btn-ferretti.active::after {
            filter: invert(1);
        }

/*------------------------      ARROW DOWN      -------------------------*/

    .btn-ferretti.down::after {
        transform: translateY(-55%) rotate(90deg);
    }

/*--------------------------      WHITE      ----------------------------*/

    .btn-ferretti.white {
        border-color: #FFFFFF;
        color: #FFFFFF;
    }

        .btn-ferretti.white:hover {
            color: var(--color-dark-grey);
            background-color: #FFFFFF;
        }

        .btn-ferretti.white::after {
            /*filter: invert(1);*/
            background-image: url("../img/right-arrow-small-white.svg");
        }

        .btn-ferretti.white:hover::after {
            /*filter: invert(0);*/
            filter: invert(1);
        }

/*-------------------------      OTTANIO      ---------------------------*/

    .btn-ferretti.ottanio {
        border-color: var(--color-ottanio);
        color: var(--color-ottanio);
    }

    .btn-ferretti.ottanio::after {
        content: "";
        background-image: url("../img/right-arrow-ottanio.svg");
    }

        .btn-ferretti.ottanio:hover {
            color: #FFFFFF;
            background-color: var(--color-ottanio);
        }

            .btn-ferretti.ottanio:hover::after {
                content: "";
                filter: invert(0);
                background-image: url("../img/right-arrow-ottanio-hover.svg");
            }

/*------------------------      ICO PLAY      --------------------------*/

        .btn-ferretti.white.ico-play::after {
            background-image: url("../img/play.svg");
            width: 15px;
            height: 17px;
            filter: invert(0);
        }

        .btn-ferretti.white.ico-play:hover::after {
            filter: invert(1);
        }

/*-------------------------      DEALERS      ---------------------------*/

    .btn-ferretti.no-ico {
        padding-left: 1.375rem;
        padding-right: 1.375rem;
        text-align: center;
    }

        .btn-ferretti.no-ico::after {
            background-image: none;
        }

.sub-button {
    padding-right: 3rem;
    padding-top: 0.65rem;
    padding-bottom: 0.65rem;
    padding-left: 1rem;
    text-align: left;
}

/*--------------------      UNDERLINED LINKS      ----------------------*/

.underlined {
    position: relative;
    display: inline-block;
}

    .underlined::after {
        content: "";
        background-image: url("../img/underline.svg");
        width: 100%;
        height: 2px;
        position: absolute;
        bottom: 0px;
        left: 0%;
        transition: all 0.25s ease-in-out;
        opacity: 0;
    }

        .underlined.ottanio::after {
            background-image: url("../img/underline-ottanio.svg");
        }

    .underlined:hover::after {
        opacity: 1;
    }

/*------------------------      OWL DOTS      --------------------------*/

html .owl-carousel .owl-dots {
    position: absolute;
    right: var(--container-padding);
    bottom: var(--padding-md);
}

html .owl-carousel button.owl-dot {
    padding: 10px 0 !important;
    transition: all 0.25s ease-in-out;
    opacity: 0.5;
}

    html .owl-carousel button.owl-dot.active {
        opacity: 1;
    }

html .owl-carousel button.owl-dot span {
    display: inline-block;
    padding-top: 0.1rem !important;
    padding-bottom: 0.1rem !important;
    width: clamp(28px, 2.604vw, 80px);
    background: #FFFFFF;
    margin: 0 10px;
}

/* Layouts versions */

html .gallery .owl-carousel {
    cursor: grab;
}

    html .gallery .owl-carousel .owl-dots {
        right: 50%;
        bottom: 0;
        transform: translateX(50%) translateY(100%);
    }

    html .gallery .owl-carousel button.owl-dot span {
        background: var(--color-dark-grey);
    }

@media (max-width: 413.98px) {
    html .featured-yachts-container .owl-carousel .owl-dots {
        right: initial;
        left: var(--container-padding);
    }

    html .owl-carousel button.owl-dot span {
        width: clamp(20px, 2.604vw, 80px);
        margin: 0 10px;
    }
}

@media (max-width: 767.98px) {

    html .gallery .owl-carousel .owl-dots {
        right: initial !important;
        transform: translateX(0%) translateY(125%);
    }

}

/* ----------------------------------------------------------------------
   Breadcrumbs
---------------------------------------------------------------------- */

@media (max-width: 991.98px) {
    .breadcrumb-wrapper {
        display: none;
    }
}

.breadcrumb-item {
    display: inline-block;
    position: relative;
    font-family: 'SuisseIntl-Regular';
    font-size: var(--font-xs);
    letter-spacing: var(--letter-spacing-xl);
    text-transform: uppercase;
    color: var(--color-grey);
}

    .breadcrumb-item.breadcrumb-item:not(.first)::before {
        content: "" !important;
        background-image: url("../img/breadcrumb-grey.svg");
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        position: absolute;
        top: 50%;
        left: 0%;
        transform: translate(50%, -50%);
        width: 7px;
        height: 11px;
        z-index: 0;
    }

    .breadcrumb-item:not(.first) {
        padding-left: 1.25rem !important;
    }


.bg-ottanio .breadcrumb-item {
    color: #FFFFFF;
}

    .bg-ottanio .breadcrumb-item.breadcrumb-item:not(.first)::before {
        background-image: url("../img/breadcrumb-white.svg");
    }

/* ----------------------------------------------------------------------
   Hero Homepage
---------------------------------------------------------------------- */

.hero-container {
    height: 100vh;
    width: 100%;
    position: relative;
    overflow: hidden;
}

.hero-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

.hero-text {
    position: absolute;
    top: 80vh;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
    text-transform: uppercase;
    font-size: max(2.25rem, calc(100vw * 0.03125));
    font-family: 'SweetSans-Medium';
    color: white;
    white-space: nowrap;
    display: flex;
    gap: 0.05em;
}

    .hero-text span {
        opacity: 0;
        transform: translateX(-10px);
        display: inline-block;
        animation: fadeInLeft 0.6s ease-out forwards;
        filter: blur(2px);
    }

@media (min-width: 768px) {

    .hero-text {
        top: 50%;
    }

}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        transform: translateX(-10px);
        filter: blur(2px);
    }

    100% {
        opacity: 1;
        transform: translateX(0);
        filter: blur(0);
    }
}

.chevron-down {
    display: block;
    position: absolute;
    bottom: 5.5%;
    left: 50%;
    transform: translateX(-50%);
    font-size: 2rem;
    color: white;
    z-index: 3;
    cursor: pointer;
    animation: bounce 2s infinite;
    transition: transform 0.3s;
}

/* ----------------------------------------------------------------------
   Video gamma
---------------------------------------------------------------------- */

.video-container {
    position: relative;
}

    .video-container::after {
        content: "";
        background-color: rgba(0,0,0,0.1);
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
    }

.video-autoplay {
    position: relative;
    object-fit: cover;
    display: block;
    aspect-ratio: 895 / 563;
    z-index: 1;
}

.video-autoplay-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    pointer-events: auto;
    z-index: 2;
}

.title-home-gamma {
    color: #FFFFFF;
    text-transform: uppercase;
    margin-left: 5%;
    margin-top: 5%;
    letter-spacing: var(--letter-spacing-l);
}

    .title-home-gamma.flybridge {
        font-family: 'SweetSans-Regular';
    }

    .title-home-gamma.infynito {
        font-family: 'SweetSans-ExtraLight';
    }

        .title-home-gamma.infynito span {
            font-family: 'SweetSans-Medium';
        }

.video-text-container {
    display: flex;
    justify-content: space-between;
    margin-left: 5%;
    margin-right: 5%;
}

.text-box-gamma {
    font-family: 'SuisseIntl-Book';
    font-size: var(--font-sm);
    line-height: var(--line-h-l);
    padding-right: var(--padding-md);
    color: #FFFFFF;
    letter-spacing: initial;
    text-transform: initial !important;
    margin-bottom: 0;
}

.video-text-container img {
    max-width: 40px;
}

/* ----------------------------------------------------------------------
   Video Featured Yachts
---------------------------------------------------------------------- */

.featured-yachts-container {
    height: 80vh;
}

@media (min-width: 768px) {

    .featured-yachts-container {
        height: 40vh;
    }

}

@media (min-width: 992px) {

    .featured-yachts-container {
        height: 80vh;
    }

}

.video-featured {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

.video-featured-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    z-index: 3;
    position: relative;
    cursor: grab;
}

@media (max-width: 413.98px) {

/*    .video-featured-wrapper {
        justify-content: flex-start;
    }*/

    .video-featured-wrapper .featured-bottom {
        margin-bottom: 3rem;
    }

}

/* ----------------------------------------------------------------------
   Video Model Page
---------------------------------------------------------------------- */

.model-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

#play-video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.video-controls-overlay {
/*    position: absolute;
    left: var(--container-padding);
    bottom: 100px;
    z-index: 1;*/
}

.btn-video {
    text-transform: uppercase;
    font-family: 'SuisseIntl-Regular';
    font-size: var(--font-sm);
    letter-spacing: var(--letter-spacing-l);
    border: 0;
}

.btn-video.classic {
    text-transform: uppercase;
    font-family: 'Schnyder-S-Bold';
    font-size: max(1.0625rem, calc(100vw * 0.00885));
    letter-spacing: var(--letter-spacing-l);
    border: 0;
}

.btn-video.contemporary {
    text-transform: uppercase;
    font-family: 'SuisseIntl-Regular';
    font-size: var(--font-sm);
    letter-spacing: var(--letter-spacing-l);
    border: 0;
}

.btn-video.active {
    position: relative;
    display: inline-block;
}

    .btn-video.active::after {
        content: "";
        background-image: url("../img/underline.svg");
        width: 100%;
        height: 2px;
        position: absolute;
        bottom: 0px;
        left: 0%;
        transition: all 0.25s ease-in-out;
        opacity: 1;
    }

.btn-video:not(.active) {
    opacity: .5;
}

.video-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    background: none;
    border: none;
    cursor: pointer;
    opacity: 0.8;
    transition: all 0.3s ease;
}

    .video-arrow img {
        width: 40px;
        height: auto;
    }

    .video-arrow.left {
        left: 20px;
        transform: translateY(-50%) rotate(180deg);
    }

    .video-arrow.right {
        right: 20px;       
    }

.video-gradient {
    position: absolute;
    top: 0;
    width: 180px;
    height: 100%;
    z-index: 2;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

    .video-gradient.left {
        left: 0;
        background: linear-gradient(to right, rgba(0,0,0,0.55), transparent);
    }

    .video-gradient.right {
        right: 0;
        background: linear-gradient(to left, rgba(0,0,0,0.55), transparent);
    }

.model-video-wrapper.show-left .left,
.model-video-wrapper.show-left .video-gradient.left {
    opacity: 1;
}

.model-video-wrapper.show-right .right,
.model-video-wrapper.show-right .video-gradient.right {
    opacity: 1;
}


@media (hover: none) {
    .video-arrow,
    .video-gradient {
        opacity: 0 !important;
    }
}

/* ----------------------------------------------------------------------
   Video boat anatomy
---------------------------------------------------------------------- */

#play-boat-anatomy {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.boat-anatomy-video {
    width: 100%;
}

/* ----------------------------------------------------------------------
   Virtual tour
---------------------------------------------------------------------- */

.img-vt-preview {
    aspect-ratio: 4 / 5;
    object-fit: cover;
}

.play-vt {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}

.logo-vt {
    position: absolute;
    top: 0%;
    left: 50%;
    transform: translate(-50%, 25%);
    z-index: 2;
}

.container-naming-vt {
    display: none;
    position: absolute;
    top: var(--padding-md);
    right: var(--padding-md);
    transform: translate(-10%, 10%);
    color: #FFFFFF;
    z-index: 2;
}

    .container-naming-vt .model-badge.plain {
        border-color: #FFFFFF;
    }

.overlay-vt {
    position: absolute;
    top: 0;
    left: 0;
    width: calc(100% - 1.5rem);
    height: 100%;
    background-color: rgba(0, 0, 0, 0.25);
    z-index: 1;
    margin-left: calc(var(--bs-gutter-x) * .5);
}

@media (min-width: 768px) {

    .img-vt-preview {
        aspect-ratio: 1920 / 650;
    }

    .container-naming-vt {
        display: block;
    }

    .logo-vt {
        left: 0%;
        transform: translate(50%, 25%);
    }

}

/* ----------------------------------------------------------------------
   Latest News & Events
---------------------------------------------------------------------- */

#latestNews .owl-stage {
    padding-left: 0 !important;
}

.img-event {
    width: 100%;
    object-fit: cover;
    aspect-ratio: 4 / 5;
}

.latest-news-item {
    /*text-align: center;*/
}

.img-news {
    width: 100%;
    object-fit: cover;
    aspect-ratio: 5.5 / 4;
}

.news-main-title {
    border-bottom: 1px solid;
    border-color: var(--color-dark-grey);
    padding-bottom: 1.75rem;
}

.detal-event-border {
    border-bottom: 1px solid;
    border-color: #FFFFFF;
    padding-bottom: 1.75rem;
}

/* ----------------------------------------------------------------------
   Decor Images and GIFs
---------------------------------------------------------------------- */

.decor-home-intro-top {
    position: absolute;
    top: 0;
    right: 0;
    transform: translateX(-40%);
    width: clamp(280px, 20.83vw, 600px);
    height: auto;
    pointer-events: none;
    z-index: -1;
    padding: 0;
}

.decor-home-intro-bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translate(10.5%, 18%);
    width: clamp(280px, 20.83vw, 600px);
    height: auto;
    pointer-events: none;
    z-index: -1;
    padding: 0;
    clip-path: inset(10% 0 10% 0);
}

.decor-home-intro-bottom {
    position: relative;
    width: 100%;
    transform: initial;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center;
    height: auto;
    pointer-events: none;
    z-index: -1;
    padding: 0;
}

@media (min-width: 992px) {

    .decor-home-intro-bottom {
        position: absolute;
        bottom: 0;
        left: 0;
        transform: translate(10.5%, 18%);
        width: clamp(280px, 20.83vw, 600px);
        clip-path: inset(10% 0 10% 0);
        aspect-ratio: initial;
    }

}

/* ----------------------------------------------------------------------
   Owl Carousels
---------------------------------------------------------------------- */

#exterior .owl-carousel .owl-stage,
#interior .owl-carousel .owl-stage,
#classic .owl-carousel .owl-stage,
#contemporary .owl-carousel .owl-stage {
    padding-left: 0 !important;
}

/*.owl-carousel.gallery img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

@media (min-width: 992px) {

    .owl-carousel.gallery img {
        aspect-ratio: 16 / 9;
    }

}*/



.owl-carousel.gallery img {
    height: clamp(200px, 40vh, 250px);
    object-fit: cover;
    object-position: center;
}

@media (min-width: 768px) {

    .owl-carousel.gallery img {
        height: clamp(200px, 40vh, 450px);
    }

}

@media (min-width: 992px) {

    .owl-carousel.gallery img {
        height: clamp(250px, 70vh, 750px);
    }

}

.gallery-tab {
    transition: all 0.25s ease-in-out;
}

.gallery-tab:not(.active) {
    opacity: 50%;
}

    .gallery-tab::after {
        opacity: 0 !important;
    }

    .gallery-tab.active::after {
        opacity: 1 !important;
    }

.interior_subtabs {
    display: inline-block;
}

.subtab.classic {
    text-transform: uppercase;
    font-family: 'Schnyder-S-Bold';
    /*font-size: max(1.0625rem, calc(100vw * 0.00885));*/
    font-size: max(0.75rem, calc(100vw * 0.00885));
    letter-spacing: var(--letter-spacing-l);
}

.subtab.contemporary {
    text-transform: uppercase;
    font-family: 'SuisseIntl-Regular';
    /*font-size: var(--font-sm);*/
    font-size: max(0.75rem, calc(100vw * 0.00885));
    letter-spacing: var(--letter-spacing-l);
}

.subtab:not(.active) {
    opacity: 50%;
}

.wrapper-gallery {
    cursor: grab;
}

.owl-carousel .owl-nav {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

    .owl-carousel .owl-nav button.owl-prev,
    .owl-carousel .owl-nav button.owl-next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        background: none;
        border: none;
        pointer-events: all;
    }

    .owl-carousel .owl-nav button.owl-prev {
        left: 2.5%; 
    }

        .owl-carousel .owl-nav button.owl-prev img {
            transform: rotate(180deg);
        }

    .owl-carousel .owl-nav button.owl-next {
        right: 2.5%;
    }

    .owl-carousel .owl-nav button.owl-prev.disabled,
    .owl-carousel .owl-nav button.owl-next.disabled {
        display: none;
    }

    .owl-carousel .owl-nav img {
        aspect-ratio: initial;
        height: 25px;
    }

@media (min-width: 992px) {

    .owl-carousel .owl-nav img {
        height: auto;
    }

}

/* ----------------------------------------------------------------------
   Video gallery
---------------------------------------------------------------------- */

.model-video-wrapper {
    aspect-ratio: 4/3;
    width: 100%;
    position: relative;
    overflow: hidden;
    background-color: var(--color-light-grey);
    z-index: 0;
    border: none;
    background: none;
    border-color: transparent;
}

@media (min-width: 992px) {

    .model-video-wrapper {
        aspect-ratio: 1920 / 850;
    }
}

/* ----------------------------------------------------------------------
   Layouts
---------------------------------------------------------------------- */

.layout-wrapper {
    margin-bottom: var(--padding-xs);
}

.layout-tab {
    border-bottom: 1.5px solid;
    border-color: var(--color-dark-grey);
    display: flex;
    justify-content: space-between;
}

.arrow-icon {
    transition: transform 0.3s ease;
}

.layout-tab.collapsed .arrow-icon {
    transform: rotate(0deg);
}

.layout-tab:not(.collapsed) .arrow-icon {
    transform: rotate(180deg);
}


/*------------------------      Open icon     --------------------------*/

.open-icon {
    transition: transform 0.15s ease;
}

.layout-tab:not(.collapsed) .open-icon {
    transform: rotate(135deg);
}

/* ----------------------------------------------------------------------
   Technical data
---------------------------------------------------------------------- */

.tech-wrapper {
    margin-bottom: var(--padding-md);
}

.tech-tab {
    border-bottom: 1.5px solid;
    border-color: var(--color-dark-grey);
    display: flex;
    justify-content: space-between;
    margin-bottom: var(--padding-xs);
}

.version-tab {
    transition: all 0.25s ease-in-out;
    background: none;
    border: none;
    padding: 0;
    font-family: 'SuisseIntl-Regular';
    font-size: var(--font-xs);
    color: inherit;
    cursor: pointer;
}

    .version-tab:not(.active) {
        opacity: 50%;
    }

.opt {
    font-family: 'SuisseIntl-Regular';
    font-size: var(--font-xs);
    line-height: var(--line-h-l);
    letter-spacing: var(--letter-spacing-l);
    text-transform: uppercase;
    text-align: center;
    margin-bottom: .5rem;
}

/* ----------------------------------------------------------------------
   Page flybridge / Infynito
---------------------------------------------------------------------- */

.hero-flybridge {
    aspect-ratio: 9 / 16;
    width: 100%;
    position: relative;
    overflow: hidden;
    background-color: var(--color-light-grey);
    z-index: 0;
    /*z-index: -2;*/
    border: none;
    background: none;
    border-color: transparent;
}

.hero-fleet-text {
    position: absolute;
    top: 95%;
    left: var(--container-padding);
    transform: translateY(-50%);
    z-index: 2;
    text-transform: uppercase;
    font-size: max(2.5rem, calc(100vw * 0.03125));
    /*font-size: var(--font-custom-03);*/
    letter-spacing: var(--letter-spacing-m);
    color: white;
    white-space: nowrap;
    display: flex;
    gap: 0.05em;
}

@media (min-width: 768px) {

    .hero-flybridge {
        aspect-ratio: 1;
    }

    .hero-fleet-text {
        top: 50%;
    }

}

@media (min-width: 992px) {

    .hero-flybridge {
        aspect-ratio: 1920 / 850;
    }

}

.decor-flybridge-intro-top {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(-52%, -4%);
    width: clamp(280px, 20.83vw, 600px);
    height: auto;
    pointer-events: none;
    z-index: -1;
    padding: 0;
}

.flybridge-range-title {
    border-bottom: 1px solid;
    border-color: var(--color-dark-grey);
    padding-bottom: 0.5rem;
}

.model-name {
    font-family: 'SuisseIntl-Book';
}

.title-classic {
    text-transform: uppercase;
    font-size: var(--font-custom-01);
    font-family: 'Schnyder-S-Bold';
    letter-spacing: var(--letter-spacing-l);
}

.title-contemporary {
    text-transform: uppercase;
    font-size: var(--font-custom-01);
    font-family: 'SuisseIntl-Medium';
    letter-spacing: var(--letter-spacing-l);
}

.video-flybridge-container {
    aspect-ratio: 3 / 4;
    position: relative;
}

@media (min-width: 768px) {

    .video-flybridge-container {
        aspect-ratio: 1920 / 650;
    }

}

.video-flybridge {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: -1;
}

.video-flybridge-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    z-index: 3;
    position: relative;
}

    .video-flybridge-wrapper::after {
        content: "";
        background-color: rgba(0, 0, 0, 0.1);
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
        pointer-events: none;
    }

.hero-fleet-text.infynito {
    font-family: 'SweetSans-ExtraLight';
}

    .hero-fleet-text.infynito span {
        font-family: 'SweetSans-Medium';
    }

.decor-infynito-intro-right {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(0%, -5%);
    width: clamp(200px, 46.615vw, 1790px);
    height: auto;
    pointer-events: none;
    padding: 0;
}

.explore-title {
    font-family: 'SuisseIntl-Light';
    color: var(--color-ottanio);
    text-transform: uppercase;
    transform: translateX(-0.0825em);
    line-height: 0.75;
    margin-bottom: 0;
    text-wrap: nowrap;
}

    .explore-title.en {
        font-size: max(2rem, calc(100vw * 0.2262));
    }

    .explore-title.it {
        font-size: max(2rem, calc(100vw * 0.1745));
    }

    .explore-title.es {
        font-size: max(2rem, calc(100vw * 0.194));
    }

    .explore-title.ru {
        font-size: max(2rem, calc(100vw * 0.1315));
    }

    .explore-title.fr {
        font-size: max(2rem, calc(100vw * 0.196));
    }

    .explore-title.pt {
        font-size: max(2rem, calc(100vw * 0.194));
    }

    .explore-title.jp {
        font-size: max(1rem, calc(100vw * 0.0565));
    }

    .explore-title.de {
        font-size: max(2rem, calc(100vw * 0.185));
    }

    .explore-title.zh {
        font-size: max(2rem, calc(100vw * 0.137));
    }

.explore-subtitle {
    font-family: 'SuisseIntl-Book';
    color: var(--color-ottanio);
    text-transform: uppercase;
    font-size: var(--font-custom-04);
}

/* ----------------------------------------------------------------------
   Fleet 

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

.fleet-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-start;
    /*align-items: flex-start;*/
    align-items: flex-end;
}

.fleet-item {
    flex: 0 0 auto;
    text-align: center;
    margin-bottom: var(--padding-xs);
    display: flex;
    flex-direction: column;
    align-items: center;
}

    /* Flybridge Set */
    .fleet-item .model-number.flybridge {
        font-size: max(1.5rem, calc(100vw * 0.03645833));
        margin-bottom: 0;
        height: clamp(24px, calc(100vw * 0.0001 + 31.8px), 48px);
        transition: all 0.25s ease-in-out;
    }

    .fleet-item .model-badge.flybridge {
        color: var(--color-light-grey);
        border-color: var(--color-light-grey);
    }

    .fleet-item:hover .model-number.flybridge,
    .fleet-item:hover .model-badge.flybridge {
        color: var(--color-dark-grey);
    }

    .fleet-item:hover .model-badge.flybridge {
        border-color: var(--color-dark-grey);
    }

    /* INFYNITO Set */
    .fleet-item .model-number.infynito {
        font-size: max(1.5rem, calc(100vw * 0.03645833));
        margin-bottom: 0;
        height: clamp(24px, calc(100vw * 0.0001 + 31.8px), 48px);
        transition: all 0.25s ease-in-out;
        color: var(--color-ottanio);
    }

    .fleet-item .model-badge.infynito {
        color: var(--color-ottanio);
        border-color: var(--color-ottanio);
    }

    .fleet-item:hover .model-number.infynito,
    .fleet-item:hover .model-badge.infynito {
        color: var(--color-ottanio);
    }

    .fleet-item:hover .model-badge.infynito {
        border-color: var(--color-ottanio);
    }


    .fleet-item img.miniature {
        height: auto;
        width: auto;
        transform: scale(var(--scale, 1));
        transform-origin: bottom center;
        transition: transform 0.3s ease;
        display: block;
        margin: 0 auto;
        width: var(--boat-base, 12rem);
    }

/*     Set max-height img flybridge menu range
    .fleet-item img.miniature.flybridge {
        max-height: clamp(60px, calc(6.98vw - 43.98px), 120px);
    }*/

/*     Set max-height img INFYNITO menu range
    .fleet-item img.miniature.infynito {
        max-height: clamp(80px, calc(11.72vw - 45.02px), 240px)
    }*/

    .fleet-item:hover .wrapper-bottom {
        opacity: 1 !important;
    }

.wrapper-bottom {
    opacity: 0 !important;
    transition: all 0.25s ease-in-out;
}

.wrapper-img-miniature {
    display: flex;
    align-items: flex-end;
}

/* ----------------------------------------------------------------------
   Form
---------------------------------------------------------------------- */

.form-control {
    border: 2px solid;
    border-color: var(--color-dark-grey);
    border-radius: 0;
    font-family: 'SuisseIntl-Book';
    font-size: var(--font-sm);
    line-height: var(--line-h-l);
    letter-spacing: var(--letter-spacing-l);
    color: var(--color-dark-grey);
    padding: var(--padding-xs);
    background-color: rgba(209,205,199,0.3);
}

.form-select {
    border: 2px solid;
    border-color: var(--color-dark-grey);
    border-radius: 0;
    font-family: 'SuisseIntl-Book';
    font-size: var(--font-sm);
    line-height: var(--line-h-l);
    letter-spacing: var(--letter-spacing-l);
    color: var(--color-dark-grey);
    padding: var(--padding-xs);
    background-color: rgba(209,205,199,0.3);
}

.form-check-label {
    font-family: 'SuisseIntl-Book';
    font-size: var(--font-sm);
    letter-spacing: var(--letter-spacing-l);
    text-transform: uppercase;
}

.form-check-input[type=checkbox] {
    border-radius: 0;
    border-color: var(--color-dark-grey);
    border-width: 2px;
}

.wrapper-radio-button {
    display: block;
    align-items: center;
    gap: 1rem;
    justify-content: space-between;
}

.form-check-input[type=radio] {
    border-radius: 0;
    border-color: var(--color-dark-grey);
    border-width: 2px;
}

.wrapper-checks {
    margin-left: var(--padding-md);
    display: flex;
    justify-content: end;
}

.form-check-input:checked {
    background-color: var(--color-dark-grey);
}

@media (min-width: 768px) {

    .wrapper-radio-button {
        display: flex;
    }

}

/*---------------------     ALTERNATIVE FORM      ----------------------*/

.form-alternative .form-select,
.form-alternative .form-control {
    border-color: #ffffff;
    color: #ffffff;
    background-color: transparent;
}

    .form-alternative .form-select option {
        color: #212322;
    }

    .form-alternative .form-select {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFFFFF' viewBox='0 0 16 16'%3E%3Cpath d='M1.5 5.5l6 6 6-6'/%3E%3C/svg%3E");
    }

    .form-alternative .form-control::placeholder {
        color: #ffffff;
        opacity: 1;
    }

.form-alternative .form-check-input[type=checkbox],
.form-alternative .form-check-input[type=radio] {
    border-color: #ffffff;
}

/* ----------------------------------------------------------------------
   Footer
---------------------------------------------------------------------- */

.footer-list {
    color: #FFFFFF;
    text-transform: uppercase;
    overflow-x: hidden;
}

.wrapper-social {
    flex-wrap: nowrap;
    display: flex;
    justify-content: end;
}

.ico-social {
    display: inline-flex;
    margin-left: 0.375rem;
}

.modal-backdrop {
    z-index: 0;
}

footer a:hover,
.footer-list a:hover {
    color: inherit;
}

footer a:active,
.footer-list a:active {
    color: inherit;
}

footer a:visited,
.footer-list a:visited {
    color: inherit;
}

/* ----------------------------------------------------------------------
   Our Worlds
---------------------------------------------------------------------- */


@media (min-width: 992px) {

    .float-world-intro {
        position: absolute;
        margin-bottom: 0;
        top: 20px;
    }

    html[lang="it-IT"] .float-world-intro,
    html[lang="es-ES"] .float-world-intro,
    html[lang="ru-RU"] .float-world-intro,
    html[lang="fr-FR"] .float-world-intro,
    html[lang="pt-PT"] .float-world-intro,
    html[lang="de-DE"] .float-world-intro {
        position: relative;
        margin-bottom: 2rem;
    }

}

.video-ourworld-container {
    aspect-ratio: 4 / 3;
    position: relative;
}

@media (min-width: 992px) {

    .video-ourworld-container {
        aspect-ratio: 1920 / 650;
    }

}

.video-ourworld {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    z-index: -1;
}

.partners-row {
    display: block;
}

.partner {
    display: table;
    margin: 3rem auto;
    max-width: 70%;
}

    .partner img {
        max-width: 100%;
        height: auto;
        object-fit: contain;
        display: block;
    }

@media (min-width: 768px) {

    .partners-row {
        display: flex;
        gap: 1rem;
        width: 100%;
        box-sizing: border-box;
        align-items: center;
    }

    .partner {
        flex: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        max-width: 100%;
        margin: initial;
    }

}

.heritage-years {
    font-family: 'Schnyder-S-Light';
    font-size: clamp(2.25rem, 3.385vw, 4.0625rem);
    line-height: 1;
    text-transform: uppercase;
    color: var(--dark-grey);
}

.heritage-title {
    font-family: 'SuisseIntl-Book';
    font-size: clamp(1.125rem, 1.302vw, 1.5625rem);
    text-transform: uppercase;
    margin-right: var(--padding-xs);
    line-height: 1;
}

.heritage-text {
    font-family: 'SuisseIntl-Regular';
    font-size: clamp(1rem, 0.9375vw, 1.125rem);
    line-height: 1.1;
    margin-right: var(--padding-xs);
}

#heritage .owl-carousel .owl-stage {
    padding-left: 0 !important;
}

.accordion-separator {
    border-bottom: 1.5px solid;
    border-color: var(--color-dark-grey);
}

/* ----------------------------------------------------------------------
   Dealer network
---------------------------------------------------------------------- */

.dropdown-menu {
    min-width: calc(100% - 3%);
    border-radius: 0;
}

.dropdown-item {
    text-transform: uppercase;
    font-size: 0.875rem;
    padding: 0.5rem 1rem;
}

.sub-button {
    font-size: 0.875rem;
}

    .sub-button.dropdown-toggle::after {
        border: none;
        transform: translateY(-45%) rotate(0deg);
        transition: transform 0.3s ease;
    }

    .sub-button.dropdown-toggle.show::after {
        transform: translateY(-45%) rotate(90deg);
    }

.box-results {
    background-color: var(--color-dark-grey);
    color: #FFFFFF;
    border-radius: 0;
}

.box-results p {
    margin-bottom: 0;
}

.dealer-mail {
    text-decoration: underline;
}

.dealer-select {
    position: relative;
    transition: transform 0.3s ease;
}

.dealer-select select {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
}

.dealer-select::after {
    content: "";
    background-image: url(../img/right-arrow.svg);
    width: 20px;
    height: 15px;
    position: absolute;
    top: 50%;
    right: 10%;
    transform: translateY(-45%);
    background-repeat: no-repeat;
}

    .dealer-select:hover::after {
        filter:invert(1);
    }

    .dealer-select:focus-within::after {
        transform: translateY(-50%) rotate(90deg);
    }

    .dealer-select select[disabled="disabled"] {
        background-color: #ccc;
    }

.img-decor-dealers {
    aspect-ratio: 5 / 3;
    object-fit: cover;
    object-position: 65%;
}

@media (min-width: 768px) {

    .img-decor-dealers {
        aspect-ratio: 1820 / 750;
    }

}

.box-preowned-container {
    aspect-ratio: 3 / 4;
    position: relative;
}

.img-preowned-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 16%;
    z-index: -1;
}

@media (min-width: 768px) {

    .box-preowned-container {
        aspect-ratio: 1920 / 650;
    }

    .img-preowned-container {
        object-position: center;
    }

}

.animated-number {
    font-size: max(11rem, calc(100vw * 0.1302083)) !important;
}

@media (max-width: 991.98px) {
    .mt-title-custom {
        margin-top: 4rem;
    }
}

/* ----------------------------------------------------------------------
   Contacts
---------------------------------------------------------------------- */

.img-contacts {
    width: 100%;
    aspect-ratio: 1820 / 750;
    object-fit: cover;
}

.spin-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    background: rgba(255,255,255,0.75);
}

    .spin-overlay .loader span {
        display: inline-block;
        width: 12px;
        height: 12px;
        margin: 3px;
        border-radius: 50%;
        background: #333;
        animation: loader-bounce 1.2s infinite ease-in-out both;
    }

@keyframes loader-bounce {
    0%, 80%, 100% {
        transform: scale(0);
    }

    40% {
        transform: scale(1);
    }
}

/* ----------------------------------------------------------------------
   Clamp
---------------------------------------------------------------------- */

.read-more-btn {
    font-family: 'SuisseIntl-Regular';
    font-size: var(--font-xs);
    letter-spacing: var(--letter-spacing-xl);
    text-transform: uppercase;
    position: relative;
    margin-bottom: 1.5rem;
}

.read-more-btn::after {
    content: "";
    background-image: url("../img/dropdown.svg");
    width: 12px;
    height: 7px;
    position: absolute;
    top: 50%;
    right: -20px;
    transform: translateY(-50%) rotate(0deg);
    transform-origin: center center;
    background-repeat: no-repeat;
    background-position: right;
    transition: transform 0.4s ease;
    filter: invert(1);
    transition: all 0.3s ease;
}

    .read-more-btn[aria-expanded="true"]::after {
        transform: translateY(-50%) rotate(180deg);
    }

@media (max-width: 991.98px) {
    .text-content {
        position: relative;
        overflow: hidden;
        transition: max-height 0.3s ease;
        padding-right: 1.25em;
    }

        /* Puntini: mostrali solo quando JS mette .is-clamped */
        .text-content.is-clamped:not(.expanded)::after {
            content: "\2026";
            position: absolute;
            right: 15px;
            bottom: 2px;
            line-height: 1;
            padding-left: 0.35em;
            background: linear-gradient( to right, rgba(255, 255, 255, 0), var(--ellipsis-bg, #fff) 55% );
        }
}