/* RESET */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ========================================
   SELETTORE LINGUA ITA / ENG
======================================== */

header#top .language-switcher {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    order: 1;
    margin-left: 22px;
    white-space: nowrap;
    font-family: "Cormorant Garamond", serif;
    color: rgba(255, 252, 235, .62);
}

header#top .language-switcher .language-option {
    padding: 5px 0 4px;
    color: rgba(255, 252, 235, .72);
    font-size: 15px;
    font-weight: 500;
    letter-spacing: .03em;
    line-height: 1;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    transition: color .25s ease, border-color .25s ease;
}

header#top .language-switcher .language-option:hover,
header#top .language-switcher .language-option.is-active {
    color: #FFD43B;
    border-bottom-color: #FFD43B;
}

header#top .language-switcher .language-option::after {
    display: none;
}

@media screen and (max-width: 1100px) and (min-width: 901px) {
    header#top .language-switcher {
        margin-left: 22px;
    }

    header#top .header-social {
        margin-left: 0;
    }
}

@media screen and (max-width: 1100px) {
    header#top nav > .language-switcher {
        width: 100%;
        margin: 18px 0 0;
        padding: 24px 22px 0;
        justify-content: flex-start;
        border-top: 1px solid rgba(255, 252, 235, .18);
    }

    header#top nav > .language-switcher .language-option {
        width: auto;
        padding: 5px 0 6px;
        font-size: 18px;
    }
}

/* =========================================================
   FIRMA EDITORIALE UNIFICATA — RENZO BALDONI
========================================================= */

p.archive-author-credit {
    margin: 58px 0 0 !important;
    padding-top: 24px;
    border-top: 3px solid #FFD43B;
    font-family: "Montserrat", sans-serif;
    font-size: 16px !important;
    font-weight: 600 !important;
    font-style: italic;
    line-height: 1.6;
    text-align: right;
    color: #2E4057;
    text-decoration: none;
}

p.archive-author-credit span {
    font-size: 14px;
    font-weight: 500;
}

/* Approfondimenti storici dell’Archivio */
.archive-longform-content {
    width: min(100%, 940px);
    margin: 0 auto;
}

.archive-longform-content h2 {
    margin: 64px 0 22px;
    color: #6d251c;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(30px, 4vw, 43px);
    font-weight: 700;
    line-height: 1.08;
}

.archive-longform-lead {
    margin-bottom: 54px;
    padding: 30px 34px;
    border-left: 4px solid #b97732;
    background: #f4ede2;
}

.archive-longform-lead p {
    margin: 0 0 15px !important;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(21px, 2.5vw, 27px) !important;
    font-style: italic;
    line-height: 1.45 !important;
}

.archive-longform-lead span {
    display: block;
    color: #6d251c;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.archive-longform-content .archive-editorial-list {
    margin: 24px 0 34px;
}

.archive-longform-note {
    margin-top: 40px !important;
    padding: 22px 26px;
    border-radius: 4px;
    background: #f4ede2;
    font-style: italic;
}

.archive-list-intro {
    margin-bottom: 24px !important;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(25px, 3vw, 33px) !important;
    font-weight: 700;
}

.archive-previous-shows-list {
    columns: 2;
    column-gap: 64px;
}

.archive-previous-shows-list li {
    break-inside: avoid;
}

@media screen and (max-width: 700px) {
    .archive-longform-lead {
        padding: 24px 22px;
    }

    .archive-previous-shows-list {
        columns: 1;
    }
}

/* =========================================================
   NAVIGAZIONE MOBILE CON MENU GERARCHICO
========================================================= */

.mobile-menu-toggle,
.mobile-menu-close,
.mobile-menu-title,
.mobile-submenu-back,
.mobile-submenu-title,
.mobile-nav-overlay {
    display: none;
}

@media screen and (max-width: 1100px) {
    body.mobile-nav-locked {
        overflow: hidden;
        touch-action: none;
    }

    header#top,
    header#top.scrolled {
        min-height: 82px;
        padding: 10px 18px !important;
    }

    header#top .header-container {
        width: 100%;
        min-height: 62px;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }

    header#top .logo-box {
        position: relative;
        z-index: 1005;
        width: 66px;
        height: 66px;
        flex: 0 0 66px;
        font-size: 46px;
        border-radius: 10px;
    }

    .mobile-menu-toggle {
        position: absolute;
        top: 50%;
        right: 0;
        z-index: 1006;
        width: 50px;
        height: 50px;
        margin: 0;
        padding: 0;
        border: 1px solid rgba(255, 252, 235, .34);
        border-radius: 50%;
        background: transparent;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        color: #FFFCEB;
        cursor: pointer;
        transform: translateY(-50%);
        transition: opacity .25s ease, border-color .25s ease, color .25s ease;
    }

    header#top.mobile-menu-open .mobile-menu-toggle {
        opacity: 0;
        pointer-events: none;
    }

    .mobile-menu-toggle span {
        display: block;
        width: 22px;
        height: 2px;
        border-radius: 999px;
        background: currentColor;
        transform-origin: center;
        transition: transform .35s ease, opacity .25s ease, width .35s ease;
    }

    header#top.mobile-menu-open .mobile-menu-toggle span:nth-child(1) {
        transform: translateY(7px) rotate(45deg);
    }

    header#top.mobile-menu-open .mobile-menu-toggle span:nth-child(2) {
        width: 0;
        opacity: 0;
    }

    header#top.mobile-menu-open .mobile-menu-toggle span:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg);
    }

    header#top nav,
    header#top.scrolled nav {
        position: fixed;
        top: 0;
        right: 0;
        z-index: 1003;
        width: min(88vw, 420px);
        height: 100vh;
        height: 100dvh;
        margin: 0;
        padding: 92px 0 32px !important;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
        justify-content: flex-start;
        gap: 0 !important;
        overflow: hidden;
        background: #2E4057;
        box-shadow: -20px 0 55px rgba(15, 24, 36, .28);
        opacity: 0;
        visibility: hidden;
        transform: translateX(105%);
        transition: transform .48s cubic-bezier(.22, 1, .36, 1), opacity .35s ease, visibility .48s;
    }

    header#top.mobile-menu-open nav {
        opacity: 1;
        visibility: visible;
        transform: translateX(0);
    }

    .mobile-menu-close {
        position: absolute;
        top: 19px;
        right: 19px;
        z-index: 30;
        width: 48px;
        height: 48px;
        padding: 0;
        border: 1px solid rgba(255, 252, 235, .34);
        border-radius: 50%;
        background: transparent;
        display: grid;
        place-items: center;
        color: #FFFCEB;
        font-family: "Montserrat", sans-serif;
        font-size: 37px;
        font-weight: 300;
        line-height: 1;
        cursor: pointer;
    }

    .mobile-menu-title {
        display: block;
        margin: 0;
        padding: 0 28px 19px;
        color: #FFD43B;
        font-family: "Montserrat", sans-serif;
        font-size: 13px;
        font-weight: 800;
        letter-spacing: 1.8px;
        text-transform: uppercase;
        border-bottom: 1px solid rgba(255, 252, 235, .14);
    }

    header#top nav > .menu-item,
    header#top nav > a,
    header#top nav > .header-social,
    header#top nav > .mobile-menu-title,
    header#top nav > .mobile-menu-close {
        flex: 0 0 auto;
        transition: transform .45s cubic-bezier(.22, 1, .36, 1), opacity .3s ease;
    }

    header#top nav > .menu-item {
        position: static;
        width: 100%;
    }

    header#top nav > a,
    header#top nav > .menu-item > a {
        width: 100%;
        min-height: 64px;
        margin: 0;
        padding: 18px 28px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        color: #FFFCEB;
        font-family: "Montserrat", sans-serif;
        font-size: clamp(18px, 5vw, 22px);
        font-weight: 650;
        line-height: 1.2;
        border-bottom: 1px solid rgba(255, 252, 235, .12);
    }

    header#top nav > .mobile-has-submenu > a::before {
        content: "→";
        order: 2;
        margin-left: 20px;
        color: #FFD43B;
        font-size: 22px;
        transition: transform .3s ease;
    }

    header#top nav > a::after,
    header#top nav > .menu-item > a::after {
        display: none;
    }

    header#top nav > .menu-item > .dropdown {
        position: absolute;
        inset: 0;
        z-index: 20;
        width: 100%;
        min-width: 0;
        height: 100%;
        padding: 92px 0 32px;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        overflow-y: auto;
        background: #2E4057;
        backdrop-filter: none;
        opacity: 1;
        visibility: hidden;
        pointer-events: none;
        transform: translateX(105%);
        transition: transform .45s cubic-bezier(.22, 1, .36, 1), visibility .45s;
    }

    header#top nav > .menu-item.mobile-submenu-open > .dropdown {
        visibility: visible;
        pointer-events: auto;
        transform: translateX(0);
    }

    header#top nav.mobile-submenu-active > .menu-item:not(.mobile-submenu-open),
    header#top nav.mobile-submenu-active > .menu-item.mobile-submenu-open > a,
    header#top nav.mobile-submenu-active > a,
    header#top nav.mobile-submenu-active > .header-social,
    header#top nav.mobile-submenu-active > .mobile-menu-title {
        opacity: 0;
        pointer-events: none;
        transform: translateX(-100%);
    }

    .mobile-submenu-back {
        min-height: 56px;
        padding: 0 28px;
        border: 0;
        border-bottom: 1px solid rgba(255, 252, 235, .14);
        background: transparent;
        display: flex;
        align-items: center;
        gap: 12px;
        color: #FFD43B;
        font-family: "Montserrat", sans-serif;
        font-size: 15px;
        font-weight: 750;
        text-align: left;
        cursor: pointer;
    }

    .mobile-submenu-back span {
        font-size: 22px;
    }

    .mobile-submenu-title {
        display: block;
        margin: 0;
        padding: 26px 28px 18px;
        color: #FFFCEB;
        font-family: "Montserrat", sans-serif;
        font-size: clamp(26px, 8vw, 36px);
        font-weight: 800;
        line-height: 1.05;
    }

    header#top nav > .menu-item > .dropdown > a {
        width: 100%;
        min-height: 61px;
        padding: 17px 28px;
        display: flex;
        align-items: center;
        color: #FFFCEB;
        font-family: "Montserrat", sans-serif;
        font-size: clamp(17px, 4.8vw, 21px);
        font-weight: 550;
        line-height: 1.25;
        white-space: normal;
        border-top: 1px solid rgba(255, 252, 235, .1);
    }

    header#top nav > .menu-item > .dropdown > a:hover,
    header#top nav > .menu-item > .dropdown > a:focus-visible,
    header#top nav > a:hover,
    header#top nav > a:focus-visible,
    header#top nav > .menu-item > a:hover,
    header#top nav > .menu-item > a:focus-visible {
        color: #FFD43B;
        background: rgba(255, 255, 255, .05);
    }

    header#top .header-social {
        width: auto;
        margin: auto 28px 0;
        padding-top: 26px;
        justify-content: flex-start;
        gap: 18px;
    }

    header#top .header-social a {
        width: 42px;
        height: 42px;
        border: 1px solid rgba(255, 252, 235, .24);
        border-radius: 50%;
        font-size: 20px;
    }

    .mobile-nav-overlay {
        position: fixed;
        inset: 0;
        z-index: 998;
        width: 100%;
        height: 100%;
        padding: 0;
        border: 0;
        display: block;
        background: rgba(15, 24, 36, .62);
        opacity: 0;
        visibility: hidden;
        cursor: default;
        transition: opacity .4s ease, visibility .4s;
    }

    .mobile-nav-overlay.is-visible {
        opacity: 1;
        visibility: visible;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mobile-menu-toggle span,
    header#top nav,
    header#top nav > .menu-item,
    header#top nav > a,
    header#top nav > .header-social,
    header#top nav > .menu-item > .dropdown,
    .mobile-nav-overlay {
        transition: none !important;
    }
}

/* =====================================================
   TOUR VIRTUALE — NAVIGAZIONE MOBILE DEI PIANI
===================================================== */

.floor-mobile-navigation {
    display: none;
}

@media screen and (max-width: 750px) {
    .floor-page .floor-main-image {
        margin-bottom: 0;
    }

    .floor-page .floor-interactive .museum-hotspot {
        width: 21px;
        height: 21px;
        border-width: 2px;
        font-size: 9px;
        line-height: 1;
        box-shadow: 0 2px 7px rgba(0, 0, 0, .2);
        pointer-events: none;
        cursor: default;
    }

    .floor-page .floor-interactive .museum-hotspot:hover {
        background: #2E4057;
        color: #FFFCEB;
        transform: translate(-50%, -50%);
    }

    .floor-page .floor-interactive .hotspot-label {
        display: none;
    }

    .floor-mobile-navigation {
        width: min(100%, 620px);
        margin: 20px auto 52px;
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 9px;
    }

    .floor-mobile-navigation-link {
        width: 100%;
        min-height: 46px;
        display: grid;
        grid-template-columns: 46px minmax(0, 1fr);
        align-items: stretch;
        overflow: hidden;
        border: 1px solid rgba(46, 64, 87, .18);
        border-radius: 8px;
        background: #2E4057;
        color: #FFFCEB;
        font-family: "Montserrat", sans-serif;
        text-decoration: none;
        box-shadow: 0 6px 16px rgba(46, 64, 87, .1);
        transition: transform .22s ease, box-shadow .22s ease;
    }

    .floor-mobile-navigation-number {
        display: grid;
        place-items: center;
        background: #FFD43B;
        color: #2E4057;
        font-size: 15px;
        font-weight: 800;
    }

    .floor-mobile-navigation-label {
        display: flex;
        align-items: center;
        padding: 10px 15px;
        font-size: 14px;
        font-weight: 600;
        line-height: 1.25;
    }

    .floor-mobile-navigation-link:active {
        transform: scale(.985);
        box-shadow: 0 3px 9px rgba(46, 64, 87, .12);
    }
}

/* =========================================================
   MATEMATICA SENZA FRONTIERE
========================================================= */

.matematica-frontiere-news-page .article-text,
.frontiere-partnership {
    width: 100%;
    max-width: 1050px;
}

.frontiere-partnership {
    margin-top: 58px;
}

.frontiere-partnership h2 {
    margin: 0 0 30px;
    padding-left: 18px;
    border-left: 5px solid #FFD43B;
    color: #2E4057;
    font-family: "Montserrat", sans-serif;
    font-size: clamp(27px, 3vw, 38px);
    font-weight: 800;
    line-height: 1.15;
}

.frontiere-partnership figure {
    width: 100%;
    max-width: 920px;
    margin: 0;
    padding: clamp(10px, 1.8vw, 18px);
    border: 3px solid #FFD43B;
    border-radius: 14px;
    background: #FFFFFF;
    box-sizing: border-box;
}

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

/* =========================================================
   INDICE DEL VOLUME MATEMATICA ANTICA
========================================================= */

.matantica-index {
    margin-top: 86px;
    padding-top: 62px;
    border-top: 1px solid rgba(46, 64, 87, .2);
    font-family: "Montserrat", sans-serif;
}

.matantica-index-header {
    max-width: 920px;
    margin-bottom: 44px;
}

.matantica-index-header h2 {
    margin: 0;
    color: #2E4057;
    font-size: clamp(34px, 4.8vw, 58px);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -1.5px;
}

.matantica-index-header h2::after {
    content: "";
    display: block;
    width: 64px;
    height: 4px;
    margin-top: 24px;
    background: #FFD43B;
}

.matantica-index-header p {
    margin: 22px 0 0;
    color: #2E4057;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.6;
}

.matantica-branch {
    margin-top: 28px;
    padding: clamp(28px, 4vw, 48px);
    border-left: 6px solid #FFD43B;
    border-radius: 0 16px 16px 0;
    background: rgba(255, 255, 255, .48);
    box-shadow: 0 12px 34px rgba(46, 64, 87, .06);
}

.matantica-branch h3 {
    max-width: 1000px;
    margin: 0;
    color: #2E4057;
    font-size: clamp(25px, 3vw, 36px);
    font-weight: 800;
    line-height: 1.22;
}

.matantica-branch-meta {
    margin: 12px 0 30px;
    color: rgba(46, 64, 87, .76);
    font-size: 15px;
    font-style: italic;
    font-weight: 600;
    line-height: 1.6;
}

.matantica-branch h4 {
    margin: 38px 0 17px;
    color: #2E4057;
    font-size: clamp(19px, 2vw, 23px);
    font-weight: 800;
    line-height: 1.35;
}

.matantica-topic-list {
    margin: 0;
    padding-left: 24px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 54px;
    row-gap: 10px;
    color: #2E4057;
}

.matantica-topic-list + .matantica-topic-list {
    margin-top: 24px;
}

.matantica-topic-list li {
    padding-left: 4px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.62;
}

.matantica-topic-list li::marker,
.matantica-collection li::marker {
    color: #FFD43B;
}

.matantica-collection {
    margin-top: 44px;
    padding: clamp(30px, 4.5vw, 54px);
    border-radius: 16px;
    color: #FFFCEB;
    background: #2E4057;
}

.matantica-collection h3 {
    max-width: 950px;
    margin: 0 0 28px;
    color: #FFFCEB;
    font-size: clamp(24px, 3vw, 35px);
    font-weight: 800;
    line-height: 1.3;
}

.matantica-collection ul {
    margin: 0;
    padding-left: 24px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 48px;
}

.matantica-collection li {
    padding-left: 4px;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
}

@media screen and (max-width: 760px) {
    .frontiere-partnership {
        margin-top: 44px;
    }

    .frontiere-partnership h2 {
        padding-left: 14px;
    }

    .matantica-index {
        margin-top: 58px;
        padding-top: 44px;
    }

    .matantica-index-header {
        margin-bottom: 32px;
    }

    .matantica-branch {
        padding: 26px 22px;
        border-left-width: 4px;
    }

    .matantica-topic-list,
    .matantica-collection ul {
        grid-template-columns: 1fr;
        row-gap: 8px;
    }

    .matantica-branch h4 {
        margin-top: 31px;
    }
}

@media screen and (max-width: 700px) {
    p.archive-author-credit {
        margin-top: 46px !important;
        text-align: left;
    }
}

/* BASE */

html {
    scroll-behavior: smooth;
}

html,
body {
    width: 100%;
    overflow-x: hidden;
}

body {
    background: #2E4057;
    font-family: 'Cormorant Garamond', serif;
}

/* HEADER */

header {
    width: 100%;
    background: #2E4057;
    padding: 14px 70px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);

    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;

    transition: padding .5s ease;
}

.header-container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    min-height: 100px;
    transition: min-height .5s ease;
}
/* =========================================
   SOCIAL HEADER
========================================= */

.header-social {
    display: flex;
    align-items: center;

    gap: 14px;

    order: 2;
    margin-left: -45px;
}


.header-social a {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 28px;
    height: 28px;

    color: #FFFCEB;

    text-decoration: none;

    font-size: 20px;

    transition:
        color .25s ease,
        transform .25s ease;
}


.header-social a:hover {
    color: #FFD43B;

    transform: translateY(-2px);
}

/* LOGO */

.logo-box {
    width: 75px;
    height: 75px;

    background: #2E4057;
    color: #FFFCEB;

    border-radius: 12px;

    display: flex;
    justify-content: center;
    align-items: center;

    position: absolute;
    left: 0;

    font-size: 50px;
    font-weight: 600;
    text-decoration: none;

    opacity: 0;
    transform: translateY(-15px);

    transition:
        opacity .45s ease,
        transform .45s ease,
        background .25s ease,
        color .25s ease;
}

.logo-box:hover {
    background: #FFD43B;
    color: #2E4057;
}

/* TITOLO */

.title-area {
    text-align: center;
}

.title-area h1 {
    color: #FFFCEB;
    font-size: 50px;
    line-height: 48px;
    font-weight: 700;
}

.title-area p {
    margin-top: 8px;

    color: #FFFCEB;
    font-size: 22px;
    font-weight: 300;

    letter-spacing: 4px;
    text-transform: uppercase;
}

.title-area h1,
.title-area p {
    max-height: 80px;
    overflow: hidden;
    transition:
        opacity .5s ease,
        transform .5s ease,
        max-height .5s ease,
        margin .5s ease;
}

/* MENU */

nav {
    display: flex;
    align-items: flex-start;
    gap: 100px;

    margin-top: 22px;
    transition: margin-top .5s ease;
}

nav a {
    text-decoration: none;
    color: #FFFCEB;
    font-size: 24px;
    font-weight: 500;

    transition: color .25s ease;
    position: relative;
}

nav > a::after,
.menu-item > a::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: -6px;

    width: 0;
    height: 2px;

    background: #FFD43B;

    transition: width .25s ease;
}

nav a:hover {
    color: #FFD43B;
}

nav > a:hover::after,
.menu-item:hover > a::after {
    width: 100%;
}

/* MENU A TENDINA */

.menu-item {
    position: relative;
}

.dropdown {
    position: absolute;
    top: calc(100% + 18px);
    left: 0;

    min-width: 240px;

    background: rgba(46, 64, 87, 0.92);
    backdrop-filter: blur(8px);

    padding: 18px;

    display: flex;
    flex-direction: column;
    gap: 16px;

    opacity: 0;
    visibility: hidden;
    transform: translateY(-12px);

    transition:
        opacity .35s ease,
        transform .35s ease,
        visibility .35s ease;

    z-index: 999;
    text-align: left;
}

.menu-item:hover .dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown a {
    color: #FFFCEB;
    font-size: 23px;
    font-weight: 500;
    white-space: nowrap;
    transition: color .3s ease;
}

.dropdown a:hover {
    color: #FFD43B;
}

.dropdown a::after {
    display: none;
}

/* HEADER SCROLLED */

header.scrolled {
    padding: 10px 70px;
}

header.scrolled .header-container {
    min-height: 60px;
}





header.scrolled nav {
    margin-top: 0;
}

/* HERO */

.hero{

    width:100%;
    height:100vh;

    background-image:
        linear-gradient(rgba(0,0,0,.35),rgba(0,0,0,.35)),
        url("hero.jpg");

    background-size:cover;
    background-position:center;

    display:flex;
    align-items:center;

    margin-top:0;
}
.hero-overlay{

    width:100%;
    padding:200px 8% 80px;
}

.hero-content {
    max-width: 720px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    position: relative;
    padding-left: 35px;
}

.hero-content::before {
    content: "";

    position: absolute;
    left: 0;
    top: 12px;

    width: 4px;
    height: 235px;

    background: #FFD43B;
    border-radius: 999px;

    transform: scaleY(var(--line-progress, 1));
    transform-origin: top;

    transition: transform 0.18s ease-out;
    will-change: transform;
}

.hero-content h1{
    font-family:'Jost', sans-serif;

    color:#FFFCEB;

    font-size:110px;

    font-weight:400;

    line-height:.92;

    margin-bottom:45px;

    letter-spacing:-1px;
}
.hero-content p{

    color:#FFFCEB;

    font-size:32px;

    font-weight:400;

    line-height:1.4;

    max-width:720px;

    margin-bottom:55px;
}
.hero-button{

    display:inline-block;

    padding:18px 34px;

    background:#FFD43B;

    color:#2E4057;

    text-decoration:none;

    font-size:24px;

    font-weight:700;

    border-radius:999px;

    transition:.3s ease;
}
.hero-button:hover{

    background:#6B0504;

    color:#FFFCEB;
}




/* NOTIZIE / CAROSELLO */

.news-section {
    background: #FFFCEB;
    padding: 90px 5%;
}

.news-section h2 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;

    color: #2E4057;
    font-size: 46px;
    letter-spacing: -1px;

    margin-bottom: 50px;
    padding-left: 105px;
}

.carosello {
    width: 100%;
    padding: 0 ;

    display: grid;
    grid-template-columns: 80px minmax(0, 1220px) 80px;
    align-items: center;
    justify-content: center;
    gap: 25px;
}

.carousel-window {
    overflow: hidden;
    min-width: 0;
}

.cards {
    display: flex;
    gap: 32px;
    width: max-content;

    will-change: transform;
}

/* CARD */

.card {
    flex: 0 0 360px;

    position: relative;
    overflow: hidden;

    background: transparent;
    border: none;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

/* Barra gialla laterale, inizialmente nascosta */

.card::before {
    content: "";

    position: absolute;
    top: 0;
    left: 0;

    width: 5px;
    height: 100%;

    background: #FFD43B;

    transform: scaleY(0);
    transform-origin: top;

    transition: transform .35s ease;

    z-index: 3;
}

/* Sollevamento della card */

.card:hover {
    transform: translateY(-8px);
    box-shadow: 0 18px 35px rgba(0, 0, 0, .15);
}

/* Comparsa della barra gialla */

.card:hover::before {
    transform: scaleY(1);
}

/* IMMAGINE */

.card img {
    width: 100%;
    height: 260px;

    display: block;
    object-fit: cover;

    filter: saturate(.9);

    transition:
        transform .6s ease,
        filter .4s ease;
}

.card:hover img {
    transform: scale(1.035);
    filter: saturate(1.1);
}

/* PARTE TESTUALE */

.card-content {
    min-height: 220px;
    padding: 22px 20px 25px;

    background: #2E4057;

    transition:
        background .35s ease,
        padding-left .35s ease;
}

/* La parte inferiore diventa gialla */

.card:hover .card-content {
    background: #2E4057;
    padding-left: 27px;
}

/* DATA */

.card-date {
    display: block;
    margin-bottom: 12px;

    color: #FFD43B;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 1.2px;
    text-transform: uppercase;
}

/* TITOLO */

.card h3 {
    min-height: auto;
    margin: 0 0 20px;
    padding: 0;

    background: transparent;
    color: #FFFCEB;

    font-size: 25px;
    font-weight: 600;
    line-height: 1.15;

    transition:
        color .35s ease,
        font-weight .35s ease;
}

.card:hover h3 {
    background: transparent;
    color: #FFFCEB;
    font-weight: 700;
}

/* LINK */

.card-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    color: #FFFCEB;

    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
}

.card-link span {
    display: inline-block;
    transition: transform .3s ease;
}

/* La freccina del link si muove quando tocchi tutta la card */

.card:hover .card-link span {
    transform: translateX(8px);
}

.arrow{

    background: none;
    border: none;
    outline: none;

    color: #2E4057;

    font-size: 54px;
    font-weight: 200;
    font-family: "Helvetica Neue", Arial, sans-serif;

    cursor: pointer;

    opacity: 0;
    transform: scale(.85);

    pointer-events: none;

    transition:
        opacity .35s ease,
        transform .35s ease,
        color .3s ease;

}
.carosello:hover .arrow{

    opacity:1;

    transform:scale(1);

    pointer-events:auto;
}

.arrow:hover {
    color: #FFD43B;
    transform: scale(1.15);
}

/* RESPONSIVE */

@media screen and (max-width: 1100px) {
    nav {
        gap: 45px;
    }

    .carosello {
        grid-template-columns: 60px minmax(0, 760px) 60px;
        gap: 18px;
    }

    .arrow {
        width: 60px;
        height: 60px;
        font-size: 54px;
    }

}

@media screen and (max-width: 900px) {
    header {
        padding: 24px 30px;
    }

    header.scrolled {
        padding: 10px 30px;
    }

    .header-container {
        min-height: auto;
        flex-direction: column;
    }

    .logo-box {
        left: 0;
    }

    nav {
        flex-wrap: wrap;
        justify-content: center;
        gap: 24px;
    }

    .carosello {
        grid-template-columns: 44px minmax(0, 1fr) 44px;
        padding: 0 20px;
        gap: 10px;
    }

    .card {
        flex-basis: 280px;

    }

    .card img {
        height: 210px;
    }

    .arrow {
        width: 44px;
        height: 44px;
        font-size: 43px;
    }

}

.read-more {
    width: min(1220px, calc(100% - 210px));
    margin: 32px auto 0;

    display: flex;
    justify-content: flex-end;
}

.read-more a {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    white-space: nowrap;

    color: #2E4057;

    font-size: 22px;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 5px;

    transition: color .3s ease;
}

.read-more a span {
    display: inline-block;
    text-decoration: none;

    transition: transform .3s ease;
}

.read-more a:hover {
    color: #6B0504;
}

.read-more a:hover span {
    transform: translateX(6px);
}

@media screen and (max-width: 1100px) {
    .read-more {
        width: min(760px, calc(100% - 156px));
    }
}

@media screen and (max-width: 900px) {
    .read-more {
        width: calc(100% - 148px);
    }
}
/* SEZIONE IN EVIDENZA */

.feature-section {
    width: 100%;
    min-height: 520px;

    display: grid;
    grid-template-columns: 42% 58%;

    background: #2E4057;
}

.feature-image {
    min-width: 0;
    overflow: hidden;
}

.feature-image img {
    width: 100%;
    height: 100%;
    min-height: 520px;

    object-fit: cover;
    display: block;
}

.feature-content {
    padding: 70px 8%;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;

    background: #2E4057;
    color: #FFFCEB;
}

.feature-content h2 {
    font-family: 'Montserrat', sans-serif;
    font-size: 46px;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -1px;

    margin-bottom: 22px;
}

.feature-content p {
    max-width: 650px;
    margin-bottom: 42px;

    font-size: 23px;
    font-weight: 500;
    line-height: 1.45;
}

.feature-button {
    display: inline-flex;
    align-items: center;
    gap: 14px;

    padding: 13px 22px;

    background: #FFFCEB;
    color: #2E4057;

    border: 2px solid #FFFCEB;
    border-radius: 30px;

    text-decoration: none;
    font-size: 20px;
    font-weight: 700;

    transition:
        background .3s ease,
        color .3s ease,
        border-color .3s ease,
        transform .3s ease;
}

.feature-button span {
    font-size: 24px;
    line-height: 1;
    transition: transform .3s ease;
}

.feature-button:hover {
    background: #FFD43B;
    color: #2E4057;
    border-color: #FFD43B;
    transform: translateY(-2px);
}

.feature-button:hover span {
    transform: translate(3px, -3px);
}
@media screen and (max-width: 850px) {

    .feature-section {
        grid-template-columns: 1fr;
    }

    .feature-image img {
        min-height: 360px;
    }

    .feature-content {
        padding: 55px 8%;
    }

    .feature-content h2 {
        font-size: 38px;
    }

    .feature-content p {
        font-size: 20px;
    }
}

/* HEADER NUOVO */

.header-container{

    display:flex;
    justify-content:space-between;
    align-items:center;

    min-height:55px;
}

nav{

    width:100%;

    display:flex;
    justify-content:center;
    align-items:center;

    gap:95px;

    margin-top:0;
}

.logo-box{

    position:static;

    opacity:1;

    transform:none;
}
/* ANTEPRIMA COLLEZIONI */

.collections-preview {
    width: 100%;
    padding: 90px 5% 70px;

    background: #FFFCEB;
}

/* Titolo della sezione */

.collections-preview > h2 {
    max-width: 1380px;
    margin: 0 auto 50px;

    color: #2E4057;

    font-family: "Montserrat", sans-serif;
    font-size: 46px;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -1px;
}

/* Griglia delle card */

.collections-grid {
    max-width: 1380px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 28px;
}

.collections-preview .news-page-card {
    min-width: 0;
}

.collections-preview .news-page-card img {
    height: 245px;
    padding: 12px;
    object-fit: contain;
    object-position: center;
    background: #F1E9D9;
}

.collections-preview .news-page-card:hover img {
    transform: none;
}

.collections-preview .news-page-card-content {
    min-height: 320px;
    padding: 24px 22px 27px;
}

.collections-preview .news-page-card h3 {
    font-size: 20px;
}

.collections-preview .news-page-card p {
    font-size: 17px;
}

/* Singola card */

.collection-card {
    min-width: 0;

    background: #2E4057;
    overflow: hidden;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.collection-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 18px 35px rgba(0, 0, 0, .15);
}

/* Parte blu con il titolo */

.collection-card-title {
    min-height: 92px;
    padding: 22px 18px;

    display: flex;
    align-items: center;

    background: #2E4057;
}

.collection-card-title h3 {
    margin: 0;

    color: #FFFCEB;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.25;
}

/* Immagine */

.collection-card img {
    width: 100%;
    height: 250px;

    display: block;
    object-fit: cover;

    transition: transform .6s ease;
}

.collection-card:hover img {
    transform: scale(1.035);
}

/* Link Collezioni */

.collections-link {
    max-width: 1380px;
    margin: 32px auto 0;

    display: flex;
    justify-content: flex-end;
}

.collections-link a {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    color: #2E4057;

    font-size: 22px;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 5px;

    transition: color .3s ease;
}

.collections-link a span {
    display: inline-block;
    text-decoration: none;

    transition: transform .3s ease;
}

.collections-link a:hover {
    color: #6B0504;
}

.collections-link a:hover span {
    transform: translateX(6px);
}
@media screen and (max-width: 1100px) {

    .collections-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 650px) {

    .collections-preview {
        padding: 65px 7% 50px;
    }

    .collections-preview > h2 {
        margin-bottom: 35px;
        font-size: 36px;
    }

    .collections-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .collections-preview .news-page-card img {
        height: min(72vw, 310px);
    }

    .collections-preview .news-page-card-content {
        min-height: 0;
    }

    .collection-card-title {
        min-height: 80px;
    }

    .collection-card img {
        height: 260px;
    }

    .collections-link {
        margin-top: 25px;
    }
}
/* ========================================
   FOOTER
======================================== */

.site-footer {
    width: 100%;

    background: #2E4057;
    color: #FFFCEB;

    padding: 65px 7% 75px;
}


.footer-container {
    width: 100%;
    max-width: 1500px;

    margin: 0 auto;
}


/* ========================================
   PARTE SUPERIORE
======================================== */

.footer-top {
    width: 100%;
}


/* MATEUREKA */

.footer-top h2 {
    margin: 0 0 15px;

font-family: "Cormorant Garamond", serif;
    font-size: 58px;
    font-weight: 500;

    letter-spacing: 5px;

    color: #FFFCEB;
}


/* LINEA GIALLA */

.footer-line {
    width: 100%;
    height: 2px;

    background: #FFD43B;

    margin-bottom: 55px;

    transform: scaleX(var(--footer-line-progress, 0));
    transform-origin: left;

    transition: transform 0.20s linear;

    will-change: transform;
}


/* ========================================
   COLONNE
======================================== */

.footer-content {
    width: 100%;

    display: grid;

    /*
    Contatti occupa un po' più spazio,
    Informazioni rimane centrale,
    Seguici viene spostato verso destra
    */

    grid-template-columns: 1.2fr 1.2fr 0.7fr;

    column-gap: 120px;
}


.footer-column {
    display: flex;
    flex-direction: column;

    align-items: flex-start;

    gap: 12px;
}


/* TITOLI */

.footer-column h3 {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;
    font-weight: 700;

    color: #FFFCEB;
}


/* TESTI */

.footer-column p,
.footer-column a {

    margin: 0;

font-family: "Cormorant Garamond", serif;

    font-size: 20px;
    font-weight: 400;

    line-height: 1.4;

    color: #FFFCEB;

    text-decoration: none;
}


/* LINK */

.footer-column a {
    transition: color .25s ease;
}


.footer-column a:hover {
    color: #FFD43B;
}


/* ========================================
   SOCIAL
======================================== */

.footer-social {
    justify-self: end;

    min-width: 150px;
}


.social-icons {
    display: flex;

    align-items: center;

    gap: 25px;
}


.social-icons a {

    font-size: 30px;

    color: #FFFCEB;

    transition:
        color .25s ease,
        transform .25s ease;
}


.social-icons a:hover {

    color: #FFD43B;

    transform: translateY(-3px);
}


/* ========================================
   RESPONSIVE
======================================== */

@media screen and (max-width: 800px) {

    .site-footer {
        padding: 50px 7%;
    }


    .footer-top h2 {
        font-size: 43px;
    }


    .footer-line {
        margin-bottom: 40px;
    }


    .footer-content {
        grid-template-columns: 1fr;

        gap: 40px;
    }


    .footer-social {
        justify-self: start;
    }

}
/* ========================================
   PAGINA PRENOTA ORA
======================================== */

.booking-page {
    width: 100%;

    background: #FFFCEB;
    color: #2E4057;

    padding: 175px 0 85px;
}


.booking-container {
    width: 89%;
    max-width: 1400px;

    margin: 0 auto;
}


/* ========================================
   TITOLO PRINCIPALE
======================================== */

.booking-container > h1 {
    margin: 0 0 65px;

    font-family: "Montserrat", sans-serif;

    font-size: 58px;
    font-weight: 800;

    line-height: 1;

    letter-spacing: -1.5px;

    color: #2E4057;
}


/* ========================================
   PARTE SUPERIORE
======================================== */

.booking-top {
    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(380px, .85fr);

    gap: 100px;

    align-items: start;

    margin-bottom: 65px;
}


.guided-section h2,
.date-section h2,
.tickets-section > h2,
.booking-contact h2 {
    margin: 0 0 35px;

    font-family: "Montserrat", sans-serif;

    font-size: 37px;
    font-weight: 800;

    line-height: 1.1;

    color: #2E4057;
}


/* ========================================
   VISITE GUIDATE
======================================== */

.visit-block {
    margin-bottom: 46px;
}


.visit-block h3 {
    margin: 0 0 12px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 700;

    color: #2E4057;
}


.visit-block p {
    margin: 0 0 7px;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;
    font-weight: 400;

    line-height: 1.6;

    color: #2E4057;
}



/* ========================================
   ORARI
======================================== */

.visit-hours {
    margin-top: 10px;
}


.visit-hours > h3 {
    margin: 0 0 14px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 700;

    color: #2E4057;
}


.visit-hours > h3 span {
    font-size: 14px;
    font-weight: 400;
}


.hours-box {
    max-width: 600px;

    display: grid;

    grid-template-columns:
        1fr
        1px
        1fr;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .25);

    border-radius: 10px;

    padding: 18px 20px;
}


.hour-item {
    display: flex;

    align-items: center;

    gap: 16px;
}


.hour-icon {
    width: 42px;
    height: 42px;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    background: #0C457C;

    color: #FFFCEB;

    font-size: 20px;
}


.hour-item div:last-child {
    display: flex;
    flex-direction: column;

    gap: 4px;
}


.hour-item strong {
    font-family: "Montserrat", sans-serif;

    font-size: 17px;

    color: #2E4057;
}


.hour-item span {
    font-family: "Montserrat", sans-serif;

    font-size: 14px;

    color: #2E4057;
}


.hours-divider {
    width: 1px;
    height: 55px;

    background: rgba(46, 64, 87, .25);
}



/* ========================================
   CALENDARIO
======================================== */

.date-section {
    padding-top: 52px;
}


.date-section h2 {
    margin-bottom: 25px;

    font-size: 26px;
}


.date-section > p {
    margin-bottom: 45px;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;

    color: #2E4057;
}


.calendar-header {
    display: grid;

    grid-template-columns:
        40px
        1fr
        40px;

    align-items: center;

    margin-bottom: 30px;
}


.calendar-header h3 {
    margin: 0;

    text-align: center;

    font-family: "Montserrat", sans-serif;

    font-size: 23px;
    font-weight: 700;

    color: #2E4057;
}


.calendar-arrow {
    background: none;
    border: none;

    color: #2E4057;

    font-size: 40px;
    font-weight: 300;

    line-height: 1;

    cursor: pointer;

    transition:
        color .25s ease,
        transform .25s ease;
}


.calendar-arrow:hover {
    color: #FFD43B;

    transform: scale(1.1);
}


.date-options {
    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 14px;
}


.date-card {
    min-height: 83px;

    padding: 10px;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    gap: 3px;

    background: transparent;

    border: 1px solid rgba(46, 64, 87, .25);

    border-radius: 7px;

    color: #2E4057;

    cursor: pointer;

    transition:
        border-color .25s ease,
        background .25s ease,
        transform .25s ease;
}


.date-card strong {
    font-family: "Montserrat", sans-serif;

    font-size: 24px;
    font-weight: 500;
}


.date-card span {
    font-family: "Montserrat", sans-serif;

    font-size: 13px;
}


.date-card:hover {
    border-color: #2E4057;

    transform: translateY(-2px);
}


.date-card.selected {
    border: 2px solid #2E4057;

    background: rgba(46, 64, 87, .025);
}


.date-legend {
    margin-top: 32px;

    display: flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 14px;

    color: #2E4057;
}


.legend-dot {
    width: 14px;
    height: 14px;

    border-radius: 50%;

    background: #0C457C;

    display: block;
}



/* ========================================
   BIGLIETTI
======================================== */

.tickets-section {
    width: 100%;

    margin-top: 20px;
}


.tickets-section > h2 {
    margin-bottom: 24px;

    font-size: 39px;
}


.tickets-box {
    width: 100%;

    border: 1px solid rgba(46, 64, 87, .25);

    border-radius: 11px;

    padding: 0 20px;
}



/* SINGOLO PRODOTTO */

.ticket-product {
    min-height: 175px;

    display: grid;

    grid-template-columns:
        90px
        minmax(270px, 1.1fr)
        minmax(390px, 1fr);

    align-items: center;

    gap: 25px;

    padding: 28px 0;

    border-bottom: 1px solid rgba(46, 64, 87, .20);
}


.ticket-product:last-child {
    border-bottom: none;
}



/* ICONA */

.ticket-icon {
    width: 68px;
    height: 68px;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    justify-self: center;

    background: #EDF2F8;

    color: #0C457C;

    font-size: 32px;
}


.ticket-icon-letter {
    font-family: "Montserrat", sans-serif;

    font-size: 41px;
    font-weight: 600;
}



/* DESCRIZIONE */

.ticket-description h3 {
    margin: 0 0 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 700;

    line-height: 1.45;

    color: #2E4057;
}


.ticket-description p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 14px;

    color: #2E4057;
}



/* OPZIONI INTERO/RIDOTTO */

.ticket-options {
    display: flex;

    flex-direction: column;

    gap: 24px;
}


.ticket-option {
    display: grid;

    grid-template-columns:
        minmax(135px, 1fr)
        70px
        135px;

    align-items: center;

    gap: 20px;
}


.ticket-type {
    display: flex;

    flex-direction: column;

    font-family: "Montserrat", sans-serif;

    font-size: 20px;

    color: #2E4057;
}


.ticket-type small {
    margin-top: 3px;

    font-size: 16px;

    line-height: 1.3;
}


.ticket-price {
    font-family: "Montserrat", sans-serif;

    font-size: 19px;
    font-weight: 700;

    color: #2E4057;
}



/* ========================================
   CONTATORE
======================================== */

.ticket-counter {
    height: 42px;

    display: grid;

    grid-template-columns:
        38px
        45px
        38px;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .25);

    border-radius: 7px;

    overflow: hidden;
}


.ticket-counter button {
    width: 100%;
    height: 100%;

    border: none;

    background: transparent;

    color: #2E4057;

    font-family: "Montserrat", sans-serif;

    font-size: 19px;

    cursor: pointer;

    transition:
        background .25s ease,
        color .25s ease;
}


.ticket-counter button:hover {
    background: #FFD43B;
    color: #2E4057;
}


.quantity {
    text-align: center;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;

    color: #2E4057;
}



/* ========================================
   NOTA
======================================== */

.ticket-note {
    margin: 20px 0 26px;

    font-family: "Montserrat", sans-serif;

    font-size: 14px;

    color: #2E4057;
}



/* ========================================
   BOTTONE ACQUISTA - VERSIONE PIÙ RAFFINATA
======================================== */

.purchase-button {
    width: 100%;
    height: 58px;

    margin-top: 8px;

    border: none;
    border-radius: 5px;

    background: #2E4057;
    color: #FFFCEB;

    /* FONT COME NELLO SCREENSHOT */
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.5px;

    cursor: pointer;

    position: relative;
    overflow: hidden;

    transition:
        background .3s ease,
        color .3s ease;
}


.purchase-button:hover {
    background: #24364a;
    color: #FFD43B;

    transform: translateY(-2px);
}


.purchase-button:active {
    transform: translateY(0);
}


/* ========================================
   INFORMAZIONI
======================================== */

.booking-contact {
    margin-top: 35px;

    padding-top: 28px;

    border-top: 1px solid rgba(46, 64, 87, .20);
}


.booking-contact h2 {
    margin-bottom: 14px;

    font-size: 32px;
}


.booking-contact > p {
    margin: 0 0 13px;

    font-family: "Montserrat", sans-serif;

    font-size: 14px;

    color: #2E4057;
}


.booking-phone {
    display: inline-flex;

    align-items: center;

    gap: 16px;

    text-decoration: none;

    font-family: "Montserrat", sans-serif;

    font-size: 21px;
    font-weight: 700;

    color: #2E4057;
}


.phone-icon {
    width: 42px;
    height: 42px;

    border-radius: 50%;

    display: flex;

    align-items: center;
    justify-content: center;

    background: #0C457C;

    color: #FFFCEB;

    font-size: 18px;

    transition:
        background .25s ease,
        color .25s ease;
}


.booking-phone:hover .phone-icon {
    background: #FFD43B;

    color: #2E4057;
}



/* ========================================
   RESPONSIVE
======================================== */

@media screen and (max-width: 1050px) {

    .booking-top {
        grid-template-columns: 1fr;

        gap: 20px;
    }


    .date-section {
        padding-top: 0;

        max-width: 600px;
    }


    .ticket-product {
        grid-template-columns:
            75px
            1fr;

        gap: 20px;
    }


    .ticket-options {
        grid-column: 2;
    }

}


@media screen and (max-width: 700px) {

    .booking-page {
        padding: 145px 0 60px;
    }


    .booking-container {
        width: 88%;
    }


    .booking-container > h1 {
        font-size: 43px;

        margin-bottom: 45px;
    }


    .guided-section h2,
    .tickets-section > h2 {
        font-size: 32px;
    }


    .date-options {
        gap: 7px;
    }


    .date-card {
        min-height: 72px;
    }


    .hours-box {
        grid-template-columns: 1fr;

        gap: 20px;
    }


    .hours-divider {
        width: 100%;
        height: 1px;
    }


    .ticket-product {
        grid-template-columns: 1fr;

        padding: 28px 5px;
    }


    .ticket-icon {
        justify-self: start;
    }


    .ticket-options {
        grid-column: 1;
    }


    .ticket-option {
        grid-template-columns:
            minmax(0, 1fr)
            auto;
    }


    .ticket-counter {
        grid-column: 1 / -1;

        justify-self: start;

        margin-top: 4px;
    }


    .purchase-button {
        font-size: 20px;
    }

}
/* ========================================
   POPUP NEWSLETTER — VERSIONE RAFFINATA
======================================== */


/* ===================================
   PAGINA CONTATTI
=================================== */

.contact-page {
    width: 100%;
    min-height: 100vh;

    background: #FFFCEB;

    padding: 170px 6% 110px;
}


.contact-container {
    width: 100%;
    max-width: 1380px;

    margin: 0 auto;
}


/* TITOLO */

.contact-container h1 {
    font-family: "Montserrat", sans-serif;

    font-size: 54px;
    font-weight: 800;

    color: #2E4057;

    margin-bottom: 28px;
}


/* TESTO INIZIALE */

.contact-intro {
    font-family: "Montserrat", sans-serif;

    color: #2E4057;

    font-size: 25px;
    font-weight: 500;

    line-height: 1.5;

    margin-bottom: 55px;
}


/* FORM */

.contact-form {
    width: 100%;
    max-width: 700px;
}


/* SINGOLO CAMPO */

.contact-field {
    display: flex;
    flex-direction: column;

    margin-bottom: 42px;
}


/* SCRITTE SOPRA I CAMPI */

.contact-field label {
    font-family: "Montserrat", sans-serif;

    color: #2E4057;

    font-size: 24px;
    font-weight: 600;

    margin-bottom: 20px;
}


.contact-field label span {
    font-weight: 500;
}


/* INPUT NOME + EMAIL */

.contact-field input {
    width: 100%;
    height: 60px;

    padding: 12px 16px;

    background: transparent;

    border: 2px solid rgba(46, 64, 87, .35);
    border-radius: 10px;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;

    color: #2E4057;

    outline: none;

    transition:
        border-color .25s ease,
        box-shadow .25s ease;
}


/* MESSAGGIO */

.contact-field textarea {
    width: 100%;
    min-height: 290px;

    padding: 15px 16px;

    resize: vertical;

    background: transparent;

    border: 2px solid rgba(46, 64, 87, .35);
    border-radius: 10px;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;

    color: #2E4057;

    outline: none;

    transition:
        border-color .25s ease,
        box-shadow .25s ease;
}


/* QUANDO CLICCHI SUL CAMPO */

.contact-field input:focus,
.contact-field textarea:focus {

    border-color: #2E4057;

    box-shadow:
        0 0 0 3px rgba(46, 64, 87, .08);
}


/* BOTTONE INVIA */

.contact-submit {
    border: none;

    background: #2E4057;
    color: #FFFCEB;

    padding: 14px 32px;

    border-radius: 30px;

    font-family: "Montserrat", sans-serif;

    font-size: 20px;
    font-weight: 700;

    cursor: pointer;

    transition:
        background .25s ease,
        color .25s ease,
        transform .25s ease;
}


.contact-submit:hover {
    background: #FFD43B;
    color: #2E4057;

    transform: translateY(-2px);
}


/* RESPONSIVE */

@media screen and (max-width: 750px) {

    .contact-page {
        padding: 150px 7% 80px;
    }

    .contact-container h1 {
        font-size: 42px;
    }

    .contact-intro {
        font-size: 20px;
    }

    .contact-field label {
        font-size: 20px;
    }

}

/* Stack stratificato dei piani */
.virtual-tour-layered-shell {
    position: relative;
    isolation: isolate;
    width: 100%;
    margin-top: 42px;
    overflow: visible;
}

.virtual-tour-grid.virtual-tour-layered-stack {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(18px, 2vw, 28px);
    width: 100%;
    padding: 48px 24px;
    overflow: visible;
}

.virtual-tour-layered-stack .virtual-floor-card {
    --layer-x: 0px;
    --layer-y: 0px;
    --layer-rotation: 0deg;
    --layer-scale: 1;
    --layer-z: 1;
    position: relative;
    z-index: var(--layer-z);
    min-width: 0;
    border: 1px solid rgba(255, 212, 59, .42);
    border-radius: 3px;
    transform:
        translate3d(var(--layer-x), var(--layer-y), 0)
        rotate(var(--layer-rotation))
        scale(var(--layer-scale));
    transform-origin: center center;
    box-shadow: 0 22px 48px rgba(20, 31, 46, .2);
    transition:
        transform .8s cubic-bezier(.16, 1, .3, 1),
        box-shadow .45s ease,
        border-color .45s ease;
    will-change: transform;
}

.virtual-tour-layered-stack.is-expanded .virtual-floor-card:nth-child(2) {
    transition-delay: .025s;
}

.virtual-tour-layered-stack.is-expanded .virtual-floor-card:nth-child(3) {
    transition-delay: .05s;
}

.virtual-tour-layered-stack.is-expanded .virtual-floor-card:nth-child(4) {
    transition-delay: .075s;
}

.virtual-tour-layered-stack .virtual-floor-card:hover,
.virtual-tour-layered-stack .virtual-floor-card:focus-visible {
    --layer-scale: 1.035;
    border-color: #FFD43B;
    transform:
        translate3d(var(--layer-x), var(--layer-y), 0)
        rotate(var(--layer-rotation))
        scale(var(--layer-scale));
    box-shadow: 0 30px 62px rgba(20, 31, 46, .28);
}

.virtual-tour-layered-stack .virtual-floor-card:focus-visible {
    outline: 3px solid #FFD43B;
    outline-offset: 5px;
}

.virtual-tour-layered-stack .virtual-floor-card img {
    height: 300px;
}

.virtual-tour-layered-stack .virtual-floor-card:hover img,
.virtual-tour-layered-stack .virtual-floor-card:focus-visible img {
    transform: scale(1.035);
}

.virtual-tour-layered-stack.without-layer-motion .virtual-floor-card {
    transition: none !important;
}

@media screen and (max-width: 1050px) {
    .virtual-tour-grid.virtual-tour-layered-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 26px;
        padding-inline: 5%;
    }

    .virtual-tour-layered-stack .virtual-floor-card img {
        height: 320px;
    }
}

@media screen and (max-width: 600px) {
    .virtual-tour-layered-shell {
        margin-top: 24px;
    }

    .virtual-tour-grid.virtual-tour-layered-stack {
        grid-template-columns: 1fr;
        gap: 22px;
        padding: 24px 0;
    }

    .virtual-tour-layered-stack .virtual-floor-card img {
        height: 280px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .virtual-tour-layered-stack .virtual-floor-card {
        transition: none;
    }
}

/* ==================================================
   RIFINITURE GLOBALI: LINK TESTUALI E COSA SCOPRIRE
================================================== */

/* Pallini gialli negli elenchi delle pagine del primo piano del tour. */
:is(
    .object-page,
    .written-page,
    .greek-page,
    .roman-page,
    .eastern-page,
    .medieval-page,
    .america-page,
    .renaissance-page,
    .seicento-page,
    .settecento-page,
    .ottocento-page,
    .novecento-page
) li::marker {
    color: #FFD43B !important;
}

/* Evidenziatore solo nei link interni alle card Notizie e Archivio in home. */
.news-section .card .card-link,
.collections-preview .news-page-card-content > a {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    position: relative;
    /* Lo spazio extra a destra mantiene la freccia dentro l'evidenziatore
       anche quando si sposta durante l'hover. */
    padding: 0 13px 0 3px;
    margin-left: -3px;
    margin-right: -13px;
    color: #FFFCEB;
    text-decoration: none;
    box-shadow: inset 0 -3px 0 #FFD43B;
    transform-origin: center;
    transition:
        box-shadow .25s ease,
        color .25s ease,
        transform .25s ease;
}

.news-section .card .card-link span,
.collections-preview .news-page-card-content > a span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1em;
    line-height: 1;
}

/* Allinea il link Scopri la notizia sul fondo di tutte le card in home. */
.news-section .cards {
    align-items: stretch;
}

.news-section .card {
    display: flex;
    flex-direction: column;
}

.news-section .card-content {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.news-section .card .card-link {
    align-self: flex-start;
    margin-top: auto;
}

.news-section .card .card-link:hover,
.news-section .card .card-link:focus-visible,
.collections-preview .news-page-card-content > a:hover,
.collections-preview .news-page-card-content > a:focus-visible {
    color: #2E4057;
    box-shadow: inset 0 -1.45em 0 #FFD43B;
    transform: scale(1.05);
}

/* Immagini di Cosa puoi scoprire: stessa cornice e stesso asse. */
.offriamo-row:nth-of-type(even) {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.offriamo-image {
    align-self: start;
}

.offriamo-image img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4 / 3;
    object-fit: cover !important;
    object-position: center !important;
}

@media (prefers-reduced-motion: reduce) {
    .added-news-video-preview,
    .added-news-video-preview img,
    .added-news-play,
    .news-section .card .card-link,
    .collections-preview .news-page-card-content > a {
        transition: none !important;
    }
}
/* =========================================
   COERENZA FONT - PRENOTA + CONTATTI
========================================= */


/* TITOLI PRINCIPALI
   "Prenota ora" / "Contattaci"
*/

.booking-container > h1,
.contact-container > h1 {
    font-family: "Montserrat", sans-serif;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.1;
}


/* TITOLI DELLE SEZIONI
   "Visite guidate"
   "Biglietti"
   "Informazioni e prenotazioni"
*/

.guided-section > h2,
.tickets-section > h2,
.booking-contact > h2 {
    font-family: "Montserrat", sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;
}


/* TESTO INTRODUTTIVO CONTATTI */

.contact-intro {
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.5;
}

/* CONTATTI DIRETTI */
.direct-contact-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    width: 100%;
    max-width: 980px;
}

.direct-contact-card {
    display: flex;
    align-items: baseline;
    gap: 10px;
    min-height: 118px;
    padding: 30px 34px;
    border: 2px solid #FFD43B;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.24);
    color: #2E4057;
    font-family: "Montserrat", sans-serif;
    text-decoration: none;
    transition: background-color .25s ease, transform .25s ease, box-shadow .25s ease;
}

.direct-contact-label,
.direct-contact-value {
    font-size: 20px;
    line-height: 1.45;
}

.direct-contact-label {
    font-weight: 700;
}

.direct-contact-value {
    position: relative;
    font-weight: 500;
}

.direct-contact-value::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -4px;
    height: 2px;
    background: #FFD43B;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .25s ease;
}

.direct-contact-card:hover,
.direct-contact-card:focus-visible {
    background: #FFD43B;
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(46, 64, 87, .14);
    outline: none;
}

.direct-contact-card:hover .direct-contact-value::after,
.direct-contact-card:focus-visible .direct-contact-value::after {
    background: #2E4057;
    transform: scaleX(1);
}

@media screen and (max-width: 750px) {
    .direct-contact-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .direct-contact-card {
        min-height: 0;
        padding: 24px;
        flex-wrap: wrap;
    }

    .direct-contact-label,
    .direct-contact-value {
        font-size: 18px;
    }
}


/* ETICHETTE FORM
   "Il tuo nome"
   "La tua email"
   "Il tuo messaggio"
*/

.contact-field label {
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 600;
}


/* TESTI NORMALI PAGINA PRENOTA */

.visit-block p,
.booking-contact p {
    font-size: 20px;
    line-height: 1.5;
}


/* GRUPPI / VISITATORI SINGOLI */

.visit-block h3 {
    font-size: 24px;
    font-weight: 700;
}


/* INTERO / RIDOTTO */

.ticket-type {
    font-size: 20px;
    font-weight: 600;
}


/* PREZZI */

.ticket-price {
    font-size: 22px;
}
/* ========================================
   PAGINA NOTIZIE
======================================== */

.news-page {
    width: 100%;

    padding: 175px 5% 100px;

    background: #FFFCEB;
}


.news-page-container {
    width: 100%;
    max-width: 1380px;

    margin: 0 auto;
}


/* ========================================
   TESTATA
======================================== */

.news-page-header {
    margin-bottom: 65px;
}


.news-page-header h1 {
    margin: 0 0 22px;

    font-family: "Montserrat", sans-serif;

    font-size: 48px;
    font-weight: 800;
    line-height: 1.1;

    color: #2E4057;

    letter-spacing: -1px;
}


.news-page-header p {
    max-width: 610px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 20px;
    font-weight: 400;
    line-height: 1.5;

    color: #2E4057;
}

/* =========================================
   RICHIAMO SOCIAL - PAGINA NOTIZIE
========================================= */

.notizie-social-callout {
    position: relative;

    max-width: 950px;

    margin: 55px 0;
    padding: 25px 35px;

    background: rgba(46, 64, 87, 0.05);

    border-left: 5px solid #FFD43B;

    border-radius: 0;

    /* necessario */
    z-index: 1;
}


/* PROLUNGAMENTO DELLO SFONDO FINO A DESTRA */

.notizie-social-callout::before {
    content: "";

    position: absolute;

    top: 0;
    bottom: 0;

    left: 100%;

    width: 100vw;

    background: rgba(46, 64, 87, 0.05);

    z-index: -1;
}

.notizie-social-callout p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 21px;
    font-weight: 500;
    line-height: 1.65;

    color: #2E4057;
}


/* INSTAGRAM + FACEBOOK */

.notizie-social-callout .social-name {
    position: relative;

    display: inline-block;

    font-size: 23px;
    font-weight: 800;

    color: #2E4057;

    padding: 0 3px;

    z-index: 1;
}


/* EVIDENZIATORE GIALLO */

.notizie-social-callout .social-name::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 2px;

    width: 100%;
    height: 3px;

    background: #FFD43B;

    z-index: -1;

    border-radius: 2px;
}

.notizie-social-callout a.social-name {
    text-decoration: none;
} 


.notizie-social-callout a.social-name:hover::after {
    height: 100%;
    bottom: 0;

    transition: height .25s ease;
}
.notizie-social-callout .social-name {
    transition: 
        transform 0.25s ease,
        color 0.25s ease;
}


/* HOVER INSTAGRAM E FACEBOOK */

.notizie-social-callout .social-name:hover {
    transform: scale(1.12);
}

/* ========================================
   NOTIZIA IN EVIDENZA
======================================== */

.news-featured {
    width: 100%;

    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(370px, .85fr);

    margin-bottom: 85px;

    background: #2E4057;

    overflow: hidden;
}


.news-featured-image {
    min-height: 430px;

    overflow: hidden;
}


.news-featured-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition: transform .6s ease;
}


.news-featured:hover
.news-featured-image img {
    transform: scale(1.035);
}


.news-featured-content {
    padding: 55px 50px;

    display: flex;
    flex-direction: column;

    justify-content: center;
    align-items: flex-start;

    color: #FFFCEB;
}


.news-featured-label {
    margin-bottom: 13px;

    font-family: "Montserrat", sans-serif;

    font-size: 13px;
    font-weight: 700;

    letter-spacing: 1.2px;

    color: #FFD43B;
}


.news-featured-date {
    margin-bottom: 25px;

    font-family: "Montserrat", sans-serif;

    font-size: 14px;
    font-weight: 600;

    color: #FFFCEB;

    opacity: .8;
}


.news-featured-content h2 {
    margin: 0 0 22px;

    font-family: "Montserrat", sans-serif;

    font-size: 36px;
    font-weight: 800;

    line-height: 1.12;

    color: #FFFCEB;
}


.news-featured-content p {
    margin: 0 0 35px;

    max-width: 500px;

font-family: "Montserrat", sans-serif;

    font-size: 22px;
    font-weight: 500;

    line-height: 1.45;

    color: #FFFCEB;
}


.news-featured-link {
    display: inline-flex;

    align-items: center;

    gap: 12px;

    color: #FFFCEB;

    font-size: 19px;
    font-weight: 600;

    text-decoration: underline;
    text-underline-offset: 5px;
}


.news-featured-link span {
    display: inline-block;

    text-decoration: none;

    transition: transform .3s ease;
}


.news-featured-link:hover {
    color: #FFD43B;
}


.news-featured-link:hover span {
    transform: translateX(6px);
}



/* ========================================
   TITOLO ULTIME NOTIZIE
======================================== */

.news-list-heading {
    display: flex;

    align-items: center;

    gap: 28px;

    margin-bottom: 40px;
}


.news-list-heading h2 {
    margin: 0;

    white-space: nowrap;

    font-family: "Montserrat", sans-serif;

    font-size: 36px;
    font-weight: 800;

    color: #2E4057;
}


.news-list-line {
    flex: 1;

    height: 2px;

    background: #FFD43B;
}



/* ========================================
   CARD
======================================== */

.news-page-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 32px;
}


.news-page-card {
    position: relative;

    overflow: hidden;

    background: #2E4057;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.news-page-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 5px;
    height: 100%;

    background: #FFD43B;

    transform: scaleY(0);
    transform-origin: top;

    transition: transform .35s ease;

    z-index: 3;
}


.news-page-card:hover {
    transform: translateY(-8px) scale(1.025);

    box-shadow:
        0 18px 35px
        rgba(0, 0, 0, .15);

    z-index: 5;
}

.news-page-card:hover::before {
    transform: scaleY(1);
}


.news-page-card img {
    width: 100%;
    height: 250px;

    display: block;

    object-fit: cover;

    transition: transform .6s ease;
}


.news-page-card:hover img {
    transform: scale(1.035);
}


.news-page-card-content {
    min-height: 250px;

    padding: 25px 23px 28px;

    display: flex;
    flex-direction: column;

    align-items: flex-start;
}


.news-page-date {
    margin-bottom: 13px;

    font-family: "Montserrat", sans-serif;

    font-size: 13px;
    font-weight: 700;

    letter-spacing: 1px;

    color: #FFD43B;
}


.news-page-card h3 {
    margin: 0 0 16px;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;
    font-weight: 700;

    line-height: 1.25;

    color: #FFFCEB;
}


.news-page-card p {
    margin: 0 0 25px;

font-family: "Montserrat", sans-serif;

    font-size: 19px;

    line-height: 1.4;

    color: #FFFCEB;
}


.news-page-card a {
    margin-top: auto;

    display: inline-flex;

    align-items: center;

    gap: 10px;

    color: #FFFCEB;

    font-size: 18px;
    font-weight: 600;

    text-decoration: underline;
    text-underline-offset: 5px;

    transition: color .3s ease;
}


.news-page-card a span {
    display: inline-block;

    text-decoration: none;

    transition: transform .3s ease;
}


.news-page-card a:hover {
    color: #FFD43B;
}


.news-page-card a:hover span {
    transform: translateX(6px);
}



/* ========================================
   CARICA ALTRE
======================================== */

.news-load-more {
    display: flex;

    justify-content: center;

    margin-top: 50px;
}


.news-load-more button {
    min-width: 300px;

    padding: 16px 30px;

    border: 2px solid #2E4057;
    border-radius: 30px;

    background: transparent;

    color: #2E4057;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 700;

    cursor: pointer;

    transition:
        background .3s ease,
        color .3s ease;
}


.news-load-more button:hover {
    background: #2E4057;

    color: #FFD43B;
}



/* ========================================
   RESPONSIVE
======================================== */

@media screen and (max-width: 1050px) {

    .news-featured {
        grid-template-columns: 1fr;
    }


    .news-featured-image {
        min-height: 380px;
    }


    .news-page-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


@media screen and (max-width: 700px) {

    .news-page {
        padding: 145px 6% 70px;
    }


    .news-page-header h1 {
        font-size: 43px;
    }


    .news-page-header p {
        font-size: 18px;
    }


    .news-featured-content {
        padding: 38px 28px;
    }


    .news-featured-content h2 {
        font-size: 30px;
    }


    .news-page-grid {
        grid-template-columns: 1fr;
    }


    .news-list-heading h2 {
        font-size: 30px;
    }

}
.booking-email {
    display: block;

    margin-top: 15px;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 600;

    color: #2E4057;

    text-decoration: underline;
    text-underline-offset: 4px;

    transition: color .25s ease;
}

.booking-email:hover {
    color: #FFD43B;
}
/* ========================================
   TARIFFE
======================================== */

.prices-section {
    width: 100%;
    margin-top: 65px;
}


.prices-section > h2 {
    margin: 0 0 12px;

    font-family: "Montserrat", sans-serif;
    font-size: 32px;
    font-weight: 700;

    color: #2E4057;
}


.prices-intro {
    margin: 0 0 35px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.5;

    color: #2E4057;
}


/* SINGOLA TARIFFA */

.price-row {
    width: 100%;

    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;

    gap: 50px;

    padding: 30px 0;

    border-top: 1px solid rgba(46, 64, 87, .20);
}


.price-row:last-of-type {
    border-bottom: 1px solid rgba(46, 64, 87, .20);
}


/* DESCRIZIONE */

.price-info h3 {
    margin: 0 0 7px;

    font-family: "Montserrat", sans-serif;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.4;

    color: #2E4057;
}


.price-info p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;

    color: #2E4057;

    opacity: .75;
}


/* PREZZI */

.price-values {
    display: flex;

    align-items: center;

    gap: 55px;
}


.price-values > div {
    min-width: 90px;

    display: flex;
    flex-direction: column;

    gap: 5px;
}


.price-values span {
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 500;

    color: #2E4057;
}


.price-values strong {
    font-family: "Montserrat", sans-serif;
    font-size: 22px;
    font-weight: 700;

    color: #2E4057;
}


/* NOTA RIDOTTO */

.prices-note {
    margin: 18px 0 0;

    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    line-height: 1.5;

    color: #2E4057;
}

/* NUOVE PAGINE NOTIZIE */

.added-news-page .article-title-wrapper {
    max-width: 1180px;
}

.added-news-page .article-title-wrapper h1 {
    overflow-wrap: anywhere;
}

.added-news-page .article-text {
    max-width: 1040px;
}

.added-news-media {
    width: min(100%, 940px);
    margin: 42px auto 0;
}

.added-news-media img {
    width: 100%;
    max-height: 820px;
    display: block;
    object-fit: contain;
    background: #F1E9D9;
}

.added-news-poster {
    width: min(100%, 720px);
}

.added-news-video-preview {
    position: relative;
    width: min(100%, 1040px);
    aspect-ratio: 16 / 9;
    margin: 40px auto 0;
    display: block;
    overflow: hidden;
    background: #2E4057;
    border-radius: 18px;
    box-shadow: 0 22px 50px rgba(20, 31, 46, .18);
    isolation: isolate;
    transition: transform .32s ease, box-shadow .32s ease;
}

.added-news-video-preview img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform .5s cubic-bezier(.2, .75, .25, 1), filter .32s ease;
}

.added-news-video-preview::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(20, 31, 46, .04), rgba(20, 31, 46, .24));
    transition: background .32s ease;
}

.added-news-play {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 2;
    width: clamp(74px, 9vw, 106px);
    height: clamp(52px, 6.4vw, 75px);
    display: grid;
    place-items: center;
    color: #fff;
    background: #ff0033;
    border-radius: 22%;
    font-size: clamp(34px, 4.5vw, 52px);
    line-height: 1;
    box-shadow: 0 14px 35px rgba(20, 31, 46, .34);
    transform: translate(-50%, -50%);
    transition: transform .32s cubic-bezier(.2, .75, .25, 1), background .25s ease;
}

.added-news-video-preview:hover,
.added-news-video-preview:focus-visible {
    transform: translateY(-4px);
    box-shadow: 0 28px 64px rgba(20, 31, 46, .25);
}

.added-news-video-preview:hover img,
.added-news-video-preview:focus-visible img {
    transform: scale(1.025);
    filter: saturate(1.04) contrast(1.02);
}

.added-news-video-preview:hover .added-news-play,
.added-news-video-preview:focus-visible .added-news-play {
    transform: translate(-50%, -50%) scale(1.09);
    background: #e0002c;
}

.article-text .added-news-external,
.article-text .added-news-external:visited {
    color: #D6A900;
    font-weight: 700;
    text-decoration: none;
    transition: color .25s ease;
}

.article-text .added-news-external:hover,
.article-text .added-news-external:focus-visible {
    color: #2E4057;
}

@media screen and (max-width: 700px) {
    .added-news-media,
    .added-news-video-preview {
        margin-top: 30px;
        border-radius: 12px;
    }
}


/* MOBILE */

@media screen and (max-width: 700px) {

    .price-row {
        grid-template-columns: 1fr;

        gap: 22px;

        padding: 25px 0;
    }


    .price-values {
        gap: 40px;
    }

}
/* ========================================
   MESSAGGIO INVIATO
======================================== */

.message-success-overlay {
    position: fixed;
    inset: 0;

    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 25px;

    background: rgba(20, 30, 43, .48);
    backdrop-filter: blur(3px);

    z-index: 9999;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transition:
        opacity .35s ease,
        visibility .35s ease;
}


.message-success-overlay.show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.contact-form-status {
    margin: 18px 0 0;
    color: #2E4057;
    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
}

.contact-form-status.is-error {
    color: #2E4057;
    border-left: 4px solid #FFD43B;
    padding-left: 12px;
}


.message-success-box {
    width: 100%;
    max-width: 480px;

    padding: 48px 40px;

    background: #FFFCEB;

    text-align: center;

    transform: translateY(15px);

    transition: transform .35s ease;
}


.message-success-overlay.show
.message-success-box {
    transform: translateY(0);
}


.message-success-icon {
    width: 58px;
    height: 58px;

    margin: 0 auto 25px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    color: #FFD43B;

    font-family: "Montserrat", sans-serif;
    font-size: 28px;
    font-weight: 700;
}


.message-success-box h2 {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 27px;
    font-weight: 800;
    line-height: 1.2;

    color: #2E4057;
}


.message-success-box p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    line-height: 1.5;

    color: #2E4057;
}
/* ======================================================
   PAGINA DIDATTICA - SCUOLE E GRUPPI
====================================================== */

.school-page {
    width: 100%;

    padding: 165px 5% 0;

    background: #FFFCEB;

    color: #2E4057;
}


.school-container {
    width: 100%;
    max-width: 1380px;

    margin: 0 auto;
}


/* ======================================================
   IMMAGINE PRINCIPALE
====================================================== */

.school-hero-image {
    width: 100%;
    height: 335px;

    margin-bottom: 38px;

    overflow: hidden;

    border-radius: 6px;
}


.school-hero-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;
}


/* ======================================================
   TITOLO
====================================================== */

.school-intro {
    margin-bottom: 25px;
}


.school-intro > h1 {
    font-family: "Montserrat", sans-serif;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.1;
    color: #2E4057;
}


.school-title-line {
    width: 70px;
    height: 3px;

    margin: 27px 0 55px;

    background: #FFD43B;
}


/* ======================================================
   DOMANDE PIÙ FREQUENTI
====================================================== */




.school-question-title h2 {
    font-family: "Montserrat", sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;
    color: #2E4057;
}


/* ======================================================
   RIGHE FAQ
====================================================== */

.school-faq-row {
    width: 100%;

    display: grid;

    grid-template-columns: 85px minmax(0, 1fr);

    column-gap: 27px;

    padding: 38px 0;

    border-bottom:
        1px solid rgba(46, 64, 87, .28);
}


.school-faq-last {
    border-bottom: none;

    padding-bottom: 45px;
}


/* ======================================================
   ICONA CIRCOLARE
====================================================== */

.school-faq-icon {
    width: 68px;
    height: 68px;

    margin-top: 1px;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #0C457C;

    color: #FFFCEB;

    font-size: 27px;
}


/* ======================================================
   CONTENUTO FAQ
====================================================== */

.school-faq-content {
    position: relative;

    padding-left: 27px;
}


/* LINEA GIALLA VERTICALE */

.school-faq-content::before {
    content: "";

    position: absolute;

    left: 0;
    top: 0;

    width: 2px;
    height: 100%;

    background: #FFD43B;
}

.school-faq-content h3 {
    font-family: "Montserrat", sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
    color: #2E4057;
}


.school-faq-content ul {
    margin: 0;

    padding-left: 22px;
}



.school-faq-content li {
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.55;
    color: #2E4057;
}


/* ======================================================
   RESPONSIVE TABLET
====================================================== */

@media screen and (max-width: 950px) {

    .school-hero-image {
        height: 285px;
    }


    .school-intro > h1 {
        font-size: 48px;
    }


    .school-question-title h2 {
        font-size: 30px;
    }

}


/* ======================================================
   RESPONSIVE MOBILE
====================================================== */

@media screen and (max-width: 650px) {

    .school-page {
        padding: 145px 7% 0;
    }


    .school-hero-image {
        height: 220px;

        margin-bottom: 30px;
    }


    .school-intro > h1 {
        font-size: 39px;
    }


    .school-question-title {
        align-items: flex-start;

        gap: 18px;
    }


    .school-question-icon {
        width: 55px;

        flex-basis: 55px;

        font-size: 48px;
    }


    .school-question-title h2 {
        font-size: 26px;
    }


    .school-faq-row {
        grid-template-columns: 55px minmax(0, 1fr);

        column-gap: 17px;

        padding: 24px 0;
    }


    .school-faq-icon {
        width: 52px;
        height: 52px;

        font-size: 21px;
    }


    .school-faq-content {
        padding-left: 18px;
    }


    .school-faq-content h3 {
        font-size: 21px;
    }


    .school-faq-content li {
        font-size: 15px;
    }

}
/* ========================================
   FONT ORIGINALI HEADER E FOOTER
======================================== */

header nav a,
header .dropdown a {
    font-family: "Cormorant Garamond", serif;
}

.footer-column h3 {
    font-family: "Montserrat", sans-serif;
}

.footer-column p,
.footer-column a {
    font-family: "Cormorant Garamond", serif;
}
/* ========================================
   PAGINA DOVE SIAMO
======================================== */

.location-page {
    width: 100%;

    padding: 175px 5% 100px;

    background: #FFFCEB;

    color: #2E4057;
}


.location-container {
    width: 100%;
    max-width: 1380px;

    margin: 0 auto;
}


/* ========================================
   TITOLO
======================================== */

.location-header {
    margin-bottom: 45px;
}


.location-header h1 {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 70px;
    font-weight: 900;
    line-height: 1.1;

    letter-spacing: -1px;

    color: #2E4057;
}


.location-title-line {
    width: 70px;
    height: 3px;

    margin-top: 22px;

    background: #FFD43B;
}


/* ========================================
   MAPPA
======================================== */

.location-map {
    width: 100%;
    height: 470px;

    overflow: hidden;

    margin-bottom: 55px;
}


.location-map iframe {
    width: 100%;
    height: 100%;

    display: block;

    border: 0;
}


/* ========================================
   INFORMAZIONI
======================================== */

.location-info {
    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap: 90px;

    padding-bottom: 20px;
}


.location-info h2 {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;

    font-size: 24px;
    font-weight: 700;

    line-height: 1.25;

    color: #2E4057;
}


.location-info p {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;

    line-height: 1.6;

    color: #2E4057;
}


.location-map-link {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-top: 8px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 600;

    color: #2E4057;

    text-decoration: underline;
    text-underline-offset: 5px;

    transition: color .3s ease;
}


.location-map-link span {
    display: inline-block;

    text-decoration: none;

    transition: transform .3s ease;
}


.location-map-link:hover {
    color: #FFD43B;
}


.location-map-link:hover span {
    transform: translateX(6px);
}


/* ========================================
   RESPONSIVE
======================================== */

@media screen and (max-width: 850px) {

    .location-info {
        grid-template-columns: 1fr;

        gap: 40px;
    }


    .location-map {
        height: 390px;
    }

}


@media screen and (max-width: 650px) {

    .location-page {
        padding: 145px 7% 70px;
    }


    .location-header h1 {
        font-size: 43px;
    }


    .location-map {
        height: 320px;

        margin-bottom: 40px;
    }


    .location-info h2 {
        font-size: 22px;
    }


    .location-info p,
    .location-map-link {
        font-size: 16px;
    }

}
/* ========================================
   TOUR VIRTUALE
======================================== */

.virtual-tour-page {
    width: 100%;
    padding: 175px 5% 100px;

    background: #FFFCEB;
    color: #2E4057;
}

.virtual-tour-container {
    width: 100%;
    max-width: 1380px;

    margin: 0 auto;
}

.virtual-tour-container > h1 {
    margin: 0 0 24px;

    font-family: "Montserrat", sans-serif;
    font-size: 48px;
    font-weight: 800;
    line-height: 1.1;

    color: #2E4057;
}

.virtual-tour-intro {
    max-width: 800px;

    margin-bottom: 55px;

    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.5;

    color: #2E4057;
}


/* GRIGLIA */

.virtual-tour-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 30px;
}


/* CARD */

.virtual-floor-card {
    display: block;

    overflow: hidden;

    background: #2E4057;

    text-decoration: none;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.virtual-floor-card:hover {
    transform: translateY(-7px);

    box-shadow:
        0 18px 35px rgba(0,0,0,.14);
}


/* IMMAGINE */

.virtual-floor-card img {
    width: 100%;
    height: 330px;

    display: block;

    object-fit: cover;

    transition: transform .5s ease;
}

.virtual-floor-card:hover img {
    transform: scale(1.035);
}


/* PARTE BLU */

.virtual-floor-info {
    padding: 24px 26px;

    display: flex;
    align-items: center;
    justify-content: space-between;
}

.virtual-floor-info h2 {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 26px;
    font-weight: 700;

    color: #FFFCEB;
}

.virtual-floor-info span {
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    font-weight: 600;

    color: #FFD43B;
}


/* MOBILE */

@media screen and (max-width: 750px) {

    .virtual-tour-grid {
        grid-template-columns: 1fr;
    }

    .virtual-floor-card img {
        height: 260px;
    }

}
/* ========================================
   SINGOLO PIANO TOUR VIRTUALE
======================================== */

.floor-page {
    width: 100%;

    padding: 175px 5% 100px;

    background: #FFFCEB;
    color: #2E4057;
}

.floor-container {
    width: 100%;
    max-width: 1380px;

    margin: 0 auto;
}


/* TORNA INDIETRO */

.floor-back {
    display: inline-block;

    margin-bottom: 30px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    font-weight: 600;

    color: #2E4057;

    text-decoration: none;
}

.floor-back:hover {
    color: #FFD43B;
}


/* TITOLO */

.floor-container > h1 {
    margin: 0 0 22px;

    font-family: "Montserrat", sans-serif;
    font-size: 48px;
    font-weight: 800;

    color: #2E4057;
}

.floor-intro {
    max-width: 800px;

    margin-bottom: 45px;

    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    line-height: 1.5;

    color: #2E4057;
}


/* MAPPA GRANDE */

.floor-main-image {
    width: 100%;
    margin: 0 auto 50px;
    overflow: visible;
}

.floor-main-image img {
    width: auto;
    max-width: 100%;
    height: 62vh;

    display: block;
    margin: 0 auto;

    object-fit: contain;
}


/* TITOLO OGGETTI */

.floor-objects-title {
    margin: 0 0 35px;

    font-family: "Montserrat", sans-serif;
    font-size: 32px;
    font-weight: 700;

    color: #2E4057;
}


/* CARD OGGETTI */

.floor-objects {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 28px;
}

.floor-object-card {
    display: block;

    overflow: hidden;

    background: #2E4057;

    text-decoration: none;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.floor-object-card:hover {
    transform: translateY(-6px);

    box-shadow:
        0 16px 30px rgba(0,0,0,.13);
}

.floor-object-card img {
    width: 100%;
    height: 240px;

    display: block;

    object-fit: cover;

    transition: transform .5s ease;
}

.floor-object-card:hover img {
    transform: scale(1.035);
}

.floor-object-content {
    padding: 20px;
}

.floor-object-content span {
    display: block;

    margin-bottom: 8px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    color: #FFD43B;
}

.floor-object-content h3 {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;

    color: #FFFCEB;
}


/* RESPONSIVE */

@media screen and (max-width: 950px) {

    .floor-objects {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}

@media screen and (max-width: 650px) {

    .floor-objects {
        grid-template-columns: 1fr;
    }

}
/* ========================================
   MAPPA INTERATTIVA TOUR
======================================== */

.floor-interactive {
    position: relative;

    width: fit-content;
    max-width: 100%;

    margin: 0 auto;
}

.floor-interactive img {
    width: 100%;
    height: auto;
    display: block;
}


/* PUNTI CLICCABILI */

.museum-hotspot {
    position: absolute;

    width: 46px;
    height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    color: #FFFCEB;

    border: 3px solid #FFD43B;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    font-weight: 700;

    text-decoration: none;

    transform: translate(-50%, -50%);

    box-shadow: 0 5px 15px rgba(0,0,0,.18);

    transition:
        transform .25s ease,
        background .25s ease;
}

/* ========================================
   TOUR VIRTUALE - MAPPA INTERATTIVA
======================================== */

.floor-interactive {
    position: relative;
}

.floor-interactive img {
    width: 100%;
    height: auto;
    display: block;
}


/* ========================================
   HOTSPOT
======================================== */

.museum-hotspot {
    position: absolute;

    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    border: 3px solid #FFD43B;

    color: #FFFCEB;

    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 700;

    text-decoration: none;

    transform: translate(-50%, -50%);

    box-shadow: 0 5px 15px rgba(0, 0, 0, .18);

    z-index: 5;

    transition:
        transform .25s ease,
        background .25s ease,
        color .25s ease;
}


/* HOVER */

.museum-hotspot:hover {
    background: #FFD43B;
    color: #2E4057;

    transform:
        translate(-50%, -50%)
        scale(1.12);

    z-index: 20;
}


/* ========================================
   NUMERO
======================================== */

.hotspot-number {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;
    height: 100%;
}


/* ========================================
   ETICHETTA CHE COMPARE AL PASSAGGIO
======================================== */

.hotspot-label {
    position: absolute;

    left: 58px;
    top: 50%;

    transform:
        translateY(-50%)
        translateX(-8px);

    padding: 10px 14px;

    white-space: nowrap;

    background: #2E4057;
    color: #FFFCEB;

    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 600;

    border-radius: 3px;

    opacity: 0;
    visibility: hidden;

    pointer-events: none;

    transition:
        opacity .25s ease,
        transform .25s ease,
        visibility .25s ease;
}


.museum-hotspot:hover .hotspot-label {
    opacity: 1;
    visibility: visible;

    transform:
        translateY(-50%)
        translateX(0);
}
/* ========================================
   POSIZIONE DEI 12 PUNTI
   MODIFICA LEFT E TOP PER SPOSTARLI
======================================== */

.piano-1 .hotspot-1 {
    left: 30%;
    top: 40%;
}

.piano-1 .hotspot-2 {
    left: 38%;
    top: 30%;
}

.piano-1 .hotspot-3 {
    left: 47%;
    top: 20%;
}

.piano-1 .hotspot-4 {
    left: 53%;
    top: 18%;
}

.piano-1 .hotspot-5 {
    left: 66%;
    top: 20%;
}

.piano-1 .hotspot-6 {
    left: 75%;
    top: 20%;
}

.piano-1 .hotspot-7 {
    left: 80%;
    top: 26%;
}

.piano-1 .hotspot-8 {
    left: 55%;
    top: 25%;
}

.piano-1 .hotspot-9 {
    left: 53%;
    top: 32%;
}

.piano-1 .hotspot-10 {
    left: 56%;
    top: 47%;
}

.piano-1 .hotspot-11 {
    left: 58%;
    top: 63%;
}

.piano-1 .hotspot-12 {
    left: 51%;
    top: 62%;
}
/* ========================================
   POSIZIONE DEI 5 PUNTI piano 2
   MODIFICA LEFT E TOP PER SPOSTARLI
======================================== */
/* =========================
   POSIZIONI PIANO 2
========================= */

.piano-2 .hotspot-1 {
    left: 40%;
    top: 20%;
}

.piano-2 .hotspot-2 {
    left: 70%;
    top: 25%;
}

.piano-2 .hotspot-3 {
    left: 85%;
    top: 35%;
}

.piano-2 .hotspot-4 {
    left: 57%;
    top: 66%;
}
.piano-2 .hotspot-5 {
    left: 45%;
    top: 70%;
}
/* =========================
   POSIZIONI PIANO 3
========================= */

.piano-3 .hotspot-1 {
    left: 47%;
    top: 14%;
}

.piano-3 .hotspot-2 {
    left: 80%;
    top: 19%;
}

.piano-3 .hotspot-3 {
    left: 77%;
    top: 37%;
}

.piano-3 .hotspot-4 {
    left: 55%;
    top: 30%;
}

.piano-3 .hotspot-5 {
    left: 57%;
    top: 45%;
}
.piano-3 .hotspot-6 {
    left: 50%;
    top: 40%;
}
.piano-3 .hotspot-7 {
    left: 36%;
    top: 45%;
}
/* =========================
   POSIZIONI PIANO 4
========================= */

.piano-4 .hotspot-1 {
    left: 16%;
    top: 30%;
}

.piano-4 .hotspot-2 {
    left: 60%;
    top: 50%;
}

.piano-4 .hotspot-3 {
    left: 80%;
    top: 30%;
}

.piano-4 .hotspot-4 {
    left: 75%;
    top: 18%;
}
.piano-4 .hotspot-5 {
    left: 90%;
    top: 24%;
}

.piano-4 .hotspot-6 {
    left: 50%;
    top: 13%;
}


/* =====================================================
   ORIGINI DELLA MATEMATICA
   ===================================================== */

.object-page {
    width: 100%;

    padding: 150px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}


/* =====================================================
   BANNER SUPERIORE
   ===================================================== */

.object-hero {
    width: 92%;
    max-width: 1380px;
    min-height: 190px;

    margin: 0 auto;

    position: relative;

    display: flex;
    align-items: center;

    overflow: hidden;

    border-radius: 12px;

    background: #2E4057;
}


.object-hero-content {
    width: 100%;

    padding: 45px 55px;

    display: flex;
    align-items: center;

    gap: 28px;
}


.object-hero-line {
    width: 4px;
    height: 105px;

    flex-shrink: 0;

    background: #FFD43B;
}


.object-hero-text {
    display: flex;
    flex-direction: column;
}


.object-hero h1 {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.15;

    color: #FFFCEB;
}


.object-floor {
    margin: 0;

    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}

.object-floor i {
    color: #FFD43B;
}

.object-floor:hover {
    color: #FFD43B;
}


.origin-bottom-card .origin-icon {
    position: static;

    transform: none;

    flex-shrink: 0;
}


.origin-bottom-card p {
    margin: 0;
}
.origin-icon {
    background-color: #2E4057;
    color: #FFFCEB;
}


.quote-icon {
    background-color: rgba(46, 64, 87, 0.06);
    color: #2E4057;
}
/* =====================================================
   CONTENUTO
   ===================================================== */

.object-content {
    width: 88%;
    max-width: 1250px;

    margin: 55px auto 0;
}


/* TITOLO PRINCIPALE */

.object-content > h2 {
    max-width: 1100px;

    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.15;
    letter-spacing: -1px;

    color: #2E4057;
}


.section-yellow-line {
    width: 65px;
    height: 3px;

    margin-top: 24px;

    background: #FFD43B;
}
/* =====================================================
   CITAZIONE
   ===================================================== */

.object-quote {
    width: 100%;

    margin: 38px 0 80px;

    display: grid;

    grid-template-columns: 105px 1fr;

    align-items: center;

    gap: 35px;
}


.quote-icon {
    width: 100px;
    height: 100px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(46, 64, 87, .06);

    color: #2E4057;
}


.quote-icon i {
    font-size: 43px;
}


.quote-text {
    max-width: 1050px;
}


.quote-text p {
    margin: 0 0 17px;

    font-family: "Montserrat", sans-serif;
    font-size: 19px;
    font-weight: 400;
    line-height: 1.55;

    color: #2E4057;
}


.quote-text p:last-child {
    margin-bottom: 0;
}
/* =====================================================
   DUE CARD
   ===================================================== */

.origin-grid {
    width: 100%;

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 38px;

    margin-top: 15px;
}


.origin-card {
    position: relative;

    min-height: 470px;

    padding: 85px 55px 50px;

    border: 1px solid rgba(46, 64, 87, .20);
    border-radius: 12px;

    background: transparent;
}


/* CERCHIO SOPRA LA CARD */

.origin-card > .origin-icon {
    width: 90px;
    height: 90px;

    position: absolute;

    top: -45px;
    left: 50%;

    transform: translateX(-50%);

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    color: #FFFCEB;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 600;
}


.origin-card > .origin-icon i {
    font-size: 34px;
}


/* TITOLO CARD */

.origin-card h3 {
    max-width: 440px;

    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.4;

    color: #2E4057;
}


.card-yellow-line {
    width: 55px;
    height: 3px;

    margin: 25px 0 35px;

    background: #FFD43B;
}


/* TESTO CARD */

.origin-card p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}
/* =====================================================
   CARD FINALE
   ===================================================== */

.origin-bottom-card {
    width: 100%;

    margin-top: 55px;

    padding: 38px 42px;

    display: grid;

    grid-template-columns: 90px 1fr;

    align-items: center;

    gap: 35px;

    border: 1px solid rgba(46, 64, 87, .20);
    border-left: 4px solid #FFD43B;

    border-radius: 12px;
}


.origin-bottom-card .origin-icon {
    width: 80px;
    height: 80px;

    position: static;

    transform: none;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    color: #FFFCEB;

    flex-shrink: 0;
}


.origin-bottom-card .origin-icon i {
    font-size: 31px;
}


.origin-bottom-card p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.6;

    color: #2E4057;
}
/* =====================================================
   RESPONSIVE ORIGINI MATEMATICA
   ===================================================== */

@media screen and (max-width: 900px) {

    .object-hero {
        width: 88%;
    }

    .object-hero-content {
        padding: 38px 35px;
    }

    .object-hero h1 {
        font-size: 27px;
    }


    .object-content > h2 {
        font-size: 36px;
    }


    .origin-grid {
        grid-template-columns: 1fr;

        gap: 85px;
    }


    .object-quote {
        grid-template-columns: 80px 1fr;

        gap: 25px;
    }


    .quote-icon {
        width: 75px;
        height: 75px;
    }

}


@media screen and (max-width: 600px) {

    .object-page {
        padding-top: 135px;
    }


    .object-hero-content {
        padding: 30px 25px;

        gap: 20px;
    }


    .object-hero h1 {
        font-size: 23px;
    }


    .object-hero-line {
        height: 95px;
    }


    .object-floor {
        font-size: 15px;
    }


    .object-content {
        width: 86%;

        margin-top: 40px;
    }


    .object-content > h2 {
        font-size: 32px;
    }


    .object-quote {
        grid-template-columns: 1fr;

        margin-bottom: 75px;
    }


    .quote-icon {
        width: 70px;
        height: 70px;
    }


    .origin-card {
        padding:
            75px
            30px
            40px;

        min-height: auto;
    }


    .origin-bottom-card {
        grid-template-columns: 1fr;

        padding: 32px 28px;
    }

}
/* =====================================================
   MATEMATICA SCRITTA
===================================================== */

.written-page {
    width: 100%;
    padding: 155px 0 80px;

    background: #FFFCEB;
    color: #2E4057;
}

.written-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =====================================================
   BANNER
===================================================== */

.written-hero {
    width: 100%;
    min-height: 190px;

    display: flex;
    align-items: center;

    border-radius: 14px;

    background: #2E4057;

    overflow: hidden;
}

.written-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}

.written-hero-line {
    width: 4px;
    height: 100px;

    flex-shrink: 0;

    background: #FFD43B;
}

.written-hero-text h1 {
    margin: 0 0 14px;

    font-family: "Montserrat", sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;

    color: #FFFCEB;
}

.written-floor {
    margin: 0;

    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}

.written-floor i {
    color: #FFD43B;
}

.written-floor:hover {
    color: #FFD43B;
}


/* =====================================================
   CONTENUTO
===================================================== */

.written-content {
    width: 95%;

    margin: 50px auto 0;
}

.written-content > h2 {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.15;

    color: #2E4057;
}

.written-section-line {
    width: 50px;
    height: 3px;

    margin: 22px 0 32px;

    background: #FFD43B;
}


/* =====================================================
   TESTO
===================================================== */

.written-text {
    width: 100%;
}

.written-text p {
    margin: 0 0 30px;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.65;

    color: #2E4057;
}

.written-text p:last-child {
    margin-bottom: 0;
}


/* =====================================================
   IMMAGINE CENTRALE
===================================================== */

.written-image {
    width: 100%;

    margin: 40px 0 45px;

    display: flex;
    justify-content: center;
}

.written-image img {
    width: 460px;
    max-width: 100%;
    height: auto;

    display: block;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    padding: 4px;
}


/* =====================================================
   CARD INFERIORI
===================================================== */

.written-cards {
    width: 88%;

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 40px;
}

.written-card {
    position: relative;

    min-height: 290px;

    padding: 85px 40px 40px;

    border: 1px solid rgba(46, 64, 87, .22);
    border-radius: 12px;

    background: transparent;
}


/* ICONA TONDA SOPRA */

.written-card-icon {
    width: 82px;
    height: 82px;

    position: absolute;

    top: -28px;
    left: 36px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    color: #FFFCEB;

    font-size: 30px;
}


/* LINEA GIALLA */

.written-card-line {
    width: 45px;
    height: 3px;

    margin-bottom: 24px;

    background: #FFD43B;
}


/* TESTO */

.written-card p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.6;

    color: #2E4057;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media screen and (max-width: 900px) {

    .written-content > h2 {
        font-size: 36px;
    }

    .written-cards {
        width: 100%;

        grid-template-columns: 1fr;

        gap: 70px;
    }

}

@media screen and (max-width: 600px) {

    .written-page {
        padding-top: 135px;
    }

    .written-container {
        width: 88%;
    }

    .written-hero-content {
        padding: 35px 25px;
    }

    .written-hero-text h1 {
        font-size: 24px;
    }

    .written-content {
        width: 100%;
    }

    .written-content > h2 {
        font-size: 31px;
    }

    .written-text p {
        font-size: 17px;
    }

    .written-card {
        padding:
            75px
            28px
            35px;
    }

}
/* =====================================================
   PAGINA GRECI
===================================================== */

.greek-page {
    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}


.greek-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =====================================================
   BANNER
===================================================== */

.greek-hero {
    width: 100%;
    min-height: 190px;

    display: flex;
    align-items: center;

    border-radius: 14px;

    background: #2E4057;

    overflow: hidden;
}


.greek-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}


.greek-hero-line {
    width: 4px;
    height: 100px;

    flex-shrink: 0;

    background: #FFD43B;
}


.greek-hero-text h1 {
    margin: 0 0 14px;

    font-family: "Montserrat", sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;

    color: #FFFCEB;
}


/* PIANO 1 */

.greek-floor {
    margin: 0;

    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}


.greek-floor i {
    color: #FFD43B;
}


.greek-floor:hover {
    color: #FFD43B;
}


/* =====================================================
   CONTENUTO
===================================================== */

.greek-content {
    width: 96%;

    margin: 55px auto 0;
}


/* =====================================================
   BLOCCHI TESTO
===================================================== */

.greek-text-block {
    position: relative;

    margin-bottom: 55px;

    padding-left: 35px;
}


.greek-text-block::before {
    content: "";

    position: absolute;

    left: 0;
    top: 0;

    width: 3px;
    height: 100%;

    background: #FFD43B;
}


.greek-text-block p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 19px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}


.greek-text-block strong {
    font-weight: 700;
}


.greek-text-block em {
    font-style: italic;
}


/* =====================================================
   IMMAGINE CENTRALE
===================================================== */

.greek-image {
    width: 100%;

    margin: 25px 0 0;

    display: flex;
    justify-content: center;
}


.greek-image img {
    width: min(720px, 100%);

    height: auto;

    display: block;

    border: 2px solid #FFD43B;
    border-radius: 12px;

    padding: 6px;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media screen and (max-width: 900px) {

    .greek-hero-text h1 {
        font-size: 28px;
    }

    .greek-text-block p {
        font-size: 18px;
    }

}


@media screen and (max-width: 600px) {

    .greek-page {
        padding-top: 135px;
    }

    .greek-container {
        width: 88%;
    }

    .greek-hero-content {
        padding: 35px 25px;
    }

    .greek-hero-text h1 {
        font-size: 24px;
    }

    .greek-content {
        width: 100%;
    }

    .greek-text-block {
        padding-left: 24px;
        margin-bottom: 40px;
    }

    .greek-text-block p {
        font-size: 17px;
    }

}
/* =====================================================
   PAGINA ROMANI
===================================================== */

.roman-page {
    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}


.roman-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =====================================================
   BANNER
===================================================== */

.roman-hero {
    width: 100%;
    min-height: 190px;

    display: flex;
    align-items: center;

    border-radius: 14px;

    background: #2E4057;

    overflow: hidden;
}


.roman-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}


.roman-hero-line {
    width: 4px;
    height: 105px;

    flex-shrink: 0;

    background: #FFD43B;
}


.roman-hero-text h1 {
    margin: 0 0 14px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;

    color: #FFFCEB;
}


/* PIANO 1 */

.roman-floor {
    margin: 0;

    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}


.roman-floor i {
    color: #FFD43B;
}


.roman-floor:hover {
    color: #FFD43B;
}


/* =====================================================
   CONTENUTO
===================================================== */

.roman-content {
    width: 96%;

    margin: 55px auto 0;
}


/* =====================================================
   PRIMO BLOCCO
===================================================== */

.roman-intro-row {
    display: grid;

    grid-template-columns:
        90px
        minmax(0, 1fr);

    gap: 30px;

    align-items: start;

    margin-bottom: 65px;
}

.roman-intro-row--plain {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
}


.roman-icon {
    width: 72px;
    height: 72px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    color: #FFFCEB;

    font-size: 29px;
}


.roman-intro-text {
    position: relative;

    padding-left: 30px;
}


.roman-intro-text::before {
    content: "";

    position: absolute;

    left: 0;
    top: 0;

    width: 3px;
    height: 100%;

    background: #FFD43B;
}


.roman-intro-text p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 19px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}


.roman-intro-text strong {
    font-weight: 700;
}


/* =====================================================
   LE CIFRE ROMANE
===================================================== */

.roman-section-row {
    display: grid;

    grid-template-columns:
        90px
        minmax(0, 1fr);

    gap: 30px;

    align-items: start;
}


.roman-number-icon {
    width: 72px;
    height: 72px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    color: #FFFCEB;

    font-family: "Cormorant Garamond", serif;

    font-size: 30px;
    font-weight: 600;
}


.roman-section-body {
    position: relative;

    padding-left: 30px;
}


.roman-section-body::before {
    content: "";

    position: absolute;

    left: 0;
    top: 0;

    width: 3px;
    height: 65px;

    background: #FFD43B;
}


/* TITOLO */

.roman-section-body h2 {
    margin: 0 0 35px;

    font-family: "Montserrat", sans-serif;

    font-size: 42px;
    font-weight: 800;
    line-height: 1.15;

    color: #2E4057;
}


/* TESTI */

.roman-section-body p {
    max-width: 1050px;

    margin: 0 0 28px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}


.roman-section-body p:last-of-type {
    margin-bottom: 0;
}


/* =====================================================
   IMMAGINE
===================================================== */

.roman-image {
    width: 100%;

    margin: 55px 0 0;

    display: flex;
    justify-content: center;
}


.roman-image img {
    width: min(700px, 100%);
    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;
    border-radius: 12px;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media screen and (max-width: 900px) {

    .roman-section-body h2 {
        font-size: 36px;
    }

}


@media screen and (max-width: 650px) {

    .roman-page {
        padding-top: 135px;
    }

    .roman-container {
        width: 88%;
    }

    .roman-hero-content {
        padding: 35px 25px;
    }

    .roman-hero-text h1 {
        font-size: 24px;
    }

    .roman-content {
        width: 100%;
    }

    .roman-intro-row,
    .roman-section-row {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .roman-intro-text,
    .roman-section-body {
        padding-left: 24px;
    }

    .roman-section-body h2 {
        font-size: 31px;
    }

    .roman-intro-text p,
    .roman-section-body p {
        font-size: 17px;
    }

}
/* =====================================================
   CINESI - INDIANI - ARABI
===================================================== */

.eastern-page {
    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}


.eastern-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =====================================================
   BANNER
===================================================== */

.eastern-hero {
    width: 100%;
    min-height: 210px;

    display: flex;
    align-items: center;

    border-radius: 14px;

    background: #2E4057;

    overflow: hidden;
}


.eastern-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}


.eastern-hero-line {
    width: 4px;
    height: 125px;

    flex-shrink: 0;

    background: #FFD43B;
}


.eastern-hero-text h1 {
    max-width: 1150px;

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 30px;
    font-weight: 700;
    line-height: 1.35;

    color: #FFFCEB;
}


.eastern-floor {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}


.eastern-floor i {
    color: #FFD43B;
}


.eastern-floor:hover {
    color: #FFD43B;
}


/* =====================================================
   CONTENUTO
===================================================== */

.eastern-content {
    width: 97%;

    margin: 55px auto 0;
}


/* =====================================================
   SINGOLA RIGA
===================================================== */

.eastern-row {
    display: grid;

    grid-template-columns:
        85px
        minmax(0, 1fr);

    gap: 28px;

    align-items: center;

    margin-bottom: 42px;
}


/* ICONA */

.eastern-icon {
    width: 72px;
    height: 72px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    color: #FFD43B;

    font-size: 27px;
}


.eastern-zero {
    font-family: "Cormorant Garamond", serif;

    font-size: 39px;
    font-weight: 500;
}


/* TESTO + LINEA GIALLA */

.eastern-text {
    position: relative;

    padding-left: 30px;
}


.eastern-text::before {
    content: "";

    position: absolute;

    left: 0;
    top: 0;

    width: 2px;
    height: 100%;

    background: #FFD43B;
}


.eastern-text p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}


.eastern-text strong {
    font-weight: 700;
}


/* =====================================================
   DUE IMMAGINI
===================================================== */

.eastern-images {
    width: 76%;

    margin: 20px auto 0;

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 80px;
}


.eastern-image {
    width: 100%;
}


.eastern-image img {
    width: 100%;
    height: 285px;

    display: block;

    object-fit: cover;

    padding: 5px;

    border: 2px solid #FFD43B;
    border-radius: 12px;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media screen and (max-width: 900px) {

    .eastern-hero-text h1 {
        font-size: 27px;
    }


    .eastern-images {
        width: 90%;

        gap: 30px;
    }

}


@media screen and (max-width: 650px) {

    .eastern-page {
        padding-top: 135px;
    }


    .eastern-container {
        width: 88%;
    }


    .eastern-hero-content {
        padding: 35px 25px;
    }


    .eastern-hero-text h1 {
        font-size: 23px;
    }


    .eastern-content {
        width: 100%;
    }


    .eastern-row {
        grid-template-columns: 60px 1fr;

        gap: 17px;

        margin-bottom: 35px;
    }


    .eastern-icon {
        width: 55px;
        height: 55px;

        font-size: 21px;
    }


    .eastern-text {
        padding-left: 20px;
    }


    .eastern-text p {
        font-size: 16px;
    }


    .eastern-images {
        width: 100%;

        grid-template-columns: 1fr;

        gap: 25px;
    }


    .eastern-image img {
        height: auto;
    }

}
.islamic-pattern {
    color: #FFD43B;
    font-family: serif;
    font-size: 38px;
    font-weight: 300;
    line-height: 1;
}
/* =====================================================
   PAGINA MEDIOEVO
===================================================== */

.medieval-page {
    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}


.medieval-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =====================================================
   BANNER
===================================================== */

.medieval-hero {
    width: 100%;
    min-height: 190px;

    display: flex;
    align-items: center;

    border-radius: 14px;

    background: #2E4057;

    overflow: hidden;
}


.medieval-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}


.medieval-hero-line {
    width: 4px;
    height: 105px;

    flex-shrink: 0;

    background: #FFD43B;
}


.medieval-hero-text h1 {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;

    color: #FFFCEB;
}


/* PIANO 1 CLICCABILE */

.medieval-floor {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}


.medieval-floor i {
    color: #FFD43B;
}


.medieval-floor:hover {
    color: #FFD43B;
}


/* =====================================================
   CONTENUTO
===================================================== */

.medieval-content {
    width: 96%;

    margin: 50px auto 0;
}


/* =====================================================
   PRIMI 5 BLOCCHI
===================================================== */

.medieval-text-block {
    position: relative;

    margin-bottom: 36px;

    padding: 2px 0 2px 48px;
}


.medieval-text-block::before {
    content: "";

    position: absolute;

    left: 0;
    top: 0;

    width: 4px;
    height: 100%;

    background: #FFD43B;
}


.medieval-text-block p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}


/* =====================================================
   BOX APPROFONDIMENTO
===================================================== */

.medieval-detail {
    width: 94%;

    margin: 25px auto 0;

    display: grid;

    grid-template-columns: 105px minmax(0, 1fr);

    gap: 28px;

    padding: 30px 40px;

    border: 1px solid rgba(46, 64, 87, 0.25);
    border-radius: 12px;
}


/* VIRGOLETTE */

.medieval-quote {
    font-family: "Cormorant Garamond", serif;

    font-size: 90px;
    font-weight: 700;
    line-height: .75;

    color: #2E4057;

    text-align: center;
}


/* CONTENUTO BOX */

.medieval-detail-content {
    width: 100%;
}


.medieval-detail-item {
    position: relative;

    margin-bottom: 22px;

    padding-bottom: 17px;
}


.medieval-detail-item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
}


/* PICCOLA LINEA GIALLA TRA I TESTI */

.medieval-detail-item:not(:last-child)::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 45px;
    height: 2px;

    background: #FFD43B;
}


.medieval-detail-item p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.65;

    color: #2E4057;
}


.medieval-detail-item strong {
    font-weight: 700;
}


/* =====================================================
   IMMAGINE
===================================================== */

.medieval-image {
    width: 100%;

    margin: 25px 0 0;

    display: flex;
    justify-content: center;
}


.medieval-image img {
    width: min(600px, 100%);
    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;
    border-radius: 12px;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media screen and (max-width: 700px) {

    .medieval-page {
        padding-top: 135px;
    }


    .medieval-container {
        width: 88%;
    }


    .medieval-hero-content {
        padding: 35px 25px;
    }


    .medieval-hero-text h1 {
        font-size: 25px;
    }


    .medieval-content {
        width: 100%;
    }


    .medieval-text-block {
        padding-left: 25px;
        margin-bottom: 30px;
    }


    .medieval-text-block p {
        font-size: 16px;
    }


    .medieval-detail {
        width: 100%;

        grid-template-columns: 1fr;

        padding: 25px;
    }


    .medieval-quote {
        text-align: left;
        height: 45px;
    }


    .medieval-detail-item p {
        font-size: 16px;
    }

}
/* =====================================================
   PAGINA CENTRO AMERICA
===================================================== */

.america-page {
    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}


.america-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =====================================================
   BANNER
===================================================== */

.america-hero {
    width: 100%;
    min-height: 205px;

    display: flex;
    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;
}


.america-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}


.america-hero-line {
    width: 4px;
    height: 125px;

    flex-shrink: 0;

    background: #FFD43B;
}


.america-hero-text h1 {
    max-width: 1100px;

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 30px;
    font-weight: 700;
    line-height: 1.3;

    color: #FFFCEB;
}


/* PIANO 1 */

.america-floor {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}


.america-floor i {
    color: #FFD43B;
}


.america-floor:hover {
    color: #FFD43B;
}


/* =====================================================
   CONTENUTO
===================================================== */

.america-content {
    width: 95%;

    margin: 45px auto 0;
}


/* TESTI PRINCIPALI */

.america-text p {
    margin: 0 0 30px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.75;

    color: #2E4057;
}


.america-text strong {
    font-weight: 700;
}


/* =====================================================
   BOX APPROFONDIMENTO
===================================================== */

.america-detail {
    width: 96%;

    margin: 38px auto 0;

    display: grid;

    grid-template-columns:
        105px
        minmax(0, 1fr);

    gap: 30px;

    padding: 34px 40px;

    border: 1px solid rgba(46, 64, 87, .23);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;
}


/* VIRGOLETTE */

.america-quote {
    font-family: "Cormorant Garamond", serif;

    font-size: 92px;
    font-weight: 700;
    line-height: .8;

    color: #2E4057;

    text-align: center;
}


/* TESTI DEL BOX */

.america-detail-item {
    position: relative;

    margin-bottom: 20px;

    padding-bottom: 18px;
}


.america-detail-item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
}


.america-detail-item:not(:last-child)::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 48px;
    height: 2px;

    background: #FFD43B;
}


.america-detail-item p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;
    line-height: 1.65;

    color: #2E4057;
}


/* =====================================================
   IMMAGINE
===================================================== */

.america-image {
    width: 100%;

    margin: 35px 0 0;

    display: flex;
    justify-content: center;
}


.america-image img {
    width: min(650px, 100%);

    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;
    border-radius: 12px;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media screen and (max-width: 750px) {

    .america-page {
        padding-top: 135px;
    }


    .america-container {
        width: 88%;
    }


    .america-hero-content {
        padding: 35px 25px;
    }


    .america-hero-text h1 {
        font-size: 23px;
    }


    .america-content {
        width: 100%;
    }


    .america-text p {
        font-size: 16px;
    }


    .america-detail {
        width: 100%;

        grid-template-columns: 1fr;

        padding: 28px 25px;
    }


    .america-quote {
        text-align: left;

        height: 45px;
    }


    .america-detail-item p {
        font-size: 16px;
    }

}
/* =====================================================
   PAGINA RINASCIMENTO
===================================================== */

.renaissance-page {
    width: 100%;
    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}

.renaissance-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* BANNER */

.renaissance-hero {
    width: 100%;
    min-height: 205px;

    display: flex;
    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;
}

.renaissance-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}

.renaissance-hero-line {
    width: 4px;
    height: 125px;

    flex-shrink: 0;

    background: #FFD43B;
}

.renaissance-hero-text h1 {
    max-width: 1000px;

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;
    font-weight: 700;
    line-height: 1.25;

    color: #FFFCEB;
}


/* PIANO 1 */

.renaissance-floor {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}

.renaissance-floor i {
    color: #FFD43B;
}

.renaissance-floor:hover {
    color: #FFD43B;
}


/* CONTENUTO */

.renaissance-content {
    width: 95%;

    margin: 45px auto 0;
}

.renaissance-intro {
    margin: 0 0 35px;

    font-family: "Montserrat", sans-serif;
    font-size: 19px;
    font-weight: 400;
    line-height: 1.65;

    color: #2E4057;
}


/* ELENCO */

.renaissance-list {
    margin: 0 0 40px;
    padding-left: 34px;
}

.renaissance-list li {
    margin-bottom: 12px;

    padding-left: 5px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}

.renaissance-list li::marker {
    color: #2E4057;
}

.renaissance-list strong {
    font-weight: 700;
}

.renaissance-list em {
    font-style: italic;
}


/* BOX APPROFONDIMENTO */

.renaissance-detail {
    width: 96%;

    margin: 35px auto 0;

    display: grid;

    grid-template-columns:
        105px
        minmax(0, 1fr);

    gap: 30px;

    padding: 34px 40px;

    border: 1px solid rgba(46, 64, 87, .23);
    border-left: 4px solid #FFD43B;

    border-radius: 12px;
}

.renaissance-quote {
    font-family: "Cormorant Garamond", serif;

    font-size: 92px;
    font-weight: 700;
    line-height: .8;

    color: #2E4057;

    text-align: center;
}

.renaissance-detail-item {
    position: relative;

    margin-bottom: 20px;

    padding-bottom: 18px;
}

.renaissance-detail-item:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
}

.renaissance-detail-item:not(:last-child)::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 48px;
    height: 2px;

    background: #FFD43B;
}

.renaissance-detail-item p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;
    line-height: 1.65;

    color: #2E4057;
}

.renaissance-detail-item strong {
    font-weight: 700;
}


/* IMMAGINE */

.renaissance-image {
    width: 100%;

    margin: 35px 0 0;

    display: flex;
    justify-content: center;
}

.renaissance-image img {
    width: min(650px, 100%);
    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;
    border-radius: 12px;
}


/* RESPONSIVE */

@media screen and (max-width: 750px) {

    .renaissance-page {
        padding-top: 135px;
    }

    .renaissance-container {
        width: 88%;
    }

    .renaissance-hero-content {
        padding: 35px 25px;
    }

    .renaissance-hero-text h1 {
        font-size: 24px;
    }

    .renaissance-content {
        width: 100%;
    }

    .renaissance-intro,
    .renaissance-list li {
        font-size: 16px;
    }

    .renaissance-detail {
        width: 100%;

        grid-template-columns: 1fr;

        padding: 28px 25px;
    }

    .renaissance-quote {
        text-align: left;

        height: 45px;
    }

    .renaissance-detail-item p {
        font-size: 16px;
    }
}/* =====================================================
   PAGINA 1600 - SEICENTO
===================================================== */

.seicento-page {
    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}


.seicento-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =====================================================
   BANNER
===================================================== */

.seicento-hero {
    width: 100%;
    min-height: 205px;

    display: flex;
    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;
}


.seicento-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}


.seicento-hero-line {
    width: 4px;
    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;
}


.seicento-hero-text h1 {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;

    color: #FFFCEB;
}


/* PIANO 1 */

.seicento-floor {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}


.seicento-floor i {
    color: #FFD43B;
}


.seicento-floor:hover {
    color: #FFD43B;
}


/* =====================================================
   CONTENUTO
===================================================== */

.seicento-content {
    width: 95%;

    margin: 45px auto 0;
}


/* INTRO */

.seicento-intro {
    max-width: 1150px;

    margin: 0 0 35px;

    font-family: "Montserrat", sans-serif;

    font-size: 19px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}


/* =====================================================
   ELENCO
===================================================== */

.seicento-list {
    margin: 0 0 45px;

    padding-left: 35px;
}


.seicento-list li {
    margin-bottom: 12px;

    padding-left: 7px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}


.seicento-list li::marker {
    color: #2E4057;
}


.seicento-list strong {
    font-weight: 700;
}


/* =====================================================
   IMMAGINE
===================================================== */

.seicento-image-box {
    width: 92%;

    margin: 30px auto 0;

    padding: 30px;

    border: 1px solid rgba(46, 64, 87, .20);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

    display: flex;
    justify-content: center;
}


.seicento-image-box img {
    width: 100%;
    max-width: 1050px;

    height: auto;

    display: block;

    border-radius: 8px;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media screen and (max-width: 750px) {

    .seicento-page {
        padding-top: 135px;
    }


    .seicento-container {
        width: 88%;
    }


    .seicento-hero-content {
        padding: 35px 25px;
    }


    .seicento-hero-text h1 {
        font-size: 24px;
    }


    .seicento-content {
        width: 100%;
    }


    .seicento-intro,
    .seicento-list li {
        font-size: 16px;
    }


    .seicento-image-box {
        width: 100%;

        padding: 15px;
    }

}
/* =====================================================
   PAGINA 1700 - SETTECENTO
===================================================== */

.settecento-page {
    width: 100%;
    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}

.settecento-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =====================================================
   BANNER
===================================================== */

.settecento-hero {
    width: 100%;
    min-height: 205px;

    display: flex;
    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;
}

.settecento-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}

.settecento-hero-line {
    width: 4px;
    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;
}

.settecento-hero-text h1 {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;

    color: #FFFCEB;
}


/* PIANO 1 */

.settecento-floor {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}

.settecento-floor i {
    color: #FFD43B;
}

.settecento-floor:hover {
    color: #FFD43B;
}


/* =====================================================
   CONTENUTO
===================================================== */

.settecento-content {
    width: 95%;
    margin: 45px auto 0;
}


/* INTRO */

.settecento-intro {
    margin: 0 0 30px;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}

.settecento-intro strong {
    font-weight: 700;
}


/* =====================================================
   ELENCO
===================================================== */

.settecento-list {
    margin: 0 0 35px;
    padding-left: 35px;
}

.settecento-list li {
    margin-bottom: 10px;
    padding-left: 5px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.65;

    color: #2E4057;
}

.settecento-list li::marker {
    color: #2E4057;
}

.settecento-list strong {
    font-weight: 700;
}


/* =====================================================
   BOX APPROFONDIMENTO
===================================================== */

.settecento-card {
    width: 96%;

    margin: 0 auto 18px;

    display: grid;

    grid-template-columns:
        85px
        minmax(0, 1fr);

    gap: 25px;

    align-items: center;

    padding: 25px 35px;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;
}


/* ICONA */

.settecento-card-icon {
    width: 70px;
    height: 70px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    color: #FFFCEB;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;
    font-weight: 700;
    line-height: 1;
}

.settecento-person {
    font-family: "Montserrat", sans-serif;
    font-size: 27px;
}


/* TESTO BOX */

.settecento-card p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;
    line-height: 1.6;

    color: #2E4057;
}

.settecento-card strong {
    font-weight: 700;
}


/* =====================================================
   IMMAGINE
===================================================== */

.settecento-image {
    width: 100%;

    margin: 28px 0 0;

    display: flex;
    justify-content: center;
}

.settecento-image img {
    width: min(720px, 100%);
    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media screen and (max-width: 750px) {

    .settecento-page {
        padding-top: 135px;
    }

    .settecento-container {
        width: 88%;
    }

    .settecento-hero-content {
        padding: 35px 25px;
    }

    .settecento-hero-text h1 {
        font-size: 24px;
    }

    .settecento-content {
        width: 100%;
    }

    .settecento-intro,
    .settecento-list li {
        font-size: 16px;
    }

    .settecento-card {
        width: 100%;

        grid-template-columns: 1fr;

        padding: 25px;
    }

    .settecento-card p {
        font-size: 16px;
    }

}
/* =====================================================
   PAGINA 1800 - OTTOCENTO
===================================================== */

.ottocento-page {
    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}


.ottocento-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =====================================================
   BANNER
===================================================== */

.ottocento-hero {
    width: 100%;
    min-height: 205px;

    display: flex;
    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;
}


.ottocento-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}


.ottocento-hero-line {
    width: 4px;
    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;
}


.ottocento-hero-text h1 {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;

    color: #FFFCEB;
}


/* PIANO 1 */

.ottocento-floor {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}


.ottocento-floor i {
    color: #FFD43B;
}


.ottocento-floor:hover {
    color: #FFD43B;
}


/* =====================================================
   CONTENUTO
===================================================== */

.ottocento-content {
    width: 95%;

    margin: 45px auto 0;
}


/* INTRODUZIONE */

.ottocento-intro p {
    margin: 0 0 28px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}


.ottocento-intro strong {
    font-weight: 700;
}


/* =====================================================
   RIGHE CON SIMBOLO
===================================================== */

.ottocento-row {
    width: 100%;

    display: grid;

    grid-template-columns:
        75px
        minmax(0, 1fr);

    gap: 20px;

    align-items: center;

    margin-bottom: 24px;
}

.ottocento-row--plain {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
}


.ottocento-symbol {
    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    border: 2px solid rgba(255, 212, 59, .45);

    color: #FFD43B;

    font-family: "Montserrat", sans-serif;
    font-size: 29px;
    font-weight: 500;
}


.ottocento-binary {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.05;

    text-align: center;
}


.ottocento-row p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.65;

    color: #2E4057;
}


.ottocento-row strong {
    font-weight: 700;
}


/* =====================================================
   IMMAGINE
===================================================== */

.ottocento-image {
    width: 100%;

    margin: 35px 0 0;

    display: flex;
    justify-content: center;
}


.ottocento-image img {
    width: min(720px, 100%);

    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media screen and (max-width: 750px) {

    .ottocento-page {
        padding-top: 135px;
    }


    .ottocento-container {
        width: 88%;
    }


    .ottocento-hero-content {
        padding: 35px 25px;
    }


    .ottocento-hero-text h1 {
        font-size: 24px;
    }


    .ottocento-content {
        width: 100%;
    }


    .ottocento-intro p,
    .ottocento-row p {
        font-size: 16px;
    }


    .ottocento-row {
        grid-template-columns: 55px 1fr;

        gap: 15px;
    }

    .ottocento-row.ottocento-row--plain {
        grid-template-columns: 1fr;
        gap: 0;
    }


    .ottocento-symbol {
        width: 48px;
        height: 48px;

        font-size: 23px;
    }

}
/* =====================================================
   PAGINA 1900 - NOVECENTO
===================================================== */

.novecento-page {
    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}


.novecento-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =====================================================
   BANNER
===================================================== */

.novecento-hero {
    width: 100%;
    min-height: 205px;

    display: flex;
    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;
}


.novecento-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}


.novecento-hero-line {
    width: 4px;
    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;
}


.novecento-hero-text h1 {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;

    color: #FFFCEB;
}


/* PIANO 1 */

.novecento-floor {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}


.novecento-floor i {
    color: #FFD43B;
}


.novecento-floor:hover {
    color: #FFD43B;
}


/* =====================================================
   CONTENUTO
===================================================== */

.novecento-content {
    width: 95%;

    margin: 45px auto 0;
}


/* TESTO */

.novecento-text p {
    margin: 0 0 28px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}


.novecento-text strong {
    font-weight: 700;
}


/* =====================================================
   BOX
===================================================== */

.novecento-card {
    width: 96%;

    margin: 0 auto 14px;

    display: grid;

    grid-template-columns:
        80px
        minmax(0, 1fr);

    gap: 25px;

    align-items: center;

    padding: 22px 30px;

    border: 1px solid rgba(46, 64, 87, .20);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;
}


/* ICONA */

.novecento-card-icon {
    width: 65px;
    height: 65px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    color: #FFFCEB;

    font-family: "Cormorant Garamond", serif;

    font-size: 42px;
    font-weight: 700;

    line-height: 1;
}


/* TESTO BOX */

.novecento-card p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;
    line-height: 1.6;

    color: #2E4057;
}


/* =====================================================
   IMMAGINE
===================================================== */

.novecento-image {
    width: 100%;

    margin: 30px 0 0;

    display: flex;
    justify-content: center;
}


.novecento-image img {
    width: min(650px, 100%);
    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media screen and (max-width: 750px) {

    .novecento-page {
        padding-top: 135px;
    }


    .novecento-container {
        width: 88%;
    }


    .novecento-hero-content {
        padding: 35px 25px;
    }


    .novecento-hero-text h1 {
        font-size: 24px;
    }


    .novecento-content {
        width: 100%;
    }


    .novecento-text p,
    .novecento-card p {
        font-size: 16px;
    }


    .novecento-card {
        width: 100%;

        grid-template-columns:
            60px
            1fr;

        gap: 18px;

        padding: 20px;
    }


    .novecento-card-icon {
        width: 52px;
        height: 52px;

        font-size: 32px;
    }

}
/* =====================================================
   PIANO 2 - CALCOLATRICI MECCANICHE
===================================================== */

.mechanical-page {
    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}


.mechanical-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =====================================================
   BANNER
===================================================== */

.mechanical-hero {
    width: 100%;
    min-height: 205px;

    display: flex;
    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;
}


.mechanical-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    gap: 28px;

    padding: 45px 50px;
}


.mechanical-hero-line {
    width: 4px;
    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;
}


.mechanical-hero-text h1 {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;

    color: #FFFCEB;
}


/* PIANO 2 */

.mechanical-floor {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}


.mechanical-floor i {
    color: #FFD43B;
}


.mechanical-floor:hover {
    color: #FFD43B;
}


/* =====================================================
   CONTENUTO
===================================================== */

.mechanical-content {
    width: 96%;

    margin: 45px auto 0;
}


/* =====================================================
   BOX CITAZIONE
===================================================== */

.mechanical-quote-box {
    width: 100%;

    display: grid;

    grid-template-columns:
        90px
        minmax(0, 1fr);

    gap: 30px;

    align-items: start;

    margin-bottom: 45px;

    padding: 30px 40px;

    border: 1px solid rgba(46, 64, 87, .22);

    border-radius: 12px;
}


.mechanical-quote-icon {
    width: 70px;
    height: 70px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #2E4057;
    color: #FFD43B;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;
    font-weight: 700;
    line-height: 1;
}


.mechanical-quote-content p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.7;

    color: #2E4057;
}


.mechanical-quote-author {
    margin-top: 18px !important;

    text-align: right;

    font-weight: 700 !important;
}


/* =====================================================
   TESTO
===================================================== */

.mechanical-text p {
    margin: 0 0 30px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.75;

    color: #2E4057;
}


/* =====================================================
   IMMAGINE FINALE
===================================================== */

.mechanical-image {
    width: 100%;

    margin: 40px 0 0;

    display: flex;
    justify-content: center;
}


.mechanical-image img {
    width: min(760px, 100%);

    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;
}


/* =====================================================
   RESPONSIVE
===================================================== */

@media screen and (max-width: 750px) {

    .mechanical-page {
        padding-top: 135px;
    }


    .mechanical-container {
        width: 88%;
    }


    .mechanical-hero-content {
        padding: 35px 25px;
    }


    .mechanical-hero-text h1 {
        font-size: 24px;
    }


    .mechanical-content {
        width: 100%;
    }


    .mechanical-quote-box {
        grid-template-columns: 1fr;

        padding: 25px;
    }


    .mechanical-text p,
    .mechanical-quote-content p {
        font-size: 16px;
    }

}
.mechanical-text strong {
    font-weight: 700;
}

.calc-date-separator {
    color: #FFD43B;
    font-size: 17px;
}
/* ==================================================
   TIMELINE - CALCOLATRICI MECCANICHE
================================================== */

.calc-evolution {
    width: 100%;
    margin-top: 70px;
    margin-bottom: 70px;
}


/* TITOLO */

.calc-evolution-heading {
    margin-bottom: 50px;
}

.calc-evolution-heading h2 {
    margin: 0;
    color: #2E4057;
    font-size: 34px;
    font-weight: 600;
}

.calc-evolution-heading span {
    display: block;
    width: 55px;
    height: 3px;
    background: #FFD43B;
    margin-top: 15px;
}


/* CONTENITORE TIMELINE */

.calc-timeline {
    position: relative;
    max-width: 900px;
    margin: 0 auto;
}


/* LINEA VERTICALE */

.calc-timeline::before {
    content: "";
    position: absolute;

    left: 145px;
    top: 15px;
    bottom: 15px;

    width: 2px;

    background: #FFD43B;
}


/* SINGOLO EVENTO */

.calc-event {
    position: relative;

    display: grid;

    grid-template-columns: 115px 60px 1fr;

    align-items: start;

    margin-bottom: 55px;
}


/* DATA */

.calc-date {
    color: #2E4057;

    font-size: 28px;
    font-weight: 700;

    text-align: right;

    padding-top: 3px;
}


/* PALLINO */

.calc-marker {
    position: relative;

    width: 16px;
    height: 16px;

    background: #FFD43B;

    border: 5px solid #FFFCEB;

    box-shadow: 0 0 0 2px #FFD43B;

    border-radius: 50%;

    margin: 8px auto 0;

    z-index: 2;
}


/* TESTO */

.calc-event-content {
    padding-left: 15px;
}

.calc-event-content h3 {
    margin: 0 0 10px;

    color: #2E4057;

    font-size: 22px;
    font-weight: 700;
}

.calc-event-content p {
    margin: 0;

    color: #2E4057;

    font-size: inherit;
    line-height: 1.7;
}

.calc-event-content strong {
    font-weight: 700;
}


/* DATA 1887 — 1892 */

.calc-date-double {
    line-height: 0.9;
}

.calc-date-double span {
    color: #FFD43B;
    font-size: 18px;
}
/* TESTI DESCRITTIVI DELLA TIMELINE */

.calc-event-content p {
    font-size: 20px;
    line-height: 1.7;
    color: #2E4057;
}
.calc-event-content h3 {
    font-size: 25px;
    line-height: 1.3;
    font-weight: 700;
    color: #2E4057;
    margin: 0 0 12px;
}

.calc-date {
    font-size: 27px;
    font-weight: 700;
    color: #2E4057;
}
/* ===== SISTEMAZIONE FINALE TIMELINE ===== */

.calc-event {
    margin-bottom: 32px;
}

.calc-event-content {
    padding-left: 15px;
}

.calc-event-content h3 {
    margin: 0 0 12px 0;
}

.calc-event-content p {
    margin: 0;
    font-size: 20px;
    line-height: 1.55;
}

/* Avvicina leggermente data, pallino e contenuto */
.calc-timeline {
    max-width: 1050px;
}

/* Ultimo elemento senza spazio inutile sotto */
.calc-event:last-child {
    margin-bottom: 0;
}
/* =====================================================
   CALCOLATRICI ELETTROMECCANICHE
===================================================== */


.electromechanical-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.electromechanical-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER SUPERIORE
===================================================== */


.electromechanical-hero {

    position: relative;

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    padding: 34px 42px;

    overflow: hidden;

    background: #2E4057;

    border-radius: 12px;

}



/* LINEA GIALLA */


.electromechanical-hero-line {

    width: 4px;

    height: 125px;

    flex-shrink: 0;

    margin-right: 28px;

    background: #FFD43B;

}



/* ICONA CIRCOLARE */


.electromechanical-icon {

    width: 110px;

    height: 110px;

    flex-shrink: 0;

    margin-right: 32px;


    display: flex;

    justify-content: center;

    align-items: center;


    border: 2px solid #FFD43B;

    border-radius: 50%;


    color: #FFD43B;

    font-size: 47px;

}



/* TESTO BANNER */


.electromechanical-hero-text {

    position: relative;

    z-index: 2;

}



.electromechanical-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* PIANO 2 */


.electromechanical-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}



.electromechanical-floor i {

    color: #FFD43B;

}



.electromechanical-floor:hover {

    color: #FFD43B;

}



/* DISEGNO TRASPARENTE DESTRA */


.electromechanical-decoration {

    position: absolute;

    right: 45px;

    top: 50%;

    transform: translateY(-50%);


    font-size: 115px;

    color: #FFFCEB;

    opacity: .08;

}



/* =====================================================
   CONTENUTO
===================================================== */


.electromechanical-content {

    width: 96%;

    margin: 52px auto 0;

}



/* TESTI */


.electromechanical-content p {

    max-width: 1250px;

    margin: 0 0 38px;


    color: #2E4057;

    font-family: "Montserrat", sans-serif;

    font-size: 20px;

    font-weight: 400;

    line-height: 1.7;

}



.electromechanical-content strong {

    font-weight: 700;

}



/* =====================================================
   IMMAGINE
===================================================== */


.electromechanical-image {

    width: 78%;

    margin: 52px auto 0;

}



.electromechanical-image img {

    width: 100%;

    height: auto;

    display: block;


    border: 2px solid #FFD43B;

    border-radius: 13px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 900px) {

    .electromechanical-hero {

        padding: 30px;

    }


    .electromechanical-icon {

        width: 90px;

        height: 90px;

        font-size: 38px;

        margin-right: 22px;

    }


    .electromechanical-hero-line {

        margin-right: 22px;

    }


    .electromechanical-hero-text h1 {

        font-size: 30px;

    }


    .electromechanical-decoration {

        font-size: 90px;

    }

}



@media screen and (max-width: 650px) {

    .electromechanical-page {

        padding-top: 135px;

    }


    .electromechanical-container {

        width: 88%;

    }


    .electromechanical-hero {

        padding: 25px 20px;

    }


    .electromechanical-hero-line {

        height: 95px;

        margin-right: 15px;

    }


    .electromechanical-icon {

        width: 65px;

        height: 65px;

        margin-right: 15px;

        font-size: 28px;

    }


    .electromechanical-hero-text h1 {

        font-size: 24px;

    }


    .electromechanical-floor {

        font-size: 15px;

    }


    .electromechanical-decoration {

        display: none;

    }


    .electromechanical-content {

        width: 100%;

        margin-top: 38px;

    }


    .electromechanical-content p {

        margin-bottom: 28px;

        font-size: 16px;

    }


    .electromechanical-image {

        width: 100%;

        margin-top: 40px;

    }

}
/* =====================================================
   PIANO 2 - CALCOLATRICI MECCANICHE PICCOLE
===================================================== */


.small-mechanical-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.small-mechanical-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.small-mechanical-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}



.small-mechanical-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}



/* LINEA GIALLA VERTICALE */


.small-mechanical-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO BANNER
===================================================== */


.small-mechanical-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 2
===================================================== */


.small-mechanical-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}



.small-mechanical-floor i {

    color: #FFD43B;

}



.small-mechanical-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CONTENUTO
===================================================== */


.small-mechanical-content {

    width: 95%;

    margin: 45px auto 0;

}



/* =====================================================
   TESTO NORMALE
   NON È UN TITOLO
===================================================== */

.small-mechanical-intro {

    max-width: 1150px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.7;

    color: #2E4057;

}



/* =====================================================
   LINEA GIALLA CORTA
===================================================== */


.small-mechanical-divider {

    width: 48px;

    height: 2px;

    margin: 18px 0 32px;

    background: #FFD43B;

}



/* =====================================================
   GALLERIA
===================================================== */


.small-mechanical-gallery {

    width: 100%;

    display: flex;

    align-items: flex-start;

    gap: 28px;

}



/* =====================================================
   IMMAGINI
===================================================== */


.small-mechanical-image {

    width: 340px;

}



.small-mechanical-image img {

    width: 100%;

    height: 245px;

    display: block;

    object-fit: cover;

    border: 2px solid #FFD43B;

    border-radius: 12px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 750px) {


    .small-mechanical-page {

        padding-top: 135px;

    }


    .small-mechanical-container {

        width: 88%;

    }


    .small-mechanical-hero-content {

        padding: 35px 25px;

    }


    .small-mechanical-hero-text h1 {

        font-size: 24px;

    }


    .small-mechanical-content {

        width: 100%;

    }


    .small-mechanical-intro {

        font-size: 16px;

    }


    .small-mechanical-gallery {

        flex-direction: column;

    }


    .small-mechanical-image {

        width: 100%;

    }


    .small-mechanical-image img {

        height: auto;

    }

}
.small-mechanical-intro strong {
    font-weight: 700;
}
/* =====================================================
   PIANO 2 - SISTEMI CONTABILI
===================================================== */


.accounting-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.accounting-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.accounting-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}



.accounting-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}



/* LINEA GIALLA */


.accounting-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO
===================================================== */


.accounting-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 2
===================================================== */


.accounting-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}



.accounting-floor i {

    color: #FFD43B;

}



.accounting-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CONTENUTO
===================================================== */


.accounting-content {

    width: 95%;

    margin: 45px auto 0;

}



/* =====================================================
   TESTO PRINCIPALE
===================================================== */


.accounting-intro {

    max-width: 1150px;

    margin: 0 0 35px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



.accounting-intro strong {

    font-weight: 700;

}



/* =====================================================
   BOX CITAZIONE
===================================================== */


.accounting-quote-box {

    width: 100%;

    display: grid;

    grid-template-columns:
        90px
        minmax(0, 1fr);

    gap: 30px;

    align-items: center;

    margin-bottom: 45px;

    padding: 30px 40px;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}



/* CERCHIO CON VIRGOLETTE */


.accounting-quote-icon {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFD43B;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;

    font-weight: 700;

    line-height: 1;

}



/* TESTO BOX */


.accounting-quote-content p {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.7;

    color: #2E4057;

}



.accounting-quote-content strong {

    font-weight: 700;

}



/* =====================================================
   IMMAGINI
===================================================== */


.accounting-gallery {

    width: 100%;

    display: flex;

    justify-content: center;

    align-items: flex-start;

    gap: 45px;

}



.accounting-image {

    width: min(420px, 100%);

}



.accounting-image img {

    width: 100%;

    height: 280px;

    display: block;

    object-fit: cover;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 750px) {


    .accounting-page {

        padding-top: 135px;

    }


    .accounting-container {

        width: 88%;

    }


    .accounting-hero-content {

        padding: 35px 25px;

    }


    .accounting-hero-text h1 {

        font-size: 24px;

    }


    .accounting-content {

        width: 100%;

    }


    .accounting-intro,
    .accounting-quote-content p {

        font-size: 16px;

    }


    .accounting-quote-box {

        grid-template-columns: 1fr;

        padding: 25px;

    }


    .accounting-gallery {

        flex-direction: column;

        gap: 25px;

    }


    .accounting-image {

        width: 100%;

    }


    .accounting-image img {

        height: auto;

    }

}
/* =====================================================
   PIANO 2 - CALCOLATRICI ELETTRONICHE
===================================================== */


.electronic-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.electronic-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.electronic-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}



.electronic-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}



/* LINEA GIALLA */


.electronic-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO BANNER
===================================================== */


.electronic-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 2
===================================================== */


.electronic-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}



.electronic-floor i {

    color: #FFD43B;

}



.electronic-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CONTENUTO
===================================================== */


.electronic-content {

    width: 95%;

    margin: 45px auto 0;

}



/* =====================================================
   TESTO
===================================================== */


.electronic-text {

    max-width: 1150px;

}



.electronic-text p {

    margin: 0 0 22px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



.electronic-text strong {

    font-weight: 700;

}



/* =====================================================
   TIMELINE
===================================================== */


.electronic-timeline {

    width: 100%;

    margin: 45px 0;

    padding: 28px 32px 32px;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}



/* TITOLO TIMELINE */


.electronic-timeline h2 {

    margin: 0 0 35px;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 700;

    line-height: 1.2;

    color: #2E4057;

    text-transform: uppercase;

}



/* LINEA ORIZZONTALE */


.electronic-timeline-track {

    position: relative;

    display: grid;

    grid-template-columns: repeat(4, 1fr);

    gap: 30px;

}



.electronic-timeline-track::before {

    content: "";

    position: absolute;

    top: 7px;

    left: 10%;

    right: 3%;

    height: 2px;

    background: #FFD43B;

}



/* FRECCIA FINALE */


.electronic-timeline-track::after {

    content: "";

    position: absolute;

    right: 2%;

    top: 2px;

    width: 9px;

    height: 9px;

    border-top: 2px solid #FFD43B;

    border-right: 2px solid #FFD43B;

    transform: rotate(45deg);

}



/* EVENTO */


.electronic-timeline-event {

    position: relative;

    z-index: 2;

    text-align: center;

}



/* PALLINO */


.electronic-dot {

    width: 16px;

    height: 16px;

    margin: 0 auto 18px;

    background: #FFD43B;

    border-radius: 50%;

}



/* DATA */


.electronic-timeline-event h3 {

    margin: 0 0 8px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 700;

    line-height: 1.3;

    color: #2E4057;

}



/* TESTO TIMELINE */


.electronic-timeline-event p {

    max-width: 220px;

    margin: 0 auto;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;

    font-weight: 400;

    line-height: 1.55;

    color: #2E4057;

}



/* =====================================================
   GALLERIA
===================================================== */


.electronic-gallery {

    width: 100%;

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 45px;

    align-items: start;

}



/* =====================================================
   IMMAGINI
===================================================== */


.electronic-image {

    width: 100%;

}



.electronic-image img {

    width: 100%;

    height: 240px;

    display: block;

    object-fit: cover;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 900px) {


    .electronic-timeline-track {

        grid-template-columns: repeat(2, 1fr);

        row-gap: 40px;

    }


    .electronic-timeline-track::before,
    .electronic-timeline-track::after {

        display: none;

    }


    .electronic-gallery {

        grid-template-columns: repeat(2, 1fr);

    }

}



@media screen and (max-width: 750px) {


    .electronic-page {

        padding-top: 135px;

    }


    .electronic-container {

        width: 88%;

    }


    .electronic-hero-content {

        padding: 35px 25px;

    }


    .electronic-hero-text h1 {

        font-size: 24px;

    }


    .electronic-content {

        width: 100%;

    }


    .electronic-text p {

        font-size: 16px;

    }


    .electronic-timeline {

        padding: 25px;

    }


    .electronic-timeline-track {

        grid-template-columns: 1fr;

    }


    .electronic-timeline-event {

        text-align: left;

    }


    .electronic-dot {

        margin: 0 0 15px;

    }


    .electronic-timeline-event p {

        max-width: none;

        margin: 0;

    }


    .electronic-gallery {

        grid-template-columns: 1fr;

        gap: 25px;

    }


    .electronic-image img {

        height: auto;

    }

}
/* =====================================================
   PIANO 3 - POLIEDRI
===================================================== */


.polyhedra-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.polyhedra-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.polyhedra-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}



.polyhedra-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}



.polyhedra-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO BANNER
===================================================== */


.polyhedra-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 3
===================================================== */


.polyhedra-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}



.polyhedra-floor i {

    color: #FFD43B;

}



.polyhedra-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CITAZIONE
===================================================== */


.polyhedra-quote-box {

    width: 95%;

    margin: 35px auto 0;

    padding: 25px 30px;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr)
        auto;

    gap: 25px;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}



.polyhedra-quote-icon {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFD43B;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;

    font-weight: 700;

    line-height: 1;

}



.polyhedra-quote-text p {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 600;

    line-height: 1.6;

    color: #2E4057;

}


.polyhedra-quote-author {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;

    font-weight: 400;

    line-height: 1.5;

    font-style: italic;

    color: #2E4057;

}


.polyhedra-quote-author {

    font-style: italic;

}



/* =====================================================
   INTRO
===================================================== */


.polyhedra-intro {

    width: 95%;

    margin: 35px auto 0;

}



.polyhedra-intro p {

    margin: 0 0 12px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



.polyhedra-intro strong {

    font-weight: 700;

}



/* =====================================================
   TABELLA + BOX
===================================================== */


.polyhedra-info-grid {

    width: 95%;

    margin: 40px auto 0;

    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(320px, .95fr);

    gap: 40px;

    align-items: start;

}



/* TABELLA */


.polyhedra-table-box {

    overflow: hidden;

    border: 1px solid #2E4057;

    border-radius: 12px;

}



.polyhedra-table {

    width: 100%;

    border-collapse: collapse;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;

    color: #2E4057;

}



.polyhedra-table th,
.polyhedra-table td {

    padding: 14px 16px;

    border-bottom: 1px solid rgba(46, 64, 87, .18);

    text-align: center;

}



.polyhedra-table th:first-child,
.polyhedra-table td:first-child {

    text-align: left;

}



.polyhedra-table th {

    font-weight: 700;

}



.polyhedra-table td {

    font-weight: 400;

}



.polyhedra-table tr:last-child td {

    border-bottom: none;

}



/* =====================================================
   BOX LATERALI
===================================================== */


.polyhedra-side-boxes {

    display: flex;

    flex-direction: column;

    gap: 20px;

}



.polyhedra-info-box {

    display: grid;

    grid-template-columns:
        50px
        minmax(0, 1fr);

    gap: 20px;

    align-items: start;

    padding: 22px 25px;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}



.polyhedra-info-icon {

    width: 42px;

    height: 42px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFD43B;

    font-family: "Montserrat", sans-serif;

    font-size: 20px;

    font-weight: 700;

}



.polyhedra-info-box p {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.7;

    color: #2E4057;

}



.polyhedra-info-box strong {

    font-weight: 700;

}



/* =====================================================
   TIMELINE
===================================================== */


.polyhedra-timeline {

    width: 95%;

    margin: 45px auto 0;

    padding: 25px 30px 32px;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}



.polyhedra-timeline h2 {

    margin: 0 0 35px;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 700;

    color: #2E4057;

}



.polyhedra-timeline-track {

    position: relative;

    display: grid;

    grid-template-columns: repeat(5, 1fr);

    gap: 24px;

}



.polyhedra-timeline-track::before {

    content: "";

    position: absolute;

    top: 7px;

    left: 5%;

    right: 2%;

    height: 2px;

    background: #FFD43B;

}



.polyhedra-timeline-track::after {

    content: "";

    position: absolute;

    right: 1%;

    top: 2px;

    width: 9px;

    height: 9px;

    border-top: 2px solid #FFD43B;

    border-right: 2px solid #FFD43B;

    transform: rotate(45deg);

}



.polyhedra-timeline-item {

    position: relative;

    z-index: 2;

    text-align: center;

}



.polyhedra-dot {

    width: 16px;

    height: 16px;

    margin: 0 auto 16px;

    border-radius: 50%;

    background: #FFD43B;

}



.polyhedra-timeline-item h3 {

    margin: 0 0 4px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 700;

    line-height: 1.3;

    color: #2E4057;

}



.polyhedra-timeline-item span {

    display: block;

    margin-bottom: 12px;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;

    font-style: italic;

    color: #2E4057;

}



.polyhedra-timeline-item p {

    margin: 0 auto;

    max-width: 190px;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;

    font-weight: 400;

    line-height: 1.55;

    color: #2E4057;

}



/* =====================================================
   PARTE FINALE
===================================================== */


.polyhedra-bottom {

    width: 95%;

    margin: 45px auto 0;

    display: grid;

    grid-template-columns:
        minmax(0, 1.4fr)
        minmax(300px, .75fr);

    gap: 45px;

    align-items: start;

}



/* TESTO CON PALLINI */


.polyhedra-history p {

    position: relative;

    margin: 0 0 24px;

    padding-left: 25px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.7;

    color: #2E4057;

}



.polyhedra-history p::before {

    content: "";

    position: absolute;

    left: 0;

    top: 10px;

    width: 9px;

    height: 9px;

    border-radius: 50%;

    background: #FFD43B;

}



.polyhedra-history strong {

    font-weight: 700;

}



/* =====================================================
   IMMAGINE
===================================================== */


.polyhedra-image {

    width: 100%;

}



.polyhedra-image img {

    width: 100%;

    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 950px) {


    .polyhedra-info-grid,
    .polyhedra-bottom {

        grid-template-columns: 1fr;

    }


    .polyhedra-timeline-track {

        grid-template-columns: repeat(2, 1fr);

        row-gap: 40px;

    }


    .polyhedra-timeline-track::before,
    .polyhedra-timeline-track::after {

        display: none;

    }

}



@media screen and (max-width: 750px) {


    .polyhedra-page {

        padding-top: 135px;

    }


    .polyhedra-container {

        width: 88%;

    }


    .polyhedra-hero-content {

        padding: 35px 25px;

    }


    .polyhedra-hero-text h1 {

        font-size: 24px;

    }


    .polyhedra-quote-box {

        width: 100%;

        grid-template-columns: 1fr;

        padding: 25px;

    }


    .polyhedra-quote-author {

        text-align: left;

    }


    .polyhedra-intro,
    .polyhedra-info-grid,
    .polyhedra-timeline,
    .polyhedra-bottom {

        width: 100%;

    }


    .polyhedra-intro p,
    .polyhedra-info-box p,
    .polyhedra-history p {

        font-size: 16px;

    }


    .polyhedra-table {

        font-size: 14px;

    }


    .polyhedra-table th,
    .polyhedra-table td {

        padding: 11px 8px;

    }


    .polyhedra-timeline-track {

        grid-template-columns: 1fr;

    }


    .polyhedra-timeline-item {

        text-align: left;

    }


    .polyhedra-dot {

        margin: 0 0 15px;

    }


    .polyhedra-timeline-item p {

        max-width: none;

        margin: 0;

    }

}
/* =====================================================
   PIANO 3 - TEOREMA DI PITAGORA
===================================================== */


.pythagoras-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.pythagoras-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.pythagoras-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}



.pythagoras-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}



.pythagoras-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO
===================================================== */


.pythagoras-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 3
===================================================== */


.pythagoras-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}



.pythagoras-floor i {

    color: #FFD43B;

}



.pythagoras-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CITAZIONE
===================================================== */


.pythagoras-quote-box {

    width: 95%;

    margin: 35px auto 0;

    padding: 25px 30px;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr)
        auto;

    gap: 25px;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}



/* CERCHIO VIRGOLETTE */


.pythagoras-quote-icon {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFD43B;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;

    font-weight: 700;

    line-height: 1;

}



/* FRASE */


.pythagoras-quote-text p {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 600;

    line-height: 1.6;

    color: #2E4057;

}



/* AUTORE PIÙ PICCOLO */


.pythagoras-quote-author {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;

    font-weight: 400;

    line-height: 1.5;

    font-style: italic;

    color: #2E4057;

}



/* =====================================================
   CONTENUTO
===================================================== */


.pythagoras-content {

    width: 95%;

    margin: 35px auto 0;

}



/* =====================================================
   TESTO
===================================================== */


.pythagoras-text {

    max-width: 1150px;

}



.pythagoras-text p {

    margin: 0 0 30px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



.pythagoras-text strong {

    font-weight: 700;

}



/* =====================================================
   DUE IMMAGINI
===================================================== */


.pythagoras-gallery {

    width: 100%;

    margin-top: 35px;

    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 30px;

    align-items: stretch;

}



.pythagoras-image {

    width: 100%;

}



.pythagoras-image img {

    width: 100%;

    height: 430px;

    display: block;

    object-fit: contain;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;

}



/* =====================================================
   BOX PROPOSIZIONE
===================================================== */


.pythagoras-proposition {

    width: 100%;

    margin-top: 30px;

    padding: 28px 35px;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr);

    gap: 28px;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}



/* ICONA LIBRO */


.pythagoras-proposition-icon {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFFCEB;

    font-size: 30px;

}



/* TITOLO PROPOSIZIONE */


.pythagoras-proposition-text h2 {

    margin: 0 0 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 700;

    line-height: 1.3;

    color: #2E4057;

}



/* TESTO PROPOSIZIONE */


.pythagoras-proposition-text p {

    margin: 0;

    max-width: 900px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.7;

    color: #2E4057;

}



/* =====================================================
   IMMAGINE FINALE
===================================================== */


.pythagoras-final-image {

    width: 75%;

    margin: 30px auto 0;

}


.pythagoras-final-image img {

    width: 100%;

    height: auto;

    display: block;

    object-fit: contain;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 900px) {


    .pythagoras-gallery {

        grid-template-columns: 1fr;

    }


    .pythagoras-image img {

        height: auto;

    }

}



@media screen and (max-width: 750px) {


    .pythagoras-page {

        padding-top: 135px;

    }


    .pythagoras-container {

        width: 88%;

    }


    .pythagoras-hero-content {

        padding: 35px 25px;

    }


    .pythagoras-hero-text h1 {

        font-size: 24px;

    }


    .pythagoras-quote-box {

        width: 100%;

        grid-template-columns: 1fr;

        padding: 25px;

    }


    .pythagoras-quote-author {

        text-align: left;

    }


    .pythagoras-content {

        width: 100%;

    }


    .pythagoras-text p,
    .pythagoras-proposition-text p {

        font-size: 16px;

    }


    .pythagoras-quote-text p {

        font-size: 20px;

    }


    .pythagoras-proposition {

        grid-template-columns: 1fr;

        padding: 25px;

    }


    .pythagoras-final-image img {

        max-height: none;

    }

}
/* =====================================================
   PIANO 3 - PI GRECO
===================================================== */


.pi-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.pi-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.pi-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}



.pi-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}



.pi-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO
===================================================== */


.pi-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 3
===================================================== */


.pi-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}



.pi-floor i {

    color: #FFD43B;

}



.pi-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CITAZIONE
===================================================== */


.pi-quote-box {

    width: 95%;

    margin: 35px auto 0;

    padding: 25px 30px;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr);

    gap: 25px;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}



.pi-quote-icon {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFD43B;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;

    font-weight: 700;

    line-height: 1;

}



.pi-quote-main {

    width: 100%;

}



.pi-quote-text {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 600;

    line-height: 1.6;

    color: #2E4057;

}



.pi-quote-author {

    margin: 10px 0 0;

    text-align: right;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;

    font-weight: 400;

    line-height: 1.5;

    font-style: italic;

    color: #2E4057;

}



/* =====================================================
   CONTENUTO
===================================================== */


.pi-content {

    width: 95%;

    margin: 35px auto 0;

}



.pi-intro,
.pi-text-section p,
.pi-separated-text p {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



.pi-content strong {

    font-weight: 700;

}



/* =====================================================
   DATE / EVENTI
===================================================== */


.pi-history-row {

    width: 100%;

    display: grid;

    grid-template-columns:
        175px
        minmax(0, 1fr);

    gap: 30px;

    align-items: center;

    margin-top: 38px;

    padding: 32px 0;

    border-top: 2px dotted #FFD43B;

}



/* DATA MIGLIORATA */


.pi-date {

    position: relative;

    min-height: 105px;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: flex-start;

    padding-right: 26px;

    border-right: 3px solid #FFD43B;

}



.pi-date-main {

    display: block;

    font-family: "Montserrat", sans-serif;

    font-size: 42px;

    font-weight: 700;

    line-height: 1;

    letter-spacing: -1.5px;

    color: #2E4057;

}



.pi-date-label {

    display: block;

    margin-top: 7px;

    font-family: "Montserrat", sans-serif;

    font-size: 30px;

    font-weight: 500;

    line-height: 1;

    letter-spacing: -1.5px;

    color: #2E4057;

}



/* TESTO ACCANTO ALLA DATA */


.pi-history-text p {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



/* =====================================================
   TESTO STORICO
===================================================== */


.pi-text-section {

    margin-top: 0;

    padding: 32px 0;

    border-top: 2px dotted #FFD43B;

}



/* =====================================================
   PARAGRAFI SEPARATI
===================================================== */


.pi-separated-text {

    padding: 30px 0;

    border-top: 2px dotted #FFD43B;

}

.pi-final-image {
    width: 100%;
    max-width: 900px;
    margin: 44px auto 34px;
}

.pi-final-image img {
    display: block;
    width: 100%;
    height: auto;
}



/* =====================================================
   DECORAZIONE FINALE
===================================================== */


.pi-final-decoration {

    width: 100%;

    margin-top: 15px;

    display: grid;

    grid-template-columns:
        1fr
        auto
        1fr;

    gap: 22px;

    align-items: center;

}



.pi-symbol {

    font-family: "Cormorant Garamond", serif;

    font-size: 65px;

    font-weight: 600;

    line-height: 1;

    color: #FFD43B;

}



/* LINEA DECORATIVA */


.pi-wave {

    display: block;

    height: 2px;

    background-image:
        repeating-linear-gradient(
            90deg,
            #FFD43B 0,
            #FFD43B 6px,
            transparent 6px,
            transparent 13px
        );

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 750px) {


    .pi-page {

        padding-top: 135px;

    }


    .pi-container {

        width: 88%;

    }


    .pi-hero-content {

        padding: 35px 25px;

    }


    .pi-hero-text h1 {

        font-size: 24px;

    }


    .pi-quote-box {

        width: 100%;

        grid-template-columns: 1fr;

        padding: 25px;

    }


    .pi-quote-author {

        text-align: left;

    }


    .pi-content {

        width: 100%;

    }


    .pi-intro,
    .pi-history-text p,
    .pi-text-section p,
    .pi-separated-text p {

        font-size: 16px;

    }


    .pi-quote-text {

        font-size: 20px;

    }


    .pi-history-row {

        grid-template-columns: 1fr;

        gap: 20px;

    }


    .pi-date {

        min-height: 0;

        padding: 0 0 18px;

        border-right: none;

        border-bottom: 3px solid #FFD43B;

    }


    .pi-date-main {

        font-size: 34px;

    }

}
/* =====================================================
   PIANO 3 - I NUMERI PRIMI
===================================================== */


.prime-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.prime-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   INTESTAZIONE
===================================================== */

/* =====================================================
   BANNER
===================================================== */


.prime-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}


.prime-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}


/* LINEA GIALLA */


.prime-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}


/* TITOLO */


.prime-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 3
===================================================== */


.prime-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}


.prime-floor i {

    color: #FFD43B;

}


.prime-floor:hover {

    color: #FFD43B;

}



.prime-floor:hover i {

    color: #FFD43B;

}



/* =====================================================
   CITAZIONE
===================================================== */

/* =====================================================
   CITAZIONE
===================================================== */


.prime-quote-box {

    width: 95%;

    margin: 35px auto 0;

    padding: 25px 30px;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr);

    gap: 25px;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}


/* CERCHIO CON VIRGOLETTE */


.prime-quote-icon {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFD43B;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;

    font-weight: 700;

    line-height: 1;

}


/* CONTENUTO CITAZIONE */


.prime-quote-main {

    width: 100%;

}


/* FRASE */


.prime-quote-text {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 600;

    line-height: 1.6;

    color: #2E4057;

}


/* AUTORE */


.prime-quote-author {

    margin: 10px 0 0;

    text-align: right;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;

    font-weight: 400;

    line-height: 1.5;

    font-style: italic;

    color: #2E4057;

}


/* =====================================================
   CONTENUTO
===================================================== */


.prime-content {

    width: 92%;

    margin: 38px auto 0;

}



/* =====================================================
   TESTO
===================================================== */


.prime-text {

    max-width: 1150px;

}



.prime-text p {

    margin: 0 0 30px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



.prime-text strong {

    font-weight: 700;

}

.prime-text .prime-latest-link,
.prime-text .prime-latest-link:visited {
    color: #FFD43B;
    font-weight: 700;
    text-decoration-color: #FFD43B;
    transition: color .25s ease, text-decoration-color .25s ease;
}

.prime-text .prime-latest-link:hover,
.prime-text .prime-latest-link:focus-visible {
    color: #2E4057;
    text-decoration-color: #2E4057;
}

/* Link alla pagina Crittografia: stesso evidenziatore delle card in home. */
.prime-text .prime-cryptography-link,
.prime-text .prime-cryptography-link:visited {
    display: inline-block;
    position: relative;
    padding: 0 3px;
    margin-inline: -3px;
    color: #2E4057;
    font-weight: 700;
    text-decoration: none;
    box-shadow: inset 0 -3px 0 #FFD43B;
    transform-origin: center;
    transition:
        box-shadow .25s ease,
        color .25s ease,
        transform .25s ease;
}

.prime-text .prime-cryptography-link:hover,
.prime-text .prime-cryptography-link:focus-visible {
    color: #2E4057;
    box-shadow: inset 0 -1.45em 0 #FFD43B;
    transform: scale(1.05);
}

.cryptography-page .cryptography-content {
    margin-top: 48px;
}

.cryptography-page .prime-text {
    max-width: 1120px;
}

/* =====================================================
   PIANO 4 — LE CURVE MATEMATICHE
===================================================== */

.math-curves-page .math-curves-content {
    margin-top: 48px;
}

.math-curves-page .prime-text {
    max-width: 1120px;
}

.math-curves-gallery {
    width: 100%;
    margin-top: 46px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

.math-curves-image {
    margin: 0;
    overflow: hidden;
    border: 3px solid #FFD43B;
    border-radius: 14px;
    background: #2E4057;
    box-shadow: 0 18px 42px rgba(46, 64, 87, .16);
}

.math-curves-image-featured {
    grid-column: 1 / -1;
}

.math-curves-image img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

@media screen and (max-width: 750px) {
    .math-curves-page .math-curves-content {
        margin-top: 36px;
    }

    .math-curves-gallery {
        margin-top: 34px;
        grid-template-columns: minmax(0, 1fr);
        gap: 20px;
    }

    .math-curves-image-featured {
        grid-column: auto;
    }
}



.prime-text sup {

    font-size: .65em;

    line-height: 0;

}



/* =====================================================
   IMMAGINE
===================================================== */


.prime-image {

    width: 82%;

    margin: 40px auto 0;

}



.prime-image img {

    width: 100%;

    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 750px) {


    .prime-page {

        padding-top: 135px;

    }


    .prime-container {

        width: 88%;

    }


 .prime-hero-content {
    padding: 35px 25px;
}


.prime-hero-text h1 {
    font-size: 24px;
}
    .prime-content,
    .prime-quote-box {

        width: 100%;

    }


    .prime-heading h1 {

        font-size: 24px;

    }


    .prime-quote-box {

        grid-template-columns: 1fr;

        padding: 25px;

    }


    .prime-quote-text {

        font-size: 20px;

    }


    .prime-quote-author {

        text-align: left;

    }


    .prime-text p {

        font-size: 16px;

    }


    .prime-image {

        width: 100%;

    }

}
/* =====================================================
   PIANO 3 - SEZIONE AUREA
===================================================== */


.golden-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}


.golden-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.golden-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}


.golden-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}


.golden-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO
===================================================== */


.golden-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 3
===================================================== */


.golden-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}


.golden-floor i {

    color: #FFD43B;

}


.golden-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CITAZIONE
===================================================== */


.golden-quote-box {

    width: 95%;

    margin: 35px auto 0;

    padding: 25px 30px;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr);

    gap: 25px;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}


.golden-quote-icon {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFD43B;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;

    font-weight: 700;

    line-height: 1;

}


.golden-quote-main {

    width: 100%;

}


.golden-quote-text {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 600;

    line-height: 1.6;

    color: #2E4057;

}


.golden-quote-author {

    margin: 10px 0 0;

    text-align: right;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;

    font-weight: 400;

    line-height: 1.5;

    font-style: italic;

    color: #2E4057;

}



/* =====================================================
   CONTENUTO
===================================================== */


.golden-content {

    width: 95%;

    margin: 35px auto 0;

}



/* =====================================================
   TESTO
===================================================== */


.golden-text {

    max-width: 1150px;

}


.golden-text p {

    margin: 0 0 30px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}


.golden-text strong {

    font-weight: 700;

}



/* =====================================================
   SCHEMA DELLA PROPORZIONE AUREA
===================================================== */


.golden-proportion-box {

    width: min(760px, 90%);

    margin: 15px auto 35px;

    padding: 22px 35px 16px;

    border: 1px solid rgba(46, 64, 87, .12);

    border-radius: 12px;

}



/* SEGMENTO */


.golden-segment {

    position: relative;

    width: 90%;

    height: 45px;

    margin: 0 auto;

}


.golden-segment-line {

    position: absolute;

    left: 0;

    right: 0;

    top: 23px;

    height: 3px;

    background: #2E4057;

}


.golden-segment-line::before,
.golden-segment-line::after {

    content: "";

    position: absolute;

    top: -8px;

    width: 3px;

    height: 19px;

    background: #2E4057;

}


.golden-segment-line::before {

    left: 0;

}


.golden-segment-line::after {

    right: 0;

}



/* PUNTO C */


.golden-segment-marker {

    position: absolute;

    left: 62%;

    top: 50%;

    width: 10px;

    height: 10px;

    transform: translate(-50%, -50%);

    border-radius: 50%;

    background: #2E4057;

}



/* LETTERE */


.golden-point {

    position: absolute;

    top: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;

    font-weight: 600;

    color: #2E4057;

}


.golden-point-a {

    left: 0;

}


.golden-point-c {

    left: 62%;

    transform: translateX(-50%);

}


.golden-point-b {

    right: 0;

}



/* FORMULA */


.golden-formula {

    margin: 8px 0 0;

    text-align: center;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 600;

    font-style: italic;

    color: #2E4057;

}



/* =====================================================
   RAPPORTI DI FIBONACCI
===================================================== */


.golden-ratios {

    width: min(650px, 90%);

    margin: 10px auto 35px;

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 35px;

    padding: 25px 35px;

    border: 1px solid rgba(46, 64, 87, .12);

    border-radius: 12px;

}



/* DIVISORE TRA LE DUE COLONNE */


.golden-ratios-column:first-child {

    padding-right: 35px;

    border-right: 1px solid #FFD43B;

}



.golden-ratios-column p {

    display: grid;

    grid-template-columns:
        70px
        20px
        1fr;

    gap: 8px;

    margin: 0 0 7px;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;

    font-weight: 400;

    line-height: 1.4;

    color: #2E4057;

}


.golden-ratios-column p:last-child {

    margin-bottom: 0;

}



/* =====================================================
   ULTIMO TESTO
===================================================== */


.golden-final-text {

    margin-top: 5px;

}



/* =====================================================
   IMMAGINE FINALE
===================================================== */


.golden-image {

    width: 82%;

    margin: 35px auto 0;

}


.golden-image img {

    width: 100%;

    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 750px) {


    .golden-page {

        padding-top: 135px;

    }


    .golden-container {

        width: 88%;

    }


    .golden-hero-content {

        padding: 35px 25px;

    }


    .golden-hero-text h1 {

        font-size: 24px;

    }


    .golden-quote-box {

        width: 100%;

        grid-template-columns: 1fr;

        padding: 25px;

    }


    .golden-quote-text {

        font-size: 20px;

    }


    .golden-quote-author {

        text-align: left;

    }


    .golden-content {

        width: 100%;

    }


    .golden-text p {

        font-size: 16px;

    }


    .golden-proportion-box {

        width: 100%;

        padding: 20px;

    }


    .golden-ratios {

        width: 100%;

        grid-template-columns: 1fr;

        gap: 20px;

        padding: 25px;

    }


    .golden-ratios-column:first-child {

        padding: 0 0 20px;

        border-right: none;

        border-bottom: 1px solid #FFD43B;

    }


    .golden-image {

        width: 100%;

    }

}
/* =====================================================
   PIANO 3 - MUSICA
===================================================== */


.music-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.music-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.music-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}



.music-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}



/* LINEA GIALLA VERTICALE */


.music-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO
===================================================== */


.music-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 3
===================================================== */


.music-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}



.music-floor i {

    color: #FFD43B;

}



.music-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CONTENUTO
===================================================== */


.music-content {

    width: 95%;

    margin: 45px auto 0;

}



/* =====================================================
   TESTO PROVVISORIO
   NON È UN SOTTOTITOLO
===================================================== */


.music-intro {

    max-width: 1150px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



/* =====================================================
   LINEA GIALLA CORTA
===================================================== */


.music-divider {

    width: 55px;

    height: 3px;

    margin: 18px 0 35px;

    background: #FFD43B;

}



/* =====================================================
   IMMAGINE
===================================================== */


.music-image {

    width: 88%;

    margin: 0 auto;

}



.music-image img {

    width: 100%;

    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 750px) {


    .music-page {

        padding-top: 135px;

    }


    .music-container {

        width: 88%;

    }


    .music-hero-content {

        padding: 35px 25px;

    }


    .music-hero-text h1 {

        font-size: 24px;

    }


    .music-content {

        width: 100%;

    }


    .music-intro {

        font-size: 16px;

    }


    .music-image {

        width: 100%;

    }

}
/* =====================================================
   PIANO 3 - SPIRALE
===================================================== */


.spiral-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.spiral-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.spiral-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}



.spiral-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}



/* LINEA GIALLA VERTICALE */


.spiral-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO
===================================================== */


.spiral-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 3
===================================================== */


.spiral-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}



.spiral-floor i {

    color: #FFD43B;

}



.spiral-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CONTENUTO
===================================================== */


.spiral-content {

    width: 95%;

    margin: 45px auto 0;

}



/* =====================================================
   TESTO NORMALE
   NON È UN SOTTOTITOLO
===================================================== */


.spiral-intro {

    max-width: 1150px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



/* EVENTUALI PAROLE IN GRASSETTO */


.spiral-intro strong {

    font-weight: 700;

}



/* =====================================================
   LINEA GIALLA CORTA
===================================================== */


.spiral-divider {

    width: 55px;

    height: 3px;

    margin: 18px 0 35px;

    background: #FFD43B;

}



/* =====================================================
   IMMAGINE
===================================================== */


.spiral-image {

    width: 88%;

    margin: 0 auto;

}



.spiral-image img {

    width: 100%;

    height: auto;

    display: block;

    object-fit: contain;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 750px) {


    .spiral-page {

        padding-top: 135px;

    }


    .spiral-container {

        width: 88%;

    }


    .spiral-hero-content {

        padding: 35px 25px;

    }


    .spiral-hero-text h1 {

        font-size: 24px;

    }


    .spiral-content {

        width: 100%;

    }


    .spiral-intro {

        font-size: 16px;

    }


    .spiral-image {

        width: 100%;

    }

}
/* =====================================================
   PIANO 4 - COMPUTER
===================================================== */


.computer-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.computer-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.computer-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}



.computer-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}



.computer-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO
===================================================== */


.computer-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 4
===================================================== */


.computer-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

}



.computer-floor i {

    color: #FFD43B;

}
.computer-floor:hover {
    color: #FFD43B;
}



/* =====================================================
   CITAZIONE
===================================================== */


.computer-quote-box {

    width: 95%;

    margin: 35px auto 0;

    padding: 25px 30px;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr);

    gap: 25px;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}



.computer-quote-icon {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFD43B;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;

    font-weight: 700;

    line-height: 1;

}



.computer-quote-text {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 600;

    line-height: 1.6;

    color: #2E4057;

}



/* =====================================================
   CONTENUTO
===================================================== */


.computer-content {

    width: 95%;

    margin: 35px auto 0;

}



/* TESTI NORMALI */


.computer-text {

    max-width: 1150px;

}



.computer-text p,
.computer-generation-normal p,
.computer-generation-text p,
.computer-timeline-content p {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



.computer-text p {

    margin-bottom: 30px;

}



.computer-content strong {

    font-weight: 700;

}



/* =====================================================
   TIMELINE
===================================================== */


.computer-timeline {

    width: 85%;

    margin: 45px auto;

}



.computer-timeline-event {

    position: relative;

    display: grid;

    grid-template-columns:
        170px
        minmax(0, 1fr);

    gap: 45px;

    padding: 0 0 45px;

}


/* LINEA GIALLA */

.computer-timeline-event::before {

    content: "";

    position: absolute;

    left: 125px;

    top: 18px;

    bottom: -5px;

    width: 2px;

    background: #FFD43B;

}


/* PALLINO GIALLO */

.computer-timeline-event::after {

    content: "";

    position: absolute;

    left: 117px;

    top: 8px;

    width: 14px;

    height: 14px;

    border: 3px solid #FFD43B;

    border-radius: 50%;

    background: #FFFCEB;

}


/* DATA */

.computer-timeline-date {

    padding-right: 65px;

    text-align: right;

    font-family: "Montserrat", sans-serif;

    font-size: 30px;

    font-weight: 700;

    line-height: 1.1;

    color: #2E4057;

}



/* =====================================================
   PRIMA GENERAZIONE
   TESTO NORMALE SENZA DATA GRANDE
===================================================== */


.computer-generation-normal {

    width: 100%;

    margin: 10px 0 30px;

    padding: 25px 0;

    border-top: 1px solid rgba(46, 64, 87, .15);

    border-bottom: 1px solid rgba(46, 64, 87, .15);

}



/* =====================================================
   GENERAZIONI CON DATA
===================================================== */


.computer-generation-row {

    display: grid;

    grid-template-columns:
        140px
        minmax(0, 1fr);

    gap: 35px;

    align-items: start;

    padding: 28px 0;

    border-bottom: 1px solid rgba(46, 64, 87, .15);

}



.computer-generation-date {

    font-family: "Montserrat", sans-serif;

    font-size: 38px;

    font-weight: 700;

    line-height: 1;

    color: #2E4057;

}



/* LINEA GIALLA SOLO PER QUESTI EVENTI */


.computer-generation-text {

    padding-left: 25px;

    border-left: 3px solid #FFD43B;

}



/* =====================================================
   TESTO FINALE
===================================================== */


.computer-final-text {

    margin-top: 35px;

}



/* =====================================================
   GALLERIA
===================================================== */


.computer-gallery {

    width: 82%;

    margin: 35px auto 0;

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 35px;

}



.computer-image img {

    width: 100%;

    height: auto;

    display: block;

    padding: 6px;

    border: 2px solid #FFD43B;

    border-radius: 12px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 750px) {


    .computer-page {

        padding-top: 135px;

    }


    .computer-container {

        width: 88%;

    }


    .computer-hero-content {

        padding: 35px 25px;

    }


    .computer-hero-text h1 {

        font-size: 24px;

    }


    .computer-quote-box {

        width: 100%;

        grid-template-columns: 1fr;

        padding: 25px;

    }


    .computer-quote-text {

        font-size: 20px;

    }


    .computer-content {

        width: 100%;

    }


    .computer-text p,
    .computer-generation-normal p,
    .computer-generation-text p,
    .computer-timeline-content p {

        font-size: 16px;

    }


    .computer-timeline {

        width: 100%;

    }


    .computer-timeline-event {

        grid-template-columns: 1fr;

        gap: 15px;

        padding-left: 28px;

    }


    .computer-timeline-event::before {

        left: 5px;

    }


    .computer-timeline-event::after {

        left: -3px;

    }


    .computer-timeline-date {

        padding: 0;

        text-align: left;

        font-size: 26px;

    }


    .computer-generation-row {

        grid-template-columns: 1fr;

        gap: 15px;

    }


    .computer-generation-text {

        padding-left: 18px;

    }


    .computer-generation-date {

        font-size: 30px;

    }


    .computer-gallery {

        width: 100%;

        grid-template-columns: 1fr;

    }

}
/* =====================================================
   PIANO 4 - FRATTALI
===================================================== */


.fractal-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.fractal-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}
.fractal-hero {

    position: relative;

}
.fractal-hero-content {

    position: relative;

    z-index: 2;

}
.fractal-hero-decoration {

    position: absolute;

    right: 20px;
    top: 50%;

    transform: translateY(-50%);

    width: 48%;
    height: 100%;

    display: flex;

    align-items: center;
    justify-content: flex-end;

    overflow: hidden;

    pointer-events: none;

}


.fractal-hero-decoration img {

    width: 100%;
    height: 100%;

    object-fit: contain;
    object-position: right center;

    display: block;

}
.fractal-hero-text {

    position: relative;

    z-index: 3;

    max-width: 48%;

}



/* =====================================================
   BANNER
===================================================== */


.fractal-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}



.fractal-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}



.fractal-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO
===================================================== */


.fractal-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 4
===================================================== */


.fractal-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}



.fractal-floor i {

    color: #FFD43B;

}



.fractal-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CITAZIONE
===================================================== */


.fractal-quote-box {

    width: 95%;

    margin: 35px auto 0;

    padding: 25px 30px;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr);

    gap: 25px;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}



.fractal-quote-icon {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFD43B;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;

    font-weight: 700;

    line-height: 1;

}



.fractal-quote-main {

    width: 100%;

}



.fractal-quote-text {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 600;

    line-height: 1.6;

    color: #2E4057;

}



.fractal-quote-author {

    margin: 10px 0 0;

    text-align: right;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;

    font-weight: 400;

    line-height: 1.5;

    font-style: italic;

    color: #2E4057;

}



/* =====================================================
   CONTENUTO
===================================================== */


.fractal-content {

    width: 95%;

    margin: 35px auto 0;

}



/* =====================================================
   TESTO
===================================================== */


.fractal-text {

    max-width: 1150px;

}



.fractal-text p {

    margin: 0 0 30px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



.fractal-text strong {

    font-weight: 700;

}



/* =====================================================
   GALLERIA
===================================================== */


.fractal-gallery {

    width: 82%;

    margin: 40px auto 0;

    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 45px;

    align-items: stretch;

}



/* =====================================================
   IMMAGINI
===================================================== */


.fractal-image {

    width: 100%;

    aspect-ratio: 4 / 3;

    overflow: hidden;

    border: 2px solid #FFD43B;

    border-radius: 18px;

    background: #FFFCEB;

}



.fractal-image img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: contain;

    border-radius: 16px;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 750px) {


    .fractal-page {

        padding-top: 135px;

    }


    .fractal-container {

        width: 88%;

    }


    .fractal-hero-content {

        padding: 35px 25px;

    }


    .fractal-hero-text h1 {

        font-size: 24px;

    }


    .fractal-quote-box {

        width: 100%;

        grid-template-columns: 1fr;

        padding: 25px;

    }


    .fractal-quote-text {

        font-size: 20px;

    }


    .fractal-quote-author {

        text-align: left;

    }


    .fractal-content {

        width: 100%;

    }


    .fractal-text p {

        font-size: 16px;

    }


    .fractal-gallery {

        width: 100%;

        grid-template-columns: 1fr;

        gap: 25px;

    }
    .fractal-hero-decoration {
    display: none;
}

.fractal-hero-text {
    max-width: 100%;
}

}
/* =====================================================
   PIANO 4 - LO ZERO
===================================================== */


.zero-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}


.zero-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.zero-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}


.zero-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}


.zero-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO
===================================================== */


.zero-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 4
===================================================== */


.zero-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}


.zero-floor i {

    color: #FFD43B;

}


.zero-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CITAZIONE
===================================================== */


.zero-quote-box {

    width: 95%;

    margin: 35px auto 0;

    padding: 25px 30px;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr);

    gap: 25px;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}


.zero-quote-icon {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFD43B;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;

    font-weight: 700;

    line-height: 1;

}


.zero-quote-main {

    width: 100%;

}


.zero-quote-text {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 600;

    line-height: 1.6;

    color: #2E4057;

}


.zero-quote-author {

    margin: 10px 0 0;

    text-align: right;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;

    font-weight: 400;

    line-height: 1.5;

    font-style: italic;

    color: #2E4057;

}



/* =====================================================
   CONTENUTO
===================================================== */


.zero-content {

    width: 95%;

    margin: 45px auto 0;

}



/* =====================================================
   TIMELINE + BOX LATERALE
===================================================== */


.zero-main-grid {

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        320px;

    gap: 55px;

    align-items: start;

}



/* =====================================================
   TIMELINE
===================================================== */


.zero-timeline {

    position: relative;

}



/* LINEA CENTRALE */


.zero-timeline::before {
    content: "";

    position: absolute;

    left: 14px;

    top: 10px;
    bottom: 15px;

    width: 2px;

    background: #FFD43B;
}


/* EVENTO */


.zero-event {
    position: relative;

    display: grid;

    grid-template-columns: 30px minmax(0, 1fr);

    gap: 22px;

    align-items: start;

    margin-bottom: 38px;
}


.zero-event:last-child {

    margin-bottom: 0;

}



/* NUMERO */


.zero-event-number {

    font-family: "Montserrat", sans-serif;

    font-size: 30px;

    font-weight: 700;

    line-height: 1;

    color: #2E4057;

    text-align: right;

}



/* PICCOLA LINEA SOTTO NUMERO */


.zero-event-number::after {

    content: "";

    display: block;

    width: 32px;

    height: 2px;

    margin: 10px 0 0 auto;

    background: #FFD43B;

}



/* PALLINO */


.zero-event-marker {

    position: relative;

    z-index: 2;

    width: 14px;

    height: 14px;

    margin: 7px auto 0;

    border: 2px solid #FFD43B;

    border-radius: 50%;

    background: #FFFCEB;

}



/* TESTO */


.zero-event-text p {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



/* =====================================================
   BOX LATERALE
===================================================== */


.zero-side-card {

    padding: 32px 35px;

    border: 1px solid rgba(46, 64, 87, .12);

    border-radius: 18px;

}



/* ZERO GRANDE */


.zero-side-symbol {

    font-family: "Montserrat", sans-serif;

    font-size: 72px;

    font-weight: 400;

    line-height: 1;

    color: #2E4057;

    margin-bottom: 30px;

}



/* TITOLO BOX */


.zero-side-card h2 {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 700;

    line-height: 1.45;

    color: #2E4057;

}



/* LINEA */


.zero-side-line {

    width: 55px;

    height: 3px;

    margin: 22px 0;

    background: #FFD43B;

}



/* TESTO BOX */


.zero-side-card p {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.7;

    color: #2E4057;

}



/* =====================================================
   IMMAGINE
===================================================== */


.zero-image {

    width: 75%;

    margin: 45px auto 0;

    overflow: hidden;

    border: 2px solid #FFD43B;

    border-radius: 18px;

}


.zero-image img {

    width: 100%;

    height: auto;

    display: block;

    object-fit: contain;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 950px) {


    .zero-main-grid {

        grid-template-columns: 1fr;

    }


    .zero-side-card {

        width: min(500px, 100%);

    }

}



@media screen and (max-width: 750px) {


    .zero-page {

        padding-top: 135px;

    }


    .zero-container {

        width: 88%;

    }


    .zero-hero-content {

        padding: 35px 25px;

    }


    .zero-hero-text h1 {

        font-size: 24px;

    }


    .zero-quote-box {

        width: 100%;

        grid-template-columns: 1fr;

        padding: 25px;

    }


    .zero-quote-text {

        font-size: 20px;

    }


    .zero-quote-author {

        text-align: left;

    }


    .zero-content {

        width: 100%;

    }

.zero-timeline::before {
    content: "";

    position: absolute;

    left: 14px;

    top: 10px;
    bottom: 15px;

    width: 2px;

    background: #FFD43B;
}


    .zero-event {

        grid-template-columns: 35px 1fr;

        gap: 18px;

    }


    .zero-event-number {

        grid-column: 2;

        text-align: left;

        font-size: 26px;

    }


    .zero-event-number::after {

        margin-left: 0;

    }


.zero-event-marker {
    position: relative;

    z-index: 2;

    width: 14px;
    height: 14px;

    margin: 7px auto 0;

    border: 2px solid #FFD43B;
    border-radius: 50%;

    background: #FFFCEB;
}


    .zero-event-text {

        grid-column: 2;

    }


    .zero-event-text p,
    .zero-side-card p {

        font-size: 16px;

    }


    .zero-image {

        width: 100%;

    }

}
/* =====================================================
   PIANO 4 - INFINITO
===================================================== */


.infinity-page {

    width: 100%;

    padding: 155px 0 90px;

    background: #FFFCEB;

    color: #2E4057;

}



.infinity-container {

    width: 92%;

    max-width: 1380px;

    margin: 0 auto;

}



/* =====================================================
   BANNER
===================================================== */


.infinity-hero {

    width: 100%;

    min-height: 205px;

    display: flex;

    align-items: center;

    background: #2E4057;

    border-radius: 14px;

    overflow: hidden;

}



.infinity-hero-content {

    width: 100%;

    display: flex;

    align-items: center;

    gap: 28px;

    padding: 45px 50px;

}



.infinity-hero-line {

    width: 4px;

    height: 120px;

    flex-shrink: 0;

    background: #FFD43B;

}



/* =====================================================
   TITOLO
===================================================== */


.infinity-hero-text h1 {

    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;

    font-weight: 700;

    line-height: 1.2;

    color: #FFFCEB;

}



/* =====================================================
   PIANO 4
===================================================== */


.infinity-floor {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;

}



.infinity-floor i {

    color: #FFD43B;

}



.infinity-floor:hover {

    color: #FFD43B;

}



/* =====================================================
   CITAZIONE
===================================================== */


.infinity-quote-box {

    width: 95%;

    margin: 35px auto 0;

    padding: 25px 30px;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr);

    gap: 25px;

    align-items: center;

    border: 1px solid rgba(46, 64, 87, .22);

    border-left: 4px solid #FFD43B;

    border-radius: 12px;

}



.infinity-quote-icon {

    width: 70px;

    height: 70px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #2E4057;

    color: #FFD43B;

    font-family: "Cormorant Garamond", serif;

    font-size: 58px;

    font-weight: 700;

    line-height: 1;

}



.infinity-quote-main {

    width: 100%;

}



.infinity-quote-text {

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 22px;

    font-weight: 600;

    line-height: 1.6;

    color: #2E4057;

}



.infinity-quote-author {

    margin: 10px 0 0;

    text-align: right;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;

    font-weight: 400;

    line-height: 1.5;

    font-style: italic;

    color: #2E4057;

}



/* =====================================================
   CONTENUTO
===================================================== */


.infinity-content {

    width: 95%;

    margin: 45px auto 0;

}



/* =====================================================
   ICONA ∞ + LINEA + TESTO
===================================================== */


.infinity-story {

    width: 100%;

    display: grid;

    grid-template-columns:
        90px
        minmax(0, 1fr);

    gap: 35px;

    align-items: stretch;

}



/* COLONNA A SINISTRA */


.infinity-symbol-column {

    display: flex;

    flex-direction: column;

    align-items: center;

}



/* CERCHIO INFINITO */


.infinity-symbol {

    position: relative;

    z-index: 2;

    width: 74px;

    height: 74px;

    flex-shrink: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    border: 2px solid #FFD43B;

    border-radius: 50%;

    background: #FFFCEB;

    font-family: "Montserrat", sans-serif;

    font-size: 38px;

    font-weight: 500;

    color: #2E4057;

}



/* LINEA CHE ACCOMPAGNA TUTTO IL TESTO */


.infinity-symbol-line {

    width: 2px;

    flex: 1;

    min-height: 100%;

    margin-top: 10px;

    background: #FFD43B;

}



/* =====================================================
   TESTI
===================================================== */


.infinity-text {

    max-width: 1150px;

}



.infinity-text p {

    margin: 0 0 38px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;

    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;

}



.infinity-text p:last-child {

    margin-bottom: 0;

}



.infinity-text strong {

    font-weight: 700;

}



/* =====================================================
   IMMAGINE
===================================================== */


.infinity-image {

    width: 75%;

    margin: 45px auto 0;

    overflow: hidden;

    border: 2px solid #FFD43B;

    border-radius: 18px;

}



.infinity-image img {

    width: 100%;

    height: auto;

    display: block;

    object-fit: contain;

}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 750px) {


    .infinity-page {

        padding-top: 135px;

    }


    .infinity-container {

        width: 88%;

    }


    .infinity-hero-content {

        padding: 35px 25px;

    }


    .infinity-hero-text h1 {

        font-size: 24px;

    }


    .infinity-quote-box {

        width: 100%;

        grid-template-columns: 1fr;

        padding: 25px;

    }


    .infinity-quote-text {

        font-size: 20px;

    }


    .infinity-quote-author {

        text-align: left;

    }


    .infinity-content {

        width: 100%;

    }


    .infinity-story {

        grid-template-columns:
            55px
            minmax(0, 1fr);

        gap: 20px;

    }


    .infinity-symbol {

        width: 52px;

        height: 52px;

        font-size: 28px;

    }


    .infinity-text p {

        font-size: 16px;

        margin-bottom: 30px;

    }


    .infinity-image {

        width: 100%;

    }

}
/* =========================================
   BANNER INFINITO - IMMAGINE DECORATIVA
========================================= */

.infinity-hero-content {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    padding: 45px 50px;
}


.infinity-hero-left {
    display: flex;
    align-items: center;
    gap: 28px;

    position: relative;
    z-index: 2;
}


/* IMMAGINE A DESTRA */

.infinity-hero-decoration {
    width: 34%;
    max-width: 390px;
    height: 150px;

    object-fit: contain;
    object-position: center right;

    display: block;

    opacity: 0.55;

    flex-shrink: 0;
}
/* =====================================================
   PIANO 4 - L'ALBERO DELLA MATEMATICA
===================================================== */


.tree-page {
    width: 100%;
    padding: 155px 0 90px;

    background: #FFFCEB;
    color: #2E4057;
}


.tree-container {
    width: 92%;
    max-width: 1380px;

    margin: 0 auto;
}



/* =====================================================
   BANNER
===================================================== */


.tree-hero {
    width: 100%;
    min-height: 205px;

    display: flex;
    align-items: center;

    background: #2E4057;

    border-radius: 14px;
    overflow: hidden;
}


.tree-hero-content {
    width: 100%;

    display: flex;
    align-items: center;

    padding: 45px 50px;
}


.tree-hero-line {
    width: 4px;
    height: 120px;

    flex-shrink: 0;

    margin-right: 28px;

    background: #FFD43B;
}



/* =====================================================
   TITOLO
===================================================== */


.tree-hero-text h1 {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;

    font-size: 32px;
    font-weight: 700;
    line-height: 1.2;

    color: #FFFCEB;
}



/* =====================================================
   PIANO 4
===================================================== */


.tree-floor {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 500;

    color: #FFFCEB;

    text-decoration: none;

    transition: color .25s ease;
}


.tree-floor i {
    color: #FFD43B;
}


.tree-floor:hover {
    color: #FFD43B;
}



/* =====================================================
   CARD MESSAGGIO FINALE
===================================================== */


.tree-message {
    width: 90%;

    margin: 40px auto 0;

    padding: 40px 45px;

    display: grid;

    grid-template-columns:
        70px
        minmax(0, 1fr);

    gap: 30px;

    align-items: start;

    border: 1px solid rgba(46, 64, 87, .18);
    border-left: 4px solid #FFD43B;

    border-radius: 18px;

    background: rgba(255, 255, 255, .18);
}



/* =====================================================
   VIRGOLETTE
===================================================== */


.tree-quote-symbol {
    font-family: "Cormorant Garamond", serif;

    font-size: 82px;
    font-weight: 700;
    line-height: .8;

    color: #FFD43B;
}



/* =====================================================
   TESTO
===================================================== */


.tree-message-content {
    width: 100%;
}


.tree-message-content p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 400;
    line-height: 1.75;

    color: #2E4057;
}


.tree-message-content strong {
    font-weight: 700;
}



/* =====================================================
   PICCOLE LINEE GIALLE
===================================================== */


.tree-small-line {
    width: 55px;
    height: 2px;

    margin: 26px 0;

    background: #FFD43B;
}



/* =====================================================
   CITAZIONE BERTRAND RUSSELL
===================================================== */


.tree-russell {
    max-width: 760px;

    margin: 12px 0 0;
    padding: 0 0 0 22px;

    border-left: 2px solid #FFD43B;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 600;
    font-style: italic;

    line-height: 1.65;

    color: #2E4057;
}



/* =====================================================
   FONDATORE
===================================================== */


.tree-founder {
    width: fit-content;

    margin: 28px 0 0 auto;

    display: flex;
    flex-direction: column;

    align-items: flex-start;

    font-family: "Montserrat", sans-serif;

    color: #2E4057;
}


.tree-founder span {
    font-size: 15px;
    font-weight: 400;
}


.tree-founder strong {
    margin-top: 4px;

    font-size: 18px;
    font-weight: 600;

    font-style: italic;
}



/* =====================================================
   IMMAGINE FINALE
===================================================== */


.tree-image {
    width: 72%;
    max-width: 950px;

    margin: 35px auto 0;

    overflow: hidden;

    border: 2px solid #FFD43B;
    border-radius: 18px;
}


.tree-image img {
    width: 100%;
    height: auto;

    display: block;

    object-fit: contain;
}



/* =====================================================
   RESPONSIVE
===================================================== */


@media screen and (max-width: 750px) {

    .tree-page {
        padding-top: 135px;
    }


    .tree-container {
        width: 88%;
    }


    .tree-hero-content {
        padding: 35px 25px;
    }


    .tree-hero-line {
        height: 95px;
        margin-right: 20px;
    }


    .tree-hero-text h1 {
        font-size: 24px;
    }


    .tree-message {
        width: 100%;

        grid-template-columns: 1fr;

        gap: 10px;

        padding: 30px 25px;
    }


    .tree-quote-symbol {
        font-size: 65px;
    }


    .tree-message-content p,
    .tree-russell {
        font-size: 16px;
    }


    .tree-founder {
        margin-top: 30px;
    }


    .tree-image {
        width: 100%;
    }

}
.new-news-card {
    animation: newsAppear 0.6s ease forwards;
}

@keyframes newsAppear {

    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}
.article-page {
    background: #FFFCEB;
    color: #2E4057;
}


/* ========================
   TESTATA
======================== */

.article-hero {
    max-width: 1180px;
    margin: 0 auto;

    /* lascia spazio all'header fisso */
    padding: 190px 60px 65px;

    position: relative;
}

.back-news {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #DFAE00;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}

.back-news:hover {
    color: #2E4057;
    transform: translateX(-4px);
}

.article-title-wrapper {
    position: relative;
    max-width: 880px;
}

.article-category {
    display: inline-block;

    margin-bottom: 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;

    color: #DFAE00;
}

.article-hero h1 {
    max-width: 880px;
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: clamp(48px, 5.7vw, 78px);
    line-height: .98;
    font-weight: 800;
    letter-spacing: -2.5px;

    color: #2E4057;
}

.article-hero h1 span {
    display: inline-block;

    position: relative;

    padding: 3px 12px 6px;

    background: #FFD43B;
    color: #2E4057;

  
}

.article-hero h1 strong {
    display: inline-block;

    font-weight: 800;
    color: #2E4057;

    position: relative;
}

.article-hero h1 strong::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: -8px;

    width: 65%;
    height: 4px;

    background: #FFD43B;
}

.article-title-line {
    width: 60px;
    height: 3px;

    margin: 28px 0;

    background: #FFD43B;
}

.article-intro {
    max-width: 980px;

    margin-top: 55px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #2E4057;
}


/* ========================
   GALLERIA
======================== */

.article-gallery {
    max-width: 1180px;

    margin: 0 auto;
    padding: 0 60px 70px;
}

.article-gallery img {
    display: block;
    width: 100%;

    object-fit: cover;

    border: 3px solid #FFD43B;
}

.gallery-large {
    aspect-ratio: 16 / 7;
}

.gallery-two {
    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 14px;
    margin: 14px 0;
}

.gallery-two img {
    aspect-ratio: 4 / 3;
}


/* ========================
   ZONA BLU
======================== */

.article-media {
    position: relative;

    background: #2E4057;

    padding: 75px 0 90px;

    overflow: hidden;
}

.article-media-container {
    max-width: 1180px;

    margin: 0 auto;
    padding: 0 60px;
}

.media-heading h2,
.youtube-title h2 {
    margin: 0 0 35px;

    color: #FFFCEB;

    font-family: "Montserrat", sans-serif;
    font-size: 38px;
    line-height: 1.1;
}


/* ========================
   ARTICOLI
======================== */

.press-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);

    gap: 24px;
}

.press-card {
    background: #FFFCEB;

    padding: 32px;

    border-radius: 18px;
}

.press-source {
    display: block;

    margin-bottom: 25px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    color: #2E4057;
}

.press-card h3 {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 22px;
    line-height: 1.25;

    color: #2E4057;
}

.press-card p {
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    line-height: 1.55;

    color: #2E4057;
}

.press-card a {
    display: inline-block;

    margin-top: 15px;

    font-family: "Montserrat", sans-serif;
    font-weight: 600;

    color: #E7A900;
    text-decoration: none;
}


/* ========================
   YOUTUBE
======================== */

.youtube-section {
    display: grid;
    grid-template-columns: 300px 1fr;

    gap: 60px;
    align-items: center;

    margin-top: 75px;
}

.youtube-video {
    overflow: hidden;

    border: 3px solid #FFD43B;
    border-radius: 24px;
}

.youtube-preview {
    position: relative;

    display: block;
    width: 100%;

    overflow: hidden;
}

.youtube-preview img {
    display: block;

    width: 100%;
    aspect-ratio: 16 / 9;

    object-fit: cover;

    transition: transform 0.4s ease;
}


/* PULSANTE PLAY */

.youtube-play {
    position: absolute;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    width: 78px;
    height: 55px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding-left: 4px;

    background: #FFD43B;
    color: #2E4057;

    border-radius: 14px;

    font-size: 25px;

    transition:
        transform 0.3s ease,
        background 0.3s ease;
}


/* EFFETTO QUANDO PASSI SOPRA */

.youtube-preview:hover img {
    transform: scale(1.03);
}

.youtube-preview:hover .youtube-play {
    transform: translate(-50%, -50%) scale(1.1);
    background: #FFFCEB;
}
.youtube-video iframe {
    display: block;

    width: 100%;
    aspect-ratio: 16 / 9;

    border: 0;
}


/* ========================
   MOBILE
======================== */

@media (max-width: 800px) {

    .article-hero,
    .article-gallery,
    .article-media-container {
        padding-left: 25px;
        padding-right: 25px;
    }

    .gallery-two,
    .press-grid,
    .youtube-section {
        grid-template-columns: 1fr;
    }

    .youtube-section {
        gap: 20px;
    }

}

/* =========================================
   LEONARDO — IMPOSTAZIONE EDITORIALE
   Mantiene tipografia e palette del sito.
========================================= */

.leonardo-page .article-title-wrapper {
    max-width: 960px;
}

.leonardo-page .article-hero h1 {
    max-width: 960px;
}

.leonardo-intro {
    width: 100%;
    max-width: 820px;
    margin-top: 48px;
    padding-left: 28px;
    border-left: 3px solid #FFD43B;
}

.leonardo-intro p {
    margin: 0;
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;
    color: #2E4057;
}

.leonardo-intro .leonardo-lead {
    margin-bottom: 18px;
    font-size: 21px;
    line-height: 1.6;
}

.leonardo-page .leonardo-story {
    max-width: 980px;
    margin-top: 78px;
    border-top: 1px solid rgba(46, 64, 87, .18);
}

.leonardo-page .story-section {
    display: grid;
    grid-template-columns: 270px minmax(0, 1fr);
    gap: 55px;
    padding: 55px 0;
    border-bottom: 1px solid rgba(46, 64, 87, .18);
}

.leonardo-page .story-heading {
    position: relative;
}

.leonardo-page .story-number {
    display: block;
    margin-bottom: 14px;
    padding: 0;
    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 2px;
    color: #DFAE00;
}

.leonardo-page .story-heading h2 {
    margin: 0;
    font-family: "Montserrat", sans-serif;
    font-size: 29px;
    line-height: 1.15;
    color: #2E4057;
}

.leonardo-page .story-content p {
    margin: 0 0 26px;
    font-size: 17px;
    line-height: 1.8;
}

.leonardo-page .story-emphasis {
    margin: 34px 0 0;
    padding: 28px 0 2px 28px;
    border-top: 1px solid rgba(46, 64, 87, .15);
    border-left: 3px solid #FFD43B;
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.65;
    color: #2E4057;
}

.leonardo-author {
    display: flex;
    justify-content: flex-end;
    align-items: baseline;
    gap: 8px;
    margin-top: 30px;
}

.leonardo-author span {
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #DFAE00;
}

.leonardo-author strong {
    font-weight: 600;
}

.leonardo-article-link {
    margin-top: 52px;
}

@media (max-width: 800px) {
    .leonardo-intro {
        max-width: 100%;
        margin-top: 38px;
        padding-left: 20px;
    }

    .leonardo-intro .leonardo-lead {
        font-size: 19px;
    }

    .leonardo-page .leonardo-story {
        margin-top: 58px;
    }

    .leonardo-page .story-section {
        grid-template-columns: 1fr;
        gap: 24px;
        padding: 42px 0;
    }

    .leonardo-page .story-heading h2 {
        font-size: 25px;
    }

    .leonardo-page .story-emphasis {
        padding-left: 20px;
        font-size: 18px;
    }
}
.press-card-third {
    grid-column: 1 / -1;
    width: calc(50% - 12px);
    justify-self: center;
}
@media (max-width: 800px) {

    .press-card-third {
        grid-column: auto;
        width: 100%;
    }

}
.youtube-video {
    overflow: hidden;
    border: 3px solid #FFD43B;
    border-radius: 24px;
}

.youtube-preview {
    position: relative;
    display: block;
    width: 100%;
}

.youtube-preview img {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

/* PLAY CENTRALE */

.youtube-play {
    position: absolute;
    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    width: 76px;
    height: 54px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding-left: 4px;

    background: #FFD43B;
    color: #2E4057;

    border-radius: 14px;

    font-size: 24px;
    cursor: pointer;
}
/* =========================================
   PAGINA - 5 MUSEI EUROPA
========================================= */


/* UNA SOLA CARD ARTICOLO */

.press-grid-single {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
}

.press-grid-single .press-card {
    width: 100%;
    max-width: 720px;
}


/* =========================================
   DUE VIDEO UNO SOTTO L'ALTRO
========================================= */

.youtube-section-double {
    align-items: start;
}

.youtube-videos-list {
    width: 100%;

    display: flex;
    flex-direction: column;

    gap: 28px;
}


/* =========================================
   ANTEPRIMA VIDEO FISSA
========================================= */

.youtube-video {
    overflow: hidden;

    border: 3px solid #FFD43B;
    border-radius: 24px;
}

.youtube-preview {
    position: relative;

    display: block;
    width: 100%;

    overflow: hidden;

    text-decoration: none;
}

.youtube-preview img {
    display: block;

    width: 100%;

    aspect-ratio: 16 / 9;

    object-fit: cover;

    transition: transform .4s ease;
}

.youtube-preview:hover img {
    transform: scale(1.025);
}


/* =========================================
   PULSANTE PLAY
========================================= */

.youtube-play {
    position: absolute;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    width: 76px;
    height: 54px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding-left: 4px;

    background: #FFD43B;
    color: #2E4057;

    border-radius: 14px;

    font-size: 24px;

    transition:
        transform .3s ease,
        background .3s ease;
}

.youtube-preview:hover .youtube-play {
    transform: translate(-50%, -50%) scale(1.1);

    background: #FFFCEB;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 800px) {

    .press-grid-single .press-card {
        max-width: none;
    }

    .youtube-videos-list {
        gap: 20px;
    }

}
/* SOLO PAGINA 5 MUSEI EUROPA */

.five-museums-page .article-hero h1 span {
    background: transparent;
    color: #2E4057;
    padding: 0;
    transform: none;
}
/* =====================================
   TITOLO - SOLO PAGINA 5 MUSEI
===================================== */

.five-museums-page .article-hero h1 {
    line-height: 1.15;
}

.five-museums-page .article-hero h1 .title-highlight {
    display: inline;

    margin-top: 15px;
    padding: 2px 8px 5px;

    background: linear-gradient(
        transparent 15%,
        #FFD43B 15%,
        #FFD43B 90%,
        transparent 90%
    );

    color: #2E4057;

    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;

    transform: none;
}
.five-museums-page .article-intro {
    max-width: 980px;
    margin-top: 55px;
    line-height: 1.8;
}

/* =========================================
   PAGINA INAUGURAZIONE MUSEO INFORMATICA
   Solo questa pagina
========================================= */


/* NESSUNA EVIDENZIAZIONE NEL TITOLO */

.simple-news-page .article-hero h1 span,
.simple-news-page .article-hero h1 strong {
    background: transparent;
    padding: 0;
    transform: none;
}


/* PIÙ RESPIRO NEL TITOLO */

.simple-news-page .article-hero h1 {
    line-height: 1.12;
}


/* LINEA GIALLA */

.simple-news-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;
    margin-bottom: 0;

    background: #FFD43B;
}


/* =========================================
   TESTO
========================================= */

.simple-news-page .article-text {
    max-width: 980px;

    margin-top: 48px;
}

.simple-news-page .article-text p {
    margin: 0 0 30px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #2E4057;
}

.simple-news-page .article-text p:last-child {
    margin-bottom: 0;
}


/* =========================================
   SPAZIO FINALE
========================================= */

.simple-news-page .article-hero {
    padding-bottom: 110px;
}


/* MOBILE */

@media (max-width: 800px) {

    .simple-news-page .article-text {
        max-width: 100%;
        margin-top: 38px;
    }

    .simple-news-page .article-hero h1 {
        line-height: 1.15;
    }

}
/* =========================================
   PAGINA SENZAZAINO
========================================= */


/* NESSUNA EVIDENZIAZIONE NEL TITOLO */

.senzazaino-page .article-hero h1 span,
.senzazaino-page .article-hero h1 strong {
    background: transparent;
    padding: 0;
    transform: none;
}


/* TITOLO PIÙ ARIOSO */

.senzazaino-page .article-hero h1 {
    line-height: 1.12;
}


/* LINEA GIALLA SOTTO IL TITOLO */

.senzazaino-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;
    margin-bottom: 0;

    background: #FFD43B;
}


/* TESTO */

.senzazaino-page .article-text {
    max-width: 980px;

    margin-top: 48px;
}

.senzazaino-page .article-text p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #2E4057;
}


/* =========================================
   IMMAGINE ARTICOLO
========================================= */

.senzazaino-article-image {
    width: 100%;
    max-width: 980px;

    margin-top: 55px;
}

.senzazaino-article-image img {
    display: block;

    width: 100%;
    height: auto;
}


/* SPAZIO PRIMA DEL FOOTER */

.senzazaino-page .article-hero {
    padding-bottom: 110px;
}


/* MOBILE */

@media (max-width: 800px) {

    .senzazaino-page .article-text,
    .senzazaino-article-image {
        max-width: 100%;
    }

    .senzazaino-page .article-hero h1 {
        line-height: 1.15;
    }

}
/* =========================================
   PAGINA RIBELLE URBANO
========================================= */


/* NESSUNA EVIDENZIAZIONE NEL TITOLO */

.ribelle-urbano-page .article-hero h1 span,
.ribelle-urbano-page .article-hero h1 strong {
    background: transparent;
    padding: 0;
    transform: none;
}


/* TITOLO PIÙ ARIOSO */

.ribelle-urbano-page .article-hero h1 {
    line-height: 1.12;
}


/* LINEA GIALLA */

.ribelle-urbano-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;
    margin-bottom: 0;

    background: #FFD43B;
}


/* =========================================
   TESTO
========================================= */

.ribelle-urbano-page .article-text {
    max-width: 980px;
    margin-top: 48px;
}

.ribelle-urbano-page .article-text p {
    margin: 0 0 30px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #2E4057;
}

.ribelle-urbano-page .article-text p:last-child {
    margin-bottom: 0;
}


/* =========================================
   DUE IMMAGINI
========================================= */

.ribelle-gallery {
    width: 100%;
    max-width: 980px;

    margin-top: 55px;

    display: flex;
    flex-direction: column;

    gap: 22px;
}

.ribelle-gallery img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;
}


/* =========================================
   BOX BLU FINALE
========================================= */

.ribelle-urbano-page .article-media {
    margin-top: 0;
}

.ribelle-youtube-section {
    margin-top: 0;
}


/* MOBILE */

@media (max-width: 800px) {

    .ribelle-urbano-page .article-text,
    .ribelle-gallery {
        max-width: 100%;
    }

    .ribelle-urbano-page .article-hero h1 {
        line-height: 1.15;
    }

}
/* =========================================
   PAGINA TONINO GUERRA
========================================= */


/* NESSUNA EVIDENZIAZIONE NEL TITOLO */

.tonino-guerra-page .article-hero h1 span,
.tonino-guerra-page .article-hero h1 strong {
    background: transparent;
    padding: 0;
    transform: none;
}


/* TITOLO */

.tonino-guerra-page .article-hero h1 {
    line-height: 1.12;
}


/* LINEA GIALLA */

.tonino-guerra-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;
    margin-bottom: 0;

    background: #FFD43B;
}


/* TESTO */

.tonino-guerra-page .article-text {
    max-width: 980px;
    margin-top: 48px;
}

.tonino-guerra-page .article-text p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #2E4057;
}


/* IMMAGINE */

.tonino-guerra-image {
    width: 100%;
    max-width: 980px;

    margin-top: 55px;
}

.tonino-guerra-image img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;
}


/* LINK SOTTO L'IMMAGINE */

.tonino-guerra-link {
    max-width: 980px;

    margin-top: 28px;
}

.tonino-guerra-link a {
    display: inline-flex;
    align-items: center;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    font-weight: 700;

    color: #2E4057;

    text-decoration: underline;
    text-underline-offset: 5px;

    transition:
        color .25s ease,
        transform .25s ease;
}

.tonino-guerra-link a:hover {
    color: #FFD43B;
    transform: translateX(5px);
}


/* SPAZIO PRIMA DEL FOOTER */

.tonino-guerra-page .article-hero {
    padding-bottom: 110px;
}


/* MOBILE */

@media (max-width: 800px) {

    .tonino-guerra-page .article-text,
    .tonino-guerra-image,
    .tonino-guerra-link {
        max-width: 100%;
    }

    .tonino-guerra-page .article-hero h1 {
        line-height: 1.15;
    }

}
/* =========================================
   PAGINA VETRINA CALCOLO MECCANICO URBINO
========================================= */


/* NESSUNA EVIDENZIAZIONE NEL TITOLO */

.urbino-page .article-hero h1 span,
.urbino-page .article-hero h1 strong {
    background: transparent;
    padding: 0;
    transform: none;
}


/* TITOLO */

.urbino-page .article-hero h1 {
    line-height: 1.12;
}


/* LINEA GIALLA */

.urbino-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;
    margin-bottom: 0;

    background: #FFD43B;
}


/* =========================================
   PRIMA IMMAGINE
========================================= */

.urbino-main-image {
    width: 100%;
    max-width: 980px;

    margin-top: 52px;
}

.urbino-main-image img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;
}


/* =========================================
   TESTO
========================================= */

.urbino-page .article-text {
    width: 100%;
    max-width: 980px;

    margin-top: 40px;
}

.urbino-page .article-text p {
    margin: 0 0 24px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #2E4057;
}

.urbino-page .article-text p:last-child {
    margin-bottom: 0;
}


/* =========================================
   SECONDA IMMAGINE
========================================= */

.urbino-secondary-image {
    width: 100%;
    max-width: 980px;

    margin-top: 48px;
}

.urbino-secondary-image img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;
}


/* SPAZIO PRIMA DEL FOOTER */

.urbino-page .article-hero {
    padding-bottom: 110px;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 800px) {

    .urbino-main-image,
    .urbino-secondary-image,
    .urbino-page .article-text {
        max-width: 100%;
    }

    .urbino-page .article-hero h1 {
        line-height: 1.15;
    }

}
/* =========================================
   PAGINA DANTE ALIGHIERI
========================================= */


/* TITOLO */

.dante-page .article-hero h1 {
    line-height: 1.12;
}


/* EVIDENZIAZIONE SOLO SU DANTE ALIGHIERI */

.dante-page .article-hero h1 .title-highlight {
    display: inline;

    padding: 2px 8px 5px;

    background: #FFD43B;
    color: #2E4057;

    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;

    transform: none;
}


/* LINEA GIALLA */

.dante-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;
    margin-bottom: 0;

    background: #FFD43B;
}


/* TESTO */

.dante-page .article-text {
    width: 100%;
    max-width: 980px;

    margin-top: 48px;
}

.dante-page .article-text p {
    margin: 0 0 28px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #2E4057;
}

.dante-page .article-text p:last-child {
    margin-bottom: 0;
}


/* IMMAGINI */

.dante-image {
    width: 100%;
    max-width: 980px;

    margin-top: 45px;
}

.dante-image img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;
}


/* SPAZIO PRIMA DEL FOOTER */

.dante-page .article-hero {
    padding-bottom: 110px;
}


/* MOBILE */

@media (max-width: 800px) {

    .dante-page .article-text,
    .dante-image {
        max-width: 100%;
    }

    .dante-page .article-hero h1 {
        line-height: 1.15;
    }

}
.dante-page .article-text .phone-link,
.dante-page .article-text a[href^="mailto:"] {
    display: inline-block;
    position: relative;
    padding: 0 3px;
    margin-inline: -3px;
    color: #2E4057;
    font: inherit;
    font-weight: inherit;
    text-decoration: none;
    box-shadow: inset 0 -3px 0 #FFD43B;
    transform-origin: center;
    cursor: pointer;
    transition:
        box-shadow .25s ease,
        color .25s ease,
        transform .25s ease;
}

.dante-page .article-text .phone-link:hover,
.dante-page .article-text .phone-link:focus-visible,
.dante-page .article-text a[href^="mailto:"]:hover,
.dante-page .article-text a[href^="mailto:"]:focus-visible {
    color: #2E4057;
    box-shadow: inset 0 -1.45em 0 #FFD43B;
    transform: scale(1.05);
}
/* =========================================
   PAGINA GAUSSIANA BIVARIATA
========================================= */


/* TITOLO */

.gaussiana-page .article-hero h1 {
    line-height: 1.12;
}


/* SOLO "LA GAUSSIANA BIVARIATA" IN GIALLO */

.gaussiana-page .article-hero h1 .title-highlight {
    display: inline;

    padding: 2px 8px 5px;

    background: #FFD43B;
    color: #2E4057;

    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;

    transform: none;
}


/* LINEA GIALLA SOTTO IL TITOLO */

.gaussiana-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;

    background: #FFD43B;
}


/* =========================================
   INTRODUZIONE
========================================= */

.gaussiana-page .article-text {
    width: 100%;
    max-width: 980px;

    margin-top: 48px;
}

.gaussiana-page .article-text p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #2E4057;
}


/* =========================================
   CONTENUTO
========================================= */

.gaussiana-content {
    width: 100%;
    max-width: 980px;

    margin-top: 55px;
}


/* TITOLO INTERNO */

.gaussiana-content h2 {
    margin: 0 0 35px;

    font-family: "Montserrat", sans-serif;
    font-size: 28px;
    font-weight: 700;

    color: #2E4057;
}


/* PARAGRAFI */

.gaussiana-content p {
    margin: 0 0 28px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #2E4057;
}


/* =========================================
   FORMULA + GRAFICO
========================================= */

.gaussiana-formula {
    display: grid;

    grid-template-columns: 1.5fr 1fr;

    align-items: center;

    gap: 55px;

    margin: 45px 0;
}


/* FORMULA */

.gaussiana-formula .formula {
    font-family: "Cormorant Garamond", serif;

    font-size: 38px;
    font-weight: 600;

    color: #2E4057;

    text-align: center;
}


/* GRAFICO */

.gaussiana-formula img {
    display: block;

    width: 100%;
    height: auto;
}


/* =========================================
   DUE IMMAGINI FINALI
========================================= */

/* =========================================
   DUE IMMAGINI FINALI
========================================= */

.gaussiana-gallery {
    display: grid;

    grid-template-columns: 1.5fr 0.7fr;

    gap: 35px;

    margin-top: 45px;

    align-items: start;
}


/* ENTRAMBE MANTENGONO LE LORO PROPORZIONI */

.gaussiana-gallery img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: contain;
}


/* PRIMA IMMAGINE: GRAFICO GRANDE */

.gaussiana-gallery img:first-child {
    width: 100%;
}


/* SECONDA IMMAGINE: STRUMENTO PIÙ PICCOLO */

.gaussiana-gallery img:last-child {
    width: 75%;
    max-width: 280px;

    justify-self: center;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 800px) {

    .gaussiana-page .article-text,
    .gaussiana-content {
        max-width: 100%;
    }

    .gaussiana-formula {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .gaussiana-gallery {
        grid-template-columns: 1fr;
    }

    .gaussiana-page .article-hero h1 {
        line-height: 1.15;
    }

}
.gaussiana-page .gaussiana-text-after-images {
    margin-top: 65px;
}
/* =========================================
   PAGINA MARCOPOLO TV
========================================= */


/* NESSUNA EVIDENZIAZIONE NEL TITOLO */

.marcopolo-page .article-hero h1 span,
.marcopolo-page .article-hero h1 strong {
    background: transparent;
    padding: 0;
    transform: none;
}


/* TITOLO */

.marcopolo-page .article-hero h1 {
    line-height: 1.12;
}


/* LINEA GIALLA */

.marcopolo-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;
    margin-bottom: 0;

    background: #FFD43B;
}


/* TESTO */

.marcopolo-page .article-text {
    width: 100%;
    max-width: 980px;

    margin-top: 48px;
}

.marcopolo-page .article-text p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #2E4057;
}


/* PIÙ SPAZIO PRIMA DEL BOX BLU */

.marcopolo-page .article-hero {
    padding-bottom: 90px;
}


/* BOX VIDEO */

.marcopolo-youtube-section {
    margin-top: 0;
}


/* MOBILE */

@media (max-width: 800px) {

    .marcopolo-page .article-text {
        max-width: 100%;
    }

    .marcopolo-page .article-hero h1 {
        line-height: 1.15;
    }

}
/* =========================================
   PAGINA LEONARDO
========================================= */


/* NESSUNA EVIDENZIAZIONE NEL TITOLO */

.leonardo-page .article-hero h1 span,
.leonardo-page .article-hero h1 strong {
    background: transparent;
    padding: 0;
    transform: none;
}


/* TITOLO */

.leonardo-page .article-hero h1 {
    line-height: 1.12;
}


/* LINEA GIALLA */

.leonardo-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;

    background: #FFD43B;
}


/* =========================================
   BOX CITAZIONE
========================================= */

.leonardo-quote {
    position: relative;

    width: 100%;
    max-width: 980px;

    margin-top: 55px;
    padding: 45px 70px;

    background: #FFFCEB;

    border-left: 3px solid #FFD43B;
    border-radius: 18px;

    box-shadow: 0 10px 30px rgba(46, 64, 87, .08);
}

.leonardo-quote p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;

    color: #2E4057;
}

.quote-mark {
    position: absolute;

    font-family: "Cormorant Garamond", serif;
    font-size: 80px;
    line-height: 1;

    color: #FFD43B;
}

.quote-mark-left {
    top: 20px;
    left: 25px;
}

.quote-mark-right {
    right: 25px;
    bottom: -5px;
}


/* =========================================
   TESTO
========================================= */

/* =========================================
   TESTO LEONARDO - NUOVA IMPAGINAZIONE
========================================= */

.leonardo-page .leonardo-story {
    width: 100%;
    max-width: 980px;
    margin-top: 70px;
}


/* SINGOLO BLOCCO */

.leonardo-page .story-block {
    position: relative;

    display: grid;
    grid-template-columns: 90px 1fr;

    gap: 35px;

    padding: 45px 0;

    border-top: 1px solid rgba(46, 64, 87, .18);
}


/* NUMERO GRANDE */

.leonardo-page .story-number {
    font-family: "Montserrat", sans-serif;

    font-size: 48px;
    font-weight: 700;
    line-height: 1;

    color: rgba(46, 64, 87, .16);

    padding-top: 5px;
}


/* TESTO */

.leonardo-page .story-content p {
    margin: 0 0 28px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.85;

    color: #2E4057;
}

.leonardo-page .story-content p:last-child {
    margin-bottom: 0;
}


/* BLOCCO CENTRALE EVIDENZIATO */

.leonardo-page .story-block-featured {
    margin: 15px 0;

    padding: 45px 40px;

    border-top: none;
    border-left: 3px solid #FFD43B;

    border-radius: 0 18px 18px 0;

    background: rgba(46, 64, 87, .035);
}


/* FRASE IMPORTANTE */

.leonardo-page .story-emphasis {
    margin-top: 35px !important;

    padding-top: 28px;

    border-top: 1px solid rgba(46, 64, 87, .15);

    font-weight: 600;
}


/* ULTIMO BLOCCO */

.leonardo-page .story-block:last-child {
    border-bottom: 1px solid rgba(46, 64, 87, .18);
}


/* =========================================
   AUTORE
========================================= */

.leonardo-author {
    width: 100%;
    max-width: 980px;

    margin-top: 35px;

    text-align: right;

    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 500;

    color: #2E4057;
}


/* =========================================
   LINK ARTICOLO
========================================= */

.leonardo-article-link {
    width: 100%;
    max-width: 980px;

    margin-top: 40px;
}

.leonardo-article-link a {
    display: inline-flex;
    align-items: center;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 700;

    color: #2E4057;

    text-decoration: underline;
    text-underline-offset: 5px;

    transition:
        color .25s ease,
        transform .25s ease;
}

.leonardo-article-link a:hover {
    color: #FFD43B;
    transform: translateX(5px);
}


/* SPAZIO PRIMA DEL FOOTER */

.leonardo-page .article-hero {
    padding-bottom: 110px;
}


/* MOBILE */

@media (max-width: 800px) {

    .leonardo-quote,
   .leonardo-page .leonardo-story,
    .leonardo-author,
    .leonardo-article-link {
        max-width: 100%;
    }

    .leonardo-quote {
        padding: 40px 35px;
    }

    .leonardo-page .article-hero h1 {
        line-height: 1.15;
    }
    .leonardo-page .story-block {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 35px 0;
}

.leonardo-page .story-number {
    font-size: 35px;
}

.leonardo-page .story-block-featured {
    padding: 35px 25px;
}

}

/* Correzioni di cascata per la nuova struttura editoriale di Leonardo */
body .leonardo-page .story-number {
    padding: 0;
    font-size: 18px;
    color: #DFAE00;
}

body .leonardo-page .story-emphasis {
    margin: 34px 0 0 !important;
    padding: 28px 0 2px 28px;
    border-top: 1px solid rgba(46, 64, 87, .15);
    border-left: 3px solid #FFD43B;
    font-size: 20px;
    line-height: 1.65;
}

@media (max-width: 800px) {
    body .leonardo-page .story-emphasis {
        padding-left: 20px;
        font-size: 18px;
    }
}

/* Immagine conclusiva della seconda pagina dedicata a Leonardo */
.leonardo-exhibition-image {
    width: 100%;
    max-width: 760px;
    margin: 65px 0 0;
}

.leonardo-exhibition-image img {
    display: block;
    width: 100%;
    height: auto;
    border: 3px solid #FFD43B;
}

@media (max-width: 800px) {
    .leonardo-exhibition-image {
        max-width: 100%;
        margin-top: 48px;
    }
}

/* La seconda pagina Leonardo ha il ritmo di un articolo continuo */
.leonardo-exhibition-page .leonardo-story {
    max-width: 820px;
    margin-top: 58px;
    border-top: 0;
}

.leonardo-exhibition-page .leonardo-intro .leonardo-lead {
    font-size: 17px;
    line-height: 1.8;
}

.leonardo-exhibition-page .story-section {
    display: block;
    padding: 0;
    border: 0;
}

.leonardo-exhibition-page .story-section + .story-section {
    margin-top: 26px;
}

.leonardo-exhibition-page .story-heading {
    display: none;
}

.leonardo-exhibition-page .story-content p {
    margin-bottom: 26px;
}

.leonardo-exhibition-page .leonardo-exhibition-image {
    margin-top: 34px;
}

.fields-page .fields-portrait {
    max-width: 820px;
    margin-top: 48px;
}

.fields-page .fields-portrait img {
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

/* =========================================
   PAGINA COSMOGONIE
========================================= */

.cosmogonie-page .article-hero {
    padding-bottom: 110px;
}

.cosmogonie-page .article-title-wrapper,
.cosmogonie-page .article-hero h1 {
    max-width: 980px;
}

.cosmogonie-page .article-hero h1 {
    line-height: 1.12;
}

.cosmogonie-card {
    width: 100%;
    max-width: 980px;
    margin-top: 58px;
    padding: 48px 55px 22px;
    border-left: 4px solid #FFD43B;
    border-radius: 0 18px 18px 0;
    background: #FFFCEB;
    box-shadow: 0 12px 32px rgba(46, 64, 87, .10);
}

.cosmogonie-card-heading h2,
.cosmogonie-card-heading h3,
.cosmogonie-card-heading p,
.cosmogonie-description p,
.cosmogonie-details dd {
    font-family: "Montserrat", sans-serif;
    color: #2E4057;
}

.cosmogonie-card-heading h2 {
    margin: 0 0 14px;
    font-size: 34px;
    line-height: 1.1;
}

.cosmogonie-card-heading h3 {
    margin: 32px 0 14px;
    font-size: 21px;
    line-height: 1.3;
}

.cosmogonie-card-heading p,
.cosmogonie-description p {
    margin: 0 0 12px;
    font-size: 17px;
    line-height: 1.8;
}

.cosmogonie-small-line {
    width: 58px;
    height: 3px;
    margin: 34px 0;
    background: #FFD43B;
}

.cosmogonie-description {
    padding-bottom: 24px;
}

.cosmogonie-details {
    margin: 0;
}

.cosmogonie-details > div {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 22px;
    align-items: center;
    padding: 16px 0;
    border-top: 1px solid rgba(46, 64, 87, .16);
}

.cosmogonie-details dt {
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #2E4057;
    color: #FFFCEB;
    font-size: 19px;
}

.cosmogonie-details > div:nth-child(2) dt {
    background: #FFD43B;
    color: #2E4057;
}

.cosmogonie-details dd {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.55;
}

.cosmogonie-poster-link {
    display: inline-flex;
    align-items: center;
    gap: 13px;
    margin-top: 30px;
    padding: 15px 24px;
    border-radius: 999px;
    box-shadow: 0 8px 22px rgba(46, 64, 87, .10);
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #2E4057;
    text-decoration: none;
    transition: transform .25s ease, color .25s ease;
}

.cosmogonie-poster-link i {
    color: #DFAE00;
}

.cosmogonie-poster-link span {
    margin-left: 12px;
}

.cosmogonie-poster-link:hover {
    color: #DFAE00;
    transform: translateY(-2px);
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 800px) {
    .cosmogonie-card {
        margin-top: 42px;
        padding: 35px 25px 14px;
    }

    .cosmogonie-card-heading h2 {
        font-size: 29px;
    }

    .cosmogonie-details > div {
        grid-template-columns: 46px minmax(0, 1fr);
        gap: 16px;
    }

    .cosmogonie-details dd {
        font-size: 16px;
    }
}
/* =========================================
   PAGINA REPORTAGE MATE
========================================= */

.mate-reportage-page .article-hero h1 {
    line-height: 1.12;
}


/* NESSUNA EVIDENZIAZIONE NEL TITOLO */

.mate-reportage-page .article-hero h1 span,
.mate-reportage-page .article-hero h1 strong {
    background: transparent;
    padding: 0;
    transform: none;
}


/* LINEA GIALLA */

.mate-reportage-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;
    margin-bottom: 0;

    background: #FFD43B;
}


/* IMMAGINE */

.mate-reportage-image {
    width: 100%;
    max-width: 1180px;

    margin-top: 55px;
}

.mate-reportage-image img {
    display: block;

    width: 100%;
    height: auto;
}


/* SPAZIO PRIMA DEL FOOTER */

.mate-reportage-page .article-hero {
    padding-bottom: 110px;
}
/* =========================================
   PAGINA VERONA
========================================= */


/* TITOLO */

.verona-page .article-hero h1 {
    line-height: 1.12;
}


/* NESSUNA EVIDENZIAZIONE NEL TITOLO */

.verona-page .article-hero h1 span,
.verona-page .article-hero h1 strong {
    background: transparent;
    padding: 0;
    transform: none;
}


/* LINEA GIALLA SOTTO IL TITOLO */

.verona-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;
    margin-bottom: 0;

    background: #FFD43B;
}


/* =========================================
   BOX CENTRALE
========================================= */

.verona-event-box {
    width: 100%;
    max-width: 1050px;

    margin-top: 55px;

    padding: 55px 65px;

    background: #FFFCEB;

    border-left: 4px solid #FFD43B;
    border-radius: 22px;

    box-shadow: 0 10px 30px rgba(46, 64, 87, .10);
}


/* TITOLO DEL BOX */

.verona-event-box h2 {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 42px;
    font-weight: 800;
    line-height: 1.1;

    color: #2E4057;
}


/* PICCOLA LINEA GIALLA */

.verona-small-line {
    width: 60px;
    height: 4px;

    margin-top: 28px;
    margin-bottom: 35px;

    background: #FFD43B;
}


/* =========================================
   LUOGO
========================================= */

.verona-location {
    margin-bottom: 32px;
}

.verona-location p {
    margin: 0 0 8px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.6;

    color: #2E4057;
}


/* DIVISORE */

.verona-divider {
    width: 100%;
    height: 1px;

    margin: 30px 0 32px;

    background: rgba(46, 64, 87, .18);
}


/* =========================================
   TESTO
========================================= */

.verona-text p {
    margin: 0 0 24px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.85;

    color: #2E4057;
}

.verona-text p:last-child {
    margin-bottom: 0;
}


/* =========================================
   BOTTONE PROGRAMMA
========================================= */

.verona-program {
    width: 100%;
    max-width: 1050px;

    margin-top: 40px;
}

.verona-program a {
    display: inline-flex;
    align-items: center;

    gap: 18px;

    padding: 16px 28px;

    background: #FFD43B;
    color: #2E4057;

    border-radius: 999px;

    text-decoration: none;

    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 700;

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.verona-program a:hover {
    transform: translateY(-3px);

    box-shadow: 0 10px 20px rgba(46, 64, 87, .15);
}


/* ICONA */

.verona-program-icon {
    font-size: 21px;
    line-height: 1;
}


/* FRECCIA */

.verona-program-arrow {
    display: inline-block;

    font-size: 24px;
    line-height: 1;

    transition: transform .3s ease;
}

.verona-program a:hover .verona-program-arrow {
    transform: translateX(5px);
}


/* SPAZIO PRIMA DEL FOOTER */

.verona-page .article-hero {
    padding-bottom: 110px;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 800px) {

    .verona-event-box,
    .verona-program {
        max-width: 100%;
    }

    .verona-event-box {
        padding: 38px 28px;
    }

    .verona-event-box h2 {
        font-size: 32px;
    }

    .verona-page .article-hero h1 {
        line-height: 1.15;
    }

    .verona-program a {
        font-size: 17px;
        padding: 14px 22px;
    }

}
/* =========================================
   NOTTE DEI MUSEI
========================================= */
.notte-musei-page .article-hero {
    width: 100%;
    max-width: 1100px;

    margin: 0 auto;

    /* spazio necessario per l'header fisso */
    padding-top: 175px;
    padding-bottom: 120px;
}


/* TORNA ALLE NOTIZIE */

.notte-musei-page .back-news {
    display: inline-flex;
    align-items: center;

    margin-bottom: 48px;

    font-family: "Montserrat", sans-serif;

    position: relative;
    z-index: 2;
}


/* CATEGORIA SOPRA IL TITOLO */

.notte-musei-page .article-category {
    display: block;

    margin-bottom: 22px;

    letter-spacing: 2px;
    font-weight: 700;
}


/* =========================================
   TITOLO
========================================= */

.notte-musei-page .article-title-wrapper {
    max-width: 900px;
}

.notte-musei-page .article-title-wrapper h1 {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    line-height: 1.08;
}

/* NESSUNA EVIDENZIAZIONE */

.notte-musei-page .article-title-wrapper h1 strong,
.notte-musei-page .article-title-wrapper h1 span {
    background: none;
    padding: 0;
}


/* LINEA GIALLA */

.notte-musei-page .article-title-line {
    width: 65px;
    height: 4px;

    margin-top: 35px;

    background: #FFD43B;
}


/* =========================================
   TESTO SOTTO IL TITOLO
========================================= */

.notte-musei-page .notte-intro {
    max-width: 850px;

    margin-top: 55px;
}

.notte-musei-page .notte-intro p {
    margin: 0 0 14px;

    font-family: "Montserrat", sans-serif;
    line-height: 1.7;
}

.notte-musei-page .notte-intro p:last-child {
    margin-bottom: 0;
}


/* =========================================
   LOCANDINA
========================================= */

.notte-musei-page .notte-image {
    width: 100%;
    max-width: 950px;

    margin-top: 55px;
}

.notte-musei-page .notte-image img {
    display: block;

    width: 100%;
    height: auto;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 800px) {

    .notte-musei-page .article-hero {
        padding-left: 24px;
        padding-right: 24px;
        padding-top: 45px;
    }

    .notte-musei-page .back-news {
        margin-bottom: 38px;
    }

    .notte-musei-page .article-title-wrapper h1 {
        line-height: 1.12;
    }

    .notte-musei-page .notte-intro {
        margin-top: 40px;
    }

    .notte-musei-page .notte-image {
        margin-top: 40px;
    }

}
/* =========================================
   PAGINA BENEMERENZA RENZO BALDONI
========================================= */


/* =========================================
   TITOLO
========================================= */

.baldoni-page .article-hero h1 {
    line-height: 1.08;
}


/* NESSUNA EVIDENZIAZIONE NEL TITOLO */

.baldoni-page .article-hero h1 span,
.baldoni-page .article-hero h1 strong {
    background: transparent;
    padding: 0;
    transform: none;
}


/* LINEA GIALLA SOTTO IL TITOLO */

.baldoni-page .article-title-line {
    display: block;

    width: 70px;
    height: 4px;

    margin-top: 32px;
    margin-bottom: 0;

    background: #FFD43B;
}


/* =========================================
   INTRODUZIONE
========================================= */

.baldoni-intro {
    width: 100%;
    max-width: 980px;

    margin-top: 48px;
}

.baldoni-intro p {
    margin: 0 0 9px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.65;

    color: #2E4057;
}


/* =========================================
   FOTO + ELENCO
========================================= */

.baldoni-profile {
    width: 100%;
    max-width: 980px;

    margin-top: 32px;

    display: grid;

    grid-template-columns: 230px 1fr;

    gap: 55px;

    align-items: start;
}


/* FOTO PROFILO */

.baldoni-profile-image img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;
}


/* =========================================
   ELENCHI
========================================= */

.baldoni-profile-list ul,
.baldoni-main-list ul,
.baldoni-current ul {
    margin: 0;

    padding-left: 24px;

    font-family: "Montserrat", sans-serif;
    font-size: 16px;

    line-height: 1.75;

    color: #2E4057;
}


.baldoni-profile-list li,
.baldoni-main-list li,
.baldoni-current li {
    padding-left: 7px;

    margin-bottom: 7px;
}


/* =========================================
   SECONDO ELENCO
========================================= */

.baldoni-main-list {
    width: 100%;
    max-width: 980px;

    margin-top: 35px;
}


/* LINK */

.baldoni-main-list a {
    color: #2E4057;

    font-weight: 600;

    text-decoration: underline;
    text-underline-offset: 4px;

    transition: color .25s ease;
}

.baldoni-main-list a:hover {
    color: #FFD43B;
}


/* =========================================
   SEZIONE ATTUALMENTE
========================================= */

.baldoni-current {
    width: 100%;
    max-width: 980px;

    margin-top: 55px;
}


/* INTESTAZIONE */

.baldoni-current-heading {
    width: 100%;

    display: grid;

    grid-template-columns:
        auto
        auto
        1fr;

    align-items: center;

    gap: 14px;

    margin-bottom: 28px;

    font-family: "Montserrat", sans-serif;

    color: #2E4057;
}


/* CERCHIO */

.baldoni-current-icon {
    width: 25px;
    height: 25px;

    display: flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    border-radius: 50%;

    background: #FFD43B;
    color: #2E4057;

    font-size: 15px;
    font-weight: 700;
}


/* SCRITTA */

.baldoni-current-heading strong {
    font-size: 16px;
    white-space: nowrap;
}


/* LINEA LUNGA */

.baldoni-current-line {
    width: 100%;
    height: 2px;

    background: #FFD43B;
}


/* =========================================
   DUE FOTO
========================================= */

.baldoni-gallery-two {
    width: 100%;
    max-width: 760px;

    margin-top: 60px;

    display: grid;

    grid-template-columns: 1.35fr 1fr;

    gap: 35px;

    align-items: start;
}


.baldoni-gallery-two figure {
    margin: 0;
}


.baldoni-gallery-two img {
    display: block;

    width: 100%;
    height: auto;
}


/* DIDASCALIE */

.baldoni-gallery-two figcaption {
    position: relative;

    margin-top: 12px;
    padding-bottom: 12px;

    text-align: center;

    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-style: italic;

    color: #2E4057;
}


/* PICCOLA LINEA GIALLA */

.baldoni-gallery-two figcaption::after {
    content: "";

    position: absolute;

    left: 50%;
    bottom: 0;

    transform: translateX(-50%);

    width: 45px;
    height: 2px;

    background: #FFD43B;
}


/* =========================================
   FOTO GRANDE FINALE
========================================= */

.baldoni-final-image {
    width: 100%;
    max-width: 760px;

    margin-top: 35px;
}


.baldoni-final-image img {
    display: block;

    width: 100%;
    height: auto;
}


/* =========================================
   SPAZIO PRIMA DEL FOOTER
========================================= */

.baldoni-page .article-hero {
    padding-bottom: 120px;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 800px) {

    .baldoni-profile {
        grid-template-columns: 1fr;

        gap: 30px;
    }


    .baldoni-profile-image {
        max-width: 220px;
    }


    .baldoni-profile-list ul,
    .baldoni-main-list ul,
    .baldoni-current ul {
        font-size: 15px;
    }


    .baldoni-current-heading {
        grid-template-columns:
            auto
            auto;

        justify-content: start;
    }


    .baldoni-current-line {
        grid-column: 1 / -1;

        margin-top: 5px;
    }


    .baldoni-gallery-two {
        grid-template-columns: 1fr;

        max-width: 100%;

        gap: 35px;
    }


    .baldoni-final-image {
        max-width: 100%;
    }

}
/* =========================================
   BALDONI - ALLEGGERIMENTO VISIVO
========================================= */


/* TORNA ALLE NOTIZIE + CATEGORIA */

.baldoni-page .back-news {
    display: block;
    width: fit-content;

    margin-bottom: 28px;
}

.baldoni-page .article-category {
    display: block;

    margin-bottom: 25px;
}


/* =========================================
   INTRODUZIONE
========================================= */

.baldoni-intro {
    margin-top: 55px;
}

.baldoni-intro p {
    line-height: 1.75;
}


/* =========================================
   FOTO + PRIMO ELENCO
========================================= */

.baldoni-profile {
    margin-top: 40px;

    gap: 65px;
}


/* PIÙ SPAZIO TRA I PUNTI */

.baldoni-profile-list li {
    margin-bottom: 14px;
    line-height: 1.7;
}


/* =========================================
   SECONDO ELENCO
========================================= */

.baldoni-main-list {
    margin-top: 55px;
}

.baldoni-main-list li {
    margin-bottom: 13px;
    line-height: 1.7;
}


/* crea più spazio dopo gruppi di informazioni */

.baldoni-main-list li:nth-child(5) {
    margin-bottom: 26px;
}


/* =========================================
   ATTUALMENTE
========================================= */

.baldoni-current {
    margin-top: 70px;
}

.baldoni-current-heading {
    margin-bottom: 35px;
}

.baldoni-current li {
    margin-bottom: 14px;
    line-height: 1.7;
}


/* =========================================
   SPAZIO PRIMA DELLE FOTO
========================================= */

.baldoni-gallery-two {
    margin-top: 75px;
}
.baldoni-list-space {
    height: 15px;
}
/* DIDASCALIA FOTO TONINO GUERRA */

.baldoni-final-image figure {
    margin: 0;
}

.baldoni-final-image figcaption {
    position: relative;

    margin-top: 12px;
    padding-bottom: 12px;

    text-align: center;

    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-style: italic;

    color: #2E4057;
}


/* LINEA GIALLA SOTTO LA DIDASCALIA */

.baldoni-final-image figcaption::after {
    content: "";

    position: absolute;

    left: 50%;
    bottom: 0;

    transform: translateX(-50%);

    width: 45px;
    height: 2px;

    background: #FFD43B;
}
/* =========================================
   PAGINA BIBLIOTECA
========================================= */

.library-page {
    width: 100%;

    background: #FFFCEB;
    color: #2E4057;

    padding: 180px 0 110px;
}


.library-container {
    width: 88%;
    max-width: 1380px;

    margin: 0 auto;
}



/* =========================================
   TITOLO
========================================= */

.library-heading {
    max-width: 1100px;
}


.library-heading h1,
.about-heading h1 {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 68px;
    font-weight: 800;
    line-height: 1;

    letter-spacing: -2px;

    color: #2E4057;
}


.library-title-line {
    width: 100px;
    height: 5px;

    margin: 28px 0 35px;

    background: #FFD43B;
}


.library-heading p {
    max-width: 1080px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    line-height: 1.8;

    color: #2E4057;
}



/* =========================================
   IMMAGINE GRANDE
========================================= */

.library-main-image {
    width: 100%;

    margin-top: 55px;

    overflow: hidden;

    border-radius: 25px;
}


.library-main-image img {
    display: block;

    width: 100%;
    height: 440px;

    object-fit: cover;
}



/* =========================================
   ORARI + SERVIZI
========================================= */

.library-info-grid {
    width: 100%;

    display: grid;

    grid-template-columns:
        minmax(300px, .75fr)
        minmax(500px, 1.45fr);

    gap: 65px;

    margin-top: 60px;
}


.library-info-block {
    display: grid;

    grid-template-columns:
        72px
        1fr;

    gap: 28px;

    align-items: start;
}


.library-info-icon {
    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 2px solid #FFD43B;
    border-radius: 50%;

    color: #2E4057;

    font-size: 23px;
}


.library-info-content {
    padding-left: 28px;

    border-left: 2px solid #FFD43B;
}


.library-info-content h2,
.library-search-content h2 {
    margin: 0 0 22px;

    font-family: "Montserrat", sans-serif;

    font-size: 30px;
    font-weight: 800;

    color: #2E4057;
}


.library-info-content strong {
    display: block;

    margin-bottom: 8px;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;
    font-weight: 700;

    color: #2E4057;
}


.library-info-content p,
.library-search-content p {
    margin: 0 0 14px;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;
    line-height: 1.65;

    color: #2E4057;
}


.library-info-content ul {
    margin: 17px 0 0;

    padding-left: 22px;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;
    line-height: 1.7;

    color: #2E4057;
}


.library-info-content li {
    margin-bottom: 10px;
}


.library-info-content li::marker {
    color: #FFD43B;
}



/* =========================================
   BOX CONTATTO
========================================= */

.library-contact-box {
    width: 100%;

    margin-top: 55px;

    padding: 28px 34px;

    display: grid;

    grid-template-columns:
        72px
        1fr
        auto;

    gap: 28px;

    align-items: center;

    background: rgba(255, 212, 59, .08);

    border-radius: 16px;
}


.library-contact-icon {
    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 2px solid #FFD43B;
    border-radius: 50%;

    color: #2E4057;

    font-size: 24px;
}


.library-contact-text {
    padding-left: 28px;

    border-left: 2px solid #FFD43B;
}


.library-contact-text strong {
    display: block;

    margin-bottom: 8px;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;
    font-weight: 700;

    color: #2E4057;
}


.library-contact-text p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;
    line-height: 1.6;

    color: #2E4057;
}



/* EMAIL */

.library-email {
    display: inline-flex;

    align-items: center;

    gap: 12px;

    padding: 14px 22px;

    background: #2E4057;
    color: #FFFCEB;

    border-radius: 999px;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;
    font-weight: 600;

    text-decoration: none;

    white-space: nowrap;

    transition:
        background .25s ease,
        color .25s ease,
        transform .25s ease;
}


.library-email i {
    color: #FFD43B;
}


.library-email:hover {
    background: #FFD43B;
    color: #2E4057;

    transform: translateY(-2px);
}


.library-email:hover i {
    color: #2E4057;
}



/* =========================================
   CERCA UN LIBRO
========================================= */

.library-search-block {
    display: grid;

    grid-template-columns:
        72px
        1fr;

    gap: 28px;

    align-items: start;

    margin-top: 90px;
    
}
.library-search-block {
    margin-bottom: 80px;
}

.library-search-content {
    padding-left: 28px;

    border-left: 2px solid #FFD43B;
}
.contatto-link {
    color: #2E4057;
    text-decoration: none;
    transition: color 0.3s ease;
}

.contatto-link:hover {
    color: #FFD43B;
}

/* ==================================================
   LINK DI CONTATTO: EVIDENZIATORE GIALLO COERENTE
================================================== */

.booking-contact-links {
    width: min(100%, 820px);
    margin-top: 28px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.booking-contact-item {
    min-width: 0;
    padding: 20px 22px;
    display: flex;
    align-items: center;
    gap: 16px;
    color: #2E4057;
    background: rgba(46, 64, 87, .055);
    border-left: 4px solid #FFD43B;
    text-decoration: none;
    transition: transform .25s ease, background .25s ease;
}

.booking-contact-item:hover,
.booking-contact-item:focus-visible {
    color: #2E4057;
    background: rgba(46, 64, 87, .085);
    transform: translateY(-3px);
}

.booking-contact-icon {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #FFD43B;
    background: #2E4057;
    font-size: 18px;
}

.booking-contact-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    font-family: "Montserrat", sans-serif;
}

.booking-contact-label {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .8px;
    text-transform: uppercase;
}

.booking-contact-value,
.library-search-content .contatto-link,
.location-map-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    color: #2E4057;
    text-decoration: none;
    box-shadow: inset 0 -3px 0 #FFD43B;
    transform-origin: center;
    transition:
        box-shadow .25s ease,
        color .25s ease,
        transform .25s ease;
}

.booking-contact-value {
    max-width: 100%;
    font-size: 18px;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.booking-contact-item:hover .booking-contact-value,
.booking-contact-item:focus-visible .booking-contact-value,
.library-search-content .contatto-link:hover,
.library-search-content .contatto-link:focus-visible,
.location-map-link:hover,
.location-map-link:focus-visible {
    color: #2E4057;
    box-shadow: inset 0 -1.45em 0 #FFD43B;
    transform: scale(1.05);
}

/* Lo spazio finale mantiene anche la freccia di Google Maps evidenziata. */
.location-map-link {
    padding: 0 13px 0 3px;
    margin-left: -3px;
    margin-right: -13px;
}

@media (max-width: 760px) {
    .booking-contact-links {
        grid-template-columns: 1fr;
    }
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 900px) {

    .library-page {
        padding-top: 150px;
    }


    .library-heading h1 {
        font-size: 50px;
    }


    .library-main-image img {
        height: 330px;
    }


    .library-info-grid {
        grid-template-columns: 1fr;

        gap: 45px;
    }


 .library-contact-box {
    width: 100%;

    margin-top: 55px;

    padding: 32px 34px;

    display: grid;

    grid-template-columns:
        72px
        1fr
        auto;

    gap: 28px;

    align-items: start;

    background: rgba(255, 212, 59, .08);

    border-radius: 16px;
}
.library-contact-icon {
    margin-top: 0;
}

.library-contact-text {
    padding-left: 28px;
    border-left: 2px solid #FFD43B;
    min-height: 78px;
}

.library-contact-text strong {
    display: block;
    margin: 0 0 12px 0;

    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;

    color: #2E4057;
}

.library-contact-text p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    line-height: 1.65;

    color: #2E4057;
}


    .library-email {
        grid-column: 2;

        justify-self: start;
    }

}


@media (max-width: 650px) {

    .library-container {
        width: 88%;
    }


    .library-heading h1 {
        font-size: 43px;
    }


    .library-main-image img {
        height: 260px;
    }


    .library-info-block,
    .library-search-block {
        grid-template-columns: 1fr;
    }


    .library-info-content,
    .library-search-content {
        padding-left: 20px;
    }


    .library-contact-box {
        grid-template-columns: 1fr;
    }


    .library-contact-text {
        padding-left: 20px;
    }


    .library-email {
        grid-column: auto;
    }
.offriamo-title-bottom {
    width: 100%;
    margin-top: 30px;
}

.offriamo-title-bottom .offriamo-title-line {
    width: 95px;
    height: 5px;

    margin: 0;

    background: #FFD43B;
}

.offriamo-tour-top {
    font-size: 14px;
}

.offriamo-links {
    width: 100%;
    max-width: none;

    display: flex;
    flex-direction: column;
    align-items: flex-start;

    margin-top: 55px;

    text-align: left;
}

.offriamo-links .offriamo-tour-top,
.offriamo-links .offriamo-social {
    width: 100%;

    margin-left: 0 !important;
    margin-right: 0 !important;

    text-align: left !important;
}
}
/* BOX PRESTITO SUBITO SOTTO L'IMMAGINE */

.library-contact-box {
    width: 100%;
    margin-top: 45px;
    padding: 28px 34px;

    display: grid;
    grid-template-columns: 72px 1fr auto;
    gap: 28px;
    align-items: center;

    background: rgba(255, 212, 59, .08);
    border-radius: 16px;
}


/* ORARI + SERVIZI */

.library-info-grid {
    width: 100%;

    display: grid;
    grid-template-columns:
        minmax(300px, .75fr)
        minmax(500px, 1.45fr);

    gap: 65px;

    margin-top: 95px;
}


/* CERCHI UN LIBRO */

.library-search-block {
    display: grid;
    grid-template-columns: 72px 1fr;

    gap: 28px;
    align-items: start;

    margin-top: 100px;
    margin-bottom: 80px;
}
/* =========================================
   PAGINA CHI SIAMO
========================================= */

.about-page {
    width: 100%;

    background: #FFFCEB;
    color: #2E4057;

    /* spazio per header fisso */
    padding: 180px 0 120px;
}


.about-container {
    width: 86%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =========================================
   TITOLO
========================================= */

.about-heading {
    max-width: 1000px;
}


.about-heading h1 {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 68px;
    font-weight: 800;
    line-height: 1;

    letter-spacing: -2px;

    color: #2E4057;
}


.about-title-line {
    width: 95px;
    height: 5px;

    margin-top: 30px;

    background: #FFD43B;
}


/* =========================================
   TESTO
========================================= */

.about-text {
    max-width: 1100px;

    margin-top: 55px;
}


.about-text p {
    margin: 0 0 24px;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    line-height: 1.8;

    color: #2E4057;
}


.about-text p:last-child {
    margin-bottom: 0;
}


/* =========================================
   IMMAGINE
========================================= */

.about-main-image {
    width: 100%;

    margin-top: 65px;

    overflow: hidden;

    border-radius: 28px;
}


.about-main-image img {
    display: block;

    width: 100%;
    height: 560px;

    object-fit: cover;
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 900px) {

    .about-page {
        padding-top: 150px;
    }

    .about-heading h1 {
        font-size: 52px;
    }

    .about-main-image img {
        height: 420px;
    }

}


@media (max-width: 650px) {

    .about-container {
        width: 88%;
    }

    .about-heading h1 {
        font-size: 43px;
    }

    .about-text p {
        font-size: 16px;
    }

    .about-main-image {
        margin-top: 45px;
        border-radius: 20px;
    }

    .about-main-image img {
        height: 300px;
    }

}
/* =========================================
   VIDEO CHI SIAMO
========================================= */

/* =========================================
   VIDEO CHI SIAMO
========================================= */

.about-video {
    width: 100%;
    margin-top: 65px;

    padding: 22px;

    background: #2E4057;

    border-radius: 30px;

    position: relative;
}


/* PICCOLO DETTAGLIO GIALLO IN ALTO */

.about-video::before {
    content: "";

    position: absolute;

    top: -4px;
    left: 55px;

    width: 110px;
    height: 8px;

    background: #FFD43B;

    border-radius: 10px;
}


/* CONTENITORE VIDEO */

.about-video-preview {
    position: relative;

    display: block;
    width: 100%;

    overflow: hidden;

    border-radius: 18px;

    text-decoration: none;
}


/* IMMAGINE VIDEO */

.about-video-preview img {
    display: block;

    width: 100%;
    height: 540px;

    object-fit: cover;

    transition: transform .4s ease;
}


/* PLAY */

.about-video-play {
    position: absolute;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    width: 82px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding-left: 4px;

    background: #FFD43B;
    color: #2E4057;

    border-radius: 15px;

    font-size: 25px;

    transition: transform .3s ease;
}


/* HOVER */

.about-video-preview:hover img {
    transform: scale(1.025);
}

.about-video-preview:hover .about-video-play {
    transform: translate(-50%, -50%) scale(1.1);
}


/* MOBILE */

@media (max-width: 900px) {

    .about-video {
        padding: 16px;
    }

    .about-video-preview img {
        height: 420px;
    }

}


@media (max-width: 650px) {

    .about-video {
        margin-top: 45px;
        padding: 10px;

        border-radius: 20px;
    }

    .about-video-preview {
        border-radius: 13px;
    }

    .about-video-preview img {
        height: 300px;
    }

}

/* ==================================================
   PAGINA COSA OFFRIAMO
   STESSO STILE DI BIBLIOTECA / CHI SIAMO
================================================== */

.offriamo-page {
    width: 100%;

    background: #FFFCEB;
    color: #2E4057;

    padding: 180px 0 120px;
}


.offriamo-container {
    width: 86%;
    max-width: 1380px;

    margin: 0 auto;
}


/* =========================================
   TITOLO PRINCIPALE
========================================= */

.offriamo-header {
    margin-bottom: 85px;
}


.offriamo-header h1 {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 68px;
    font-weight: 800;
    line-height: 1;

    letter-spacing: -2px;

    color: #2E4057;
}


.offriamo-title-line {
    width: 95px;
    height: 5px;

    margin-top: 30px;

    background: #FFD43B;
}


/* =========================================
   SINGOLA SEZIONE
========================================= */

.offriamo-row {
    width: 100%;

    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);

    gap: 70px;

    align-items: start;

    margin-bottom: 115px;
}


/* =========================================
   IMMAGINI
========================================= */

.offriamo-image {
    width: 100%;
}


.offriamo-image img {
    display: block;

    width: 280px;
    height: 210px;

    object-fit: cover;

    border-radius: 8px;
}


/* =========================================
   TESTI
========================================= */

.offriamo-text {
    width: 100%;
    max-width: 930px;
}


.offriamo-text h2 {
    margin: 0 0 22px;

    font-family: "Montserrat", sans-serif;
    font-size: 30px;
    font-weight: 800;
    line-height: 1.2;

    color: #2E4057;
}


.offriamo-text p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.8;

    color: #2E4057;
}


/* =========================================
   LINEA TITOLO + TOUR VIRTUALE
========================================= */

.offriamo-title-bottom {
    width: 100%;

    display: flex;
    align-items: center;
    justify-content: space-between;

    margin-top: 30px;
}


/* LINEA GIALLA */

.offriamo-title-bottom .offriamo-title-line {
    width: 95px;
    height: 5px;

    margin: 0;

    flex-shrink: 0;

    background: #FFD43B;
}


/* TOUR A DESTRA */

.offriamo-tour-top {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    line-height: 1.5;

    color: #2E4057;
}


/* PAROLA TOUR VIRTUALE */

.offriamo-tour-top a {
    position: relative;

    color: #2E4057;

    font-weight: 700;
    text-decoration: none;
}


/* PICCOLA SOTTOLINEATURA GIALLA */

.offriamo-tour-top a::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: -4px;

    width: 100%;
    height: 2px;

    background: #FFD43B;

    transition: width .25s ease;
}


/* HOVER */


/* ULTIMA SEZIONE */

.offriamo-row-last {
    margin-bottom: 0;
}
/* BLOCCO TOUR + SOCIAL */


/* PRIMA FRASE */




/* SECONDA FRASE */


/* LINK IMPORTANTI */

.offriamo-tour-top a,
.offriamo-social a {
    display: inline-block;

    position: relative;

    font-weight: 800;
    color: #2E4057;

    text-decoration: none;

    transition: transform .25s ease;
}


/* LINEA GIALLA */

.offriamo-tour-top a::after,
.offriamo-social a::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: -3px;

    width: 100%;
    height: 3px;

    background: #FFD43B;
}


/* HOVER */

.offriamo-tour-top a:hover,
.offriamo-social a:hover {
    transform: scale(1.08);
}


/* INSTAGRAM + FACEBOOK */

.offriamo-social a {
    display: inline-block;

    position: relative;

    font-weight: 700;
    color: #2E4057;

    text-decoration: none;

    transition: transform .25s ease;
}


/* SOTTOLINEATURA GIALLA */

.offriamo-social a::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: -2px;

    width: 100%;
    height: 2px;

    background: #FFD43B;
}


/* PICCOLO ZOOM AL PASSAGGIO DEL MOUSE */

.offriamo-social a:hover {
    transform: scale(1.08);
}
/* =========================================
   TOUR + SOCIAL - CORREZIONE FINALE
========================================= */

/* contenitore delle due frasi */
.offriamo-links {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    text-align: left;
}


/* ENTRAMBE LE FRASI UGUALI */
.offriamo-tour-top,
.offriamo-social {
    margin: 0 !important;

    font-family: "Montserrat", sans-serif !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;

    color: #2E4057;
}


/* SPAZIO TRA PRIMA E SECONDA FRASE */
.offriamo-social {
    margin-top: 15px !important;
}


/* PAROLE CLICCABILI */
.offriamo-tour-top a,
.offriamo-social a {
    display: inline-block;

    font-family: inherit !important;
    font-size: inherit !important;
    font-weight: 800 !important;

    color: #2E4057;
    text-decoration: none;

    transition: transform 0.25s ease;
}


/* HOVER */
.offriamo-tour-top a:hover,
.offriamo-social a:hover {
    transform: scale(1.06);
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 900px) {

    .offriamo-page {
        padding-top: 150px;
    }


    .offriamo-header h1 {
        font-size: 52px;
    }


    .offriamo-row {
        grid-template-columns: 220px minmax(0, 1fr);

        gap: 45px;

        margin-bottom: 90px;
    }


    .offriamo-text h2 {
        font-size: 27px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 650px) {

    .offriamo-container {
        width: 88%;
    }


    .offriamo-header {
        margin-bottom: 60px;
    }


    .offriamo-header h1 {
        font-size: 43px;
    }


    .offriamo-row {
        grid-template-columns: 1fr;

        gap: 30px;

        margin-bottom: 80px;
    }


    .offriamo-image {
        max-width: 420px;
    }


    .offriamo-text h2 {
        font-size: 25px;
    }


    .offriamo-text p {
        font-size: 16px;
    }

}
.offriamo-row {
    position: relative;
}

/* =========================================
   TITOLI DELLE SEZIONI
========================================= */

.offriamo-text h2 {
    position: relative;

    padding-bottom: 16px;
}


/* PICCOLA LINEA SOTTO IL TITOLO */

/* =========================================
   EVIDENZIATORE ANIMATO LINK
========================================= */

.offriamo-tour-top a,
.offriamo-social a {
    display: inline-block;
    position: relative;

    color: #2E4057;
    text-decoration: none;
    font-weight: 800;

    z-index: 1;

    transition: transform 0.25s ease;
}


/* LINEA GIALLA INIZIALE */

.offriamo-tour-top a::after,
.offriamo-social a::after {
    content: "";

    position: absolute;

    left: -3px;
    bottom: -2px;

    width: calc(100% + 6px);
    height: 3px;

    background: #FFD43B;

    z-index: -1;

    transition:
        height 0.25s ease,
        bottom 0.25s ease;
}


/* HOVER: LA LINEA SALE E DIVENTA EVIDENZIATORE */

.offriamo-tour-top a:hover::after,
.offriamo-social a:hover::after {
    height: 100%;
    bottom: 0;
}


/* PICCOLO INGRANDIMENTO DELLA PAROLA */

.offriamo-tour-top a:hover,
.offriamo-social a:hover {
    transform: scale(1.05);
}

/* =========================================
   LINEA VERTICALE ACCANTO AL TESTO
========================================= */

.offriamo-text {
    position: relative;

    padding-left: 30px;
}

.offriamo-text::before {
    content: "";

    position: absolute;

    left: 0;
    top: 4px;

    width: 2px;
    height: 100%;

    background: rgba(255, 212, 59, .55);
}


/* =========================================
   SEZIONI ALTERNATE CON FONDO LEGGERO
========================================= */

.offriamo-row:nth-of-type(even) {
    padding: 38px 35px;

    background: rgba(46, 64, 87, .035);

    border-radius: 20px;
}


/* =========================================
   PICCOLO DETTAGLIO NELL'ANGOLO
========================================= */

.offriamo-row:nth-of-type(even)::after {
    content: "";

    position: absolute;

    right: 24px;
    top: 22px;

    width: 38px;
    height: 38px;

    border-top: 2px solid #FFD43B;
    border-right: 2px solid #FFD43B;
}


/* =========================================
   IMMAGINI
========================================= */

.offriamo-image {
    position: relative;
}


/* PICCOLO SEGMENTO GIALLO SOTTO L'IMMAGINE */

.offriamo-image::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: -12px;

    width: 70px;
    height: 4px;

    background: #FFD43B;
}


/* =========================================
   TOUR VIRTUALE
========================================= */

.offriamo-tour {
    position: relative;

    padding-top: 22px;
}


/* =========================================
   PREMESSA COSA OFFRIAMO
========================================= */

.offriamo-premessa {
    position: relative;

    max-width: 1050px;

    margin-top: 55px;
    padding-left: 32px;
}


/* LINEA GIALLA LATERALE */

.offriamo-premessa::before {
    content: "";

    position: absolute;

    left: 0;
    top: 4px;
    bottom: 4px;

    width: 3px;

    background: #FFD43B;

    border-radius: 10px;
}


.offriamo-premessa p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    line-height: 1.8;

    color: #2E4057;
}
/* =========================================
   EVIDENZIATORE UNICO
   TOUR + INSTAGRAM + FACEBOOK
========================================= */

.offriamo-links .offriamo-tour-top a,
.offriamo-links .offriamo-social a {
    display: inline-block;
    position: relative;

    color: #2E4057;
    text-decoration: none;
    font-weight: 800;

    z-index: 1;

    transform-origin: center;

    transition: transform 0.25s ease;
}


/* LINEA GIALLA */

.offriamo-links .offriamo-tour-top a::after,
.offriamo-links .offriamo-social a::after {
    content: "";

    position: absolute;

    left: -3px !important;
    right: auto !important;
    bottom: -2px !important;

    width: calc(100% + 6px) !important;
    height: 3px !important;

    background: #FFD43B;

    z-index: -1;

    transform: none !important;

    transition:
        height 0.25s ease,
        bottom 0.25s ease !important;
}


/* EVIDENZIATORE IN HOVER */

.offriamo-links .offriamo-tour-top a:hover::after,
.offriamo-links .offriamo-social a:hover::after {
    width: calc(100% + 6px) !important;
    height: 100% !important;

    bottom: 0 !important;

    transform: none !important;
}


/* LEGGERO ZOOM */

.offriamo-links .offriamo-tour-top a:hover,
.offriamo-links .offriamo-social a:hover {
    transform: scale(1.05);
}

.offriamo-premessa {
    margin-top: 60px;
    
}

/* SPAZIO TRA LINEA GIALLA E LINK */

.offriamo-header .offriamo-links {
    margin-top: 55px !important;
}

/* =========================================
   ALTRE NOTIZIE NASCOSTE
========================================= */

.news-page-card.extra-news {
    display: none;
}


/* DOPO IL CLICK */

.news-page-card.extra-news.news-visible {
    display: block;

    animation: extraNewsAppear .6s ease;
}

/* ==================================================
   CARD PAGINA NOTIZIE: LINK ALLINEATI ED EVIDENZIATORE
================================================== */

.news-page:not(.archive-page) .news-page-grid {
    align-items: stretch;
}

.news-page:not(.archive-page) .news-page-card:not(.extra-news),
.news-page:not(.archive-page) .news-page-card.extra-news.news-visible {
    display: flex;
    flex-direction: column;
}

.news-page:not(.archive-page) .news-page-card-content {
    flex: 1;
    min-height: 360px;
}

.news-page:not(.archive-page) .news-page-card-content > a {
    align-self: flex-start;
    margin-top: auto;
    padding: 0 13px 0 3px;
    margin-left: -3px;
    margin-right: -13px;
    color: #FFFCEB;
    text-decoration: none;
    box-shadow: inset 0 -3px 0 #FFD43B;
    transform-origin: center;
    transition:
        box-shadow .25s ease,
        color .25s ease,
        transform .25s ease;
}

.news-page:not(.archive-page) .news-page-card-content > a span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1em;
    line-height: 1;
}

.news-page:not(.archive-page) .news-page-card-content > a:hover,
.news-page:not(.archive-page) .news-page-card-content > a:focus-visible {
    color: #2E4057;
    box-shadow: inset 0 -1.45em 0 #FFD43B;
    transform: scale(1.05);
}

/* ========================================
   PAGINA ARCHIVIO
======================================== */

.archive-page-header {
    margin-bottom: 42px;
}

.archive-premise {
    position: relative;
    width: 100%;
    margin-bottom: 85px;
    padding: 58px 64px 62px;
    overflow: hidden;
    background: #2E4057;
    color: #FFFCEB;
}

.archive-premise::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    background: #FFD43B;
}

.archive-premise-label {
    display: block;
    margin-bottom: 15px;
    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.4px;
    color: #FFD43B;
}

.archive-premise h2 {
    max-width: 900px;
    margin: 0 0 30px;
    font-family: "Montserrat", sans-serif;
    font-size: 40px;
    font-weight: 800;
    line-height: 1.12;
    color: #FFFCEB;
}

.archive-premise-text {
    max-width: 1140px;
}

.archive-premise-text p {
    margin: 0 0 18px;
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.65;
    color: #FFFCEB;
}

.archive-premise-text p:last-child {
    margin-bottom: 0;
}

.archive-list-heading {
    margin-bottom: 40px;
}

/* Marcatori gialli in tutti gli elenchi delle pagine interne all'Archivio. */
.archive-article-page li::marker {
    color: #FFD43B !important;
}

/* ==================================================
   CARD ARCHIVIO: LINK ALLINEATI ED EVIDENZIATORE
================================================== */

.archive-page .news-page-grid {
    align-items: stretch;
}

.archive-page .news-page-card {
    display: flex;
    flex-direction: column;
}

.archive-page .news-page-card-content {
    flex: 1;
    min-height: 360px;
}

/*
   Le locandine e le illustrazioni vengono mostrate interamente.
   Il fondo neutro mantiene tutte le card uniformi anche con formati verticali.
*/
.archive-page .news-page-card > img {
    padding: 10px;
    object-fit: contain;
    object-position: center;
    background: #F1E9D9;
}

/* Fotografie orizzontali: riempiono il riquadro mantenendo il soggetto visibile. */
.archive-page .news-page-card > img:is(
    [src="albero.png"],
    [src="corrado-bonfanti.png"],
    [src="bruno-amore.png"],
    [src="piergiorgio.png"],
    [src="zuse-2.png"]
) {
    padding: 0;
    object-fit: cover;
    background: transparent;
}

.archive-page .news-page-card > img[src="albero.png"] {
    object-position: center 44%;
}

.archive-page .news-page-card > img[src="corrado-bonfanti.png"],
.archive-page .news-page-card > img[src="bruno-amore.png"] {
    object-position: center 32%;
}

.archive-page .news-page-card > img[src="piergiorgio.png"] {
    object-position: center 27%;
}

.archive-page .news-page-card > img[src="zuse-2.png"] {
    object-position: center 18%;
}

.archive-page .news-page-card-content > a {
    align-self: flex-start;
    margin-top: auto;
    padding: 0 13px 0 3px;
    margin-left: -3px;
    margin-right: -13px;
    color: #FFFCEB;
    text-decoration: none;
    box-shadow: inset 0 -3px 0 #FFD43B;
    transform-origin: center;
    transition:
        box-shadow .25s ease,
        color .25s ease,
        transform .25s ease;
}

.archive-page .news-page-card-content > a span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1em;
    line-height: 1;
}

.archive-page .news-page-card-content > a:hover,
.archive-page .news-page-card-content > a:focus-visible {
    color: #2E4057;
    box-shadow: inset 0 -1.45em 0 #FFD43B;
    transform: scale(1.05);
}

.archive-article-page .article-text a {
    color: #2E4057;
    font-weight: 700;
    text-decoration-color: #FFD43B;
    text-decoration-thickness: 3px;
    text-underline-offset: 4px;
    transition: color .25s ease;
}

.archive-article-page .article-text a:hover {
    color: #DFAE00;
}

.archive-article-page .archive-article-context {
    margin-bottom: 38px;
    padding-left: 22px;
    border-left: 4px solid #FFD43B;
}

.archive-article-quote {
    margin: 8px 0 36px;
    padding: 28px 32px;
    border-left: 4px solid #FFD43B;
    background: rgba(46, 64, 87, .06);
    font-family: "Montserrat", sans-serif;
    font-size: 19px;
    font-style: italic;
    font-weight: 600;
    line-height: 1.7;
    color: #2E4057;
}

.archive-leonardo-page .article-text h2 {
    max-width: 850px;
    margin: 0 0 38px;
    padding-left: 24px;
    border-left: 4px solid #FFD43B;
    font-family: "Montserrat", sans-serif;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.35;
    color: #2E4057;
}

.archive-bottom-image {
    width: 100%;
    max-width: 620px;
    margin: 55px auto 0;
}

.archive-bottom-image img,
.archive-side-image img {
    display: block;
    width: 100%;
    height: auto;
}

.archive-long-title-page .article-title-wrapper,
.archive-long-title-page .article-hero h1 {
    max-width: 1030px;
}

.archive-long-title-page .article-hero h1 {
    font-size: clamp(40px, 4.7vw, 64px);
    line-height: 1.06;
}

.archive-split-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
    gap: 64px;
    align-items: start;
    margin-top: 48px;
}

.archive-split-layout .article-text {
    margin-top: 0;
}

.archive-side-image {
    width: 100%;
    max-width: 380px;
    margin: 0 auto;
}

.archive-visit-list {
    margin: 4px 0 34px;
    padding-left: 24px;
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.8;
    color: #2E4057;
}

.archive-visit-list li + li {
    margin-top: 7px;
}

.archive-article-page .article-text .archive-poster-link {
    display: inline-flex;
    align-items: center;
    padding: 14px 24px;
    border: 2px solid #2E4057;
    background: transparent;
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    font-weight: 700;
    color: #2E4057;
    text-decoration: none;
    transition: background .25s ease, color .25s ease, transform .25s ease;
}

.archive-article-page .article-text .archive-poster-link:hover {
    background: #2E4057;
    color: #FFD43B;
    transform: translateY(-2px);
}

.archive-event-intro {
    max-width: 900px;
    margin-top: 48px;
    padding: 38px 42px;
    border-left: 5px solid #FFD43B;
    background: rgba(46, 64, 87, .06);
    font-family: "Montserrat", sans-serif;
    color: #2E4057;
}

.archive-event-intro h2 {
    margin: 0 0 22px;
    font-size: 34px;
    font-weight: 800;
    line-height: 1.1;
}

.archive-event-intro p {
    margin: 0 0 8px;
    font-size: 17px;
    line-height: 1.55;
}

.archive-event-intro .archive-event-date {
    margin-top: 28px;
}

.archive-poster-image {
    max-width: 560px;
}

.archive-event-details p {
    margin-bottom: 8px !important;
    font-size: 20px !important;
    font-weight: 600;
}

/* ========================================
   PAGINE IPAZIA E GALLERIE INGRANDIBILI
======================================== */

.ipazia-main-poster {
    width: 100%;
    max-width: 520px;
    margin: 50px auto 0;
}

.ipazia-main-poster img,
.ipazia-text-with-image img {
    display: block;
    width: 100%;
    height: auto;
}

.ipazia-opening {
    margin-top: 55px !important;
}

.ipazia-text-with-image {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 250px;
    gap: 45px;
    align-items: start;
    max-width: 980px;
    margin-top: 52px;
}

.ipazia-text-with-image.image-left {
    grid-template-columns: 250px minmax(0, 1fr);
}

.ipazia-text-with-image .article-text {
    margin-top: 0;
}

.ipazia-text-with-image figure {
    width: 100%;
    margin: 0;
}

.ipazia-tall-section,
.ipazia-statue-section {
    padding-top: 48px;
    border-top: 1px solid rgba(46, 64, 87, .16);
}

.ipazia-section-title {
    max-width: 980px;
    margin: 72px 0 0;
    padding-left: 22px;
    border-left: 5px solid #FFD43B;
    font-family: "Montserrat", sans-serif;
    font-size: 34px;
    font-weight: 800;
    line-height: 1.2;
    color: #2E4057;
}

.ipazia-closing-text {
    margin-top: 58px !important;
}

.ipazia-honor {
    max-width: 760px;
    margin: 68px auto 0 !important;
    padding: 0;
    border: 0;
    background: transparent;
    font-family: "Cormorant Garamond", serif !important;
    font-size: 38px !important;
    font-style: italic;
    font-weight: 600;
    line-height: 1.2 !important;
    text-align: center;
    letter-spacing: .2px;
    color: #2E4057;
}

.archive-lightbox-gallery {
    display: grid;
    gap: 14px;
    max-width: 1100px;
    margin-top: 58px;
}

.archive-five-gallery {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.archive-three-gallery {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.archive-lightbox-gallery a {
    position: relative;
    display: block;
    overflow: hidden;
    min-height: 230px;
    background: #2E4057;
    cursor: zoom-in;
}

.archive-lightbox-gallery img {
    display: block;
    width: 100%;
    height: 260px;
    object-fit: cover;
    transition: transform .4s ease;
}

.archive-lightbox-gallery a:hover img {
    transform: scale(1.035);
}

.archive-lightbox {
    position: fixed;
    inset: 0;
    z-index: 5000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 70px 5%;
    background: rgba(16, 25, 38, .94);
    opacity: 0;
    visibility: hidden;
    transition: opacity .25s ease, visibility .25s ease;
}

.archive-lightbox.is-open {
    opacity: 1;
    visibility: visible;
}

.archive-lightbox img {
    display: block;
    max-width: 92vw;
    max-height: 86vh;
    width: auto;
    height: auto;
    object-fit: contain;
    box-shadow: 0 25px 65px rgba(0, 0, 0, .42);
}

.archive-lightbox-close {
    position: absolute;
    top: 20px;
    right: 28px;
    width: 48px;
    height: 48px;
    border: 0;
    border-radius: 50%;
    background: #FFD43B;
    color: #2E4057;
    font-family: "Montserrat", sans-serif;
    font-size: 34px;
    line-height: 1;
    cursor: pointer;
}

body.lightbox-open {
    overflow: hidden;
}

/* ========================================
   IPAZIA 415–2015, CONVEGNO E LIBRI
======================================== */

.archive-subheading {
    margin: 54px 0 28px;
    padding-left: 20px;
    border-left: 4px solid #FFD43B;
    font-family: "Montserrat", sans-serif;
    font-size: 27px;
    font-weight: 800;
    line-height: 1.3;
    color: #2E4057;
}

.archive-editorial-list,
.archive-appendix-list {
    margin: 0;
    padding-left: 25px;
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.75;
    color: #2E4057;
}

.archive-editorial-list li {
    margin-bottom: 20px;
    padding-left: 8px;
}

.archive-wide-image {
    width: 100%;
    max-width: 980px;
    margin: 55px 0;
}

.archive-wide-image img,
.archive-books-poster img,
.archive-book-row img {
    display: block;
    width: 100%;
    height: auto;
}

.archive-appendix-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 34px;
    margin: 55px 0;
    padding: 32px 32px 32px 52px;
    background: rgba(46, 64, 87, .055);
}

.archive-interview-link {
    margin-top: 15px;
}

.archive-convegno-intro {
    max-width: 900px;
}

.archive-convegno-intro h2 {
    max-width: 720px;
}

.archive-books-intro {
    margin-top: 48px !important;
}

.archive-books-poster {
    width: 100%;
    max-width: 760px;
    margin: 52px auto 0;
}

.archive-books-offer {
    max-width: 980px;
    margin: 60px 0 0;
    padding: 34px 38px;
    border-left: 5px solid #FFD43B;
    background: rgba(46, 64, 87, .06);
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    line-height: 1.75;
    color: #2E4057;
}

.archive-books-offer p {
    margin: 0;
}

.archive-book-row {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 42px;
    align-items: start;
    max-width: 980px;
    margin-top: 55px;
    padding-top: 45px;
    border-top: 1px solid rgba(46, 64, 87, .2);
}

.archive-book-row figure {
    margin: 0;
}

.archive-book-copy {
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    line-height: 1.7;
    color: #2E4057;
}

.archive-book-copy p {
    margin: 0 0 24px;
}

.archive-book-price {
    padding: 15px 18px;
    border: 1px solid rgba(46, 64, 87, .18);
    background: rgba(46, 64, 87, .045);
    font-family: monospace;
}

/* ========================================
   LOGARITMI, ALBERO DELLA CONOSCENZA, ENIGMA
======================================== */

.archive-logarithms-list {
    columns: 2;
    column-gap: 55px;
}

.archive-logarithms-list li {
    break-inside: avoid;
}

.archive-caption-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    max-width: 1060px;
    margin-top: 62px;
}

.archive-caption-gallery figure {
    margin: 0;
    padding: 18px 18px 20px;
    background: rgba(46, 64, 87, .055);
}

.archive-caption-gallery img {
    display: block;
    width: 100%;
    height: 350px;
    object-fit: contain;
}

.archive-caption-gallery figcaption {
    margin-top: 16px;
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    color: #2E4057;
}

.archive-tree-layout {
    display: grid;
    grid-template-columns: 330px minmax(0, 1fr);
    gap: 52px;
    align-items: start;
    max-width: 1100px;
    margin-top: 52px;
}

.archive-tree-layout figure {
    margin: 0;
}

.archive-tree-layout img {
    display: block;
    width: 100%;
    height: auto;
}

.archive-tree-layout .article-text {
    margin-top: 0;
}

.archive-schedule {
    max-width: 980px;
    margin-top: 52px;
    padding: 34px 38px;
    border-left: 5px solid #FFD43B;
    background: rgba(46, 64, 87, .055);
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.7;
    color: #2E4057;
}

.archive-schedule p {
    margin: 0 0 14px;
}

.archive-schedule ul {
    margin: 0 0 28px;
    padding-left: 22px;
}

.archive-schedule .archive-poster-link {
    display: inline-flex;
    padding: 14px 24px;
    border: 2px solid #2E4057;
    font-weight: 700;
    color: #2E4057;
    text-decoration: none;
    transition: background .25s ease, color .25s ease, transform .25s ease;
}

.archive-schedule .archive-poster-link:hover {
    background: #2E4057;
    color: #FFD43B;
    transform: translateY(-2px);
}

/* ========================================
   ARCHIVIO — RICCIONE, ZUSE E FAENZA
======================================== */

.archive-riccione-intro {
    max-width: 1040px;
}

.archive-riccione-intro h3 {
    margin: 30px 0 12px;
    font-family: "Montserrat", sans-serif;
    font-size: 27px;
    font-weight: 800;
    line-height: 1.25;
    color: #2E4057;
}

.archive-riccione-image {
    width: 100%;
    max-width: 560px;
    margin: 48px auto 54px;
    padding: 18px;
    background: rgba(46, 64, 87, .055);
}

.archive-riccione-image img,
.archive-zuse-image img {
    display: block;
    width: 100%;
    height: auto;
}

.archive-resource-links {
    margin-top: 50px;
    padding: 32px 36px;
    border-left: 5px solid #FFD43B;
    background: rgba(46, 64, 87, .055);
}

.archive-resource-links h2 {
    margin: 0 0 22px;
    font-family: "Montserrat", sans-serif;
    font-size: 25px;
    font-weight: 800;
    color: #2E4057;
}

.archive-resource-links a {
    display: block;
    width: fit-content;
    margin-top: 14px;
}

.archive-zuse-image {
    width: 100%;
    max-width: 760px;
    margin: 48px auto 50px;
    padding: 20px;
    background: rgba(46, 64, 87, .055);
}

.archive-zuse-page .article-text {
    max-width: 980px;
    margin-right: auto;
    margin-left: auto;
}

.archive-numbered-list {
    margin: 8px 0 38px;
    padding-left: 30px;
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.75;
    color: #2E4057;
}

.archive-numbered-list li {
    margin-bottom: 13px;
    padding-left: 7px;
}

.archive-numbered-list li::marker {
    font-weight: 800;
    color: #DFAE00;
}

/* ========================================
   ARCHIVIO — MOSTRE E CONFERENZE 2007-2009
======================================== */

.archive-pacioli-heading {
    margin-top: 48px;
    text-align: center;
    font-family: "Montserrat", sans-serif;
    color: #2E4057;
}

.archive-pacioli-heading strong {
    display: block;
    font-size: 24px;
    letter-spacing: 3px;
}

.archive-pacioli-heading h2 {
    margin: 14px 0 8px;
    font-size: 38px;
    font-weight: 800;
    line-height: 1.15;
}

.archive-pacioli-heading p {
    margin: 0;
    font-size: 21px;
}

.archive-feature-image {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding: 18px;
    background: rgba(46, 64, 87, .055);
}

.archive-feature-image img,
.archive-space-layout img,
.archive-conference-layout img,
.archive-conference-poster img {
    display: block;
    width: 100%;
    height: auto;
}

.archive-pacioli-image {
    max-width: 760px;
    margin-top: 38px;
}

.archive-counting-image {
    max-width: 860px;
    margin-top: 45px;
}

.archive-centered-text {
    max-width: 900px;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.archive-date-note {
    margin-top: 35px;
    padding: 28px 30px;
    border-top: 3px solid #FFD43B;
    background: rgba(46, 64, 87, .045);
}

.archive-date-note p:last-child {
    margin-bottom: 0;
}

.archive-space-layout {
    display: grid;
    grid-template-columns: minmax(280px, 390px) minmax(0, 1fr);
    gap: 55px;
    align-items: start;
    margin-top: 50px;
}

.archive-space-layout figure {
    position: sticky;
    top: 130px;
    margin: 0;
    padding: 16px;
    background: rgba(46, 64, 87, .055);
}

.archive-space-layout .article-text {
    margin-top: 0;
}

.archive-conference-layout {
    display: grid;
    grid-template-columns: minmax(330px, 540px) minmax(0, 1fr);
    gap: 58px;
    align-items: center;
    margin-top: 52px;
}

.archive-conference-layout figure {
    margin: 0;
    padding: 18px 18px 20px;
    background: rgba(46, 64, 87, .055);
}

.archive-conference-layout figcaption {
    margin-top: 16px;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-style: italic;
    line-height: 1.55;
    color: #2E4057;
}

.archive-conference-details {
    padding: 36px 38px;
    border-left: 5px solid #FFD43B;
    background: rgba(46, 64, 87, .055);
    font-family: "Montserrat", sans-serif;
    color: #2E4057;
}

.archive-conference-details p {
    margin: 0 0 22px;
    font-size: 17px;
    line-height: 1.7;
}

.archive-conference-details p:last-child {
    margin-bottom: 0;
}

.archive-conference-details h2 {
    margin: 28px 0 20px;
    font-size: 29px;
    font-weight: 800;
    line-height: 1.25;
}

.archive-conference-details .archive-conference-subtitle {
    margin-top: -10px;
    font-size: 19px;
}

.archive-conference-poster {
    width: 100%;
    max-width: 780px;
    margin: 52px auto 0;
    padding: 20px;
    background: rgba(46, 64, 87, .055);
}

/* ========================================
   ARCHIVIO — MOSTRE E LABORATORI STORICI
======================================== */

.archive-image-grid {
    display: grid;
    gap: 22px;
    margin-top: 42px;
}

.archive-image-grid figure {
    margin: 0;
    padding: 12px;
    background: rgba(46, 64, 87, .055);
}

.archive-image-grid img,
.archive-exhibit-row img,
.archive-section-image img {
    display: block;
    width: 100%;
    height: auto;
}

.archive-fractal-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.archive-fractal-grid img {
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.archive-escher-image {
    max-width: 780px;
    margin-top: 45px;
}

.archive-exhibit {
    margin-top: 58px;
}

.archive-exhibit h2,
.archive-geometry-section h2,
.archive-source-content h2 {
    margin: 0 0 28px;
    padding-left: 20px;
    border-left: 5px solid #FFD43B;
    font-family: "Montserrat", sans-serif;
    font-size: 29px;
    font-weight: 800;
    line-height: 1.25;
    color: #2E4057;
}

.archive-exhibit-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 390px);
    gap: 45px;
    align-items: start;
}

.archive-exhibit-row .article-text {
    margin-top: 0;
}

.archive-exhibit-row figure {
    margin: 0;
    padding: 14px;
    background: rgba(46, 64, 87, .055);
}

.archive-exhibit-row figcaption {
    margin-top: 13px;
    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-style: italic;
    text-align: center;
    color: #2E4057;
}

.archive-lampi-gallery {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 58px;
}

.archive-two-gallery {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 960px;
}

.archive-two-gallery img {
    height: 440px;
    object-fit: contain;
}

.archive-source-content {
    max-width: 1080px;
}

.archive-source-content h2 {
    margin-top: 54px;
}

.archive-source-content h3 {
    position: relative;
    margin: 46px 0 24px;
    padding: 18px 22px 18px 26px;
    border-left: 4px solid #FFD43B;
    background: rgba(46, 64, 87, .055);
    font-family: "Montserrat", sans-serif;
    font-size: 26px;
    font-weight: 800;
    line-height: 1.3;
    color: #2E4057;
}

.archive-source-content .archive-author-credit {
    margin: 58px 0 0;
    padding-top: 24px;
    border-top: 3px solid #FFD43B;
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 600;
    font-style: italic;
    line-height: 1.6;
    text-align: right;
    color: #2E4057;
}

.archive-source-content .archive-author-credit span {
    font-size: 14px;
    font-weight: 500;
}

.archive-source-content .archive-source-quote {
    padding: 28px 32px;
    border-left: 5px solid #FFD43B;
    background: rgba(46, 64, 87, .055);
    font-size: 20px;
    font-style: italic;
}

.archive-geometry-section {
    margin-top: 68px;
}

.archive-section-image {
    width: 100%;
    max-width: 760px;
    margin: 34px auto 42px;
    padding: 16px;
    background: rgba(46, 64, 87, .055);
}

.archive-bibliography {
    padding: 34px 38px;
    border-left: 5px solid #FFD43B;
    background: rgba(46, 64, 87, .055);
}

.archive-bibliography .article-text {
    margin-top: 0;
}

@media screen and (max-width: 700px) {
    .archive-riccione-intro h3 {
        font-size: 23px;
    }

    .archive-riccione-image,
    .archive-zuse-image {
        margin-top: 38px;
        margin-bottom: 42px;
        padding: 12px;
    }

    .archive-resource-links {
        margin-top: 40px;
        padding: 27px 23px;
    }

    .archive-resource-links h2 {
        font-size: 22px;
    }

    .archive-numbered-list {
        padding-left: 24px;
        font-size: 16px;
    }

    .archive-pacioli-heading {
        margin-top: 38px;
    }

    .archive-pacioli-heading strong {
        font-size: 20px;
    }

    .archive-pacioli-heading h2 {
        font-size: 29px;
    }

    .archive-feature-image,
    .archive-conference-poster {
        padding: 12px;
    }

    .archive-space-layout,
    .archive-conference-layout {
        grid-template-columns: 1fr;
        gap: 34px;
        margin-top: 40px;
    }

    .archive-space-layout figure {
        position: static;
        width: 100%;
        max-width: 420px;
        margin: 0 auto;
    }

    .archive-conference-layout figure {
        width: 100%;
        max-width: 540px;
        margin: 0 auto;
        padding: 12px 12px 16px;
    }

    .archive-conference-details {
        padding: 28px 24px;
    }

    .archive-conference-details h2 {
        font-size: 24px;
    }

    .archive-conference-details p {
        font-size: 16px;
    }

    .archive-fractal-grid,
    .archive-lampi-gallery,
    .archive-two-gallery {
        grid-template-columns: 1fr;
    }

    .archive-two-gallery img {
        height: auto;
        max-height: 440px;
    }

    .archive-exhibit-row {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .archive-exhibit-row figure {
        width: 100%;
        max-width: 420px;
        margin: 0 auto;
    }

    .archive-exhibit h2,
    .archive-geometry-section h2,
    .archive-source-content h2 {
        font-size: 24px;
    }

    .archive-source-content .archive-source-quote {
        padding: 22px 20px;
        font-size: 17px;
    }

    .archive-source-content h3 {
        margin-top: 36px;
        padding: 15px 18px;
        font-size: 21px;
    }

    .archive-source-content .archive-author-credit {
        margin-top: 46px;
        text-align: left;
    }

    .archive-geometry-section {
        margin-top: 52px;
    }

    .archive-section-image {
        padding: 11px;
    }

    .archive-bibliography {
        padding: 27px 23px;
    }
}

.archive-enigma-date {
    margin: 48px 0 0;
    font-family: "Montserrat", sans-serif;
    font-size: 23px;
    font-weight: 700;
    color: #2E4057;
}

.archive-static-gallery {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    max-width: 1060px;
    margin-top: 34px;
}

.archive-static-gallery figure {
    margin: 0;
    padding: 10px;
    background: rgba(46, 64, 87, .055);
}

.archive-static-gallery img {
    display: block;
    width: 100%;
    height: 330px;
    object-fit: contain;
}

.archive-enigma-page .article-text {
    margin-top: 60px;
}

.archive-enigma-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 55px;
    align-items: center;
    max-width: 980px;
    margin-top: 58px;
    padding-top: 45px;
    border-top: 1px solid rgba(46, 64, 87, .2);
}

.archive-enigma-info {
    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    line-height: 1.75;
    color: #2E4057;
}

.archive-enigma-info p {
    margin: 0 0 26px;
}

.archive-enigma-footer figure {
    margin: 0;
}

.archive-enigma-footer img {
    display: block;
    width: 100%;
    height: auto;
}

@media screen and (max-width: 700px) {
    .archive-page-header {
        margin-bottom: 30px;
    }

    .archive-premise {
        margin-bottom: 60px;
        padding: 38px 28px 42px 32px;
    }

    .archive-premise h2 {
        font-size: 30px;
    }

    .archive-premise-text p {
        font-size: 16px;
        line-height: 1.6;
    }

    .archive-article-quote {
        padding: 22px 20px;
        font-size: 17px;
    }

    .archive-leonardo-page .article-text h2 {
        padding-left: 18px;
        font-size: 23px;
    }

    .archive-bottom-image {
        margin-top: 40px;
    }

    .archive-long-title-page .article-hero h1 {
        font-size: 38px;
    }

    .archive-split-layout {
        grid-template-columns: 1fr;
        gap: 38px;
        margin-top: 38px;
    }

    .archive-side-image {
        max-width: 340px;
    }

    .archive-event-intro {
        margin-top: 38px;
        padding: 30px 24px;
    }

    .archive-event-intro h2 {
        font-size: 28px;
    }

    .archive-event-intro p {
        font-size: 16px;
    }

    .ipazia-main-poster {
        max-width: 420px;
        margin-top: 40px;
    }

    .ipazia-text-with-image,
    .ipazia-text-with-image.image-left {
        grid-template-columns: 1fr;
        gap: 28px;
        margin-top: 42px;
    }

    .ipazia-text-with-image figure {
        max-width: 310px;
        margin: 0 auto;
    }

    .ipazia-section-title {
        margin-top: 58px;
        font-size: 28px;
    }

    .ipazia-honor {
        margin-top: 52px !important;
        font-size: 31px !important;
    }

    .archive-five-gallery,
    .archive-three-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .archive-lightbox-gallery img {
        height: 210px;
    }

    .archive-lightbox {
        padding: 68px 18px 24px;
    }

    .archive-lightbox-close {
        top: 13px;
        right: 16px;
    }

    .archive-subheading {
        margin-top: 44px;
        font-size: 23px;
    }

    .archive-editorial-list,
    .archive-appendix-list {
        font-size: 16px;
    }

    .archive-appendix-list {
        grid-template-columns: 1fr;
        padding: 26px 24px 26px 43px;
    }

    .archive-wide-image {
        margin: 42px 0;
    }

    .archive-books-poster {
        max-width: 520px;
        margin-top: 40px;
    }

    .archive-books-offer {
        margin-top: 44px;
        padding: 28px 24px;
        font-size: 15px;
    }

    .archive-book-row {
        grid-template-columns: 1fr;
        gap: 28px;
        margin-top: 45px;
        padding-top: 38px;
    }

    .archive-book-row figure {
        width: 100%;
        max-width: 220px;
        margin: 0 auto;
    }

    .archive-logarithms-list {
        columns: 1;
    }

    .archive-caption-gallery,
    .archive-static-gallery {
        grid-template-columns: 1fr;
    }

    .archive-caption-gallery figure,
    .archive-static-gallery figure {
        max-width: 420px;
        width: 100%;
        margin: 0 auto;
    }

    .archive-caption-gallery img,
    .archive-static-gallery img {
        height: auto;
        max-height: 460px;
    }

    .archive-tree-layout {
        grid-template-columns: 1fr;
        gap: 32px;
        margin-top: 40px;
    }

    .archive-tree-layout figure {
        max-width: 460px;
        margin: 0 auto;
    }

    .archive-schedule {
        margin-top: 42px;
        padding: 28px 24px;
        font-size: 16px;
    }

    .archive-enigma-date {
        margin-top: 38px;
        font-size: 20px;
    }

    .archive-enigma-page .article-text {
        margin-top: 46px;
    }

    .archive-enigma-footer {
        grid-template-columns: 1fr;
        gap: 28px;
        margin-top: 46px;
    }

    .archive-enigma-footer figure {
        max-width: 280px;
    }
}

@keyframes extraNewsAppear {

    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}

@keyframes newsAppear {

    from {
        opacity: 0;
        transform: translateY(25px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }

}

/* =========================================================
   PAGINA NOTIZIA - DARIO FRANCESCHINI
========================================================= */

.franceschini-page {
    width: 100%;
    min-height: 100vh;

    position: relative;
    overflow: hidden;

    background: #FFFCEB;
    color: #2E4057;

     padding: 0 0 110px;
}


.franceschini-container {
    width: 89%;
    max-width: 1400px;

    margin: 0 auto;

    position: relative;
    z-index: 2;

        max-width: 1180px;
    margin: 0 auto;

    padding:
        190px
        60px
        0;
}

/* =========================================================
   FRANCESCHINI - COERENZA CON PAGINE NOTIZIE
========================================================= */


/* CONTENITORE */

.franceschini-container {
    width: auto;
    max-width: 1180px;

    margin: 0 auto;
    padding-left: 60px;
    padding-right: 60px;
}


/* TORNA ALLE NOTIZIE */

.franceschini-back {
    gap: 10px;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #DFAE00;
}


.franceschini-back span {
    font-size: inherit;
}


.franceschini-back:hover {
    color: #2E4057;
}


/* CATEGORIA */

.franceschini-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #DFAE00;
}


/* TITOLO */

.franceschini-header {
    max-width: 880px;

    margin-bottom: 0;
}


.franceschini-header h1 {
    max-width: 880px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;

    letter-spacing: -2.5px;

    color: #2E4057;
}


/* LINEA GIALLA */

.franceschini-line {
    width: 60px;
    height: 3px;

    margin: 28px 0;

    background: #FFD43B;
}


/* TESTO */

.franceschini-text {
    max-width: 980px;

    margin-top: 55px;
    margin-bottom: 45px;
}


.franceschini-text p {
    margin: 0 0 26px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


.franceschini-text strong {
    font-weight: 700;
}


/* =========================================================
   TORNA ALLE NOTIZIE
========================================================= */

.franceschini-back {
    display: inline-flex;
    align-items: center;

    gap: 11px;

    margin-bottom: 55px;

    color: #2E4057;

    text-decoration: none;

    font-size: 18px;
    font-weight: 600;

    transition:
        color .25s ease,
        transform .25s ease;
}


.franceschini-back span {
    font-size: 25px;

    transition: transform .25s ease;
}


.franceschini-back:hover {
    color: #FFD43B;
}


.franceschini-back:hover span {
    transform: translateX(-5px);
}


/* =========================================================
   INTESTAZIONE
========================================================= */

.franceschini-header {
    max-width: 1150px;

    margin-bottom: 45px;
}


.franceschini-category {
    margin: 0 0 30px;

    color: #2E4057;

    font-size: 16px;
    font-weight: 700;

    letter-spacing: 3px;
}


/* TITOLO */

.franceschini-header h1 {
    margin: 0;

    color: #2E4057;

    font-size: 64px;
    font-weight: 800;

    line-height: 1.05;

    letter-spacing: -1.5px;
}


/* LINEA GIALLA */

.franceschini-line {
    width: 82px;
    height: 5px;

    margin-top: 30px;

    background: #FFD43B;
}


/* =========================================================
   TESTO
========================================================= */

.franceschini-text {
    max-width: 1180px;

    margin-top: 42px;
    margin-bottom: 45px;
}


.franceschini-text p {
    margin: 0 0 28px;

    color: #2E4057;

    font-size: 22px;
    font-weight: 400;

    line-height: 1.55;
}


.franceschini-text p:last-child {
    margin-bottom: 0;
}


.franceschini-text strong {
    font-weight: 700;
}


/* =========================================================
   GALLERIA
========================================================= */

.franceschini-gallery {
    width: 100%;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 24px;

    margin-top: 48px;
}

.franceschini-gallery img {
    width: 100%;
    height: 390px;

    display: block;
    object-fit: cover;

    border: 3px solid #FFD43B;
    border-radius: 14px;

    box-sizing: border-box;
}







/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 1000px) {

    .franceschini-gallery img {
        height: 320px;
    }

}


@media screen and (max-width: 700px) {

    .franceschini-page {
        padding: 155px 0 80px;
    }

    .franceschini-container {
        width: 86%;
    }

    .franceschini-gallery {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .franceschini-gallery img {
        height: 300px;
    }


}

/* HEADER HOME - distanza M / menu */

header#top nav {
    padding-left: 80px;
    gap: 85px;
}


/* =========================================================
   COLLABORAZIONE SCUOLA - MUSEO
========================================================= */

.collab-page {
    width: 100%;
    min-height: 100vh;

    background: #FFFCEB;
    color: #2E4057;

    padding: 190px 0 110px;
}


.collab-container {
    width: 88%;
    max-width: 1180px;
    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.collab-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    color: #DFAE00;
    text-decoration: none;

    font-size: 15px;
    font-weight: 700;

    transition: .25s ease;
}

.collab-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* CATEGORIA */

.collab-category {
    margin: 0 0 18px;

    color: #DFAE00;

    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
}


/* TITOLO */

.collab-title {
    max-width: 900px;

    margin: 0;

    color: #2E4057;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;
}


/* LINEA GIALLA */

.collab-title-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 48px;

    background: #FFD43B;
}


/* =========================================================
   TESTO
========================================================= */

.collab-text {
    max-width: 1080px;
}

.collab-text p {
    margin: 0 0 24px;

    color: #2E4057;

    font-size: 17px;
    font-weight: 400;
    line-height: 1.8;
}


/* =========================================================
   BOX PERSONAGGI
========================================================= */

.collab-people {
    position: relative;

    margin-top: 45px;
    margin-bottom: 38px;

    padding: 30px 32px 32px;

    background: rgba(46, 64, 87, .055);

    border-radius: 12px;
    overflow: hidden;
}


/* piccolo dettaglio laterale */

.collab-people::before {
    content: "";

    position: absolute;
    left: 0;
    top: 0;

    width: 4px;
    height: 100%;

    background: #FFD43B;
}


/* TITOLO DEL BOX */

.collab-people-heading {
    display: flex;
    align-items: flex-start;

    gap: 22px;

    margin-bottom: 28px;
}


.collab-icon {
    width: 54px;
    height: 54px;

    flex: 0 0 54px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #FFD43B;
    color: #2E4057;

    font-size: 21px;
}


.collab-people-heading h2 {
    margin: 5px 0 0;

    color: #2E4057;

    font-size: 25px;
    font-weight: 700;

    line-height: 1.25;
}


.collab-small-line {
    width: 48px;
    height: 3px;

    margin-top: 12px;

    background: #FFD43B;
}


/* =========================================================
   ELENCO
========================================================= */

.collab-people-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 0;

    margin-left: 6px;
}


.collab-column {
    padding: 0 26px;
}


.collab-column:first-child {
    padding-left: 0;
}


.collab-column + .collab-column {
    border-left: 1px solid #FFD43B;
}


.collab-person {
    display: grid;

    grid-template-columns:
        minmax(95px, auto)
        18px
        1fr;

    align-items: center;

    gap: 10px;

    margin-bottom: 13px;
}


.collab-person:last-child {
    margin-bottom: 0;
}


.collab-person strong {
    color: #2E4057;

    font-size: 14px;
    font-weight: 700;
}


.collab-person span {
    display: block;

    width: 13px;
    height: 2px;

    background: #FFD43B;
}


.collab-person p {
    margin: 0;

    color: #2E4057;

    font-size: 14px;
    font-weight: 400;
}


/* =========================================================
   TESTO FINALE
========================================================= */

.collab-final-text {
    max-width: 1080px;

    margin: 0 0 30px;

    color: #2E4057;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;
}


/* =========================================================
   IMMAGINE
========================================================= */

.collab-image {
    width: 100%;

    margin-top: 25px;
}


.collab-image img {
    display: block;

    width: 100%;
    height: auto;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    box-sizing: border-box;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 900px) {

    .collab-people-grid {
        grid-template-columns: 1fr 1fr;
        gap: 25px;
    }

    .collab-column {
        padding: 0;
    }

    .collab-column + .collab-column {
        border-left: none;
    }

}


@media screen and (max-width: 650px) {

    .collab-page {
        padding-top: 155px;
    }

    .collab-container {
        width: 86%;
    }

    .collab-title {
        font-size: 42px;
        line-height: 1.05;
    }

    .collab-people {
        padding: 25px 20px;
    }

    .collab-people-grid {
        grid-template-columns: 1fr;
    }

    .collab-people-heading {
        gap: 15px;
    }

    .collab-people-heading h2 {
        font-size: 21px;
    }

}

/* =========================================================
   COLLABORAZIONE SCUOLA-MUSEO
   TIPOGRAFIA UGUALE ALLE ALTRE NOTIZIE
========================================================= */

.collab-page,
.collab-page p,
.collab-page a,
.collab-page span,
.collab-page strong,
.collab-page h1,
.collab-page h2 {
    font-family: "Montserrat", sans-serif;
}


/* TORNA ALLE NOTIZIE */

.collab-back {
    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;
}


/* MATEUREKA · NOTIZIE */

.collab-category {
    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
}


/* TITOLO PRINCIPALE */

.collab-title {
    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;
}


/* TESTO DELLA NOTIZIA */

.collab-text p,
.collab-final-text {
    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;
}


/* TITOLO PERSONAGGI */

.collab-people-heading h2 {
    font-family: "Montserrat", sans-serif;

    font-size: 25px;
    font-weight: 700;

    line-height: 1.25;
}


/* NOMI DEI PERSONAGGI */

.collab-person strong {
    font-family: "Montserrat", sans-serif;

    font-size: 14px;
    font-weight: 700;
}


/* NOMI DEGLI STUDENTI */

.collab-person p {
    font-family: "Montserrat", sans-serif;

    font-size: 14px;
    font-weight: 400;
}

/* =========================================================
   PAGINA INTERVISTA RENZO BALDONI
========================================================= */

.intervista-page {
    width: 100%;
    min-height: 100vh;

    background: #FFFCEB;
    color: #2E4057;

    padding: 190px 0 110px;
}


.intervista-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.intervista-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #DFAE00;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.intervista-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* CATEGORIA */

.intervista-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #DFAE00;
}


/* TITOLO */

.intervista-title {
    max-width: 950px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


/* LINEA GIALLA */

.intervista-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 48px;

    background: #FFD43B;
}


/* TESTO */

.intervista-text {
    max-width: 1050px;

    margin-bottom: 48px;
}


.intervista-text p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


/* =========================================================
   VIDEO
========================================================= */

.intervista-video {
    width: 100%;
    max-width: 1080px;

    margin-top: 35px;
}


.intervista-video a {
    position: relative;

    display: block;

    width: 100%;

    overflow: hidden;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    text-decoration: none;
}


.intervista-video img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;

    transition:
        transform .45s ease,
        filter .35s ease;
}


/* PLAY CENTRALE */

.intervista-play {
    position: absolute;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    width: 82px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 15px;

    background: #FFD43B;
    color: #2E4057;

    font-size: 25px;

    transition:
        transform .3s ease,
        background .3s ease;
}


/* HOVER */

.intervista-video a:hover img {
    transform: scale(1.025);
}


.intervista-video a:hover .intervista-play {
    transform:
        translate(-50%, -50%)
        scale(1.1);
}


/* RESPONSIVE */

@media screen and (max-width: 700px) {

    .intervista-page {
        padding-top: 155px;
    }

    .intervista-container {
        width: 86%;
    }

    .intervista-title {
        font-size: 42px;
        line-height: 1.05;
    }

    .intervista-play {
        width: 68px;
        height: 48px;

        font-size: 20px;
    }

}

/* =========================================================
   PAGINA PREMIO FRONTINO - MATEUREKA
========================================================= */

.frontino-page {
    width: 100%;
    min-height: 100vh;

    background: #FFFCEB;
    color: #2E4057;

    padding: 190px 0 110px;
}


.frontino-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.frontino-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.frontino-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* CATEGORIA */

.frontino-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* TITOLO */

.frontino-title {
    max-width: 950px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


/* LINEA GIALLA */

.frontino-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 48px;

    background: #FFD43B;
}


/* TESTO */

.frontino-text {
    max-width: 1050px;
}


.frontino-text p {
    margin: 0 0 24px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


.frontino-text strong {
    font-weight: 700;
}


/* FIRMA */

.frontino-signature {
    text-align: right;

    font-style: italic;
    font-weight: 500 !important;

    margin-top: 8px !important;
    margin-bottom: 32px !important;
}


/* IMMAGINE */

.frontino-image {
    width: 100%;

    margin-top: 25px;
}


.frontino-image img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    box-sizing: border-box;
}


/* RESPONSIVE */

@media screen and (max-width: 700px) {

    .frontino-page {
        padding-top: 155px;
    }

    .frontino-container {
        width: 86%;
    }

    .frontino-title {
        font-size: 42px;
        line-height: 1.05;
    }

    .frontino-text p {
        font-size: 16px;
    }

}

/* =========================================================
   PAGINA QUADRATO MAGICO "IL PERFETTO"
========================================================= */

.perfetto-page {
    width: 100%;
    min-height: 100vh;

    background: #FFFCEB;
    color: #2E4057;

    padding: 190px 0 110px;
}


.perfetto-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.perfetto-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.perfetto-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* CATEGORIA */

.perfetto-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* TITOLO */

.perfetto-title {
    max-width: 980px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


/* LINEA GIALLA */

.perfetto-title-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 48px;

    background: #FFD43B;
}


/* =========================================================
   TESTO
========================================================= */

.perfetto-text {
    max-width: 1050px;
}


.perfetto-text > p,
.perfetto-info-block p {
    margin: 0 0 26px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


.perfetto-info-block {
    margin-top: 28px;
}


.perfetto-info-block h2 {
    margin: 0 0 8px;

    font-family: "Montserrat", sans-serif;

    font-size: 21px;
    font-weight: 700;

    line-height: 1.3;

    color: #2E4057;
}


/* =========================================================
   CITAZIONE
========================================================= */

.perfetto-quote {
    max-width: 1000px;

    margin: 40px 0 35px;
    padding: 8px 0 8px 28px;

    border-left: 5px solid #FFD43B;

    font-family: "Montserrat", sans-serif;

    font-size: 25px;
    font-weight: 700;

    line-height: 1.35;

    color: #2E4057;
}


/* =========================================================
   GALLERIA
========================================================= */

.perfetto-gallery {
    width: 100%;

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 20px;
}


.perfetto-gallery img {
    width: 100%;
    height: 330px;

    display: block;

    object-fit: cover;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    box-sizing: border-box;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.perfetto-gallery img:hover {
    transform: scale(1.015);

    box-shadow:
        0 14px 30px
        rgba(0, 0, 0, .10);
}


/* DIDASCALIA */

.perfetto-caption {
    margin: 14px 0 20px;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;
    font-weight: 400;

    line-height: 1.5;

    color: #2E4057;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 700px) {

    .perfetto-page {
        padding-top: 155px;
    }

    .perfetto-container {
        width: 86%;
    }

    .perfetto-title {
        font-size: 42px;
        line-height: 1.05;
    }

    .perfetto-gallery {
        grid-template-columns: 1fr;
    }

    .perfetto-gallery img {
        height: 290px;
    }

    .perfetto-quote {
        font-size: 21px;
    }

}

/* =========================================
   PAGINA INTERVISTA RENZO BALDONI
========================================= */

.pagina-notizia {
    width: 100%;
    min-height: 100vh;

    padding: 175px 5% 110px;

    background: #FFFCEB;
    color: #2E4057;

    position: relative;
    overflow: hidden;
}


/* =========================================
   TORNA ALLE NOTIZIE
========================================= */

.notizia-back {
    width: 100%;
    max-width: 1380px;

    margin: 0 auto 38px;
}


.notizia-back a {
    display: inline-flex;
    align-items: center;

    gap: 12px;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 500;

    color: #2E4057;

    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.freccia-back {
    display: inline-block;

    font-family: "Montserrat", sans-serif;
    font-size: 27px;
    font-weight: 400;
    line-height: 1;
}


.notizia-back a:hover {
    color: #FFD43B;
    transform: translateX(-4px);
}


/* =========================================
   TESTATA DELLA NOTIZIA
========================================= */

.notizia-header {
    width: 100%;
    max-width: 1380px;

    margin: 0 auto 42px;

    position: relative;
}


/* MATEUREKA · NOTIZIE */

.notizia-categoria {
    margin: 0 0 20px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 600;

    letter-spacing: 2.5px;

    color: #2E4057;

    text-transform: uppercase;
}


/* TITOLO */

.notizia-header h1 {
    width: 100%;
    max-width: 1250px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 48px;
    font-weight: 800;

    line-height: 1.08;
    letter-spacing: -1.5px;

    color: #2E4057;
}


/* LINEA GIALLA SOTTO IL TITOLO */

.notizia-linea {
    width: 70px;
    height: 5px;

    margin-top: 27px;

    background: #FFD43B;

    border-radius: 20px;
}





/* =========================================
   CONTENUTO
========================================= */

.notizia-contenuto {
    width: 100%;
    max-width: 1380px;

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        minmax(0, 1.1fr)
        minmax(320px, .75fr);

    gap: 70px;

    align-items: start;

    position: relative;
}


/* =========================================
   TESTO
========================================= */

.notizia-testo {
    width: 100%;
    max-width: 610px;

    padding-top: 3px;
}


.notizia-testo p {
    margin: 0 0 32px;

    font-family: "Montserrat", sans-serif;

    font-size: 20px;
    font-weight: 400;

    line-height: 1.62;

    color: #2E4057;
}


.notizia-testo p:last-child {
    margin-bottom: 0;
}


/* =========================================
   IMMAGINE
========================================= */

/* =========================================
   IMMAGINE
========================================= */

.notizia-immagine {
    width: 100%;
    max-width: 500px;

    justify-self: end;
}


.notizia-immagine img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;

    border-radius: 10px;
}




.notizia-immagine img {
    display: block;

    width: 100%;

    aspect-ratio: 1 / 1;

    object-fit: cover;

    border-radius: 10px;
}


/* =========================================
   TABLET
========================================= */

@media screen and (max-width: 1000px) {

    .pagina-notizia {
        padding:
            160px 6%
            90px;
    }


    .notizia-header h1 {
        font-size: 43px;
    }


    .notizia-contenuto {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(360px, .9fr);

        gap: 45px;
    }


    .notizia-testo p {
        font-size: 18px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media screen and (max-width: 750px) {

    .pagina-notizia {
        padding:
            145px 7%
            75px;
    }


    .notizia-back {
        margin-bottom: 32px;
    }


    .notizia-back a {
        font-size: 16px;
    }


    .freccia-back {
        font-size: 24px;
    }


    .notizia-header {
        margin-bottom: 38px;
    }


    .notizia-categoria {
        font-size: 11px;

        letter-spacing: 2px;

        margin-bottom: 16px;
    }


    .notizia-header h1 {
        font-size: 38px;

        line-height: 1.08;

        letter-spacing: -1px;
    }


    .notizia-linea {
        width: 60px;
        height: 4px;

        margin-top: 23px;
    }


    .notizia-header::after {
        width: 48px;
        height: 48px;

        top: -25px;
        right: -10px;

        background-size: 13px 13px;
    }


    .notizia-contenuto {
        grid-template-columns: 1fr;

        gap: 40px;
    }


    .notizia-testo {
        max-width: 100%;
    }


    .notizia-testo p {
        font-size: 17px;
        line-height: 1.65;

        margin-bottom: 25px;
    }


    .notizia-immagine {
        width: 100%;
    }


    .notizia-immagine::before {
        width: 110px;
        height: 110px;

        top: -38px;
        right: -55px;
    }


    .notizia-immagine img {
        aspect-ratio: auto;
        height: auto;
    }

}

/* =========================================================
   PAGINA CORRIERE E NOTIZIARIO
========================================================= */

.corriere-page {
    width: 100%;
    min-height: 100vh;

    background: #FFFCEB;
    color: #2E4057;

    padding: 190px 0 110px;
}


.corriere-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.corriere-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.corriere-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* CATEGORIA */

.corriere-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* TITOLO PRINCIPALE */

.corriere-title {
    max-width: 980px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


/* LINEA GIALLA */

.corriere-title-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 48px;

    background: #FFD43B;
}


/* =========================================================
   SEZIONI
========================================================= */

.corriere-section {
    width: 100%;

    margin-bottom: 65px;
}


.corriere-section h2 {
    margin: 0 0 25px;

    font-family: "Montserrat", sans-serif;

    font-size: 27px;
    font-weight: 700;

    line-height: 1.25;

    color: #2E4057;
}


/* =========================================================
   GALLERIE
========================================================= */

/* =========================================================
   GALLERIA ARTICOLI - IMMAGINI GRANDI UNA SOTTO L'ALTRA
========================================================= */

.corriere-gallery {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 38px;
}

.corriere-gallery-three {
    width: 100%;
}


/* IMMAGINI */

.corriere-gallery img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: contain;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    box-sizing: border-box;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.corriere-gallery img:hover {
    transform: scale(1.01);

    box-shadow: 0 14px 28px rgba(0, 0, 0, .10);
}

/* IMMAGINI */

.corriere-gallery img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    box-sizing: border-box;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


/* HOVER */

.corriere-gallery img:hover {
    transform: scale(1.02);

    box-shadow:
        0 14px 28px
        rgba(0, 0, 0, .10);
}


/* =========================================================
   PRIMA SEZIONE PIÙ IMPORTANTE
========================================================= */

.corriere-section:first-of-type {
    margin-top: 10px;
}




/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 900px) {

    .corriere-gallery-three {
        grid-template-columns: 1fr 1fr;
    }

}


@media screen and (max-width: 650px) {

    .corriere-page {
        padding-top: 155px;
    }

    .corriere-container {
        width: 86%;
    }

    .corriere-title {
        font-size: 42px;
        line-height: 1.05;
    }

    .corriere-gallery-three {
        grid-template-columns: 1fr;
    }

    .corriere-section h2 {
        font-size: 23px;
    }

}

/* =========================================================
   PAGINA SCHICKARD
========================================================= */

.schickard-page {
    width: 100%;
    min-height: 100vh;

    background: #FFFCEB;
    color: #2E4057;

    padding: 190px 0 110px;
}


.schickard-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.schickard-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.schickard-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* CATEGORIA */

.schickard-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* TITOLO */

.schickard-title {
    max-width: 1100px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


/* LINEA GIALLA */

.schickard-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 48px;

    background: #FFD43B;
}


/* =========================================================
   CONTENUTO PRINCIPALE
========================================================= */

.schickard-content {
    display: grid;

    grid-template-columns:
        minmax(0, .95fr)
        minmax(420px, 1.05fr);

    gap: 55px;

    align-items: start;
}


/* TESTO */

.schickard-text p {
    margin: 0 0 28px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


.schickard-text strong {
    font-weight: 700;
}


.schickard-text em {
    font-style: italic;
}


/* =========================================================
   IMMAGINE
========================================================= */

.schickard-figure {
    margin: 0;
}


.schickard-figure img {
    display: block;

    width: 100%;
    height: auto;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    box-sizing: border-box;
}


.schickard-figure figcaption {
    margin-top: 12px;

    text-align: center;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;
    font-weight: 400;

    font-style: italic;

    color: #2E4057;
}


/* =========================================================
   CONDIVISIONE
========================================================= */

.schickard-share {
    max-width: 610px;

    margin-top: 30px;

    padding: 18px 22px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 25px;

    border: 1px solid rgba(46, 64, 87, .18);
    border-radius: 10px;
}


.schickard-share > span {
    font-family: "Montserrat", sans-serif;

    font-size: 15px;
    font-weight: 500;

    color: #2E4057;
}


.schickard-social {
    display: flex;
    align-items: center;

    gap: 20px;
}


.schickard-social a {
    width: 46px;
    height: 46px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 2px solid #2E4057;
    border-radius: 50%;

    color: #2E4057;
    text-decoration: none;

    font-size: 20px;

    transition:
        background .25s ease,
        color .25s ease,
        transform .25s ease;
}


.schickard-social a:hover {
    background: #FFD43B;
    color: #2E4057;

    transform: translateY(-3px);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 900px) {

    .schickard-content {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .schickard-figure {
        max-width: 680px;
    }

}


@media screen and (max-width: 650px) {

    .schickard-page {
        padding-top: 155px;
    }

    .schickard-container {
        width: 86%;
    }

    .schickard-title {
        font-size: 42px;
        line-height: 1.05;
    }

    .schickard-share {
        align-items: flex-start;
        flex-direction: column;
    }

}

/* =========================================================
   PAGINA COCLEA DI ARCHIMEDE
========================================================= */

.coclea-page {
    width: 100%;
    min-height: 100vh;

    background: #FFFCEB;
    color: #2E4057;

    padding: 190px 0 110px;
}


.coclea-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.coclea-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.coclea-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* CATEGORIA */

.coclea-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* TITOLO */

.coclea-title {
    max-width: 1000px;
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


/* LINEA GIALLA */

.coclea-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 38px;

    background: #FFD43B;
}


/* =========================================================
   IMMAGINE
========================================================= */

.coclea-image {
    width: 100%;
    margin: 0 0 30px;
}


.coclea-image img {
    display: block;

    width: 100%;
    height: auto;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    box-sizing: border-box;
}


/* =========================================================
   TESTO
========================================================= */

.coclea-text {
    max-width: 1080px;
}


.coclea-text p {
    margin: 0 0 24px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 700px) {

    .coclea-page {
        padding-top: 155px;
    }

    .coclea-container {
        width: 86%;
    }

    .coclea-title {
        font-size: 42px;
        line-height: 1.05;
        letter-spacing: -1.5px;
    }

    .coclea-line {
        margin-bottom: 30px;
    }

    .coclea-text p {
        font-size: 16px;
    }

}

/* =========================================================
   PAGINA MATEMATICA ANTICA
========================================================= */

.matantica-page {
    width: 100%;
    min-height: 100vh;

    background: #FFFCEB;
    color: #2E4057;

    padding: 190px 0 110px;
}


.matantica-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.matantica-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.matantica-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* CATEGORIA */

.matantica-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* TITOLO */

.matantica-title {
    max-width: 1050px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


/* LINEA GIALLA */

.matantica-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 48px;

    background: #FFD43B;
}


/* =========================================================
   CONTENUTO
========================================================= */

.matantica-content {
    width: 100%;

    display: grid;

    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(300px, .75fr);

    gap: 65px;

    align-items: start;
}


/* =========================================================
   TESTO
========================================================= */

.matantica-text p {
    margin: 0 0 42px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.9;

    color: #2E4057;
}


.matantica-text strong {
    font-weight: 700;
}


/* =========================================================
   COPERTINA
========================================================= */

.matantica-cover {
    margin: 0;
    width: 100%;
}


.matantica-cover img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: contain;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    box-sizing: border-box;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.matantica-cover img:hover {
    transform: scale(1.015);

    box-shadow: 0 14px 30px rgba(0, 0, 0, .10);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 900px) {

    .matantica-content {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .matantica-cover {
        width: 65%;
        max-width: 450px;
    }

}


@media screen and (max-width: 650px) {

    .matantica-page {
        padding-top: 155px;
    }

    .matantica-container {
        width: 86%;
    }

    .matantica-title {
        font-size: 42px;
        line-height: 1.05;
        letter-spacing: -1.5px;
    }

    .matantica-text p {
        font-size: 16px;
        line-height: 1.75;
        margin-bottom: 30px;
    }

    .matantica-cover {
        width: 100%;
    }

}

/* =========================================================
   PAGINA NUOVE ACQUISIZIONI
========================================================= */

.acquisizioni-page {
    width: 100%;
    min-height: 100vh;

    padding: 190px 0 110px;

    background: #FFFCEB;
    color: #2E4057;
}


.acquisizioni-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.acquisizioni-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.acquisizioni-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* CATEGORIA */

.acquisizioni-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* =========================================================
   TITOLO
========================================================= */

.acquisizioni-title {
    max-width: 1050px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


.acquisizioni-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 42px;

    background: #FFD43B;
}


/* =========================================================
   INTRODUZIONE
========================================================= */

.acquisizioni-intro {
    max-width: 800px;

    margin-bottom: 55px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.7;

    color: #2E4057;
}


.acquisizioni-intro p {
    margin: 0 0 5px;
}


.acquisizioni-intro ul {
    margin: 0;
    padding-left: 27px;
}


.acquisizioni-intro li {
    margin-bottom: 3px;
}


/* =========================================================
   GALLERIA
========================================================= */

.acquisizioni-gallery {
    width: 100%;

    display: grid;

    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 28px;

    align-items: start;
}


/* SINGOLO ELEMENTO */

.acquisizioni-item {
    min-width: 0;
}


/* =========================================================
   IMMAGINI
========================================================= */

.acquisizioni-image {
    width: 100%;
    height: 310px;

    margin-bottom: 20px;

    overflow: hidden;

    border: 3px solid #FFD43B;
    border-radius: 12px;
}


.acquisizioni-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .4s ease;
}


.acquisizioni-item:hover .acquisizioni-image img {
    transform: scale(1.035);
}


/* =========================================================
   TITOLI DELLE IMMAGINI
========================================================= */

.acquisizioni-item h2 {
    margin: 0 0 8px;

    font-family: "Montserrat", sans-serif;

    font-size: 18px;
    font-weight: 700;

    line-height: 1.35;

    color: #2E4057;
}


/* =========================================================
   DESCRIZIONI
========================================================= */

.acquisizioni-item p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;
    font-weight: 400;

    line-height: 1.55;

    color: #2E4057;
}


/* PICCOLO DETTAGLIO GIALLO */

.acquisizioni-small-line {
    width: 42px;
    height: 3px;

    margin-top: 18px;

    background: #FFD43B;
}


/* =========================================================
   TABLET
========================================================= */

@media screen and (max-width: 1000px) {

    .acquisizioni-gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 45px 25px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 650px) {

    .acquisizioni-page {
        padding-top: 155px;
    }

    .acquisizioni-container {
        width: 86%;
    }

    .acquisizioni-title {
        font-size: 42px;
        line-height: 1.05;
        letter-spacing: -1.5px;
    }

    .acquisizioni-intro {
        font-size: 16px;
        margin-bottom: 40px;
    }

    .acquisizioni-gallery {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .acquisizioni-image {
        height: auto;
        aspect-ratio: 1 / 1;
    }

}

/* =========================================================
   PAGINA MOSTRA ENIGMA
========================================================= */

.enigma-page {
    width: 100%;
    min-height: 100vh;

    padding: 190px 0 110px;

    background: #FFFCEB;
    color: #2E4057;
}


.enigma-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.enigma-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.enigma-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* CATEGORIA */

.enigma-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* =========================================================
   TITOLO
========================================================= */

.enigma-title {
    max-width: 1100px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


/* LINEA GIALLA */

.enigma-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 48px;

    background: #FFD43B;
}


/* =========================================================
   IMMAGINE + TESTO
========================================================= */

.enigma-content {
    width: 100%;

    display: grid;

    grid-template-columns:
        minmax(380px, .95fr)
        minmax(0, 1.05fr);

    gap: 50px;

    align-items: start;
}


/* =========================================================
   IMMAGINE
========================================================= */

.enigma-image {
    width: 100%;
    margin: 0;
}


.enigma-image img {
    display: block;

    width: 100%;
    height: 520px;

    object-fit: cover;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    box-sizing: border-box;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


.enigma-image img:hover {
    transform: scale(1.012);

    box-shadow: 0 14px 30px rgba(0, 0, 0, .10);
}


/* =========================================================
   TESTO
========================================================= */

.enigma-text {
    padding-top: 8px;
}


.enigma-text p {
    margin: 0 0 32px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


.enigma-text strong {
    font-weight: 700;
}


.enigma-text em {
    font-style: italic;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 850px) {

    .enigma-content {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .enigma-image {
        max-width: 650px;
    }

    .enigma-image img {
        height: auto;
    }

}


@media screen and (max-width: 650px) {

    .enigma-page {
        padding-top: 155px;
    }

    .enigma-container {
        width: 86%;
    }

    .enigma-title {
        font-size: 42px;
        line-height: 1.05;
        letter-spacing: -1.5px;
    }

    .enigma-line {
        margin-bottom: 35px;
    }

    .enigma-text p {
        font-size: 16px;
        line-height: 1.75;
    }

}

/* =========================================================
   PAGINA MATEMATICA SENZA FRONTIERE
========================================================= */

.frontiere-page{
    width:100%;
    min-height:100vh;
    background:#FFFCEB;
    color:#2E4057;
    padding:190px 0 110px;
}

.frontiere-container{
    width:88%;
    max-width:1180px;
    margin:0 auto;
}


/* TORNA ALLE NOTIZIE */

.frontiere-back{
    display:inline-flex;
    align-items:center;
    margin-bottom:42px;

    font-family:"Montserrat",sans-serif;
    font-size:15px;
    font-weight:700;

    color:#FFD43B;
    text-decoration:none;

    transition:.25s ease;
}

.frontiere-back:hover{
    color:#2E4057;
    transform:translateX(-4px);
}


/* CATEGORIA */

.frontiere-category{
    margin:0 0 18px;

    font-family:"Montserrat",sans-serif;
    font-size:13px;
    font-weight:700;
    letter-spacing:2px;

    color:#2E4057;
}


/* TITOLO */

.frontiere-title{
    max-width:1080px;
    margin:0;

    font-family:"Montserrat",sans-serif;
    font-size:clamp(48px,5.7vw,78px);
    font-weight:800;

    line-height:.98;
    letter-spacing:-2.5px;

    color:#2E4057;
}


/* LINEA GIALLA */

.frontiere-line{
    width:60px;
    height:3px;

    margin:28px 0 48px;

    background:#FFD43B;
}


/* CONTENUTO */

.frontiere-content{
    display:grid;
    grid-template-columns: 0.95fr 1.35fr;
    gap:55px;

    align-items:start;
}


/* IMMAGINE */

.frontiere-image{
    margin:0;
    width:100%;
}

.frontiere-image img{
    width:100%;
    height:445px;

    display:block;
    object-fit:cover;

    border:3px solid #FFD43B;
    border-radius:12px;

    box-sizing:border-box;
}


/* TESTO */

.frontiere-text{
    padding-top:4px;
}

.frontiere-text p{
    margin:0;

    font-family:"Montserrat",sans-serif;
    font-size:17px;
    font-weight:400;

    line-height:1.8;
    color:#2E4057;
}

.frontiere-text strong{
    font-weight:700;
}


/* RESPONSIVE */

@media screen and (max-width:900px){

    .frontiere-content{
        grid-template-columns:1fr;
        gap:35px;
    }

    .frontiere-image{
        max-width:650px;
    }

    .frontiere-image img{
        height:auto;
    }

}

@media screen and (max-width:650px){

    .frontiere-page{
        padding-top:155px;
    }

    .frontiere-container{
        width:86%;
    }

    .frontiere-title{
        font-size:42px;
        line-height:1.05;
        letter-spacing:-1.5px;
    }

    .frontiere-text p{
        font-size:16px;
        line-height:1.75;
    }

}

/* =========================================================
   PRIMA GRANDE FESTA DELLA MATEMATICA
========================================================= */

.festa-matematica-page {
    width: 100%;
    min-height: 100vh;

    padding: 190px 0 110px;

    background: #FFFCEB;
    color: #2E4057;
}

.festa-matematica-container {
    width: 88%;
    max-width: 1180px;
    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.festa-matematica-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition: color .25s ease, transform .25s ease;
}

.festa-matematica-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* CATEGORIA */

.festa-matematica-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;

    color: #2E4057;
}


/* TITOLO */

.festa-matematica-title {
    max-width: 1100px;
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


/* LINEA GIALLA */

.festa-matematica-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 48px;

    background: #FFD43B;
}


/* =========================================================
   IMMAGINE + TESTO
========================================================= */

.festa-matematica-content {
    width: 100%;

    display: grid;
    grid-template-columns: minmax(300px, .75fr) minmax(0, 1.45fr);

    gap: 55px;
    align-items: start;
}


/* IMMAGINE */

.festa-matematica-image {
    width: 100%;
    margin: 0;
}

.festa-matematica-image img {
    display: block;

    width: 100%;
    height: 520px;

    object-fit: cover;
    object-position: center;

    border: 3px solid #FFD43B;
    border-radius: 12px;

    box-sizing: border-box;
}


/* TESTO */

.festa-matematica-text {
    padding-top: 5px;
}

.festa-matematica-text p {
    margin: 0 0 38px;

    font-family: "Montserrat", sans-serif;
    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}

.festa-matematica-text p:last-child {
    margin-bottom: 0;
}


/* TITOLO DELLA MOSTRA */

.festa-matematica-text strong {
    font-weight: 700;
    color: #2E4057;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 900px) {

    .festa-matematica-content {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .festa-matematica-image {
        max-width: 500px;
    }

    .festa-matematica-image img {
        height: auto;
    }
}


@media screen and (max-width: 650px) {

    .festa-matematica-page {
        padding-top: 155px;
    }

    .festa-matematica-container {
        width: 86%;
    }

    .festa-matematica-title {
        font-size: 42px;
        line-height: 1.05;
        letter-spacing: -1.5px;
    }

    .festa-matematica-line {
        margin-bottom: 35px;
    }

    .festa-matematica-text p {
        font-size: 16px;
        line-height: 1.75;
        margin-bottom: 28px;
    }
}

/* =========================================================
   APPELLO MAHMOUD VAHIDNIA
========================================================= */

.appello-page {
    width: 100%;
    min-height: 100vh;

    padding: 190px 0 110px;

    background: #FFFCEB;
    color: #2E4057;
}


.appello-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* =========================================================
   TORNA ALLE NOTIZIE
========================================================= */

.appello-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.appello-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* =========================================================
   CATEGORIA
========================================================= */

.appello-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* =========================================================
   TITOLO
========================================================= */

.appello-title {
    max-width: 1120px;
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


/* LINEA GIALLA */

.appello-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 35px;

    background: #FFD43B;
}


/* =========================================================
   DESTINATARIO
========================================================= */

.appello-destinatario {
    margin: 0 0 35px;

    font-family: "Montserrat", sans-serif;

    font-size: 20px;
    font-weight: 700;
    font-style: italic;

    line-height: 1.5;

    color: #2E4057;
}


/* =========================================================
   FOTO + LETTERA
========================================================= */

.appello-content {
    width: 100%;

    display: grid;

    grid-template-columns:
        minmax(250px, .55fr)
        minmax(0, 1.45fr);

    gap: 50px;

    align-items: start;
}


/* =========================================================
   FOTO
========================================================= */

.appello-photo {
    width: 100%;
    margin: 0;
}


.appello-photo img {
    display: block;

    width: 100%;
    height: 390px;

    object-fit: cover;
    object-position: center;

    box-sizing: border-box;

    border: 3px solid #FFD43B;
    border-radius: 12px;
}


/* NOME SOTTO FOTO */

.appello-photo figcaption {
    margin-top: 12px;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;
    font-weight: 500;
    font-style: italic;

    text-align: center;

    color: #2E4057;
}


/* =========================================================
   LETTERA
========================================================= */

.appello-lettera {
    padding-top: 0;
}


.appello-lettera > p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.85;

    color: #2E4057;
}


/* =========================================================
   FIRMA
========================================================= */

.appello-firma {
    margin-top: 20px;

    text-align: right;
}


.appello-firma p {
    margin: 0 0 4px;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;
    font-weight: 500;

    line-height: 1.5;

    color: #2E4057;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 850px) {

    .appello-content {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .appello-photo {
        width: 55%;
        max-width: 350px;
    }

    .appello-photo img {
        height: auto;
    }

}


@media screen and (max-width: 650px) {

    .appello-page {
        padding-top: 155px;
    }

    .appello-container {
        width: 86%;
    }

    .appello-title {
        font-size: 42px;
        line-height: 1.05;
        letter-spacing: -1.5px;
    }

    .appello-destinatario {
        font-size: 18px;
        margin-bottom: 30px;
    }

    .appello-photo {
        width: 75%;
    }

    .appello-lettera > p {
        font-size: 16px;
        line-height: 1.75;
    }

}


/* =========================================================
   DA NON PERDERE
========================================================= */

.nonperdere-page {
    width: 100%;
    min-height: 100vh;

    padding: 190px 0 120px;

    background: #FFFCEB;
    color: #2E4057;
}

.nonperdere-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* =========================================================
   SINGOLO PROGETTO
========================================================= */

.nonperdere-item {
    display: grid;
    grid-template-columns: 1.15fr .85fr;

    gap: 70px;
    align-items: center;

    margin-bottom: 80px;
}


/* secondo progetto invertito */

.nonperdere-item-reverse {
    grid-template-columns: .85fr 1.15fr;
}

/* Alternanza immagine/testo esclusivamente su desktop */
@media screen and (min-width: 851px) {
    .nonperdere-item:nth-of-type(odd) {
        grid-template-columns: 1.15fr .85fr;
    }

    .nonperdere-item:nth-of-type(odd) .nonperdere-image {
        grid-column: 1;
        grid-row: 1;
    }

    .nonperdere-item:nth-of-type(odd) .nonperdere-info {
        grid-column: 2;
        grid-row: 1;
    }

    .nonperdere-item:nth-of-type(even) {
        grid-template-columns: .85fr 1.15fr;
    }

    .nonperdere-item:nth-of-type(even) .nonperdere-info {
        grid-column: 1;
        grid-row: 1;
    }

    .nonperdere-item:nth-of-type(even) .nonperdere-image {
        grid-column: 2;
        grid-row: 1;
    }
}


/* =========================================================
   IMMAGINI
========================================================= */

.nonperdere-image {
    width: 100%;
    overflow: hidden;

    border-radius: 10px;
}

.nonperdere-image img {
    display: block;

    width: 100%;
    height: 370px;

    object-fit: cover;

    transition: transform .4s ease;
}


/* leggerissimo movimento della foto */

.nonperdere-item:hover .nonperdere-image img {
    transform: scale(1.02);
}


/* =========================================================
   TESTO
========================================================= */

.nonperdere-info {
    width: 100%;
}


.nonperdere-info h2 {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;
    font-size: 27px;
    font-weight: 700;

    line-height: 1.2;

    color: #2E4057;
}


.nonperdere-info p {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 400;

    line-height: 1.7;

    color: #2E4057;
}


/* =========================================================
   LINEA GIALLA
========================================================= */

.nonperdere-line {
    display: block;

    width: 42px;
    height: 3px;

    margin-bottom: 20px;

    background: #FFD43B;

    transition: width .4s ease;
}


/* 
   PASSANDO SULL'IMMAGINE O SUL TITOLO
   LA LINEA SI ALLUNGA
*/

.nonperdere-item:has(.nonperdere-image:hover) .nonperdere-line,
.nonperdere-info:has(h2:hover) .nonperdere-line,
.nonperdere-info:has(.nonperdere-more:hover) .nonperdere-line {
    width: 190px;
}
/* =========================================================
   LINK
========================================================= */

.nonperdere-link {
    display: inline-block;

    margin-top: 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #2E4057;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.nonperdere-link::first-letter {
    color: #FFD43B;
}


.nonperdere-link:hover {
    color: #FFD43B;
    transform: translateX(4px);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 850px) {

    .nonperdere-item,
    .nonperdere-item-reverse {
        grid-template-columns: 1fr;

        gap: 30px;
        margin-bottom: 65px;
    }


    /* sul secondo progetto riportiamo prima l'immagine */

    .nonperdere-item-reverse .nonperdere-image {
        order: 1;
    }

    .nonperdere-item-reverse .nonperdere-info {
        order: 2;
    }


    .nonperdere-image img {
        height: auto;
    }
}


@media screen and (max-width: 650px) {

    .nonperdere-page {
        padding-top: 155px;
    }

    .nonperdere-container {
        width: 86%;
    }

    .nonperdere-info h2 {
        font-size: 23px;
    }

    .nonperdere-info p {
        font-size: 15px;
    }

}

/* =========================================================
   SCOPRI DI PIÙ
========================================================= */

.nonperdere-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin-top: 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #2E4057;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}

.nonperdere-more span {
    color: #FFD43B;
    font-size: 19px;

    transition: transform .25s ease;
}


/* HOVER */

.nonperdere-more:hover {
    color: #FFD43B;
}

.nonperdere-more:hover span {
    transform: translateX(5px);
}

/* =========================================================
   TITOLO GLI IMPERDIBILI
========================================================= */

.nonperdere-header {
    margin-bottom: 65px;
}

.nonperdere-header h1 {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;
    line-height: 1;

    color: #2E4057;
}

.nonperdere-title-line {
    width: 65px;
    height: 4px;

    margin-top: 22px;

    background: #FFD43B;
}

/* =========================================================
   MONOCORDO DI PITAGORA
========================================================= */

.monocordo-page {
    width: 100%;
    min-height: 100vh;

    padding: 190px 0 110px;

    background: #FFFCEB;
    color: #2E4057;
}

.monocordo-container {
    width: 88%;
    max-width: 1180px;
    margin: 0 auto;
}


/* =========================================================
   TORNA ALLE NOTIZIE
========================================================= */

.monocordo-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 40px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #2E4057;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}

.monocordo-back:hover {
    color: #FFD43B;
    transform: translateX(-4px);
}


/* =========================================================
   CATEGORIA
========================================================= */

.monocordo-category {
    margin: 0 0 16px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2.5px;

    color: #2E4057;
}


/* =========================================================
   TITOLO
========================================================= */

.monocordo-title {
    max-width: 1100px;
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(46px, 5.2vw, 72px);
    font-weight: 800;

    line-height: 1.02;
    letter-spacing: -2px;

    color: #2E4057;
}


/* LINEA GIALLA */

.monocordo-title-line {
    width: 65px;
    height: 4px;

    margin: 26px 0 30px;

    background: #FFD43B;
}


/* =========================================================
   TESTI
========================================================= */

.monocordo-intro,
.monocordo-body {
    width: 100%;
}

.monocordo-intro p,
.monocordo-body p,
.monocordo-body li {
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 400;

    line-height: 1.7;

    color: #2E4057;
}

.monocordo-intro p {
    margin: 0;
}

.monocordo-body p {
    margin: 0 0 24px;
}

.monocordo-intro strong,
.monocordo-body strong {
    font-weight: 700;
}

.monocordo-intro em {
    font-style: italic;
}


/* =========================================================
   IMMAGINE
========================================================= */

.monocordo-image {
    width: 82%;
    max-width: 900px;

    margin: 35px auto 35px;
}

.monocordo-image img {
    display: block;

    width: 100%;
    height: auto;

    border: 3px solid #FFD43B;
    border-radius: 10px;

    box-sizing: border-box;
}


/* =========================================================
   ELENCO
========================================================= */

.monocordo-body ul {
    margin: 8px 0 28px;
    padding-left: 28px;
}

.monocordo-body li {
    margin-bottom: 5px;
    padding-left: 5px;
}

.monocordo-body li::marker {
    color: #FFD43B;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 850px) {

    .monocordo-image {
        width: 100%;
    }

}


@media screen and (max-width: 650px) {

    .monocordo-page {
        padding-top: 155px;
    }

    .monocordo-container {
        width: 86%;
    }

    .monocordo-title {
        font-size: 40px;
        line-height: 1.05;
        letter-spacing: -1.2px;
    }

    .monocordo-category {
        font-size: 11px;
        letter-spacing: 2px;
    }

    .monocordo-intro p,
    .monocordo-body p,
    .monocordo-body li {
        font-size: 15px;
        line-height: 1.7;
    }

    .monocordo-image {
        margin: 30px auto;
    }

}

/* =========================================================
   SEZIONE PERMANENTE ANTICO EGITTO
========================================================= */

.egitto-page {
    width: 100%;
    min-height: 100vh;

    padding: 190px 0 110px;

    background: #FFFCEB;
    color: #2E4057;
}

.egitto-container {
    width: 88%;
    max-width: 1180px;
    margin: 0 auto;
}


/* TORNA ALLE NOTIZIE */

.egitto-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 35px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}

.egitto-back:visited {
    color: #FFD43B;
}

.egitto-back:hover,
.egitto-back:focus-visible,
.egitto-back:active {
    color: #2E4057;
    transform: translateX(-4px);
}


/* =========================================================
   CATEGORIA
========================================================= */

.egitto-category {
    margin: 0 0 15px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2.5px;

    color: #2E4057;
}


/* =========================================================
   TITOLO
========================================================= */

.egitto-title {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.5vw, 74px);
    font-weight: 800;

    line-height: 1;
    letter-spacing: -2px;

    color: #2E4057;
}

.egitto-title-line {
    width: 65px;
    height: 4px;

    margin: 25px 0 30px;

    background: #FFD43B;
}


/* =========================================================
   IMMAGINE PRINCIPALE
========================================================= */

.egitto-hero {
    width: 82%;
    max-width: 950px;

    margin: 0 auto 30px;
}
.egitto-hero img {
    display: block;

    width: 100%;
    height: auto;

    border: 3px solid #FFD43B;
    border-radius: 10px;

    box-sizing: border-box;
}


/* =========================================================
   TESTO
========================================================= */

.egitto-text {
    margin-top: 30px;
}

.egitto-text p {
    margin: 0 0 20px;

    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 400;

    line-height: 1.7;

    color: #2E4057;
}

.egitto-text em {
    font-style: italic;
}


/* =========================================================
   LINK APPROFONDIMENTO
========================================================= */

.egitto-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin: 5px 0 35px;

    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 600;

    color: #2E4057;
    text-decoration: none;

    position: relative;

    transition: color .25s ease;
}

.egitto-more::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: -8px;

    width: 55px;
    height: 3px;

    background: #FFD43B;

    transition: width .4s ease;
}

.egitto-more span {
    color: #FFD43B;
    font-size: 21px;

    transition: transform .3s ease;
}

.egitto-more:hover {
    color: #2E4057;
}

.egitto-more:hover::after {
    width: 180px;
}

.egitto-more:hover span {
    transform: translateX(5px);
}


/* =========================================================
   DUE IMMAGINI
========================================================= */

.egitto-gallery {
    display: grid;
    grid-template-columns: repeat(2, 1fr);

    gap: 35px;

    margin-bottom: 55px;
}

.egitto-gallery figure {
    margin: 0;
}

.egitto-gallery img {
    display: block;

    width: 100%;
    height: 260px;

    object-fit: cover;

    border: 3px solid #FFD43B;
    border-radius: 10px;

    box-sizing: border-box;
}

.egitto-gallery figcaption {
    margin-top: 10px;

    font-family: "Montserrat", sans-serif;
    font-size: 14px;
    font-weight: 500;
    font-style: italic;

    text-align: center;

    color: #2E4057;
}


/* =========================================================
   RICHIEDI INFORMAZIONI
========================================================= */

.egitto-contact {
    margin-top: 30px;
}

.egitto-contact h2 {
    margin: 0;

    font-family: "Montserrat", sans-serif;
    font-size: 32px;
    font-weight: 800;

    color: #2E4057;
}

.egitto-contact-line {
    width: 55px;
    height: 4px;

    margin: 16px 0 25px;

    background: #FFD43B;
}

.egitto-contact-links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 18px 46px;
}

.egitto-contact-link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 7px 0;
    color: #2E4057;
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.45;
    text-decoration: none;
}

.egitto-contact-link i {
    color: #FFD43B;
    font-size: 18px;
    transition: transform .25s ease;
}

.egitto-contact-link span {
    position: relative;
}

.egitto-contact-link span::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -4px;
    height: 2px;
    background: #FFD43B;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .25s ease;
}

.egitto-contact-link:hover span::after,
.egitto-contact-link:focus-visible span::after {
    transform: scaleX(1);
}

.egitto-contact-link:hover i,
.egitto-contact-link:focus-visible i {
    transform: translateY(-2px);
}

.egitto-contact-link:focus-visible {
    outline: 2px solid #FFD43B;
    outline-offset: 5px;
}


/* =========================================================
   FORM
========================================================= */

.egitto-form {
    display: grid;

    grid-template-columns:
        1fr
        1fr
        1.15fr;

    gap: 28px;

    align-items: start;
}

.egitto-field {
    display: flex;
    flex-direction: column;
}

.egitto-field label {
    margin-bottom: 8px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 600;

    color: #2E4057;
}

.egitto-field input,
.egitto-field textarea {
    width: 100%;

    padding: 13px 15px;

    box-sizing: border-box;

    font-family: "Montserrat", sans-serif;
    font-size: 14px;

    color: #2E4057;
    background: #ffffff;

    border: 1px solid rgba(46, 64, 87, .25);
    border-radius: 7px;

    outline: none;

    transition:
        border-color .25s ease,
        box-shadow .25s ease;
}

.egitto-field textarea {
    height: 100px;
    resize: vertical;
}

.egitto-field input:focus,
.egitto-field textarea:focus {
    border-color: #FFD43B;

    box-shadow:
        0 0 0 3px rgba(255, 212, 59, .18);
}


/* =========================================================
   PULSANTE
========================================================= */

.egitto-submit {
    grid-column: 1 / -1;
}

.egitto-submit button {
    padding: 13px 23px;

    border: none;
    border-radius: 30px;

    background: #FFD43B;
    color: #2E4057;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 800;

    cursor: pointer;

    transition:
        transform .25s ease,
        background .25s ease;
}

.egitto-submit button:hover {
    transform: translateY(-3px);
    background: #2E4057;
    color: #FFFCEB;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 850px) {

    .egitto-hero {
        width: 100%;
    }

    .egitto-gallery {
        grid-template-columns: 1fr;
    }

    .egitto-form {
        grid-template-columns: 1fr 1fr;
    }

    .egitto-field-message {
        grid-column: 1 / -1;
    }
}


@media screen and (max-width: 650px) {

    .egitto-page {
        padding-top: 155px;
    }

    .egitto-container {
        width: 86%;
    }

    .egitto-title {
        font-size: 40px;
        line-height: 1.05;
        letter-spacing: -1px;
    }

    .egitto-hero img {
        height: auto;
    }

    .egitto-text p {
        font-size: 15px;
    }

    .egitto-more {
        font-size: 16px;
    }

    .egitto-contact-links {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .egitto-contact-link {
        font-size: 16px;
    }

    .egitto-form {
        grid-template-columns: 1fr;
    }

    .egitto-field-message,
    .egitto-submit {
        grid-column: auto;
    }

}

/* =========================================================
   PAGINA QUADRATI MAGICI
========================================================= */

.quadrati-page {
    width: 100%;
    min-height: 100vh;

    background: #FFFCEB;
    color: #2E4057;

    padding: 190px 0 110px;
}


.quadrati-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* =========================================================
   TORNA INDIETRO
========================================================= */

.quadrati-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;
    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.quadrati-back:hover {
    color: #2E4057;
    transform: translateX(-4px);
}


/* =========================================================
   INTRO
========================================================= */

.quadrati-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;
    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


.quadrati-intro h1 {
    max-width: 1050px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


.quadrati-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 38px;

    background: #FFD43B;
}


.quadrati-intro-text {
    max-width: 1080px;
}


.quadrati-intro-text p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


/* =========================================================
   LA MOSTRA
========================================================= */

.quadrati-mostra {
    margin-top: 55px;
}


.quadrati-mostra h2 {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 38px;
    font-weight: 800;

    line-height: 1.1;
    letter-spacing: -1px;

    color: #2E4057;
}


.quadrati-small-line {
    width: 60px;
    height: 3px;

    margin: 18px 0 32px;

    background: #FFD43B;
}


/* =========================================================
   PRIMA GRIGLIA
========================================================= */

.quadrati-mostra-grid {
    display: grid;

    grid-template-columns:
        minmax(280px, .85fr)
        minmax(0, 1.55fr);

    gap: 45px;

    align-items: start;
}


.quadrati-figure {
    margin: 0;
}


.quadrati-figure img {
    display: block;

    width: 100%;
    height: auto;

    border-radius: 10px;
}


.quadrati-figure figcaption {
    margin-top: 10px;

    text-align: center;

    font-family: "Montserrat", sans-serif;

    font-size: 14px;
    font-weight: 400;
    font-style: italic;

    color: #2E4057;
}


.quadrati-mostra-text p,
.quadrati-paragrafo {
    margin: 0 0 28px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


/* =========================================================
   SECONDA PARTE MOSTRA
========================================================= */

.quadrati-mostra-seconda {
    display: grid;

    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(260px, .75fr);

    gap: 45px;

    align-items: start;

    margin-top: 35px;
}


.quadrati-figure-small {
    max-width: 380px;
}


.quadrati-paragrafo {
    margin-top: 30px;
}


/* =========================================================
   SATOR
========================================================= */

.quadrati-sator {
    width: 330px;

    margin: 35px auto;
}


.quadrati-sator img {
    display: block;

    width: 100%;
    height: auto;

    border-radius: 10px;
}


.quadrati-sator figcaption {
    margin-top: 10px;

    text-align: center;

    font-family: "Montserrat", sans-serif;

    font-size: 14px;
    font-style: italic;

    color: #2E4057;
}


/* =========================================================
   ELENCO QUADRATI
========================================================= */

.quadrati-elenco {
    width: 100%;

    margin-top: 45px;

    border-top: 1px solid rgba(46, 64, 87, .18);
}


/* SINGOLO ELEMENTO */

.quadrato-item {
    position: relative;

    display: grid;

    grid-template-columns:
        65px
        minmax(0, 1fr);

    gap: 25px;

    padding: 32px 0;

    border-bottom: 1px solid rgba(46, 64, 87, .18);
}


/* NUMERO LATERALE */

.quadrato-number {
    padding-top: 2px;

    font-family: "Montserrat", sans-serif;

    font-size: 14px;
    font-weight: 700;

    color: #FFD43B;
}


/* CONTENUTO */

.quadrato-content h3 {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 24px;
    font-weight: 800;

    line-height: 1.2;

    color: #2E4057;
}


.quadrato-content h3 span {
    font-weight: 600;
}


.quadrato-item-line {
    width: 42px;
    height: 3px;

    margin: 13px 0 16px;

    background: #FFD43B;

    transition: width .35s ease;
}


.quadrato-item:hover .quadrato-item-line {
    width: 110px;
}


.quadrato-content p {
    max-width: 950px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 16px;
    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;
}


/* =========================================================
   ELEMENTI CON IMMAGINE
========================================================= */

.quadrato-item-image {
    grid-template-columns:
        65px
        280px
        minmax(0, 1fr);

   gap: 35px;
    align-items: start;
}


.quadrato-thumb {
    width: 100%;

    margin: 0;
}


.quadrato-thumb img {
    display: block;

    width: 100%;
    height: auto;

    border-radius: 8px;
}


.quadrato-thumb figcaption {
    margin-top: 9px;

    font-family: "Montserrat", sans-serif;

    font-size: 12px;
    font-weight: 400;
    font-style: italic;

    line-height: 1.4;

    color: #2E4057;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 850px) {

    .quadrati-mostra-grid,
    .quadrati-mostra-seconda {
        grid-template-columns: 1fr;

        gap: 30px;
    }


    .quadrati-figure-small {
        max-width: 100%;
    }


    .quadrato-item-image {
        grid-template-columns:
            50px
            150px
            minmax(0, 1fr);
    }

}


@media screen and (max-width: 650px) {

    .quadrati-page {
        padding-top: 155px;
    }


    .quadrati-container {
        width: 86%;
    }


    .quadrati-intro h1 {
        font-size: 42px;
        line-height: 1.05;
        letter-spacing: -1.5px;
    }


    .quadrati-intro-text p,
    .quadrati-mostra-text p,
    .quadrati-paragrafo {
        font-size: 16px;
        line-height: 1.75;
    }


    .quadrati-mostra h2 {
        font-size: 30px;
    }


    .quadrato-item,
    .quadrato-item-image {
        grid-template-columns: 1fr;

        gap: 15px;

        padding: 28px 0;
    }


    .quadrato-number {
        padding: 0;
    }


    .quadrato-thumb {
        max-width: 250px;
    }


    .quadrato-content h3 {
        font-size: 21px;
    }


    .quadrato-content p {
        font-size: 15px;
    }


    .quadrati-sator {
        width: 100%;
        max-width: 330px;
    }

}


/* =========================================================
   PAGINA FRATTALI
   frattali.html
========================================================= */

.frattali-page {
    width: 100%;
    min-height: 100vh;

    padding: 190px 0 110px;

    background: #FFFCEB;
    color: #2E4057;

    font-family: "Montserrat", sans-serif;
}


.frattali-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* =========================================================
   TORNA INDIETRO
========================================================= */

.frattali-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;

    text-decoration: none !important;
    border: none;
    border-bottom: none;
    box-shadow: none;

    transition:
        color .25s ease,
        transform .25s ease;
}


.frattali-back:link,
.frattali-back:visited {
    color: #FFD43B;
    text-decoration: none !important;
}


.frattali-back:hover {
    color: #2E4057;

    text-decoration: none !important;

    transform: translateX(-4px);
}


/* =========================================================
   CATEGORIA
========================================================= */

.frattali-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;

    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* =========================================================
   TITOLO PRINCIPALE
========================================================= */

.frattali-title {
    max-width: 1050px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


.frattali-title-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 38px;

    background: #FFD43B;
}


/* =========================================================
   INTRODUZIONE
========================================================= */

.frattali-opening {
    max-width: 1080px;

    margin-bottom: 55px;
}


.frattali-opening p {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;

    text-decoration: none;
}


/* =========================================================
   SEZIONI
========================================================= */

.frattali-section {
    max-width: 1080px;

    margin-top: 55px;
}


.frattali-section h2 {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 27px;
    font-weight: 700;

    line-height: 1.2;

    color: #2E4057;

    text-decoration: none;
}


.frattali-section h2 span {
    font-weight: 500;
}


/* =========================================================
   LINEA GIALLA DEI TITOLI
========================================================= */

.frattali-line {
    width: 42px;
    height: 3px;

    margin: 13px 0 22px;

    background: #FFD43B;

    transition: width .4s ease;
}


.frattali-section:hover .frattali-line {
    width: 110px;
}


/* =========================================================
   TESTO
========================================================= */

.frattali-text {
    max-width: 1080px;
}


.frattali-text p {
    margin: 0 0 24px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;

    text-decoration: none;
}


.frattali-text p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   SITI INTERNET + BIBLIOGRAFIA + APPENDICI
========================================================= */

.frattali-resources {
    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


.frattali-resources p {
    margin: 0 0 24px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;

    text-decoration: none !important;
}


/* ELENCHI */

.frattali-resources ul {
    margin: 0;

    padding-left: 24px;

    list-style-type: disc;
}


.frattali-resources ol {
    margin: 0;

    padding-left: 24px;
}


.frattali-resources li {
    margin-bottom: 8px;

    padding-left: 2px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;

    text-decoration: none !important;
}


/* =========================================================
   PUNTINI GIALLI
========================================================= */

.frattali-resources li::marker {
    color: #FFD43B;

    font-size: 1.15em;
}


/* =========================================================
   LINK DI SITI / BIBLIOGRAFIA / APPENDICI
========================================================= */

.frattali-resources a,
.frattali-resources a:link,
.frattali-resources a:visited,
.frattali-resources a:active,
.frattali-resources a:focus {
    font-family: "Montserrat", sans-serif;

    font-size: inherit;
    font-weight: inherit;

    color: #2E4057;

    text-decoration: none !important;
    text-decoration-line: none !important;

    border: 0 !important;
    border-bottom: 0 !important;

    box-shadow: none !important;

    outline-offset: 3px;

    transition: color .25s ease;
}


/* HOVER */

.frattali-resources a:hover {
    color: #FFD43B;

    text-decoration: none !important;
    text-decoration-line: none !important;

    border-bottom: 0 !important;

    box-shadow: none !important;
}


/* =========================================================
   IMPEDISCE SOTTOLINEATURE NEL CONTENUTO DEGLI ELENCHI
========================================================= */

.frattali-resources li,
.frattali-resources li span,
.frattali-resources li strong,
.frattali-resources li em {
    text-decoration: none !important;
}


/* =========================================================
   FIRMA FINALE
========================================================= */

.frattali-credit {
    margin: 40px 0 0;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;
    font-weight: 500;

    font-style: italic;

    line-height: 1.6;

    text-align: right;

    color: #2E4057;

    text-decoration: none;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 650px) {

    .frattali-page {
        padding-top: 155px;
    }


    .frattali-container {
        width: calc(100% - 44px);
    }


    .frattali-title {
        max-width: 100%;
        padding-right: 4px;
        font-size: clamp(34px, 10vw, 40px);

        line-height: 1.05;
        letter-spacing: -1px;
        overflow-wrap: break-word;
    }


    .frattali-opening p,
    .frattali-text p,
    .frattali-resources,
    .frattali-resources p,
    .frattali-resources li {
        font-size: 16px;

        line-height: 1.75;
    }


    .frattali-section {
        margin-top: 45px;
    }


    .frattali-section h2 {
        font-size: 23px;
    }


    .frattali-credit {
        text-align: left;
    }

}

/* =========================================================
   PAGINA PI GRECO
   pi-greco.html
========================================================= */

.pigreco-page {
    width: 100%;
    min-height: 100vh;

    padding: 190px 0 110px;

    background: #FFFCEB;
    color: #2E4057;

    font-family: "Montserrat", sans-serif;
}


.pigreco-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* =========================================================
   TORNA INDIETRO
========================================================= */

.pigreco-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;

    text-decoration: none !important;

    transition:
        color .25s ease,
        transform .25s ease;
}


.pigreco-back:link,
.pigreco-back:visited {
    color: #FFD43B;
    text-decoration: none !important;
}


.pigreco-back:hover {
    color: #2E4057;

    text-decoration: none !important;

    transform: translateX(-4px);
}


/* =========================================================
   CATEGORIA
========================================================= */

.pigreco-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;

    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* =========================================================
   TITOLO PRINCIPALE
========================================================= */

.pigreco-title {
    max-width: 1100px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


.pigreco-title-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 38px;

    background: #FFD43B;
}


/* =========================================================
   NUMERO PI GRECO
========================================================= */

.pigreco-number {
    max-width: 1080px;

    margin: 0 0 55px;

    padding: 18px 22px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 600;

    line-height: 1.6;

    color: #2E4057;

    border-left: 4px solid #FFD43B;

    overflow-wrap: anywhere;
}


/* =========================================================
   SEZIONI
========================================================= */

.pigreco-section {
    max-width: 1080px;

    margin-top: 55px;
}


.pigreco-section h2 {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 27px;
    font-weight: 700;

    line-height: 1.2;

    color: #2E4057;
}


/* LINEA GIALLA */

.pigreco-line {
    width: 42px;
    height: 3px;

    margin: 13px 0 22px;

    background: #FFD43B;

    transition: width .4s ease;
}


.pigreco-section:hover .pigreco-line {
    width: 110px;
}


/* =========================================================
   TESTO
========================================================= */

.pigreco-text {
    max-width: 1080px;
}


.pigreco-text p {
    margin: 0 0 24px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


.pigreco-text p:last-child {
    margin-bottom: 0;
}


/* =========================================================
   LINK JOY OF PI
========================================================= */

.pigreco-text a,
.pigreco-text a:link,
.pigreco-text a:visited {
    font-family: inherit;

    color: #2E4057;

    font-weight: 600;

    text-decoration: none !important;

    transition: color .25s ease;
}


.pigreco-text a:hover {
    color: #FFD43B;

    text-decoration: none !important;
}


/* =========================================================
   BIBLIOGRAFIA
========================================================= */

.pigreco-resources {
    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


.pigreco-resources ul {
    margin: 0;

    padding-left: 24px;

    list-style-type: disc;
}


.pigreco-resources li {
    margin-bottom: 8px;

    padding-left: 2px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


/* PUNTINI GIALLI */

.pigreco-resources li::marker {
    color: #FFD43B;

    font-size: 1.15em;
}


/* =========================================================
   FIRMA
========================================================= */

.pigreco-credit {
    margin: 45px 0 0;

    font-family: "Montserrat", sans-serif;

    font-size: 15px;
    font-weight: 500;

    font-style: italic;

    line-height: 1.6;

    text-align: right;

    color: #2E4057;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 650px) {

    .pigreco-page {
        padding-top: 155px;
    }


    .pigreco-container {
        width: 86%;
    }


    .pigreco-title {
        font-size: 42px;

        line-height: 1.05;
        letter-spacing: -1.5px;
    }


    .pigreco-number {
        padding: 15px 17px;

        font-size: 15px;
    }


    .pigreco-section {
        margin-top: 45px;
    }


    .pigreco-section h2 {
        font-size: 23px;
    }


    .pigreco-text p,
    .pigreco-resources,
    .pigreco-resources li {
        font-size: 16px;

        line-height: 1.75;
    }


    .pigreco-credit {
        text-align: left;
    }

}

/* =========================================================
   CURVE FAMOSE
   curve-famose.html
========================================================= */

.curve-page {
    width: 100%;
    min-height: 100vh;

    padding: 190px 0 110px;

    background: #FFFCEB;
    color: #2E4057;

    font-family: "Montserrat", sans-serif;
}


.curve-container {
    width: 88%;
    max-width: 1180px;

    margin: 0 auto;
}


/* =========================================================
   TORNA INDIETRO
========================================================= */

.curve-back {
    display: inline-flex;
    align-items: center;

    margin-bottom: 42px;

    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 700;

    color: #FFD43B;

    text-decoration: none !important;

    transition:
        color .25s ease,
        transform .25s ease;
}


.curve-back:link,
.curve-back:visited {
    color: #FFD43B;
    text-decoration: none !important;
}


.curve-back:hover {
    color: #2E4057;

    transform: translateX(-4px);
}


/* =========================================================
   CATEGORIA
========================================================= */

.curve-category {
    margin: 0 0 18px;

    font-family: "Montserrat", sans-serif;

    font-size: 13px;
    font-weight: 700;

    letter-spacing: 2px;

    color: #2E4057;
}


/* =========================================================
   TITOLO PRINCIPALE
========================================================= */

.curve-title {
    max-width: 1000px;

    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: clamp(48px, 5.7vw, 78px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;

    color: #2E4057;
}


.curve-title-line {
    width: 60px;
    height: 3px;

    margin: 28px 0 38px;

    background: #FFD43B;
}


/* =========================================================
   SEZIONI
========================================================= */

.curve-section {
    max-width: 1080px;

    margin-top: 55px;
}


.curve-section h2 {
    margin: 0;

    font-family: "Montserrat", sans-serif;

    font-size: 27px;
    font-weight: 700;

    line-height: 1.2;

    color: #2E4057;
}


.curve-line {
    width: 42px;
    height: 3px;

    margin: 13px 0 22px;

    background: #FFD43B;

    transition: width .4s ease;
}


.curve-section:hover .curve-line {
    width: 110px;
}


/* =========================================================
   TESTO
========================================================= */

.curve-text {
    max-width: 1080px;
}


.curve-text p {
    margin: 0 0 24px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


.curve-text strong {
    font-weight: 700;
}


/* =========================================================
   ELENCHI
========================================================= */

.curve-text ul,
.curve-resources ul {
    margin: 5px 0 28px;

    padding-left: 24px;
}


.curve-text li,
.curve-resources li {
    margin-bottom: 9px;

    padding-left: 3px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.75;

    color: #2E4057;
}


.curve-text li::marker,
.curve-resources li::marker {
    color: #FFD43B;
}


/* =========================================================
   IMMAGINI
========================================================= */

.curve-figure {
    width: 100%;

    margin: 38px 0 45px;

    text-align: center;
}


.curve-figure img {
    display: block;

    width: auto;
    max-width: 520px;
    max-height: 500px;

    margin: 0 auto;

    object-fit: contain;
}


/* DUE IMMAGINI AFFIANCATE */

.curve-images-row {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 50px;

    margin: 38px 0 45px;
}


.curve-images-row img {
    width: auto;
    max-width: 420px;
    max-height: 450px;

    object-fit: contain;
}


/* =========================================================
   TAVOLE / BIBLIOGRAFIA
========================================================= */

.curve-resources {
    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


.curve-resources p {
    margin: 0 0 12px;

    font-family: "Montserrat", sans-serif;

    font-size: 17px;
    font-weight: 400;

    line-height: 1.8;

    color: #2E4057;
}


/* =========================================================
   FIRMA
========================================================= */

.curve-credit {
    margin-top: 45px !important;

    font-size: 15px !important;
    font-weight: 500 !important;

    font-style: italic;

    text-align: right;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 700px) {

    .curve-page {
        padding-top: 155px;
    }


    .curve-container {
        width: 86%;
    }


    .curve-title {
        font-size: 42px;

        line-height: 1.05;
        letter-spacing: -1.5px;
    }


    .curve-section {
        margin-top: 45px;
    }


    .curve-section h2 {
        font-size: 23px;
    }


    .curve-text p,
    .curve-text li,
    .curve-resources,
    .curve-resources li,
    .curve-resources p {
        font-size: 16px;

        line-height: 1.75;
    }


    .curve-figure img {
        max-width: 100%;
        max-height: none;
    }


    .curve-images-row {
        flex-direction: column;

        gap: 25px;
    }


    .curve-images-row img {
        max-width: 100%;
        max-height: none;
    }


    .curve-credit {
        text-align: left;
    }

}

/* =========================================================
   HOME — CAROSELLO NOTIZIE MOBILE A CARD INTERA
========================================================= */

@media screen and (max-width: 750px) {
    .news-section {
        padding: 66px 20px 72px;
    }

    .news-section h2 {
        margin-bottom: 34px;
        padding-left: 0;
        font-size: clamp(34px, 10vw, 43px);
        line-height: 1.05;
    }

    .carosello {
        position: relative;
        width: 100%;
        padding: 0;
        display: block;
    }

    .carousel-window {
        width: 100%;
        min-width: 0;
        overflow: hidden;
    }

    .cards {
        gap: 20px;
    }

    .card {
        flex: 0 0 calc(100vw - 40px);
        width: calc(100vw - 40px);
        max-width: calc(100vw - 40px);
    }

    .card img {
        height: clamp(225px, 64vw, 300px);
    }

    .card-content {
        min-height: 205px;
        padding: 24px 24px 28px;
    }

    .card h3 {
        font-size: clamp(23px, 6.7vw, 28px);
    }

    .carosello .arrow {
        position: absolute;
        top: 126px;
        z-index: 20;
        width: 44px;
        height: 44px;
        display: grid;
        place-items: center;
        border-radius: 50%;
        background: #FFD43B;
        color: #2E4057;
        font-size: 37px;
        line-height: 1;
        opacity: .94;
        pointer-events: auto;
        transform: none;
        box-shadow: 0 8px 24px rgba(20, 31, 46, .22);
    }

    .carosello .arrow:hover,
    .carosello .arrow:focus-visible {
        background: #2E4057;
        color: #FFD43B;
        transform: scale(1.06);
    }

    .carosello .prev {
        left: 10px;
    }

    .carosello .next {
        right: 10px;
    }

    .read-more {
        margin-top: 28px;
        width: 100%;
    }
}

@media screen and (max-width: 420px) {
    .news-section {
        padding-inline: 16px;
    }

    .card {
        flex-basis: calc(100vw - 32px);
        width: calc(100vw - 32px);
        max-width: calc(100vw - 32px);
    }
}

/* =========================================================
   HOME — HERO RESPONSIVE
========================================================= */

@media screen and (max-width: 900px) {
    .hero {
        height: auto;
        min-height: 88svh;
        background-position: center center;
        background-size: cover;
    }

    .hero-overlay {
        width: 100%;
        min-height: 88svh;
        padding: 128px 7% 58px;
        display: flex;
        align-items: center;
    }

    .hero-content {
        width: min(100%, 570px);
        max-width: 570px;
        padding-left: 25px;
    }

    .hero-content::before {
        top: 6px;
        width: 3px;
        height: 172px;
    }

    .hero-content h1 {
        max-width: 100%;
        margin-bottom: 34px;
        font-size: clamp(50px, 10.5vw, 82px);
        line-height: .94;
        letter-spacing: -1.5px;
        overflow-wrap: normal;
    }

    .hero-button {
        padding: 15px 25px;
        font-size: clamp(17px, 3vw, 21px);
    }
}

@media screen and (max-width: 520px) {
    .hero,
    .hero-overlay {
        min-height: 78svh;
    }

    .hero {
        background-position: 52% center;
    }

    .hero-overlay {
        padding: 112px 6% 46px;
    }

    .hero-content {
        padding-left: 19px;
    }

    .hero-content::before {
        height: 132px;
    }

    .hero-content h1 {
        margin-bottom: 27px;
        font-size: clamp(40px, 12vw, 56px);
        line-height: .96;
        letter-spacing: -1px;
    }

    .hero-button {
        max-width: 100%;
        padding: 14px 20px;
        font-size: 17px;
        text-align: center;
    }
}

@media screen and (max-width: 360px) {
    .hero-content h1 {
        font-size: 38px;
    }

    .hero-button {
        font-size: 16px;
    }
}

/* =========================================================
   PIANO 1 — CAROSELLO DELLE SEZIONI
========================================================= */

.floor-carousel-section {
    width: 100%;
    margin-top: 72px;
}

.floor-carousel-section > h2 {
    margin: 0 0 38px;
    font-family: "Montserrat", sans-serif;
    font-size: clamp(32px, 4vw, 46px);
    font-weight: 800;
    line-height: 1.08;
    color: #2E4057;
}

.floor-carousel {
    --floor-mobile-card-width: 330px;
    position: relative;
    width: 100%;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr) 64px;
    align-items: center;
    gap: 20px;
}

.floor-carousel-window {
    min-width: 0;
    overflow: hidden;
}

.floor-carousel-track {
    width: max-content;
    display: flex;
    gap: 28px;
    will-change: transform;
}

.floor-carousel-card {
    position: relative;
    flex: 0 0 350px;
    overflow: hidden;
    background: #2E4057;
    color: #FFFCEB;
    text-decoration: none;
    padding: 0;
    border: 0;
    font: inherit;
    text-align: left;
    cursor: zoom-in;
    transition: transform .35s ease, box-shadow .35s ease;
}

.floor-carousel-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    z-index: 3;
    width: 5px;
    background: #FFD43B;
    transform: scaleY(0);
    transform-origin: top;
    transition: transform .35s ease;
}

.floor-carousel-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 18px 35px rgba(0, 0, 0, .15);
}

.floor-carousel-card:hover::before {
    transform: scaleY(1);
}

.floor-carousel-card > img {
    width: 100%;
    height: 350px;
    display: block;
    padding: 14px;
    object-fit: contain;
    object-position: center;
    background: #F1E9D9;
    transition: transform .55s ease;
}

.floor-carousel-card:hover > img {
    transform: scale(1.035);
}

.floor-carousel-placeholder {
    width: 100%;
    height: 350px;
    display: grid;
    place-items: center;
    color: rgba(46, 64, 87, .46);
    background:
        linear-gradient(135deg, rgba(255, 212, 59, .22), transparent 52%),
        #F1E9D9;
    font-family: "Montserrat", sans-serif;
}

.floor-carousel-placeholder span {
    font-size: 64px;
    font-weight: 800;
}

.floor-carousel-card-placeholder {
    cursor: default;
}

.floor-carousel-card-content {
    min-height: 78px;
    padding: 17px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.floor-carousel-card h3 {
    margin: 0;
    color: #FFFCEB;
    font-family: "Montserrat", sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
}

.floor-static-gallery {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 350px));
    justify-content: center;
    gap: 28px;
}

.floor-static-gallery .floor-carousel-card {
    width: 100%;
}

.floor-static-carousel-window {
    overflow: visible;
}

.floor-static-carousel-arrow {
    display: none;
}

body.floor-lightbox-open {
    overflow: hidden;
}

.floor-lightbox {
    position: fixed;
    inset: 0;
    z-index: 5000;
    padding: clamp(22px, 4vw, 56px);
    display: grid;
    place-items: center;
    background: rgba(12, 20, 31, .9);
    opacity: 0;
    visibility: hidden;
    cursor: zoom-out;
    transition:
        opacity .38s ease-out,
        visibility 0s linear .62s;
}

.floor-lightbox.is-open {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
}

.floor-lightbox-figure {
    max-width: min(94vw, 1280px);
    max-height: 91vh;
    max-height: 91dvh;
    margin: 0;
    padding: 14px 14px 0;
    display: flex;
    flex-direction: column;
    background: #F1E9D9;
    box-shadow: 0 30px 90px rgba(0, 0, 0, .42);
    cursor: default;
    opacity: 0;
    transform: translate3d(0, 18px, 0) scale(.86);
    transform-origin: center;
    backface-visibility: hidden;
    will-change: transform, opacity;
    transition:
        transform .62s cubic-bezier(.16, 1, .3, 1),
        opacity .28s ease-out;
}

.floor-lightbox.is-open .floor-lightbox-figure {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
}

.floor-lightbox-image {
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: calc(91vh - 96px);
    max-height: calc(91dvh - 96px);
    display: block;
    object-fit: contain;
    transform: translateZ(0);
    backface-visibility: hidden;
}

.floor-lightbox-caption {
    min-height: 65px;
    padding: 17px 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFCEB;
    background: #2E4057;
    font-family: "Montserrat", sans-serif;
    font-size: clamp(18px, 2.2vw, 25px);
    font-weight: 700;
    text-align: center;
}

.floor-lightbox-close {
    position: fixed;
    top: 20px;
    right: 22px;
    z-index: 2;
    width: 52px;
    height: 52px;
    padding: 0;
    border: 1px solid rgba(255, 252, 235, .55);
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: #FFFCEB;
    background: #2E4057;
    font-family: "Montserrat", sans-serif;
    font-size: 35px;
    font-weight: 300;
    line-height: 1;
    cursor: pointer;
}

.floor-lightbox-close:hover,
.floor-lightbox-close:focus-visible {
    color: #2E4057;
    background: #FFD43B;
}

.floor-carousel-arrow {
    width: 58px;
    height: 58px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #2E4057;
    font-family: Arial, sans-serif;
    font-size: 58px;
    font-weight: 300;
    line-height: 1;
    cursor: pointer;
    opacity: .72;
    transition: color .25s ease, transform .25s ease, opacity .25s ease;
}

.floor-carousel:hover .floor-carousel-arrow,
.floor-carousel-arrow:focus-visible {
    opacity: 1;
}

.floor-carousel-arrow:hover,
.floor-carousel-arrow:focus-visible {
    color: #DFAE00;
    transform: scale(1.1);
}

@media screen and (max-width: 750px) {
    .floor-carousel-section {
        margin-top: 52px;
    }

    .floor-carousel-section > h2 {
        margin-bottom: 28px;
        font-size: clamp(30px, 9vw, 40px);
    }

    .floor-carousel {
        display: block;
    }

    .floor-carousel-track {
        gap: 18px;
    }

    .floor-carousel-card {
        flex-basis: var(--floor-mobile-card-width);
        width: var(--floor-mobile-card-width);
        max-width: var(--floor-mobile-card-width);
    }

    .floor-carousel-card > img {
        height: clamp(300px, 85vw, 390px);
        padding: 12px;
    }

    .floor-carousel-placeholder {
        height: clamp(300px, 85vw, 390px);
    }

    .floor-carousel-card-content {
        min-height: 72px;
    }

    .floor-static-gallery {
        width: 100%;
        display: flex;
        justify-content: flex-start;
        gap: 0;
        transition: transform .62s cubic-bezier(.22, 1, .36, 1);
        will-change: transform;
    }

    .floor-static-carousel {
        position: relative;
        width: 100%;
    }

    .floor-static-carousel-window {
        width: 100%;
        overflow: hidden;
    }

    .floor-static-gallery .floor-carousel-card {
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }

    .floor-static-carousel-arrow {
        position: absolute;
        top: calc(clamp(300px, 85vw, 390px) / 2 - 22px);
        z-index: 20;
        width: 44px;
        height: 44px;
        padding: 0;
        border: 0;
        border-radius: 50%;
        display: grid;
        place-items: center;
        background: #FFD43B;
        color: #2E4057;
        font-family: Arial, sans-serif;
        font-size: 38px;
        font-weight: 300;
        line-height: 1;
        cursor: pointer;
        box-shadow: 0 8px 24px rgba(20, 31, 46, .22);
    }

    .floor-static-carousel-prev {
        left: 10px;
    }

    .floor-static-carousel-next {
        right: 10px;
    }

    .floor-carousel-arrow {
        position: absolute;
        top: calc(clamp(300px, 85vw, 390px) / 2 - 22px);
        z-index: 20;
        width: 44px;
        height: 44px;
        display: grid;
        place-items: center;
        border-radius: 50%;
        background: #FFD43B;
        color: #2E4057;
        font-size: 38px;
        opacity: .95;
        box-shadow: 0 8px 24px rgba(20, 31, 46, .22);
    }

    .floor-carousel-prev {
        left: 10px;
    }

    .floor-carousel-next {
        right: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .floor-carousel-track,
    .floor-carousel-card,
    .floor-carousel-card > img,
    .floor-carousel-arrow,
    .floor-lightbox,
    .floor-lightbox-figure,
    .floor-lightbox-image {
        transition: none !important;
    }
}

/* Override finale dei link di approfondimento: mantiene anche le frecce
   completamente dentro l'evidenziatore giallo. */
.leonardo-article-link a,
.cosmogonie-poster-link,
.verona-program a {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    position: relative;
    padding: 0 13px 0 3px;
    margin-left: -3px;
    margin-right: -13px;
    border-radius: 0;
    color: #2E4057;
    background: transparent;
    text-decoration: none;
    box-shadow: inset 0 -3px 0 #FFD43B;
    transform: none;
    transform-origin: center;
    transition: box-shadow .25s ease, color .25s ease, transform .25s ease;
}

.leonardo-article-link a:hover,
.leonardo-article-link a:focus-visible,
.cosmogonie-poster-link:hover,
.cosmogonie-poster-link:focus-visible,
.verona-program a:hover,
.verona-program a:focus-visible {
    color: #2E4057;
    background: transparent;
    box-shadow: inset 0 -1.45em 0 #FFD43B;
    transform: scale(1.05);
}

.cosmogonie-poster-link i {
    color: currentColor;
}

.cosmogonie-poster-link span {
    margin-left: 0;
}

.verona-program a:hover .verona-program-arrow,
.verona-program a:focus-visible .verona-program-arrow {
    transform: translateX(5px);
}


/* =========================================
   FIRMA CREAZIONE SITO
========================================= */
.footer-credit {
    width: 100%;
    margin-top: 42px;
    padding: 26px 20px 0;
    border-top: 1px solid rgba(255, 252, 235, .28);
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 9px;
    font-family: "Montserrat", sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.5;
    color: rgba(255, 252, 235, .78);
    text-align: center;
}

.footer-credit a {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #FFD43B;
    font-weight: 600;
    text-decoration: none;
    transition: color .25s ease;
}

.footer-credit a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -3px;
    height: 1px;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .25s ease;
}

.footer-credit a:hover,
.footer-credit a:focus-visible {
    color: #FFD43B;
    outline: none;
}

.footer-credit a:hover::after,
.footer-credit a:focus-visible::after {
    transform: scaleX(1);
}

@media screen and (max-width: 600px) {
    .footer-credit {
        margin-top: 34px;
        padding: 23px 10px 0;
        flex-wrap: wrap;
        gap: 6px;
        font-size: 13px;
    }
}