@charset "utf-8";

/*** Code by Daniele Dalla Bona https://danieledallabona.com  ***/

/***
Theme Name: Frabosa
Description: Frabosa
Theme URL: https://danieledallabona.com
Author: Daniele Dalla Bona
Version: 1.0
***/

/*** This is where the caos starts ***/

/*** Webfont: JetBrains Mono ***/

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap');

/*** Webfont: AcuminPro ***/

@font-face {
font-family: 'AcuminPro';
src: url('../fonts/AcuminPro-Regular.woff') format('woff'),
url('../fonts/AcuminPro-Regular.woff2') format('woff2');
font-display: swap;
font-style: normal;
font-weight: 400;
}

@font-face {
font-family: 'AcuminPro';
src: url('../fonts/AcuminPro-Medium.woff') format('woff'),
url('../fonts/AcuminPro-Medium.woff2') format('woff2');
font-display: swap;
font-style: normal;
font-weight: 500;
}

@font-face {
font-family: 'AcuminPro';
src: url('../fonts/AcuminPro-Semibold.woff') format('woff'),
url('../fonts/AcuminPro-Semibold.woff2') format('woff2');
font-display: swap;
font-style: normal;
font-weight: 600;
}

@font-face {
font-family: 'AcuminPro';
src: url('../fonts/AcuminPro-Bold.woff') format('woff'),
url('../fonts/AcuminPro-Bold.woff2') format('woff2');
font-display: swap;
font-style: normal;
font-weight: 700;
}

/* --- RESET BASE --- */

*,
*::before,
*::after {
margin: 0;
padding: 0;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
}

/* Remove default browser focus only if we restyle it later */
*:focus {
outline: none;
}

button,
a,
.icon,
.no-select {
-webkit-user-select: none;
user-select: none;
}

/* HTML Structural defaults */
html, body {
width: 100%;
height: 100%;
scroll-behavior: smooth;
-webkit-text-size-adjust: 100%;
text-size-adjust: 100%;

}

/* Remove default styles */
body {
margin: 0;
}

/* Display block modern elements */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}

/* Typography inheritance */
html, body {
font: inherit;
}

/* Lists */
ul, ol {
list-style: none;
}

/* Links */
a {
text-decoration: none;
color: inherit;
}

/* Media defaults */
img, picture, video, canvas, svg, iframe {
display: block;
max-width: 100%;
height: auto;
}

/* Prevent weird baseline alignment */
img, svg, video, canvas, iframe {
vertical-align: middle;
}

/* SVG inherit color */
svg {
fill: currentColor;
overflow: visible;
}

/* Forms reset minimal */
button, input, textarea, select {
font: inherit;
background: none;
border: none;
}

/* Tables */
table {
border-collapse: collapse;
border-spacing: 0;
}

/* Strong & bold */
b, strong {
font-weight: var(--font-weight-7);
}

#page-transition {
position: fixed;
inset: 0;
background: #fff;
z-index: 99999;
pointer-events: none;
opacity: 0;
transition: opacity .75s ease-in-out;
}

/* Stato iniziale: schermata coperta */
html.page-start #page-transition {
opacity: 1;
pointer-events: auto;
}

/* Fade out */
html.page-transition-out #page-transition {
opacity: 1;
pointer-events: auto;
}

/* Fade in */
html.page-transition-in #page-transition {
opacity: 0;
pointer-events: none;
}   


:root {
--color-brand-transparent: transparent;
--color-brand-white: #FFFFFF;
--color-brand-black: #000000;
--color-brand-grey: #AFAFAF;
--color-brand-light-grey: #F5F5F5;
--color-brand-red: #C61919;
--color-brand-blue: #0085CF;
--wrapper: 48px;
--img-border-radius: 10px;
--cta-border-radius: 6px;
--page-width: 1280px;
--transition: all 250ms ease-in-out;
--font-body-family: "AcuminPro", sans-serif;
--font-mono-family: "JetBrains Mono", monospace;
--topbar-height:36px;
--header-desk-height:85px;

--font-weight-3: 300;
--font-weight-4: 400;
--font-weight-5: 500;
--font-weight-6: 600;
--font-weight-7: 700;

--font-size-title1: 64px;
--line-height-title1: 68px;
--letter-spacing-title1: -1px;

--font-size-title2: 42px;
--line-height-title2: 46px;
--letter-spacing-title2: -.6px;

--font-size-body: 16px;
--line-height-body: 26px;
--letter-spacing-body: normal;

--font-size-copy2: 14px;
--line-height-copy2: 20px;
--letter-spacing-copy2: normal;

--font-size-copy3: 12px;
--line-height-copy3: 12px;
--letter-spacing-copy3: normal;

--header-nav-link-size: 18px;
--header-nav-link-line-height: 1;
--header-nav-link-letter-spacing: .2px;

--megamenu-link-size: 20px;
--megamenu-link-line-height: 1;
--megamenu-link-letter-spacing: .2px;
--megamenu-width: 1440px;

--text-decoration-underline: underline;
--margin-auto: 0 auto;
}

@media (max-width: 1023px) {

:root {
--wrapper: 16px;

--font-size-title1: 36px;
--line-height-title1: 42px;
--letter-spacing-title1: -.6px;

--font-size-title2: 30px;
--line-height-title2: 36px;
--letter-spacing-title2: -.6px;

--font-size-body: 16px;
--line-height-body: 26px;
--letter-spacing-body: normal;

--font-size-copy2: 14px;
--line-height-copy2: 20px;
--letter-spacing-copy2: normal;

--font-size-copy3: 12px;
--line-height-copy3: 12px;
--letter-spacing-copy3: normal;

--topbar-height:36px;
--header-mob-height:61px;
}

}

/* Chrome, Edge, Safari */
::-webkit-scrollbar {
width: 10px; /* spessore */
}

::-webkit-scrollbar-track {
background: #f0f0f0; /* colore track */
}

::-webkit-scrollbar-thumb {
background-color: #ccc; /* colore barra */
border-radius: 4px; /* arrotondamento */
border: 2px solid #f0f0f0; /* crea un po’ di spazio intorno */
}

::-webkit-scrollbar-thumb:hover {
background-color: #555; /* hover */
}

/* Firefox */
html {
scrollbar-width: thin; /* "thin" rende la barra più sottile */
scrollbar-color: #ccc #f0f0f0; /* thumb track */
}

body {
height: 100%;
background: var(--color-brand-white);
color: var(--color-brand-black);
font-family: var(--font-body-family);
font-size: var(--font-size-copy1);
line-height: var(--line-height-copy1);
font-weight: var(--font-weight-4);
letter-spacing: var(--letter-spacing-copy1);
}

.noScroll {
overflow: hidden;
position: static;
height: auto;
}

.wrapper{
padding-left: var(--wrapper);
padding-right: var(--wrapper);
}

.img-border-radius{
border-radius: var(--img-border-radius);
}



/*** Images Aspect Ratio ***/

.aspect-1\/1{
aspect-ratio: 1/1;
}

.aspect-4\/5{
aspect-ratio: 4/5;
}

.aspect-16\/9{
aspect-ratio: 16/9;
}

.aspect-16\/10{
aspect-ratio: 16/10;
}



/***  Buttons / Labels / Tags  ***/

a.cta-outline-red-header:link,
a.cta-outline-red-header:visited{
font-size: 14px;
font-weight: var(--font-weight-7);
letter-spacing: normal;
text-transform: uppercase;
color: var(--color-brand-red);
background: var(--color-brand-transparent);
padding: 13px 24px 10px;
border-radius: var(--cta-border-radius);
border: 1px solid var(--color-brand-red);
box-sizing: border-box;
transition: var(--transition);
height: 40px;
line-height: 1;
display: inline-flex;
align-items: center;
outline: 1px solid transparent;
}

a.cta-outline-red-header:hover{
color: var(--color-brand-white);
background: var(--color-brand-red);
}

a.cta-outline-red:link,
a.cta-outline-red:visited{
font-size: 14px;
font-weight: var(--font-weight-7);
letter-spacing: normal;
text-transform: uppercase;
color: var(--color-brand-red);
background: var(--color-brand-transparent);
padding: 13px 24px 10px;
border-radius: var(--cta-border-radius);
border: 1px solid var(--color-brand-red);
box-sizing: border-box;
transition: var(--transition);
height: 48px;
line-height: 1;
display: inline-flex;
align-items: center;
outline: 1px solid transparent;
gap: 8px;
}

a.cta-outline-red:hover{
color: var(--color-brand-white);
background: var(--color-brand-red);
}

a.cta-outline-white:link,
a.cta-outline-white:visited{
font-size: 14px;
font-weight: var(--font-weight-7);
letter-spacing: normal;
text-transform: uppercase;
color: var(--color-brand-white);
background: var(--color-brand-transparent);
padding: 13px 24px 10px;
border-radius: var(--cta-border-radius);
border: 1px solid var(--color-brand-white);
box-sizing: border-box;
transition: var(--transition);
height: 48px;
line-height: 1;
display: inline-flex;
align-items: center;
outline: 1px solid transparent;
gap: 8px;
}

a.cta-outline-white:hover{
color: var(--color-brand-black);
background: var(--color-brand-white);
}

a.cta-outline-red svg,
a.cta-outline-white svg{
margin-bottom: 3px;
vertical-align: middle;
display: block;
flex-shrink: 0;
}

a.cta-underline-red{
display: inline-block;
font-size: 20px;
line-height: 1;
font-weight: 600;
padding-bottom: 2px;
color: var(--color-brand-red);
border-bottom: 2px solid var(--color-brand-red);
}

a.cta-underline-red:hover{
border-bottom: 2px solid var(--color-brand-transparent);
}

@media (max-width: 1023px) {

a.cta-outline-red-header:hover{
color: var(--color-brand-red);
background: var(--color-brand-transparent);
}

a.cta-outline-red:hover{
color: var(--color-brand-red);
background: var(--color-brand-transparent);
}

a.cta-outline-white:hover{
color: var(--color-brand-white);
background: var(--color-brand-transparent);
}

a.cta-underline-red{
font-size: 15px;
}

a.cta-underline-red:hover{
border-bottom: 2px solid var(--color-brand-red);
}

}

/*** 404 ***/

.container-404{
width: 100%;
height: calc(100vh - (var(--topbar-height) + var(--header-desk-height)));
display: flex;
align-items: center;
justify-content: flex-start;
position: relative;
}

.container-404::before {
content: "";
left: 0;
right: 0;
bottom: 0;
z-index: 1;
height: 100%;
width: 50%;
opacity: .64;
display: block;
position: absolute;
background: linear-gradient(90deg, var(--color-brand-black), transparent);
}

.container-404 img{
position: absolute;
z-index: -1;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
}

.container-404 .message{
position: relative;
z-index: 9;
padding: var(--wrapper);
}

.container-404 .message h1{
font-size: var(--font-size-title2);
line-height: var(--line-height-title2);
letter-spacing: var(--letter-spacing-title2);
font-weight: var(--font-weight-7);
color: var(--color-brand-white);
text-align: left;
margin-bottom: 16px;
}

.container-404 .message p{
font-size: var(--font-size-body);
line-height: var(--line-height-body);
letter-spacing: var(--letter-spacing-body);
font-weight: var(--font-weight-5);
color: var(--color-brand-white);
text-align: left;
margin-bottom: 24px;
}


@media (max-width: 1023px) {

.container-404{
height: calc(100vh - (var(--topbar-height) + var(--header-mob-height)));
align-items: flex-end;
}

.container-404::before {
content: "";
left: 0;
right: 0;
bottom: 0;
z-index: 1;
height: 64%;
width: 100%;
opacity: .72;
display: block;
position: absolute;
background: linear-gradient(0deg, var(--color-brand-black), transparent);
}

.container-404 img{
object-position: center top;
}

.container-404 .message{
padding: calc(var(--wrapper)*2) var(--wrapper);
}

.container-404 .message h1{
margin-bottom: 8px;
}

}


/*** Site Header Desktop ***/

.site-header {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 999;
transition: transform 0.3s ease;
}

.site-header.fixed {
position: fixed;
top: 0;
left: 0;
}

.site-header.hide {
transform: translateY(-100%);
}

.site-header-mobile {
display: none;
}


/*** Topbar ***/

.topbar{
background: var(--color-brand-light-grey);
width: 100%;
height: var(--topbar-height);
display: flex;
align-items: center;
justify-content: flex-end;
padding: 0 var(--wrapper);
}

.topbar .container{
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
}

.topbar .season-menu-container{
display: flex;
flex-direction: row;
flex-wrap: nowrap;
font-family: var(--font-mono-family);
font-size: 12px;
line-height: 1;
color: var(--color-brand-grey);
gap: 16px;
}

.topbar .season-menu-container a:link,
.topbar .season-menu-container a:visited{
display: flex;
flex-direction: row;
flex-wrap: nowrap;
font-family: var(--font-mono-family);
font-size: 12px;
line-height: 1;
font-weight: var(--font-weight-5);
color: var(--color-brand-grey);
transition: var(--transition);
}

.topbar .season-menu-container a:hover{
color: var(--color-brand-red);
cursor: pointer;
}

.topbar .season-menu-container a:link.active,
.topbar .season-menu-container a:visited.active{
color: var(--color-brand-red);
}

.topbar .divider{
width: 1px;
height: 20px;
background-color: var(--color-brand-black);
opacity: 0.16;
margin: 0 16px;
}

.topbar .utilities{
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
gap: 12px;
}

.topbar .utilities img{
width: 18px;
opacity: .32;
transition: var(--transition);
}

.topbar .utilities img:hover{
width: 18px;
opacity: 1;
}



/*** Header Desktop ***/

.header{
background: var(--color-brand-white);
width: 100%;
height: var(--header-desk-height);
border-bottom: 1px solid var(--color-brand-light-grey);
transform: translateY(0px);
-webkit-transform: translateY(0px);
transition: transform 500ms cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
}

.header .container {
position: relative;
height: 100%;
display: flex;
align-items: center;
justify-content: space-between;
margin: var(--margin-auto);
width: 100%;
max-width: 100%;
}

.header .logo{
z-index: 9;
}

.header .logo img{
display: block;
height: 56px;
}

.header .nav {
position: absolute;
z-index: 1;
left: 0;
background: var(--color-brand-transparent);
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}

.header .utilities {
z-index: 9;
}

.header ul.nav-list {
height: 100%;
}

.header .nav > ul > li {
display: inline-block;
margin: 0 16px;
position: relative;
height: 100%;
}

.header .nav > ul > li > a {
display: flex;
align-items: center;
height: 100%;
font-size: var(--header-nav-link-size);
line-height: var(--header-nav-link-line-height);
letter-spacing: var(--header-nav-link-letter-spacing);
font-weight: var(--font-weight-6);
color: var(--color-brand-black);
padding: 0;
border-bottom: 0px solid transparent;
transition: var(--transition);
}

.header .nav > ul > li > a.active {
color: var(--color-brand-red);
}

.header .nav > ul > li > a.active:before {
background-color: var(--color-brand-red);
}

.header .nav > ul > li:hover > a {
color: var(--color-brand-red);
}

.header .nav > ul > li > a:before{
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 4px;
background-color: var(--color-brand-transparent);
transition: var(--transition);
}

/*** Megamenu ***/

.megamenu-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: rgba(0, 0, 0, 0.72); 
backdrop-filter: blur(3px);
-webkit-backdrop-filter: blur(3px);
opacity: 0;
visibility: hidden;
transition: opacity 0.0s ease, visibility 0.0s ease;
z-index: 998;
}

.megamenu-overlay.active {
opacity: 1;
visibility: visible;
}

.megamenu-overlay:hover {
cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cline x1='0' y1='0' x2='16' y2='16' stroke='white' stroke-width='1.5' stroke-linecap='square'/%3E%3Cline x1='16' y1='0' x2='0' y2='16' stroke='white' stroke-width='1.5' stroke-linecap='square'/%3E%3C/svg%3E") 8 8, auto; }

.megamenu {
background: var(--color-brand-white);
opacity: 0;
pointer-events: none;
transition: opacity 0s ease;
position:fixed;
left: 0;
top: 85px;
width: 100%;
padding: 64px var(--wrapper);
}

.megamenu.active {
opacity: 1;
pointer-events: auto;
}

.megamenu-close {
position: absolute;
top: 24px;
right: var(--wrapper);
cursor: pointer;
z-index: 1000;
height: 16px;
}

.dropdown {
position: static;
}

.megamenu .megamenu-container  {
width: 100%;
max-width: var(--megamenu-width);
margin: var(--margin-auto);
}

.megamenu .megamenu-container .row {
display: flex;
flex-wrap: nowrap;
margin: 0 -12px;
}

.megamenu .megamenu-container .row .clmn{
width: 50%;
margin: 0 12px;
}

.megamenu .megamenu-container h4{
font-size: 42px;
line-height: 1;
font-weight: var(--font-weight-4);
color: var(--color-brand-grey);
margin-bottom: 24px;
}

.megamenu .megamenu-container ul li{
list-style-type: none;
padding: 8px 0;
}

.megamenu .megamenu-container a:link,
.megamenu .megamenu-container a:visited{
font-size: var(--megamenu-link-size);
line-height: var(--megamenu-link-line-height);
letter-spacing: var(--megamenu-link-letter-spacing);
font-weight: var(--font-weight-5);
color: var(--color-brand-black);
text-decoration: none;
transition: var(--transition);
display: table;
}

.megamenu .megamenu-container a:hover{
color: var(--color-brand-red);
}

.header .utilities {
display: flex;
align-items: center;
}

.header-mobile {
display: none;
}

.nav-menu {
display: none;
}



@media (max-width: 1023px) {


body.noScrollMobile {
  overflow: hidden;
}

.site-header {
display: none;
}

.site-header-mobile {
display: block;
}

.site-header-mobile {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 999;
transition: transform 0.3s ease;
}

.site-header-mobile.fixed {
position: fixed;
top: 0;
left: 0;
}

.site-header-mobile.hide {
transform: translateY(-100%);
}

.topbar .season-menu-container a:hover{
color: var(--color-brand-grey);
cursor: pointer;
}

.topbar .divider{
display: none;
}

.topbar .utilities{
display: none;
}

.header-mobile {
display: block;
background: var(--color-brand-white);
transition: all 0.5s ease-in-out;
z-index: 999;
width: 100%;
border-bottom: 1px solid var(--color-brand-light-grey);
}

.header-mobile .container {
width: 100%;
height: 100%;
padding: 0 var(--wrapper);
display: flex;
align-items: center;
justify-content: space-between;
}

.header-mobile .logo img {
height: 38px;
}

/* BURGER MENU */
.button-menu-mobile {
display: flex;
justify-content: center;
align-items: center;
width: 52px;
height: 60px;
cursor: pointer;
position: relative;
z-index: 2000;
margin-right: -16px;
}

/* MENU FULLSCREEN */
.nav-menu {
position: fixed;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: var(--color-brand-white);
z-index: 1000;
display: flex;
flex-direction: column;
transition: left 0.25s ease;
overflow: hidden;
}

.nav-menu-active { left: 0; }

/* HEADER MENU */
.menu-header {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0;
}

.menu-header span {
cursor: pointer;
font-size: 12px;
line-height: 1;
font-weight: 500;
color: var(--color-brand-black);
user-select: none;
text-decoration: underline;
padding: 24px 16px;
}

.menu-header span img {
height: 16px;
display: block;
}

.menu-header span:first-child {

}

/* Main Menu */
.main-menu {
list-style: none;
padding: 24px 16px;
margin: 0;
flex-grow: 1;
overflow-y: auto;
}

.main-menu li { 
padding: 6px 0; 
}

.main-menu li a {
font-size: 32px;
line-height: 1;
font-weight: 600;
color: var(--color-brand-black);
text-decoration: none;
display: block;
}

/* Submenu */

.submenu {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: var(--color-brand-white);
list-style: none;
padding: 0;
margin: 0;
display: flex;
flex-direction: column;
opacity: 0;
pointer-events: none;
transition: opacity 0 ease;
z-index: 1100;
}

.submenu.active {
opacity: 1;
pointer-events: auto;
}

.submenu-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 24px;
}

.submenu-header span {
cursor: pointer;
font-size: 12px;
line-height: 1;
font-weight: 500;
color: var(--color-brand-black);
user-select: none;
padding: 24px 16px;
}

.submenu-header span:nth-child(2) {
position: absolute;
left: 50%;
transform: translateX(-50%);
}

.submenu-header img{
height: 16px;
display: block;
}

.submenu li { 
padding: 6px 16px;
}

.submenu li:first-child { 
padding: 0 0;
}

.submenu li a {
font-size: 32px;
line-height: 1;
font-weight: 600;
color: var(--color-brand-black);
text-decoration: none;
display: block;
}

.back-submenu, .close-menu, .home-link {
cursor: pointer;
user-select: none;
font-weight: 600;
}

/* BOTTOM AREA */
.bottom {
margin-top: auto;
padding: 16px;
border-top: 1px solid var(--color-brand-light-grey);
}

.bottom .cta-header-filled-red {
display: inline-block;
background: var(--color-brand-red);
color: var(--color-brand-white);
text-align: center;
font-weight: 600;
padding: 12px 16px;
border-radius: 6px;
text-decoration: none;
margin-bottom: 16px;
width: 100%;
}

.bottom .services {
display: flex;
align-items: center;
gap: 16px;
}

.bottom .services a {
display: flex;
align-items: center;
gap: 10px;
text-decoration: none;
color: var(--color-brand-black);
}

.bottom .services img {
width: 36px;
}

}


/*** Main Container ***/

.main-container{
padding-top: 121px;
}

@media (max-width: 1023px) {

.main-container{
padding-top: 97px;
}

}


/*** HP Hero Banner Logo ***/

.hero-banner-logo{
width: 100%;
padding: 64px var(--wrapper);
display: flex;
align-items: center;
justify-content: center;
}

.hero-banner-logo img{
width: 100%;
max-width: 320px;
display: block;
}


@media (max-width: 1023px) {

.hero-banner-logo{
padding: 48px var(--wrapper);
}

.hero-banner-logo img{
width: 100%;
max-width: 280px;
display: block;
}

}

/*** HP Hero Banner Season ***/

.hero-banner-season{
position: relative;
width: 100%;
/* height: calc(100vh - (var(--header-desk-height) + var(--topbar-height)));
height: 100vh; */
}

.hero-banner-season::before{
content: "";
left: 0;
right: 0;
bottom: 0;
z-index: 2;
height: 50%;
opacity: .72;
display: block;
position: absolute;
background: linear-gradient(0deg, var(--color-brand-black), transparent);
}

.hero-banner-season img{
position: relative;
z-index: 1;
width: 100%;
/* height: 100%;
object-fit: cover;
object-position: top center; */
}

.hero-banner-season .claim{
position: absolute;
z-index: 5;
bottom: 0;
left: 0;
padding: var(--wrapper);
width: 100%;
display: flex;
flex-direction: column;
align-items: flex-start;
}

.hero-banner-season .claim h1{
font-size: var(--font-size-title1);
line-height: var(--line-height-title1);
letter-spacing: var(--letter-spacing-title1);
font-weight: var(--font-weight-7);
color: var(--color-brand-white);
text-align: left;
}

.hero-banner-season .claim p{
font-size: var(--font-size-body);
line-height: var(--line-height-body);
letter-spacing: var(--letter-spacing-body);
font-weight: var(--font-weight-5);
color: var(--color-brand-white);
text-align: left;
padding-top: 8px;
width: 72%;
}

@media (max-width: 1023px) {

.hero-banner-season{
height: auto;
aspect-ratio: 4/5;
}

.hero-banner-season img{
position: relative;
width: 100%;
height: auto;
}

.hero-banner-season .claim{
position: absolute;
z-index: 5;
bottom: 0;
left: 0;
padding: calc(var(--wrapper) *1.5) var(--wrapper);
width: 100%;
height: auto;
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-wrap: wrap;
}

.hero-banner-season .claim p{
display: none;
}

}








/*** HP About Section ***/

.hp-about-section{
width: 100%;
padding: 120px var(--wrapper);
}

.hp-about-section .container{
width: 100%;
max-width: var(--page-width);
margin: var(--margin-auto);
display: flex;
flex-wrap: nowrap;
flex-direction: row-reverse;
align-items: center;
}

.hp-about-section .left{
width: 50%;
padding: 0 0 0 calc(var(--wrapper) *2);
}

.hp-about-section .left h3{
font-size: var(--font-size-title2);
line-height: var(--line-height-title2);
letter-spacing: var(--letter-spacing-title2);
font-weight: var(--font-weight-7);
text-align: left;
}

.hp-about-section .left p{
font-size: var(--font-size-body);
line-height: var(--line-height-body);
letter-spacing: var(--letter-spacing-body);
font-weight: var(--font-weight-5);
padding-top: 16px;
padding-bottom: 24px;
text-align: left;
}

.hp-about-section .right{
width: 50%;
}

@media (max-width: 1023px) {

.hp-about-section{
width: 100%;
padding: 72px var(--wrapper) 72px;
}

.hp-about-section .container{
flex-direction: column-reverse;
align-items: flex-start;
}

.hp-about-section .left{
width: 100%;
padding: 0 0;
}

.hp-about-section .right{
width: 100%;
height: auto;
margin-bottom: 24px;
}

.hp-about-section .left p{
padding-top: 8px;
}

}

/*** Break Image Mobile ***/

.break-image-mobile{
padding: 0 var(--wrapper);
}

.break-image-mobile img{
width: 100%;
}


/*** Inner Season Menu ***/

.inner-season-menu {
width: 100%;
padding: 0 var(--wrapper) 0;
}

.inner-season-menu .container {
width: 100%;
max-width: var(--page-width);
margin: var(--margin-auto);
display: flex;
flex-wrap: nowrap;
align-items: center;
}

.inner-season-menu .container .menu {
width: 50%;
display: flex;
flex-direction: column;
}

.menu-text p{
font-family: var(--font-mono-family);
font-size: 16px;
line-height: 1;
text-align: left;
font-weight: var(--font-weight-4);
text-transform: uppercase;
margin-bottom: 48px;
}

.inner-season-menu .container .menu .menu-wrapper {
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
flex: 1;
}

.inner-season-menu .container .menu .menu-wrapper a {
display: inline-flex;
align-items: center;
font-size: 42px;
line-height: 125%;
font-weight: 700;
color: #000;
text-decoration: none;
transition: 0.25s ease;
}

.inner-season-menu .container .menu .menu-wrapper a svg {
margin-left: 12px;
opacity: 0;
margin-bottom: 3px;
transition: opacity 0.5s ease;
will-change: opacity;
transform: translateZ(0);
backface-visibility: hidden;
}

.inner-season-menu .container .menu .menu-wrapper a:hover {
color: var(--color-brand-red);
}

.inner-season-menu .container .menu .menu-wrapper a:hover svg {
opacity: 1;
visibility: visible;
}

.inner-season-menu .container .image {
position: relative;
width: 50%;
height: 100%;
overflow: hidden;
aspect-ratio: 4/5;
}

.inner-season-menu .container .image a {
position: absolute;
inset: 0;
display: block;
opacity: 0;
pointer-events: none;
transition: opacity 0.25s ease;
}

.inner-season-menu .container .image a img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}

.inner-season-menu .container .image img.active {
opacity: 1;
}

.inner-season-menu .container .image a:has(img.active) {
opacity: 1;
pointer-events: auto;
z-index: 2;
}

.inner-season-menu .container .image a {
transition: opacity 0.25s ease;
}



@media (max-width: 1023px) {

.inner-season-menu {
width: 100%;
padding: 72px var(--wrapper);
}

.inner-season-menu .container .menu {
width: 100%;
}

.menu-text p{
font-size: 14px;
margin-bottom: 32px;
}

.inner-season-menu .container .image {
display: none;
}

.inner-season-menu .container .menu .menu-wrapper a {
font-size: 32px;
line-height: 135%;
}

.inner-season-menu .container .menu .menu-wrapper a:hover {
color: var(--color-brand-black);
}

.inner-season-menu .container .menu .menu-wrapper a:hover svg {
opacity: 0;
visibility: visible;
}

}






/*** Claim ***/

.claim{
width: 100%;
padding: 120px var(--wrapper);
}

.claim h3{
font-size: clamp(32px, 4vw, 64px);
line-height: 110%;
letter-spacing: var(--letter-spacing-title1);
font-weight: var(--font-weight-7);
color: var(--color-brand-black);
text-align: left;
}

@media (max-width: 1023px) {
.claim{

padding: 72px var(--wrapper);
}
}


/*** Outro Image ***/

.outro-image{
position: relative;
width: 100%;
/* height: calc(100vh - (var(--header-desk-height) + var(--topbar-height))); */
}

.outro-image img{
width: 100%;
/* height: 100%;
object-fit: cover;
object-position: center center; */
}


/*** Skipass Section Footer ***/

.skipass-section-footer{
width: 100%;
background: var(--color-brand-light-grey);
padding: 120px var(--wrapper);
}

.skipass-section-footer .container{
width: 100%;
max-width: var(--page-width);
margin: var(--margin-auto);
}

.skipass-section-footer .container .row{
display: flex;
flex-direction: row;
flex-wrap: nowrap;
margin: 0 -12px;
}

.skipass-section-footer .container .row .item{
width: 50%;
margin: 0 12px;
display: flex;
align-items: center;
}

.skipass-section-footer .container .row .item .content{
padding-right: var(--wrapper);
}

.skipass-section-footer .container .item p.title{
font-size: var(--font-size-title2);
line-height: var(--line-height-title2);
letter-spacing: var(--letter-spacing-title2);
font-weight: var(--font-weight-7);
text-align: left;
}

.skipass-section-footer .container .item p.copy{
font-size: var(--font-size-body);
line-height: var(--line-height-body);
letter-spacing: var(--letter-spacing-body);
font-weight: var(--font-weight-5);
padding-top: 16px;
padding-bottom: 24px;
text-align: left;
}



/*** Mobile — Max Width 1023px ***/

@media (max-width: 1023px) {

.skipass-section-footer{
padding: 48px var(--wrapper) 48px;
}

.skipass-section-footer .container .row{
flex-direction: column-reverse;
flex-wrap: wrap;
margin: -12px 0;
}

.skipass-section-footer .container .row .item{
width: 100%;
margin: 12px 0;
align-items: flex-start;
}

.skipass-section-footer .container .row .item .content{
padding-right: 0;
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
}

.skipass-section-footer .container .item p.title{
text-align: left;
}

.skipass-section-footer .container .item p.copy{
padding-top: 8px;
padding-bottom: 24px;
text-align: left;
}

}






/*** Footer ***/

.footer {
position: relative;
padding: 120px var(--wrapper) 16px;
}

.footer .sitemap {
width: 100%;
max-width: var(--page-width);
margin: 0 auto;
}

.footer .sitemap .row {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: stretch;
margin: 0 -12px;
}

.footer .sitemap .row .left{
width: 33.333333%;
display: flex;
align-items: flex-start;
flex-direction: row;
}

.footer .sitemap .row .left img{
width: 100%;
max-width: 64%;
}

.footer .sitemap .row .right{
width: 66.666666%;
display: flex;
flex-direction: column;
justify-content: space-between;
}

.footer .sitemap .row .right .container{
width: 100%;
display: flex;
align-items: flex-start;
flex-direction: row;
}

.footer .sitemap .row .left .site-clmn{
width: 100%;
margin: 0 12px;
}

.footer .sitemap .row .right .container .site-clmn{
width: 25%;
margin: 0 12px;
}

.footer .sitemap .row .right .container .site-clmn ul, 
.footer .sitemap .row .right .container .site-clmn li {
list-style-type: none;
margin: 0;
padding: 0;
}

.footer .sitemap .row .right .container .site-clmn li {
font-size: 14px;
line-height: 20px;
color: var(--color-brand-black);
font-weight: var(--font-weight-5);
letter-spacing: normal;
padding: 3px 0;
}

.footer .sitemap .row .right .container .site-clmn li.heading {
font-size: 14px;
line-height: 1;
font-weight: var(--font-weight-7);
color: var(--color-brand-black);
letter-spacing: normal;
text-transform: uppercase;
margin-bottom: 16px;
padding: 0;
}

.footer .sitemap .row .right .container .site-clmn li a:link, 
.footer .sitemap .row .right .container .site-clmn li a:visited {
position: relative;
display: inline-block;
color: var(--color-brand-black);
text-decoration: none;
}

.footer .sitemap .row .right .container .site-clmn li a::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
height: 1px;
background-color: var(--color-brand-black);
transform: scaleX(0);
transform-origin: bottom left;
-webkit-transform-origin: bottom left;
-moz-transform-origin: bottom left;
-ms-transform-origin: bottom left;
-webkit-transition: transform .25s ease-out;
-moz-transition: transform .25s ease-out;
-ms-transition: transform .25s ease-out;
transition: transform .25s ease-out;
width: 100%;
}

.footer .sitemap .row .right .container .site-clmn li a:hover::after {
transform: scaleX(1);
transform-origin: bottom left;
}

.footer .sitemap .row .right .colophon{
display: flex;
flex-direction: row;
font-size: 12.5px;
line-height: 1;
color: var(--color-brand-black);
font-weight: var(--font-weight-6);
}

.footer .sitemap .row .right .colophon div{
width: 50%;
padding: 0 12px 12px;
}

.footer .sitemap .row .right .colophon div ul{
list-style-type: none;
padding: 0;
margin: 0;
display: flex;
}

.footer .sitemap .row .right .colophon div ul li{
padding-right: 24px;
}

@media (max-width: 1340px) {

.footer .sitemap .row .right .colophon div ul li{
padding-right: 16px;
}

}

@media (max-width: 1280px) {

.footer .sitemap .row .right .colophon div ul li{
padding-right: 12px;
}

}


/*** Mobile — Max Width 1023px ***/

@media (max-width: 1023px) {

.footer {
position: relative;
padding: 32px var(--wrapper) 0;
}

.footer .sitemap .row {
flex-wrap: wrap;
margin: 0;
flex-direction: column;
}

.footer .sitemap .row .left,
.footer .sitemap .row .right{
width: 100%;
display: flex;
align-items: flex-start;
}

.footer .sitemap .row .left{
align-items: flex-start;
flex-direction: column;
justify-content: center;
}

.footer .sitemap .row .right{
align-items: flex-start;
}

.footer .sitemap .row .left .site-clmn{
width: 100%;
margin: 0;
display: flex;
justify-content: center;
}

.footer .sitemap .row .left img{
width: 100%;
max-width: 280px;
}

.footer .sitemap .row .right .container .site-clmn{
width: 100%;
margin: 0;
}

.footer .sitemap .row .right .container {
flex-direction: column;
}

.footer .sitemap .row .right .container .site-clmn {
width: 100%;
margin: 0 0;
}

.footer .sitemap .row .right .container .site-clmn ul {
padding-top: 32px;
border-top: 1px solid var(--color-brand-light-grey);
margin-top: 32px;
margin-bottom: 0;
}

.footer .sitemap .row .right .container .site-clmn:last-child ul {
padding-top: 32px;
padding-bottom: 32px;
border-top: 1px solid var(--color-brand-light-grey);
border-bottom: 1px solid var(--color-brand-light-grey);
}

.footer .sitemap .row .right .container .site-clmn li {
font-size: 16px;
line-height: 28px;
padding: 0;
}

.footer .sitemap .row .right .container .site-clmn li.heading {
font-size: 16px;
margin-bottom: 24px;
}

.footer .sitemap .row .right .container .site-clmn li a:hover::after {
transform: scaleX(0);
}

.footer .sitemap .row .right .colophon{
width: calc((100% + 32px));
display: flex;
flex-direction: column;
margin: 0 -16px;
background: var(--color-brand-black);
color: var(--color-brand-white);
padding: 0 var(--wrapper);
}

.footer .sitemap .row .right .colophon div{
width: 100%;
padding: 32px 0px 12px;
}

.footer .sitemap .row .right .colophon div:last-child{
padding-bottom: 24px;
}

.footer .sitemap .row .right .colophon div ul{
flex-direction: row;
flex-wrap: wrap;
row-gap: 18px;
}

.footer .sitemap .row .right .colophon div ul li{
padding-right: 24px;
}

}

/*** Commons ***/

.breadcrumbs{
width: 100%;
padding: 0 var(--wrapper);
margin-top: 48px;
margin-bottom: 84px;
}

.breadcrumbs ul, 
.breadcrumbs li {
list-style-type: none;
margin: 0;
padding: 0;
}

.breadcrumbs ul, 
.breadcrumbs li {
display: flex;
font-family: var(--font-mono-family);
font-size: 12px;
line-height: 1;
font-weight: var(--font-weight-4);
text-transform: none;
color: var(--color-brand-grey);
}

.breadcrumbs li span{
margin: 0 12px;
}

.breadcrumbs li a:link,
.breadcrumbs li a:visited,
.breadcrumbs li a:hover{
color: var(--color-brand-grey);
text-decoration: none;
}

.text-content{
width: 100%;
display: grid;
grid-template-columns: repeat(12,1fr);
gap: 16px;
padding: 0 var(--wrapper);
margin-bottom: 72px;
}

.text-content .title{
grid-column: 1/9;
}

.text-content .title h1{
font-size: var(--font-size-title1);
line-height: var(--line-height-title1);
letter-spacing: var(--letter-spacing-title1);
font-weight: var(--font-weight-7);
color: var(--color-brand-black);
text-align: left;
}

.text-content .paragraph {
grid-column: 1/9;
}

.text-content .paragraph p{
font-size: var(--font-size-body);
line-height: var(--line-height-body);
letter-spacing: var(--letter-spacing-body);
font-weight: var(--font-weight-5);
text-align: left;
}

.image-content{
position: relative;
width: 100%;
}

.image-content img{
width: 100%;
}

.content-section{
width: 100%;
padding: 60px var(--wrapper);
}

.content-section .square-block{
width: 100%;
max-width: var(--page-width);
margin: var(--margin-auto);
display: flex;
flex-wrap: nowrap;
align-items: center;
padding: 60px 0;
}

.content-section .square-block:nth-child(odd) {
flex-direction: row;
}

.content-section .square-block:nth-child(even) {
flex-direction: row-reverse;
}

.content-section .square-block .square {
display: flex;
align-items: center;
width: 50%;
}

.content-section .square-block:nth-child(odd) .textcell {
padding-left: 80px;
padding-right: 0;
}

.content-section .square-block:nth-child(even) .textcell {
padding-right: 80px;
padding-left: 0;
}

.content-section .square-block .textcell p.title{
font-size: var(--font-size-title2);
line-height: var(--line-height-title2);
letter-spacing: var(--letter-spacing-title2);
font-weight: var(--font-weight-7);
color: var(--color-brand-black);
text-align: left;
margin-bottom: 16px;
}

.content-section .square-block .textcell p{
font-size: var(--font-size-body);
line-height: var(--line-height-body);
letter-spacing: var(--letter-spacing-body);
font-weight: var(--font-weight-5);
text-align: left;
}

.content-section .text-block{
width: 100%;
max-width: 720px;
margin: 0 auto;
padding: 60px 0;
}

.content-section .text-block p{
font-size: var(--font-size-body);
line-height: var(--line-height-body);
letter-spacing: var(--letter-spacing-body);
font-weight: var(--font-weight-5);
text-align: left;
}

.image-column-block{
padding: 60px 0;
width: 100%;
max-width: var(--page-width);
margin: 0 auto;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
column-gap: 16px;
}

@media (max-width: 1023px) {

.breadcrumbs{
margin-top: 32px;
margin-bottom: 64px;
}

.text-content {
max-width: 100%;
margin-bottom: 64px;
}

.content-section {
padding: 32px var(--wrapper);
}

.content-section .square-block:nth-child(odd) {
flex-direction: column;
}

.content-section .square-block:nth-child(even) {
flex-direction: column;
}

.content-section .square-block {
padding: 32px 0;
}

.content-section .square-block .square {
width: 100%;
}

.content-section .square-block:nth-child(odd) .textcell {
padding-left: 0;
padding-right: 0;
padding-top: 24px;
}

.content-section .square-block:nth-child(even) .textcell {
padding-right: 0;
padding-left: 0;
padding-top: 24px;
}

.content-section .text-block {
max-width: 100%;
padding: 32px 0;
}

.image-column-block{
padding: 32px 0;
flex-direction: column;
flex-wrap: nowrap;
row-gap: 16px;
}

.two-image-column-block{
padding: 32px 0;
flex-direction: column;
flex-wrap: wrap;
row-gap: 16px;
}

}

.grid-container{
display: grid;
grid-template-columns: repeat(4,minmax(0,1fr));
gap:16px;
padding: 60px 0;
}

@media (max-width: 1680px) {
.grid-container{
grid-template-columns: repeat(3,minmax(0,1fr));
}
}

.grid-container .card{
display: flex;
flex-direction: column;
border-radius: var(--img-border-radius);
background: var(--color-brand-light-grey);
}

.grid-container .card img{
border-top-left-radius: var(--img-border-radius);
border-top-right-radius: var(--img-border-radius);
display: none;
}

.grid-container .card .data-section{
padding: 24px;
}

.grid-container .card .data-section .title{
font-size: 24px;
line-height: 28px;
letter-spacing: normal;
font-weight: var(--font-weight-7);
margin-bottom: 20px;
}

.grid-container .card .data-section .short-description,
.grid-container .card .data-section .address,
.grid-container .card .data-section .contacts{
font-size: var(--font-size-copy2);
line-height: var(--line-height-copy2);
letter-spacing: var(--letter-spacing-copy2);
font-weight: var(--font-weight-5);
text-align: left;
}

.grid-container .card .data-section .short-description{
  display: none;
}

.grid-container .card .data-section .short-description,
.grid-container .card .data-section .address{
margin-bottom: 20px;
}

@media (max-width: 1023px) {

.text-content .title{
grid-column: 1/13;
}

.text-content .paragraph {
grid-column: 1/13;
}

.grid-container{
grid-template-columns: repeat(1,minmax(0,1fr));
padding: 32px 0;
}

.grid-container .card .data-section{
padding: 24px 16px;
}
}

/*** Skimap ***/

.cta-skimap{
margin-top: 32px;
}

.skimap-cta-container{
margin: 64px 0 ; 
}

@media (max-width: 1023px) {

.skimap-cta-container{
margin: 32px 0 ; 
}
}

/*** Scuola Sci ***/

.scuola-sci-cta-container{
display: flex;
flex-direction: column;
gap: 16px;
align-items: flex-start;
margin-top: 32px;
}

.scuola-sci-text-content {
width: 100%;
padding: 60px var(--wrapper);
}

.scuola-sci-text-content .text-block{
width: 100%;
max-width: 900px;
margin: 0 auto;
padding: 60px 0;
}

.scuola-sci-text-content .text-block p {
font-size: var(--font-size-body);
line-height: var(--line-height-body);
letter-spacing: var(--letter-spacing-body);
font-weight: var(--font-weight-5);
text-align: left;
}

.scuola-sci-image-content{
padding: 16px var(--wrapper) 120px;
}

.scuola-sci-image-content .column{
padding: 0;
width: 100%;
margin: 0 auto;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
column-gap: 16px;
}

@media (max-width: 1023px) {

.scuola-sci-text-content {
padding: 32px var(--wrapper);
}

.scuola-sci-text-content .text-block{
padding: 32px 0;
}

.scuola-sci-image-content{
padding: 16px var(--wrapper) 64px;
}

.scuola-sci-image-content .column{
flex-direction: column;
flex-wrap: wrap;
row-gap: 16px;
}
}

/*** Skipass e Prezzi ***/

.skipass-cta-container{
margin-top: 32px;
}

.skipass-section{
width: 100%;
padding: 120px var(--wrapper);
}

.skipass-section .container{
width: 100%;
max-width: 820px;
margin: 0 auto;
}

.skipass-section .container h2{
font-size: var(--font-size-title2);
line-height: var(--line-height-title2);
letter-spacing: var(--letter-spacing-title2);
font-weight: var(--font-weight-7);
color: var(--color-brand-black);
text-align: center;
margin-bottom: 32px;
}

.accordion-container{
width: 100%;
max-width: 820px;
margin: 0 auto;
border:1px solid #eee;
border-radius: 6px;
}

.accordion-container .no-highlight{
user-select: none; /* Chrome and Opera*/
-moz-user-select: none; /*/ Firefox*/
-webkit-text-select: none; /* IOS Safari*/
-webkit-user-select: none; /* Safari*/
}

.accordion-container label {
display: block !important;
padding: 26px 24px 24px !important;
margin: 0 !important;
cursor: pointer !important;
background: transparent;
border-top: 1px solid #eee;
color: #000 !important;
transition: ease .5s !important;
position: relative !important;
font-family: var(--font-body-family);
font-size: 18px;
line-height: 22px;
font-weight: var(--font-weight-7);
letter-spacing: .2px;
padding-right: 64px !important;
}

.accordion-container > label:first-of-type {
border-top: 0;
}

.accordion-container label:hover {
background: transparent;
}

.accordion-container label::before {
display: none !important;
}

.accordion-container label::after {
position: absolute !important;
right: 24px !important;
left: auto !important;
top: 50% !important;
transform: translateY(-50%) !important;
background-image:url(../img/plus.png) !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: 20px 20px !important;
width: 20px !important;
height: 20px !important;
content:"" !important;
opacity: 1 !important;
transition: none !important;
}

.accordion-container input.accordion:checked + label::after {
position: absolute !important;
right: 24px !important;
top: 50% !important;
transform: translateY(-50%) !important;
background-image:url(../img/minus.png) !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: 20px 20px !important;
width: 20px !important;
height: 20px !important;
content:"" !important;
transition: none !important;
}

.accordion-container .content {
background: transparent;
padding: 8px 24px 24px;
margin: 0;
box-sizing: border-box;
}

.accordion-container .content p{
font-family: var(--font-body-family);
font-size: 14px;
line-height: 22px;
font-weight: var(--font-weight-5);
letter-spacing: normal;
width: 100%;
margin-bottom: 32px;
}

.accordion-container .content p:last-child{
margin-bottom: 0;
}

.accordion-container .content p span.category{
font-size: 17px;
line-height: 1.5;
font-weight: var(--font-weight-7);
letter-spacing: .2px;
}

.accordion-container .content p.disclaimer{
font-size: 14px;
line-height: 18px;
font-style: italic;
font-weight: var(--font-weight-5);
letter-spacing: normal;
}

.accordion-container .content ul li{
font-size: 14px;
line-height: 18px;
font-style: italic;
font-weight: var(--font-weight-5);
letter-spacing: normal;
list-style-type: disc;
margin-left: 16px;
padding: 2px 0;
}

.accordion-container .content p a:link,
.accordion-container .content p a:visited{
text-decoration: underline;
color: #000;
display: inline-block;
}

.accordion-container .content p a:hover{
text-decoration: underline;
color: #000;
}

.accordion-container input.accordion + label + .content {
display: none;
}

.accordion-container input.accordion:checked + label + .content {
display: block;
}

.accordion-container input.accordion {
display: none;
}

.price-table {
border: 1px solid #eee;
border-radius: 8px;
overflow: hidden;
margin: 12px 0 32px;
}

.price-table:has(+ .disclaimer) {
margin-bottom: 12px;
}

.content > .price-table:last-child {
margin-bottom: 0px;
}

.price-table .row {
display: flex;
justify-content: space-between;
padding: 12px 12px 10px;
font-size: 14px;
line-height: 1.5;
}

.price-table .row:nth-child(odd) {
background: #FFFFFF;
}

.price-table .row:nth-child(even) {
background: #f5f5f5;
}

.price-table .label {
width: 70%;
}

.price-table .price {
width: 30%;
text-align: right;
font-weight: 600;
}

.category {
display: inline-block;
margin: 0;
padding: 12px 16px 10px;
font-weight: 700;
font-size: 14px;
background: #f5f5f5;
border-left: 4px solid var(--color-brand-red);
border-radius: 4px;
}

/* Mobile */
@media (max-width: 1023px) {

.price-table .row {
flex-direction: column;
gap: 6px;
line-height: 1;
padding: 16px 12px 14px;
}

.price-table .label,
.price-table .price {
width: 100%;
text-align: left;
}

.price-table .price {
font-weight: 700;
}

.accordion-container label {
font-size: 16px;
line-height: 20px;
padding: 26px 12px 24px !important;
padding-right: 48px !important;
}

.accordion-container > label:first-of-type {
border-top: 0;
}

.accordion-container label:hover {
background: transparent !important;
}

.accordion-container label::before {
display: none !important;
}

.accordion-container label::after {
right: 12px !important;
}

.accordion-container input.accordion:checked + label::after {
right: 12px !important;
}

.accordion-container .content {
padding: 8px 12px 24px;
}

}





/*** Webcam & Meteo ***/

.webcam-container{
background: #fff;
width: 100%;
padding: 0 var(--wrapper);
box-sizing: border-box;
display: block;
}

.webcam-container .worko-tabs {
margin: 20px;
width: 100%;
max-width: 100%;
margin:0 auto;
}

.webcam-container .worko-tabs .state {
position: absolute;
left: -10000px;
display: none;
}

.webcam-container .worko-tabs .flex-tabs {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
column-gap: 32px;
}

.webcam-container .worko-tabs .flex-tabs .panel {
background-color: #fff;
padding: 0;
height: auto;
display: none;
width: 100%;
flex-basis: auto;
align-items: center;
}

.webcam-container .worko-tabs .tab {
display: inline-block;
padding: 0 0 16px;
background-color: #fff;
cursor: pointer;
border-bottom: 3px solid transparent;
text-align:left;
font-family: var(--font-body-family);
font-size: 20px;
line-height: 1;
font-weight: var(--font-weight-7);
letter-spacing: normal;
line-height: 1;
color: var(--color-brand-grey);
}

.webcam-container .worko-tabs .tab:hover {
background-color: #fff;
}

#tab-one:checked ~ .tabs #tab-one-label,
#tab-two:checked ~ .tabs #tab-two-label,
#tab-three:checked ~ .tabs #tab-three-label,
#tab-four:checked ~ .tabs #tab-four-label,
#tab-five:checked ~ .tabs #tab-five-label {
background-color: #fff;
cursor: default;
border-bottom: 3px solid var(--color-brand-red);
color: var(--color-brand-red);
}

#tab-one:checked ~ .tabs #tab-one-panel,
#tab-two:checked ~ .tabs #tab-two-panel,
#tab-three:checked ~ .tabs #tab-three-panel,
#tab-four:checked ~ .tabs #tab-four-panel,
#tab-five:checked ~ .tabs #tab-five-panel {
display: block;
}

.webcam-container .worko-tabs .flex-tabs .panel .content{
padding: 32px 0 0;
margin: 0 auto;
}

.webcam-container .worko-tabs .flex-tabs .panel .content .row{
display: flex;
flex-wrap: wrap;
margin: 0;
padding: 0;
width: 100%;
max-width: 1280px;
position: relative;
}

.webcam-container .worko-tabs .flex-tabs .panel .content .row iframe {
aspect-ratio: 16 / 9;
width: 100%;
height: auto;
border: 0;
}

.webcam-container .worko-tabs .flex-tabs .panel .content .row img {
height: auto;
display: block;
}

.weather-container{
width: 100%;
padding: 100px var(--wrapper);
}

.weather-container .context{
width: 100%;
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 16px;
margin-bottom: 64px;
}

.weather-container .context .title {
grid-column: 1 / 9;
}

.weather-container .context .title h2{
font-size: var(--font-size-title2);
line-height: var(--line-height-title2);
letter-spacing: var(--letter-spacing-title2);
font-weight: var(--font-weight-7);
color: var(--color-brand-black);
text-align: left;
}

.weather-container .context .paragraph {
grid-column: 1 / 9;
}

.weather-container .context .paragraph p{
font-size: var(--font-size-body);
line-height: var(--line-height-body);
letter-spacing: var(--letter-spacing-body);
font-weight: var(--font-weight-5);
text-align: left;
}

@media (max-width: 1023px) {

  .webcam-container .worko-tabs .flex-tabs {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    row-gap: 16px;
}

.webcam-container .worko-tabs .tab {
  font-size: 18px;
}

.webcam-container .worko-tabs .tab {
    padding: 0 0 0px;
}

.webcam-container .worko-tabs .flex-tabs .panel .content {
    padding: 16px 0 0;
}

.weather-container {
    width: 100%;
    padding: 64px var(--wrapper);
}

.weather-container .context {
    margin-bottom: 24px;
}

.weather-container .context .title {
    grid-column: 1 / 13;
}

.weather-container .context .paragraph {
    grid-column: 1 / 13;
}

}

/*** Noleggi ***/

.noleggi-container{
width: 100%;
height: calc(100vh - (var(--topbar-height) + var(--header-desk-height)));
display: flex;
flex-direction: row;
}

.noleggi-container .left-section,
.noleggi-container .right-section{
width: 50%;
}

.noleggi-container .left-section{
display: flex;
flex-direction: column;
justify-content: space-between;
}

.noleggi-container .context{
width: 100%;
padding: var(--wrapper) calc(var(--wrapper)*2) var(--wrapper) var(--wrapper);
}

.noleggi-container .context .title h1 {
font-size: var(--font-size-title1);
line-height: var(--line-height-title1);
letter-spacing: var(--letter-spacing-title1);
font-weight: var(--font-weight-7);
color: var(--color-brand-black);
text-align: left;
margin-bottom: 16px;
}

.noleggi-container .context .paragraph p {
font-size: var(--font-size-body);
line-height: var(--line-height-body);
letter-spacing: var(--letter-spacing-body);
font-weight: var(--font-weight-5);
text-align: left;
}

.noleggi-container .noleggi-cta-container{
display: flex;
flex-direction: column;
gap: 16px;
align-items: flex-start;
margin-top: 32px;
}

.noleggi-container .right-section img{
object-fit: cover;
object-position: center;
width: 100%;
height: 100%;
}


@media (max-width: 1023px) {

.noleggi-container{
width: 100%;
height: auto;
display: flex;
flex-direction: column;
}

.noleggi-container .left-section,
.noleggi-container .right-section{
width: 100%;
}

.noleggi-container .left-section{
display: flex;
flex-direction: column;
justify-content: space-between;
}

.noleggi-container .context{
width: 100%;
padding: 0 var(--wrapper) 64px;
}

.noleggi-container .context .title h1 {
font-size: var(--font-size-title1);
line-height: var(--line-height-title1);
letter-spacing: var(--letter-spacing-title1);
font-weight: var(--font-weight-7);
color: var(--color-brand-black);
text-align: left;
margin-bottom: 16px;
}

.noleggi-container .context .paragraph p {
font-size: var(--font-size-body);
line-height: var(--line-height-body);
letter-spacing: var(--letter-spacing-body);
font-weight: var(--font-weight-5);
text-align: left;
}

.noleggi-container .noleggi-cta-container{
display: flex;
flex-direction: column;
gap: 16px;
align-items: flex-start;
margin-top: 32px;
}

.noleggi-container .right-section img{
object-fit: cover;
object-position: center;
width: 100%;
height: 100%;
}

}


/*** Contatti ***/

.contatti-container {
display: grid;
grid-template-columns: auto 1fr; /* prima colonna = dimensione contenuto più largo */
column-gap: 120px; /* spazio orizzontale */
row-gap: 72px; /* spazio verticale tra le righe */
width: 100%;
padding: 0 var(--wrapper);
margin-bottom: 120px;
}

.contatti-container .title {
grid-column: 1 / -1; /* il titolo occupa tutta la larghezza */
}

.contatti-container h1 {
font-size: var(--font-size-title1);
line-height: var(--line-height-title1);
font-weight: var(--font-weight-7);
letter-spacing: var(--letter-spacing-title1);
color: var(--color-brand-black);
margin: 0;
}

.contatti-container h4 {
font-size: 22px;
line-height: 1;
font-weight: var(--font-weight-7);
margin: 0;
padding-top: 1px;
}

.contatti-container p {
font-size: var(--font-size-body);
line-height: var(--line-height-body);
font-weight: var(--font-weight-5);
margin: 0;
max-width: 720px;
}

.contatti-container p a:link,
.contatti-container p a:visited{
text-decoration: underline;
}

.contatti-container p a:hover{
text-decoration: none;
}


@media (max-width: 1023px) {
.contatti-container {
grid-template-columns: 1fr;
row-gap: 16px; 
margin-bottom: 64px;
}

.contatti-container .title {
margin-bottom: 16px;
}

.contatti-container h4 {
padding-top: 0;
}

.cont-text {
margin-bottom: 48px; /* spazio tra questo blocco e il successivo */
}

.cont-text:last-of-type {
margin-bottom: 0; /* niente spazio extra dopo l’ultimo */
}

}

/*** Page Text ***/

.page-text-margin {
margin-bottom: 120px;
}

.text-content .page-text {
grid-column: 1 / 9;
}

.text-content .page-text p {
font-size: var(--font-size-copy2);
line-height: var(--line-height-copy2);
font-weight: var(--font-weight-5);
letter-spacing: normal;
margin: 0;
}

@media (max-width: 1023px) {

.page-text-margin {
margin-bottom: 64px;
}

.text-content .page-text {
grid-column: 1 / 13;
}
}

/*** Trasparenza ***/

.text-content .page-table {
grid-column: 1 / 13;
}

.page-table table {
width: 100%;
border-collapse: collapse;
font-size: 13px;
line-height: 18px;
font-weight: var(--font-weight-5);
letter-spacing: normal;
margin-top: 48px;
border: 1px solid #eee;
}

.page-table th, 
.page-table td {
padding: 16px 12px 12px;
text-align: left;
border-bottom: 1px solid #eee;
}

.page-table thead th {
font-weight: bold;
background: #f5f5f5;
vertical-align: bottom;
line-height: 1.20;
}

@media (max-width: 1023px) {

.page-table table, 
.page-table thead, 
.page-table tbody, 
.page-table th, 
.page-table td, 
.page-table tr {
display: block;
}

.page-table table {
border: 0;
margin-top: 24px;
}

.page-table thead {
display: none;
}

.page-table tr {
margin-bottom: 16px;
border: 1px solid #eee;
padding: 16px;
border-radius: 10px;
background: #fff;
}

.page-table tr:last-child {
margin-bottom: 0;
}

.page-table td {
padding: 0 0 20px;
border: none;
position: relative;
}

.page-table td:last-child {
padding: 0 0 0;
border: none;
position: relative;
}

.page-table td::before {
content: attr(data-label);
font-weight: 700;
display: block;
margin-bottom: 0;
color: #000;
}
}




.desktop-only{
display: block;
}

.mobile-only{
display: none;
}



/*** Mobile — Max Width 1023px ***/

@media (max-width: 1023px) {

.desktop-only{
display: none;
}

.mobile-only{
display: block;
}

}