body { margin: 0; }

/* TOP BAR */
.top-bar__inner, .top-bar__social, .top-bar__col, .nav, .nav__bar, .nav__side, .menu-offcanvas__header, button.menu-offcanvas__item, .menu-offcanvas__row:nth-child(2) a, .menu-offcanvas__sublist-grid, .menu-offcanvas__textlist, .menu-offcanvas__icon-card, .menu-offcanvas__icon-frame, .menu-offcanvas__social { display: flex; }
.top-bar__inner { margin: auto; height: 45px; }
.top-bar__inner, .nav__bar, .menu-offcanvas__header, button.menu-offcanvas__item, .menu-offcanvas__sublist-grid { justify-content: space-between; }
.top-bar__inner, .top-bar__col, .nav, .nav__bar, .nav__side, .menu-offcanvas__header, button.menu-offcanvas__item, .menu-offcanvas__row:nth-child(2) a, .menu-offcanvas__icon-card, .menu-offcanvas__icon-frame { align-items: center; }
.top-bar__link, .top-bar__lang, a.nav__link, a.nav__sublink, .menu-offcanvas__sublink, .menu-offcanvas__textlist > p a, .menu-offcanvas__link { text-decoration: none; }
.top-bar__link, .top-bar__languages { margin: 0; font-size: var(--fs-15); }
.top-bar__languages { margin-right: var(--space-4); }
.top-bar__social { grid-gap: 0.8rem; }
.top-bar__social-link{ line-height: 0; }
img.top-bar__social-icon{ width: auto; height: clamp(0.675rem, calc(0.33vw + 0.51rem), 0.9375rem); }

/* NAVIGATION */
.nav, button.nav__search-btn, li.nav__item, button.menu-offcanvas__item, .menu-offcanvas__row:first-child::before, .menu-offcanvas__row:nth-child(2), .menu-offcanvas__row:nth-child(n+7):nth-child(-n+16), button.menu-offcanvas__item:nth-of-type(n+3), .menu-offcanvas__social { position: relative; }
.nav { box-shadow: -10px 10px 10px #0000000A; z-index: 2; }
.nav, .nav--fixed { transition: all 0.4s ease-in-out; -webkit-transition: all 0.4s ease-in-out; }
.nav--fixed, .menu-offcanvas, .overlay--visible, .menu-offcanvas__header { position: fixed; }
.nav--fixed{ top: 0; left: 0; right: 0; z-index: 3; }
.nav__bar{ flex: 1; }
.nav__side--left{ grid-gap: var(--space-3); }
button.nav__menu-btn, button.nav__menu-btn:hover, button.nav__menu-btn:focus, button.nav__search-btn, button.nav__search-btn:hover, button.nav__search-btn:focus, button.menu-offcanvas__close, .nav__submenu { background-color: transparent; }
button.nav__menu-btn, button.nav__menu-btn:hover, button.nav__menu-btn:focus, button.nav__search-btn, button.nav__search-btn:hover, button.nav__search-btn:focus, button.menu-offcanvas__close, button.menu-offcanvas__item { border: none; }
button.nav__menu-btn, button.nav__search-btn, button.menu-offcanvas__close, .nav__submenu, a.nav__link, a.nav__sublink, button.menu-offcanvas__item, .menu-offcanvas__textlist > p, .menu-offcanvas__link, .menu-offcanvas__social img { cursor: pointer; }
button.nav__menu-btn, button.nav__search-btn, button.menu-offcanvas__close, ul.nav__list { padding: 0; }
button.nav__search-btn { margin-left: var(--space-4); background-image: url(/media/lente-ingradimento-2.svg); }
.nav__submenu, button.menu-offcanvas__item:nth-of-type(n+2)::before, .menu-offcanvas__row:nth-child(2)::before, .menu-offcanvas__row:nth-child(n+7):nth-child(-n+16)::before, .menu-offcanvas__social::before { position: absolute; }
button.nav__menu-btn, button.nav__search-btn, button.menu-offcanvas__close{ width: clamp(1.44rem, calc(0.704vw + 1.088rem), 2rem); }
button.nav__menu-btn, button.nav__search-btn, button.menu-offcanvas__close, .menu-offcanvas__icon-frame, .menu-offcanvas__icon-frame img { aspect-ratio: 1 / 1;}
a.nav__home-link--visible, img.nav__logo, img.nav__logo-mobile { width: auto; height: clamp(1.8rem, calc(0.88vw + 1.36rem), 2.5rem); object-fit: contain; }
img.nav__menu-icon, .menu-offcanvas__header, .menu-offcanvas__logo, button.menu-offcanvas__item, button.menu-offcanvas__item:nth-of-type(n+2)::before, .menu-offcanvas__row:nth-child(2)::before, .menu-offcanvas__row:nth-child(n+7):nth-child(-n+16)::before, .menu-offcanvas__social::before { width: 100%; }
img.nav__menu-icon, .menu-offcanvas, .menu-offcanvas__social img { height: 100%; }
img.nav__menu-icon,
button.nav__search-btn, button.menu-offcanvas__close { filter: brightness(0) saturate(100%) invert(15%) sepia(32%) saturate(6238%) hue-rotate(205deg) brightness(92%) contrast(103%); }
ul.nav__list { margin: 0 var(--space-5) 0 0; grid-gap: var(--space-5); }
ul.nav__list:not(.nav__list--visible), .nav__submenu, .search button[type="submit"], .menu-offcanvas__sublist { display: none; }
li.nav__item, ul.nav__sublist { list-style: none; }
.nav__link, .search input#query, a.nav__sublink, .menu-offcanvas__icon-card > p, .menu-offcanvas__textlist > p {font-size: var(--fs-20);}
.nav__submenu{ top: 0; }
ul.nav__sublist { width: 13rem; padding-left: 0; cursor: default; margin-top: var(--space-4); box-shadow: 10px 10px 20px 0px #0000000A; }
li.nav__subitem { padding: var(--space-1) var(--space-2); }
li.nav__subitem:not(:last-child) { border-bottom: 1px solid #F0F0F0; }
.search input#query::placeholder, button.menu-offcanvas__item::after { color: #003883; }
li.nav__subitem:hover{ background-color: #8291C7; }
li.nav__subitem:hover a, li.nav__subitem a:hover{ color: white; }
button.nav__search-btn, button.menu-offcanvas__close { background-size: contain; background-repeat: no-repeat; }
button.nav__search-btn--active, button.menu-offcanvas__close { background-image: url(/media/close-icon.png?format=webp); }
button.nav__search-btn--active::before { opacity: 0; }
.search { width: 0; overflow: hidden; transition: 0.5s ease; }
.search form { margin-bottom: 0; }
.search input#query { border: 1px solid #003883; padding: 0 var(--space-2); box-sizing: content-box; }
span.material-symbols-outlined { font-variation-settings: 'FILL' 1; }

/* MENU OFF-CANVAS */
.menu-offcanvas { left: 0; top: 0; z-index: 4; transition: 0.8s ease; }
.menu-offcanvas__inner{ overflow: auto; }
.menu-offcanvas__inner::-webkit-scrollbar { width: 7px;  -webkit-appearance: none; }
.menu-offcanvas__inner::-webkit-scrollbar-track, .menu-offcanvas__row:first-child::before, .menu-offcanvas__row:nth-child(2)::before, .menu-offcanvas__row:nth-child(n+7):nth-child(-n+16)::before, .menu-offcanvas__social::before { background: #fff; }
.menu-offcanvas__inner::-webkit-scrollbar-thumb {  background-color: #003883; -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5); border-radius: 10px; }
.overlay--visible { left: 0; right: 0; top: 0; bottom: 0; background-color: #0000008f; z-index: 3; }
.menu-offcanvas__header { z-index: 1; padding: 0 var(--space-4); }
.menu-offcanvas__logo { width: clamp(13.2rem, calc(3.02vw + 12.585rem), 16.75rem); }
button.menu-offcanvas__item { text-align: left; }
button.menu-offcanvas__item, .menu-offcanvas__row, .menu-offcanvas__social { padding: var(--space-3) var(--space-4); }
button.menu-offcanvas__item:nth-of-type(n+2)::before { content: ""; height: 1px; top: 0; left: 0; background: #F0F0F0; }
button.menu-offcanvas__item::after { content: "\e145"; font-weight: 400; font-size: var(--fs-30); font-family: 'Material Symbols Outlined'; }
button.menu-offcanvas__item--active::after { content: "\e15b"; }
p.menu-offcanvas__label, .menu-offcanvas__icon-card > p, .menu-offcanvas__textlist > p { margin: 0; }
p.menu-offcanvas__label { font-size: var(--fs-25); }
.menu-offcanvas__sublist-grid { flex-direction: row; padding: var(--space-1) var(--space-8) var(--space-3) var(--space-4); }
.menu-offcanvas__icon-card, .menu-offcanvas__textlist { flex-direction: column; }
.menu-offcanvas__icon-card { grid-gap: var(--space-2); }
.menu-offcanvas__icon-card > p { text-align: center; }
.menu-offcanvas__textlist { padding: var(--space-1) var(--space-4) var(--space-3);}
.menu-offcanvas__textlist > p a:hover, .menu-offcanvas__textlist > p a:focus, .menu-offcanvas__textlist > p a:active{ color: #8291C7; }
.menu-offcanvas__icon-frame { border: 1px solid #8291C7; border-radius: 50%; justify-content: center; width: clamp(3.96rem, calc(1.94vw + 2.99rem), 5.5rem); }
.menu-offcanvas__icon-frame img { object-fit: contain; width: 51%; }
.menu-offcanvas__row:nth-child(2) a, .menu-offcanvas__textlist { grid-gap: var(--space-1); }
.menu-offcanvas__row:nth-child(2)::before, .menu-offcanvas__row:nth-child(n+7):nth-child(-n+16)::before, .menu-offcanvas__social::before{ content: ""; height: 1px; top: 0; left: 0; }
.menu-offcanvas__social { grid-gap: var(--space-2); }
.menu-offcanvas__social img { filter: brightness(0) saturate(100%) invert(14%) sepia(77%) saturate(2675%) hue-rotate(205deg) brightness(91%) contrast(103%); width: auto; max-height: clamp(1.125rem, calc(0.55vw + 0.85rem), 1.5rem); }

/* SUBNAVIGATION */
.subnav__list{
    display: flex;
    align-items: center;
    list-style: none;
    padding: 0;
    justify-content: space-between;
    margin: 0;
}
.subnav__link { line-height: 1; text-decoration: none; }

/* FORM */
.assistenzaGenoma input:-webkit-autofill, .assistenzaGenoma input:-webkit-autofill:hover, .assistenzaGenoma input:-webkit-autofill:focus, .assistenzaGenoma input:-webkit-autofill:active {
    -webkit-background-clip: text;
    -webkit-text-fill-color: white;
    transition: background-color 5000s ease-in-out 0s;
}
.searchContainer input:-webkit-autofill, .searchContainer input:-webkit-autofill:hover, .searchContainer input:-webkit-autofill:focus, .searchContainer input:-webkit-autofill:active {
    -webkit-background-clip: text;
    -webkit-text-fill-color: #003883;
    transition: background-color 5000s ease-in-out 0s;
}
/* FOOTER */
.gridSubFooter {
    display: flex;
    align-items: center;
    justify-content: center;
    grid-gap: 20px;
}
@media (max-width:550px){
    /* NAVIGATION */
    img.nav__logo, img.nav__logo-mobile { max-width: 40vw; }
    .nav__side.nav__side--right{ flex: 1; justify-content: flex-end; }
    .search--visible { flex: 1; }
    .search input#query { height: 2.8rem; width: calc(100% - 2px - (2 * var(--space-2))); }

    /* MENU OFF-CANVAS */
    .menu-offcanvas__header { height: 5rem; }
    .menu-offcanvas__inner { margin-top: 5rem; max-height: calc(100% - 5rem); }
    .menu-offcanvas__sublist-grid { flex-wrap: wrap; row-gap: 5vw; column-gap: 5vw; }
    .menu-offcanvas__sublink { flex: 0 1 calc((100% - 10vw) / 2); }
}
@media (min-width:551px) and (max-width:766.9px){
    /* NAVIGATION */
    .search--visible { width: calc(60vw + 2px); }
    .search input#query { height: 2.8rem; width: calc(60vw - (2 * var(--space-2))); }

    /* MENU OFF-CANVAS */
    .menu-offcanvas__header { height: 5.8rem; }
    .menu-offcanvas__inner { margin-top: 5.8rem; max-height: calc(100% - 5.8rem); }
}
@media (max-width:766.9px){
    /* NAVIGATION */
    .nav{ height: 5rem; }
    ul.nav__list { display: none; }
    a.nav__home-link--visible{ transition: width 0s linear 0.5s; }
    a.nav__home-link:not(.nav__home-link--visible){ width: 0; overflow: hidden; }

    /* MENU OFF-CANVAS */
    .menu-offcanvas{ width: 100vw; max-height: 100%; }
    .menu-offcanvas:not(.menu-offcanvas--visible){ left: -100vw; }
    .menu-offcanvas__header { max-width: calc(100vw - (2 * var(--space-4))); }

    /* SUBNAVIGATION */
    .subnav{ display: none; }
}
@media (min-width:767px){
    ul.nav__list--visible { display: flex;  align-items: center; }
    .nav__search-btn::before{
        top: 50%;
        width: 1px;
        content: '';
        position: absolute;
        background-color: #003883;
        transform: translateY(-50%);
        left: calc(-1 * var(--space-4));
        transition: opacity 0s linear 0.5s;
    }
    .subnav__list{ justify-content: space-around; }
}
@media (min-width:767px) and (max-width:899.9px){
    /* NAVIGATION */
    .nav{ height: 5rem; }
    img.nav__logo, img.nav__logo-mobile { max-width: 25vw; }
    .nav__submenu{ left: -1.5vw; }
    .search--visible { width: calc(37vw + 2px); }
    .search input#query { width: calc(37vw - (2 * var(--space-2))); }
    .search input#query, .nav__search-btn::before{ height: 2.5rem; }

    /* MENU OFF-CANVAS */
    .menu-offcanvas { width: 37rem; }
    .menu-offcanvas:not(.menu-offcanvas--visible){ left: -37rem; }
    .menu-offcanvas__header { max-width: calc(37rem - (2 * var(--space-4))); }
    .menu-offcanvas__header { height: 6rem; }
    .menu-offcanvas__inner { margin-top: 6rem; height: calc(100% - 6rem); }

    /* SUBNAVIGATION */
    .subnav__list{ height: 2.8rem; }
}
@media (max-width: 899.9px){
    nav:has(.nav__logo-mobile) .nav__logo { display: none; }
}
@media (min-width: 900px){
    .nav__logo-mobile { display: none; }
}
@media (min-width:900px) and (max-width:1099.9px){
    /* NAVIGATION */
    .nav{ height: 5rem; }
    .nav__submenu{ left: -1.5vw; }
    .search--visible { width: calc(38vw + 2px); }
    .search input#query { width: calc(38vw - (2 * var(--space-2))); }
    .search input#query, .nav__search-btn::before{ height: 2.8rem; }

    /* MENU OFF-CANVAS */
    .menu-offcanvas { width: 37rem; }
    .menu-offcanvas:not(.menu-offcanvas--visible){ left: -37rem; }
    .menu-offcanvas__header { max-width: calc(37rem - (2 * var(--space-4))); }
    .menu-offcanvas__header { height: 6rem; }
    .menu-offcanvas__inner { margin-top: 6rem; height: calc(100% - 6rem); }

    /* SUBNAVIGATION */
    .subnav__list{
        height: 2.8rem;
    }
}
@media (min-width: 1100px) and (max-width: 1400px){
    /* NAVIGATION */
    .nav{ height: 5.5rem; }
    .nav__submenu{ left: -1vw; }
    .search--visible { width: calc(34vw + 2px); }
    .search input#query { width: calc(34vw - (2 * var(--space-2))); }
    .search input#query, .nav__search-btn::before{ height: 2.8rem; }
    
    /* MENU OFF-CANVAS */
    .menu-offcanvas { width: 40rem; }
    .menu-offcanvas:not(.menu-offcanvas--visible){ left: -40rem; }
    .menu-offcanvas__header { max-width: calc(40rem - (2 * var(--space-4))); }
    .menu-offcanvas__header { height: 7rem; }
    .menu-offcanvas__inner { margin-top: 7rem; height: calc(100% - 7rem); }

    /* SUBNAVIGATION */
    .subnav__list{ height: 3rem; }
}
@media (max-width: 1400px){
    .subnav__link { font-size: var(--fs-15); }
}
@media (min-width: 1401px) {
    /* NAVIGATION */
    .nav { height: 110px; }
    .nav__submenu { left: -0.65vw; }
    .search--visible { width: calc(30rem + 2px); }
    .search input#query { width: calc(30rem - (2 * var(--space-2))); }
    .search input#query, .nav__search-btn::before{ height: 3.2rem; }

    /* MENU OFF-CANVAS */
    .menu-offcanvas { width: 43rem; }
    .menu-offcanvas:not(.menu-offcanvas--visible){ left: -43rem; }
    .menu-offcanvas__header { max-width: calc(43rem - (2 * var(--space-4))); }
    .menu-offcanvas__header { height: 8rem; }
    .menu-offcanvas__inner { margin-top: 8rem; height: calc(100% - 8rem)}
    
    /* SUBNAVIGATION */
    .subnav__list{ height: 3.2rem; }
    .subnav__link { font-size: var(--fs-20); }
}