/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 30 2026 | 15:12:22 */
/*
 * Scopri Cotronei - modulo 10-componenti-storia-verga.css
 * Estratto senza modifiche funzionali dal CSS originale.
 * Righe originali: 43878-52153.
 * Contenuto: Componenti condivisi, Cosa vedere, Storia e identita, Premio/Palazzo Verga.
 */

/* ==========================================================
   SCOPRI COTRONEI - COMPONENTI CONDIVISI E PAGINE RECENTI
   - Breadcrumb condiviso
   - Crediti fotografici
   - Cosa vedere
   - Storia e identita
   - Storia di Cotronei

   Nota: il vecchio blocco .sc-wip-* viene mantenuto nella parte
   precedente del file perche altre pagine in costruzione lo usano ancora.
========================================================== */


/* ==========================================================
   1. BREADCRUMB CONDIVISO
========================================================== */

.sc-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;

    width: 100%;
    max-width: 1080px;

    margin: 20px auto 14px;
    padding: 0 4px;

    color: #6c716d;

    font-size: 12px;
    line-height: 1.4;
}

.sc-breadcrumb a {
    color: var(--verde-principale, #264733) !important;
    font-weight: 800;
    text-decoration: none !important;
}

.sc-breadcrumb a:hover {
    text-decoration: underline !important;
    text-underline-offset: 3px;
}

.sc-breadcrumb-separator {
    color: #92794f;
    font-weight: 400;
}

.sc-breadcrumb-current {
    color: #666b67;
    font-weight: 400;
}


/* ==========================================================
   2. CREDITO FOTOGRAFICO HERO
   Classe consigliata: .sc-photo-credit
   La vecchia .sc-history-photo-credit resta supportata.
========================================================== */

.sc-cotronei-hero,
.sc-history-hero {
    position: relative;
}

.sc-photo-credit,
.sc-history-photo-credit {
    position: absolute;
    right: 18px;
    bottom: 16px;
    z-index: 6;

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

    min-height: 27px;
    padding: 0 10px;

    border-radius: 999px;

    background: rgba(20, 31, 24, 0.68);
    color: rgba(255, 255, 255, 0.95);

    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.2px;

    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);

    pointer-events: none;
    user-select: none;
}


/* ==========================================================
   3. COSA VEDERE A COTRONEI
========================================================== */

.sc-see-page,
.sc-see-page *,
.sc-see-page *::before,
.sc-see-page *::after {
    box-sizing: border-box;
}

.sc-see-hero {
    margin-top: 0;
}

/* Guida in evoluzione */

.sc-see-progress {
    display: flex;
    align-items: flex-start;
    gap: 12px;

    width: 100%;
    max-width: 680px;

    margin: 25px auto 0;
    padding: 17px 19px;

    border: 1px solid rgba(217, 180, 107, 0.52);
    border-radius: 17px;

    background: #fffaf0;
    text-align: left;
}

.sc-see-progress-dot {
    flex: 0 0 9px;

    width: 9px;
    height: 9px;
    margin-top: 6px;

    border-radius: 50%;
    background: var(--oro-accento, #d9b46b);
}

.sc-see-progress strong {
    display: block;
    margin: 0 0 3px;

    color: var(--verde-principale, #264733);
    font-size: 14px;
    font-weight: 800;
}

.sc-see-progress p {
    margin: 0 !important;

    color: #606660;
    font-size: 13px !important;
    line-height: 1.55 !important;
    text-align: left !important;
}

/* Griglia luoghi */

.sc-see-places-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
    align-items: stretch !important;

    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
}

.sc-see-place-card {
    display: flex;
    flex-direction: column;

    width: 100%;
    min-width: 0;
    min-height: 305px;

    margin: 0;
    padding: 25px;

    border: 1px solid rgba(38, 71, 51, 0.15);
    border-radius: 22px;

    background: #ffffff;

    box-shadow: 0 7px 22px rgba(27, 52, 37, 0.045);

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease;
}

.sc-see-place-card:hover {
    transform: translateY(-3px);
    border-color: rgba(38, 71, 51, 0.30);
    box-shadow: 0 16px 34px rgba(27, 52, 37, 0.10);
}

.sc-see-place-card-progress {
    background: #fcfaf6;
}

.sc-see-place-card-featured {
    border-color: rgba(217, 180, 107, 0.68);
    background: linear-gradient(145deg, #ffffff 0%, #faf7ef 100%);
}

/* Testata card */

.sc-see-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    width: 100%;
    margin-bottom: 22px;
}

.sc-see-card-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: fit-content;
    min-height: 30px;
    padding: 0 12px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.65px;
}

.sc-see-card-number {
    flex: 0 0 auto;

    color: rgba(38, 71, 51, 0.25);
    font-size: 12px;
    font-weight: 850;
}

/* Testi card */

.sc-see-place-card h3,
.sc-see-useful-card h3 {
    margin: 0 0 12px;

    color: var(--verde-principale, #264733);
    font-size: 22px;
    font-weight: 850;
    line-height: 1.15;
}

.sc-see-place-card p,
.sc-see-useful-card p {
    margin: 0;

    color: #606660;
    font-size: 14px;
    line-height: 1.63;
}

.sc-see-card-footer,
.sc-see-useful-footer {
    display: flex;
    align-items: flex-start;

    width: 100%;
    margin-top: auto;
    padding-top: 24px;
}

/* Pulsanti */

.sc-see-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: fit-content !important;
    min-width: 128px;
    min-height: 43px;

    margin: 0 !important;
    padding: 0 17px !important;

    border: 0;
    border-radius: 999px;

    background: var(--verde-principale, #264733) !important;
    color: #ffffff !important;

    font-family: inherit;
    font-size: 11px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
    text-align: center !important;
    text-decoration: none !important;

    box-shadow: 0 5px 12px rgba(38, 71, 51, 0.18);

    transition:
        transform 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease;
}

.sc-see-button > span {
    display: block;
    margin: 0;
    padding: 0;
    line-height: 1.2;
    text-align: center;
}

a.sc-see-button:hover {
    transform: translateY(-2px);
    background: var(--verde-hover, #1f3a2a) !important;
    box-shadow: 0 8px 17px rgba(38, 71, 51, 0.23);
}

.sc-see-button-pending {
    border: 1px solid rgba(217, 180, 107, 0.55);

    background: #fff8e9 !important;
    color: #805b1d !important;

    box-shadow: 0 4px 10px rgba(126, 91, 30, 0.09);

    cursor: default !important;
    pointer-events: none !important;
    user-select: none;
}

/* Identita */

.sc-see-identity-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    align-items: stretch;

    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
}

.sc-see-identity-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 370px;
    padding: 31px;

    border-radius: 27px;
    color: #ffffff;

    box-shadow: 0 12px 30px rgba(27, 52, 37, 0.08);
}

.sc-see-identity-hydro {
    background: linear-gradient(135deg, #264733 0%, #315d43 100%);
}

.sc-see-identity-oil {
    background: linear-gradient(135deg, #566536 0%, #697746 100%);
}

.sc-see-identity-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;

    width: fit-content;
    min-height: 40px;
    padding: 0 15px;

    border-radius: 999px;

    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;

    font-size: 9px;
    font-weight: 850;
    line-height: 1.15;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.sc-see-identity-card h3 {
    max-width: 500px;
    margin: 23px 0 14px;

    color: #ffffff;
    font-size: clamp(29px, 3vw, 39px);
    font-weight: 850;
    line-height: 1.06;
    letter-spacing: -0.4px;
}

.sc-see-identity-card > p {
    max-width: 510px;
    margin: 0;

    color: rgba(255, 255, 255, 0.88);
    font-size: 14px;
    line-height: 1.66;
}

.sc-see-identity-footer {
    display: flex;
    align-items: flex-start;

    width: 100%;
    margin-top: auto;
    padding-top: 28px;
}

.sc-see-identity-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: fit-content;
    min-width: 165px;
    min-height: 44px;
    padding: 0 18px;

    border-radius: 999px;

    background: #ffffff;
    color: var(--verde-principale, #264733);

    font-size: 11px;
    font-weight: 850;
    line-height: 1.2;
    text-align: center;

    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.16);
}

.sc-see-identity-button > span {
    display: block;
    line-height: 1.2;
    text-align: center;
}

.sc-see-identity-button-pending {
    cursor: default !important;
    pointer-events: none !important;
    user-select: none;
}

/* Organizza la visita */

.sc-see-useful-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    align-items: stretch;

    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
}

.sc-see-useful-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 280px;
    padding: 26px;

    border: 1px solid rgba(38, 71, 51, 0.15);
    border-radius: 22px;

    background: #fbfaf6;

    box-shadow: 0 7px 22px rgba(27, 52, 37, 0.045);

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.sc-see-useful-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 34px rgba(27, 52, 37, 0.10);
}

.sc-see-useful-card > .sc-see-card-label {
    align-self: flex-start;
    margin-bottom: 21px;
}

.sc-see-page .sc-cotronei-section-head,
.sc-see-page .sc-cotronei-story {
    margin-top: 72px;
}


/* ==========================================================
   4. STORIA E IDENTITA DI COTRONEI
========================================================== */

.sc-history-page,
.sc-history-page *,
.sc-history-page *::before,
.sc-history-page *::after {
    box-sizing: border-box;
}

.sc-history-hero {
    margin-top: 0;
}

.sc-history-hero-img {
    object-fit: cover !important;
    object-position: center 58% !important;
}

/* Nota editoriale */

.sc-history-note {
    display: flex;
    align-items: flex-start;
    gap: 13px;

    width: 100%;
    max-width: 700px;

    margin: 27px auto 0;
    padding: 18px 20px;

    border: 1px solid rgba(217, 180, 107, 0.52);
    border-radius: 17px;

    background: #fffaf0;
    color: #606660;
    text-align: left;
}

.sc-history-note-dot {
    flex: 0 0 9px;

    width: 9px;
    height: 9px;
    margin-top: 6px;

    border-radius: 50%;
    background: var(--oro-accento, #d9b46b);
}

.sc-history-note strong {
    display: block;
    margin: 0 0 4px;

    color: var(--verde-principale, #264733);
    font-size: 14px;
    font-weight: 800;
}

.sc-history-note p {
    margin: 0;

    color: #606660;
    font-size: 13px;
    line-height: 1.58;
}

.sc-history-page .sc-cotronei-section-head,
.sc-history-page .sc-cotronei-story {
    margin-top: 72px;
}

/* Tre percorsi principali */

.sc-history-main-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    align-items: stretch;

    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
}

.sc-history-main-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 390px;
    padding: 30px;

    border-radius: 26px;
    color: #ffffff;

    box-shadow: 0 12px 30px rgba(27, 52, 37, 0.09);
}

.sc-history-main-card-general {
    background: linear-gradient(135deg, #34493d 0%, #243a30 100%);
}

.sc-history-main-card-hydro {
    background: linear-gradient(135deg, #264733 0%, #315d43 100%);
}

.sc-history-main-card-oil {
    background: linear-gradient(135deg, #566536 0%, #697746 100%);
}

.sc-history-main-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;

    width: fit-content;
    min-height: 39px;
    padding: 0 14px;

    border-radius: 999px;

    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;

    font-size: 9px;
    font-weight: 850;
    line-height: 1.15;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.sc-history-main-card h3 {
    margin: 23px 0 15px;

    color: #ffffff;
    font-size: clamp(27px, 2.5vw, 35px);
    font-weight: 850;
    line-height: 1.07;
    letter-spacing: -0.4px;
}

.sc-history-main-card > p {
    margin: 0;

    color: rgba(255, 255, 255, 0.87);
    font-size: 14px;
    line-height: 1.67;
}

.sc-history-main-footer {
    display: flex;
    align-items: flex-start;

    width: 100%;
    margin-top: auto;
    padding-top: 28px;
}

.sc-history-main-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: fit-content;
    min-width: 155px;
    min-height: 44px;
    padding: 0 18px;

    border-radius: 999px;

    background: #ffffff;
    color: var(--verde-principale, #264733);

    font-family: inherit;
    font-size: 11px;
    font-weight: 850;
    line-height: 1.2;
    text-align: center;

    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.16);
}

.sc-history-main-button > span {
    display: block;
    line-height: 1.2;
    text-align: center;
}

.sc-history-main-button-pending {
    cursor: default !important;
    pointer-events: none !important;
    user-select: none;
}

/* Luoghi e trasformazioni */

.sc-history-links-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;

    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
}

.sc-history-link-card {
    position: relative;

    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 220px;
    padding: 28px;

    overflow: hidden;

    border: 1px solid rgba(38, 71, 51, 0.14);
    border-radius: 23px;

    background: linear-gradient(145deg, #ffffff 0%, #f8f6ef 100%);

    color: inherit !important;
    text-decoration: none !important;

    box-shadow: 0 7px 22px rgba(27, 52, 37, 0.045);

    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.sc-history-link-card:hover {
    transform: translateY(-3px);
    border-color: rgba(38, 71, 51, 0.30);
    box-shadow: 0 16px 34px rgba(27, 52, 37, 0.10);
}

.sc-history-link-card > span,
.sc-history-memory-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;

    min-height: 29px;
    padding: 0 11px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.sc-history-link-card > strong {
    display: block;
    margin-top: 24px;

    color: var(--verde-principale, #264733);
    font-size: 25px;
    font-weight: 850;
    line-height: 1.12;
}

.sc-history-link-card > small {
    display: block;
    margin-top: 12px;

    color: #606660;
    font-size: 14px;
    line-height: 1.62;
}

/* Memoria */

.sc-history-memory-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
    align-items: stretch;

    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
}

.sc-history-memory-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 250px;
    padding: 26px;

    border: 1px solid rgba(38, 71, 51, 0.14);
    border-radius: 22px;

    background: #fbfaf6;

    color: inherit !important;
    text-decoration: none !important;

    box-shadow: 0 7px 22px rgba(27, 52, 37, 0.045);

    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.sc-history-memory-card:hover {
    transform: translateY(-3px);
    border-color: rgba(38, 71, 51, 0.30);
    box-shadow: 0 16px 34px rgba(27, 52, 37, 0.10);
}

.sc-history-memory-card > strong {
    display: block;
    margin-top: 22px;

    color: var(--verde-principale, #264733);
    font-size: 22px;
    font-weight: 850;
    line-height: 1.15;
}

.sc-history-memory-card > p {
    margin: 12px 0 0;

    color: #606660;
    font-size: 14px;
    line-height: 1.63;
}


/* ==========================================================
   5. STORIA DI COTRONEI
========================================================== */

.sc-history-detail-page,
.sc-history-detail-page *,
.sc-history-detail-page *::before,
.sc-history-detail-page *::after {
    box-sizing: border-box;
}

/* Hero */

.sc-history-detail-hero {
    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
    padding: 58px 56px;

    border-radius: 28px;

    background: linear-gradient(135deg, #244632 0%, #334f3e 100%);
    color: #ffffff;

    box-shadow: 0 12px 30px rgba(27, 52, 37, 0.09);
}

.sc-history-detail-hero-content {
    max-width: 760px;
}

.sc-history-detail-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 31px;
    padding: 0 13px;

    border-radius: 999px;

    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;

    font-size: 10px;
    font-weight: 850;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.65px;
}

.sc-history-detail-hero h1 {
    margin: 17px 0 0;

    color: #ffffff;
    font-size: clamp(42px, 5.5vw, 64px);
    font-weight: 850;
    line-height: 1.02;
    letter-spacing: -1px;
}

.sc-history-detail-lead {
    max-width: 680px;
    margin: 21px 0 0;

    color: rgba(255, 255, 255, 0.87);
    font-size: 16px;
    line-height: 1.72;
}

.sc-history-detail-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 27px;
}

.sc-history-detail-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 47px;
    padding: 0 21px;

    border-radius: 999px;

    background: #ffffff;
    color: var(--verde-principale, #264733) !important;

    font-size: 12px;
    font-weight: 850;
    line-height: 1.2;
    text-align: center;
    text-decoration: none !important;

    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.16);

    transition:
        transform 0.2s ease,
        background 0.2s ease,
        color 0.2s ease;
}

.sc-history-detail-actions a + a {
    border: 1px solid rgba(255, 255, 255, 0.38);
    background: rgba(255, 255, 255, 0.09);
    color: #ffffff !important;
}

.sc-history-detail-actions a:hover {
    transform: translateY(-2px);
}

.sc-history-detail-actions a:first-child:hover {
    background: #f7f4ea;
}

.sc-history-detail-actions a + a:hover {
    background: rgba(255, 255, 255, 0.18);
}

/* Nota pagina in costruzione */

.sc-history-detail-note {
    display: flex;
    align-items: flex-start;
    gap: 13px;

    width: 100%;
    max-width: 700px;

    margin: 27px auto 0;
    padding: 18px 20px;

    border: 1px solid rgba(217, 180, 107, 0.52);
    border-radius: 17px;

    background: #fffaf0;
}

.sc-history-detail-note-dot {
    flex: 0 0 9px;

    width: 9px;
    height: 9px;
    margin-top: 6px;

    border-radius: 50%;
    background: var(--oro-accento, #d9b46b);
}

.sc-history-detail-note strong {
    display: block;
    margin: 0 0 4px;

    color: var(--verde-principale, #264733);
    font-size: 14px;
    font-weight: 850;
}

.sc-history-detail-note p {
    margin: 0;

    color: #606660;
    font-size: 13px;
    line-height: 1.58;
}

.sc-history-detail-page .sc-cotronei-section-head,
.sc-history-detail-page .sc-cotronei-story {
    margin-top: 72px;
}

/* Indice capitoli */

.sc-history-chapters-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;

    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
}

.sc-history-chapter-card {
    position: relative;

    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 270px;
    padding: 25px;

    border: 1px solid rgba(38, 71, 51, 0.14);
    border-radius: 22px;

    background: #fbfaf6;

    color: inherit !important;
    text-decoration: none !important;

    box-shadow: 0 7px 22px rgba(27, 52, 37, 0.045);

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease;
}

.sc-history-chapter-card:hover {
    transform: translateY(-3px);
    border-color: rgba(38, 71, 51, 0.30);
    box-shadow: 0 16px 34px rgba(27, 52, 37, 0.10);
}

.sc-history-chapter-number {
    position: absolute;
    top: 24px;
    right: 24px;

    color: rgba(38, 71, 51, 0.28);
    font-size: 12px;
    font-weight: 850;
}

.sc-history-chapter-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;

    min-height: 29px;
    padding: 0 11px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.sc-history-chapter-card strong {
    display: block;

    margin-top: 24px;
    padding-right: 15px;

    color: var(--verde-principale, #264733);
    font-size: 22px;
    font-weight: 850;
    line-height: 1.13;
}

.sc-history-chapter-card p {
    margin: 12px 0 0;

    color: #606660;
    font-size: 14px;
    line-height: 1.62;
}

/* Capitoli */

.sc-history-detail-section {
    width: 100%;
    max-width: 900px;

    margin: 24px auto 0;
    padding: 28px 30px;

    border-left: 4px solid var(--oro-accento, #d9b46b);
    border-radius: 0 20px 20px 0;

    background: #fbfaf6;

    scroll-margin-top: 30px;
}

.sc-history-chapters-grid + .sc-history-detail-section {
    margin-top: 42px;
}

.sc-history-detail-heading > span {
    display: block;
    margin-bottom: 7px;

    color: #956b22;
    font-size: 10px;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: 0.65px;
}

.sc-history-detail-heading h2 {
    margin: 0;

    color: var(--verde-principale, #264733);
    font-size: clamp(25px, 3vw, 34px);
    font-weight: 850;
    line-height: 1.12;
}

.sc-history-detail-section > p {
    max-width: 750px;
    margin: 14px 0 0;

    color: #606660;
    font-size: 14px;
    line-height: 1.68;
}

.sc-history-detail-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 34px;
    margin-top: 18px;
    padding: 0 13px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8b682e;

    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    text-align: center;
}

/* Fonti */

.sc-history-sources-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;

    width: 100%;
    max-width: 1080px;
    margin: 0 auto;
}

.sc-history-source-card {
    min-width: 0;
    padding: 25px;

    border: 1px solid rgba(38, 71, 51, 0.14);
    border-radius: 22px;

    background: #ffffff;

    box-shadow: 0 7px 22px rgba(27, 52, 37, 0.045);
}

.sc-history-source-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;
    padding: 0 11px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.sc-history-source-card > strong {
    display: block;
    margin-top: 21px;

    color: var(--verde-principale, #264733);
    font-size: 21px;
    font-weight: 850;
    line-height: 1.14;
}

.sc-history-source-card > p {
    margin: 11px 0 0;

    color: #606660;
    font-size: 14px;
    line-height: 1.62;
}


/* ==========================================================
   6. TABLET
========================================================== */

@media (max-width: 960px) {

    .sc-history-main-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .sc-history-main-card-general {
        grid-column: 1 / -1;
        min-height: 300px;
    }

    .sc-history-main-card {
        min-height: 350px;
        padding: 27px;
    }

    .sc-history-memory-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .sc-history-memory-card:last-child {
        grid-column: 1 / -1;
        min-height: 210px;
    }
}

@media (max-width: 900px) {

    .sc-history-detail-hero {
        padding: 46px 38px;
    }

    .sc-history-chapters-grid,
    .sc-history-sources-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .sc-history-source-card:last-child {
        grid-column: 1 / -1;
    }
}

@media (max-width: 860px) {

    .sc-breadcrumb {
        padding-left: 2px;
        padding-right: 2px;
    }

    .sc-see-places-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px !important;
    }

    .sc-see-identity-grid {
        gap: 18px;
    }

    .sc-see-identity-card {
        min-height: 350px;
        padding: 26px;
    }

    .sc-see-identity-card h3 {
        font-size: clamp(27px, 4vw, 34px);
    }

    .sc-see-useful-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .sc-see-useful-card {
        min-height: 220px;
    }

    .sc-history-hero-img {
        object-position: center 55% !important;
    }
}


/* ==========================================================
   7. MOBILE
========================================================== */

@media (max-width: 680px) {

    .sc-breadcrumb {
        gap: 7px;
        margin-top: 12px;
        margin-bottom: 12px;
        font-size: 11px;
    }

    .sc-photo-credit,
    .sc-history-photo-credit {
        right: 12px;
        bottom: 11px;

        min-height: 25px;
        padding: 0 9px;

        font-size: 9px;
    }

    /* Cosa vedere */

    .sc-see-places-grid {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .sc-see-place-card {
        min-height: 0;
        padding: 22px;
    }

    .sc-see-button {
        width: 100% !important;
    }

    .sc-see-identity-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .sc-see-identity-card {
        min-height: 330px;
        padding: 25px 22px;
        border-radius: 24px;
    }

    .sc-see-identity-card h3 {
        font-size: clamp(29px, 8.5vw, 36px);
    }

    .sc-see-identity-button {
        width: 100%;
    }

    .sc-see-useful-card {
        min-height: 0;
        padding: 22px;
    }

    .sc-see-page .sc-cotronei-section-head,
    .sc-see-page .sc-cotronei-story {
        margin-top: 56px;
    }

    /* Storia e identita */

    .sc-history-hero-img {
        object-position: center 48% !important;
    }

    .sc-history-page .sc-cotronei-section-head,
    .sc-history-page .sc-cotronei-story {
        margin-top: 56px;
    }

    .sc-history-note {
        padding: 16px;
        border-radius: 15px;
    }

    .sc-history-main-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .sc-history-main-card-general {
        grid-column: auto;
    }

    .sc-history-main-card {
        min-height: 330px;
        padding: 25px 22px;
        border-radius: 24px;
    }

    .sc-history-main-card h3 {
        font-size: clamp(29px, 8vw, 36px);
    }

    .sc-history-main-button {
        width: 100%;
    }

    .sc-history-links-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .sc-history-link-card {
        min-height: 0;
        padding: 23px;
    }

    .sc-history-memory-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .sc-history-memory-card,
    .sc-history-memory-card:last-child {
        grid-column: auto;
        min-height: 0;
        padding: 23px;
    }

    /* Storia di Cotronei */

    .sc-history-detail-hero {
        padding: 34px 22px;
        border-radius: 24px;
    }

    .sc-history-detail-hero h1 {
        font-size: clamp(38px, 12vw, 49px);
    }

    .sc-history-detail-lead {
        font-size: 14px;
    }

    .sc-history-detail-actions {
        flex-direction: column;
    }

    .sc-history-detail-actions a {
        width: 100%;
    }

    .sc-history-detail-page .sc-cotronei-section-head,
    .sc-history-detail-page .sc-cotronei-story {
        margin-top: 56px;
    }

    .sc-history-chapters-grid,
    .sc-history-sources-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .sc-history-chapter-card {
        min-height: 0;
        padding: 22px;
    }

    .sc-history-detail-section {
        padding: 23px 21px;
    }

    .sc-history-source-card:last-child {
        grid-column: auto;
    }
}


/* ==========================================================
   8. ACCESSIBILITA
========================================================== */

.sc-see-page a:focus-visible,
.sc-history-page a:focus-visible,
.sc-history-detail-page a:focus-visible,
.sc-breadcrumb a:focus-visible {
    outline: 3px solid rgba(217, 180, 107, 0.60);
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {

    .sc-see-page *,
    .sc-see-page *::before,
    .sc-see-page *::after,
    .sc-history-page *,
    .sc-history-page *::before,
    .sc-history-page *::after,
    .sc-history-detail-page *,
    .sc-history-detail-page *::before,
    .sc-history-detail-page *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}

/* ==========================================================
   COTRONEI - CITTÀ DELL'IDROELETTRICO
   Classi specifiche .sc-hydro-*
========================================================== */


/* ==========================================================
   BASE
========================================================== */

.sc-hydro-page,
.sc-hydro-page *,
.sc-hydro-page *::before,
.sc-hydro-page *::after {
    box-sizing: border-box;
}


/* ==========================================================
   HERO
========================================================== */

.sc-hydro-hero {
    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
    padding: 58px 56px;

    border-radius: 28px;

    background:
        radial-gradient(
            circle at 88% 20%,
            rgba(255, 255, 255, 0.10) 0,
            rgba(255, 255, 255, 0) 30%
        ),
        linear-gradient(
            135deg,
            #1f4434 0%,
            #315d43 58%,
            #426b50 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(27, 52, 37, 0.10);
}

.sc-hydro-hero-content {
    max-width: 780px;
}

.sc-hydro-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 31px;

    padding: 0 13px;

    border-radius: 999px;

    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;

    font-size: 10px;
    font-weight: 850;
    line-height: 1;

    text-align: center;
    text-transform: uppercase;

    letter-spacing: 0.65px;
}

.sc-hydro-hero h1 {
    max-width: 770px;

    margin: 18px 0 0;

    color: #ffffff;

    font-size: clamp(40px, 5.4vw, 63px);
    font-weight: 850;
    line-height: 1.02;

    letter-spacing: -1px;
}

.sc-hydro-lead {
    max-width: 700px;

    margin: 21px 0 0;

    color: rgba(255, 255, 255, 0.89);

    font-size: 16px;
    line-height: 1.72;
}


/* AZIONI HERO */

.sc-hydro-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;

    margin-top: 28px;
}

.sc-hydro-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 47px;

    padding: 0 21px;

    border-radius: 999px;

    background: #ffffff;
    color: var(--verde-principale, #264733) !important;

    font-size: 12px;
    font-weight: 850;
    line-height: 1.2;

    text-align: center;
    text-decoration: none !important;

    box-shadow:
        0 6px 15px rgba(0, 0, 0, 0.15);

    transition:
        transform 0.2s ease,
        background 0.2s ease;
}

.sc-hydro-actions a + a {
    border: 1px solid rgba(255, 255, 255, 0.40);

    background: rgba(255, 255, 255, 0.09);
    color: #ffffff !important;

    box-shadow: none;
}

.sc-hydro-actions a:hover {
    transform: translateY(-2px);
}

.sc-hydro-actions a:first-child:hover {
    background: #f7f4ea;
}

.sc-hydro-actions a + a:hover {
    background: rgba(255, 255, 255, 0.17);
}


/* ==========================================================
   DATI CHIAVE
========================================================== */

.sc-hydro-facts {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 42px auto 0;
}

.sc-hydro-fact {
    min-width: 0;

    padding: 24px;

    border: 1px solid rgba(38, 71, 51, 0.14);
    border-radius: 21px;

    background: #ffffff;

    box-shadow:
        0 7px 22px rgba(27, 52, 37, 0.045);
}

.sc-hydro-fact > span {
    display: block;

    margin-bottom: 7px;

    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: 0.6px;
}

.sc-hydro-fact > strong {
    display: block;

    color: var(--verde-principale, #264733);

    font-size: 24px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-hydro-fact > p {
    margin: 10px 0 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.6;
}


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

.sc-hydro-note {
    display: flex;
    align-items: flex-start;
    gap: 13px;

    width: 100%;
    max-width: 700px;

    margin: 28px auto 0;
    padding: 18px 20px;

    border: 1px solid rgba(217, 180, 107, 0.52);
    border-radius: 17px;

    background: #fffaf0;
}

.sc-hydro-note-dot {
    flex: 0 0 9px;

    width: 9px;
    height: 9px;

    margin-top: 6px;

    border-radius: 50%;

    background: var(--oro-accento, #d9b46b);
}

.sc-hydro-note strong {
    display: block;

    margin: 0 0 4px;

    color: var(--verde-principale, #264733);

    font-size: 14px;
    font-weight: 850;
}

.sc-hydro-note p {
    margin: 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.58;
}


/* ==========================================================
   SPAZIATURA SEZIONI
========================================================== */

.sc-hydro-page .sc-cotronei-section-head {
    margin-top: 72px;
}


/* ==========================================================
   LE TRE CENTRALI
========================================================== */

.sc-hydro-system-grid {
    display: grid;

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

    gap: 20px;

    align-items: stretch;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-hydro-system-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 320px;

    padding: 27px;

    border: 1px solid rgba(38, 71, 51, 0.14);
    border-radius: 24px;

    background: #fbfaf6;

    box-shadow:
        0 7px 22px rgba(27, 52, 37, 0.045);
}

.sc-hydro-system-card-featured {
    border-color: rgba(217, 180, 107, 0.65);

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f7f3e8 100%
        );

    box-shadow:
        0 13px 30px rgba(27, 52, 37, 0.08);
}

.sc-hydro-system-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.sc-hydro-system-number {
    color: rgba(38, 71, 51, 0.30);

    font-size: 12px;
    font-weight: 850;
}

.sc-hydro-system-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8c6524;

    font-size: 9px;
    font-weight: 850;
    line-height: 1;

    text-transform: uppercase;

    letter-spacing: 0.55px;
}

.sc-hydro-system-card h3 {
    margin: 28px 0 13px;

    color: var(--verde-principale, #264733);

    font-size: 28px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-hydro-system-card p {
    margin: 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.67;
}


/* ==========================================================
   TIMPAGRANDE
========================================================== */

.sc-hydro-highlight {
    display: grid;

    grid-template-columns:
        minmax(0, 1.65fr)
        minmax(230px, 0.65fr);

    gap: 28px;

    align-items: stretch;

    width: 100%;
    max-width: 1080px;

    margin: 72px auto 0;
    padding: 35px;

    border-radius: 27px;

    background:
        linear-gradient(
            135deg,
            #244632 0%,
            #315d43 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(27, 52, 37, 0.09);
}

.sc-hydro-highlight-content {
    align-self: center;
}

.sc-hydro-highlight-content > span {
    display: inline-block;

    margin-bottom: 10px;

    color: #e2c47f;

    font-size: 10px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: 0.7px;
}

.sc-hydro-highlight-content h2 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(31px, 4vw, 45px);
    font-weight: 850;
    line-height: 1.06;

    letter-spacing: -0.5px;
}

.sc-hydro-highlight-content p {
    max-width: 670px;

    margin: 15px 0 0;

    color: rgba(255, 255, 255, 0.87);

    font-size: 14px;
    line-height: 1.68;
}

.sc-hydro-highlight-mark {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 250px;

    padding: 22px;

    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 22px;

    background: rgba(255, 255, 255, 0.08);

    text-align: center;
}

.sc-hydro-highlight-mark span {
    color: rgba(255, 255, 255, 0.72);

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

    text-transform: uppercase;

    letter-spacing: 1px;
}

.sc-hydro-highlight-mark strong {
    display: block;

    margin-top: 6px;

    color: #ffffff;

    font-size: 34px;
    font-weight: 850;
    line-height: 1;
}

.sc-hydro-highlight-mark small {
    display: block;

    margin-top: 13px;

    color: #e2c47f;

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

    letter-spacing: 0.5px;
}


/* ==========================================================
   CRONOLOGIA
========================================================== */

.sc-hydro-timeline {
    position: relative;

    width: 100%;
    max-width: 900px;

    margin: 0 auto;
}

.sc-hydro-timeline::before {
    content: "";

    position: absolute;

    top: 0;
    bottom: 0;
    left: 94px;

    width: 1px;

    background: rgba(38, 71, 51, 0.16);
}

.sc-hydro-timeline-item {
    position: relative;

    display: grid;

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

    gap: 44px;

    align-items: start;

    padding: 0 0 28px;
}

.sc-hydro-timeline-item:last-child {
    padding-bottom: 0;
}

.sc-hydro-timeline-year {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 39px;

    padding: 0 8px;

    border-radius: 999px;

    background: var(--verde-principale, #264733);
    color: #ffffff;

    font-size: 10px;
    font-weight: 850;
    line-height: 1;

    text-align: center;
}

.sc-hydro-timeline-content {
    position: relative;

    padding: 0 0 29px;
}

.sc-hydro-timeline-content::before {
    content: "";

    position: absolute;

    top: 12px;
    left: -27px;

    width: 9px;
    height: 9px;

    border: 3px solid #ffffff;
    border-radius: 50%;

    background: var(--oro-accento, #d9b46b);

    box-shadow:
        0 0 0 1px rgba(38, 71, 51, 0.18);
}

.sc-hydro-timeline-content > span {
    display: block;

    margin-bottom: 6px;

    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: 0.6px;
}

.sc-hydro-timeline-content h3 {
    margin: 0;

    color: var(--verde-principale, #264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.15;
}

.sc-hydro-timeline-content p {
    max-width: 690px;

    margin: 10px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.65;
}


/* ==========================================================
   IMPATTO SULLA COMUNITÀ
========================================================== */

.sc-hydro-impact-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-hydro-impact-card {
    min-width: 0;

    padding: 26px;

    border: 1px solid rgba(38, 71, 51, 0.14);
    border-radius: 22px;

    background: #ffffff;

    box-shadow:
        0 7px 22px rgba(27, 52, 37, 0.045);
}

.sc-hydro-impact-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: 0.6px;
}

.sc-hydro-impact-card h3 {
    margin: 21px 0 0;

    color: var(--verde-principale, #264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.15;
}

.sc-hydro-impact-card p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.63;
}


/* ==========================================================
   PROSSIMI CAPITOLI
========================================================== */

.sc-hydro-future-grid {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-hydro-future-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 230px;

    padding: 25px;

    border: 1px solid rgba(38, 71, 51, 0.13);
    border-radius: 22px;

    background: #fbfaf6;
}

.sc-hydro-future-card > span {
    color: rgba(38, 71, 51, 0.28);

    font-size: 12px;
    font-weight: 850;
}

.sc-hydro-future-card > strong {
    display: block;

    margin-top: 20px;

    color: var(--verde-principale, #264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.14;
}

.sc-hydro-future-card > p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.62;
}

.sc-hydro-future-card > small {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    align-self: flex-start;

    min-height: 32px;

    margin-top: auto;
    padding: 0 12px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8b682e;

    font-size: 10px;
    font-weight: 800;
}


/* ==========================================================
   FONTI
========================================================== */

.sc-hydro-sources-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-hydro-source-card {
    min-width: 0;

    padding: 25px;

    border: 1px solid rgba(38, 71, 51, 0.14);
    border-radius: 22px;

    background: #ffffff;

    box-shadow:
        0 7px 22px rgba(27, 52, 37, 0.045);
}

.sc-hydro-source-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: 0.6px;
}

.sc-hydro-source-card > strong {
    display: block;

    margin-top: 21px;

    color: var(--verde-principale, #264733);

    font-size: 21px;
    font-weight: 850;
    line-height: 1.14;
}

.sc-hydro-source-card > p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.62;
}


/* ==========================================================
   CONTINUA IL PERCORSO
========================================================== */

.sc-hydro-related-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-hydro-related-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 220px;

    padding: 25px;

    border: 1px solid rgba(38, 71, 51, 0.14);
    border-radius: 22px;

    background: #fbfaf6;

    color: inherit !important;

    text-decoration: none !important;

    box-shadow:
        0 7px 22px rgba(27, 52, 37, 0.045);

    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.sc-hydro-related-card:hover {
    transform: translateY(-3px);

    border-color: rgba(38, 71, 51, 0.30);

    box-shadow:
        0 16px 34px rgba(27, 52, 37, 0.10);
}

.sc-hydro-related-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    align-self: flex-start;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: 0.6px;
}

.sc-hydro-related-card > strong {
    display: block;

    margin-top: 21px;

    color: var(--verde-principale, #264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.14;
}

.sc-hydro-related-card > p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.62;
}


/* ==========================================================
   CTA
========================================================== */

.sc-hydro-page .sc-cotronei-story {
    margin-top: 72px;
}


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

@media (max-width: 900px) {

    .sc-hydro-hero {
        padding: 46px 38px;
    }

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

    .sc-hydro-fact:last-child {
        grid-column: 1 / -1;
    }

    .sc-hydro-system-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 18px;
    }

    .sc-hydro-system-card-featured {
        order: -1;
        grid-column: 1 / -1;

        min-height: 260px;
    }

    .sc-hydro-highlight {
        grid-template-columns: 1fr;
    }

    .sc-hydro-highlight-mark {
        min-height: 180px;
    }

    .sc-hydro-impact-grid,
    .sc-hydro-sources-grid,
    .sc-hydro-related-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 18px;
    }

    .sc-hydro-impact-card:last-child,
    .sc-hydro-source-card:last-child,
    .sc-hydro-related-card:last-child {
        grid-column: 1 / -1;
    }

}


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

@media (max-width: 680px) {

    .sc-hydro-hero {
        padding: 34px 22px;

        border-radius: 24px;
    }

    .sc-hydro-hero h1 {
        font-size: clamp(37px, 11vw, 48px);
    }

    .sc-hydro-lead {
        font-size: 14px;
    }

    .sc-hydro-actions {
        flex-direction: column;
    }

    .sc-hydro-actions a {
        width: 100%;
    }


    /* DATI */

    .sc-hydro-facts {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 30px;
    }

    .sc-hydro-fact:last-child {
        grid-column: auto;
    }


    /* SEZIONI */

    .sc-hydro-page .sc-cotronei-section-head {
        margin-top: 56px;
    }


    /* CENTRALI */

    .sc-hydro-system-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-hydro-system-card,
    .sc-hydro-system-card-featured {
        grid-column: auto;
        order: initial;

        min-height: 0;

        padding: 23px;
    }


    /* TIMPAGRANDE */

    .sc-hydro-highlight {
        grid-template-columns: 1fr;

        gap: 22px;

        margin-top: 56px;
        padding: 25px 22px;

        border-radius: 24px;
    }

    .sc-hydro-highlight-mark {
        min-height: 160px;
    }


    /* TIMELINE */

    .sc-hydro-timeline::before {
        display: none;
    }

    .sc-hydro-timeline-item {
        grid-template-columns: 1fr;

        gap: 12px;

        padding-bottom: 28px;
    }

    .sc-hydro-timeline-year {
        width: fit-content;
        min-width: 72px;
    }

    .sc-hydro-timeline-content {
        padding-bottom: 0;
    }

    .sc-hydro-timeline-content::before {
        display: none;
    }


    /* IMPATTO */

    .sc-hydro-impact-grid,
    .sc-hydro-future-grid,
    .sc-hydro-sources-grid,
    .sc-hydro-related-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-hydro-impact-card:last-child,
    .sc-hydro-source-card:last-child,
    .sc-hydro-related-card:last-child {
        grid-column: auto;
    }

    .sc-hydro-future-card {
        min-height: 0;
        padding: 23px;
    }


    /* CTA */

    .sc-hydro-page .sc-cotronei-story {
        margin-top: 56px;
    }

}


/* ==========================================================
   ACCESSIBILITÀ
========================================================== */

.sc-hydro-page a:focus-visible {
    outline: 3px solid rgba(217, 180, 107, 0.62);
    outline-offset: 3px;
}


@media (prefers-reduced-motion: reduce) {

    .sc-hydro-page *,
    .sc-hydro-page *::before,
    .sc-hydro-page *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }

}

/* ==========================================================
   COTRONEI - CITTÀ DELL'OLIO
   Classi specifiche .sc-oil-*
========================================================== */


/* ==========================================================
   BASE
========================================================== */

.sc-oil-page,
.sc-oil-page *,
.sc-oil-page *::before,
.sc-oil-page *::after {
    box-sizing: border-box;
}


/* ==========================================================
   HERO
========================================================== */

.sc-oil-hero {
    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
    padding: 58px 56px;

    border-radius: 28px;

    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(255,255,255,.11) 0,
            rgba(255,255,255,0) 30%
        ),
        linear-gradient(
            135deg,
            #46552f 0%,
            #59683a 55%,
            #6c7845 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(39, 53, 30, .10);
}

.sc-oil-hero-content {
    max-width: 780px;
}

.sc-oil-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 31px;

    padding: 0 13px;

    border-radius: 999px;

    background: rgba(255,255,255,.14);
    color: #ffffff;

    font-size: 10px;
    font-weight: 850;
    line-height: 1;

    text-align: center;
    text-transform: uppercase;

    letter-spacing: .65px;
}

.sc-oil-hero h1 {
    max-width: 770px;

    margin: 18px 0 0;

    color: #ffffff;

    font-size: clamp(40px, 5.4vw, 63px);
    font-weight: 850;
    line-height: 1.02;

    letter-spacing: -1px;
}

.sc-oil-lead {
    max-width: 700px;

    margin: 21px 0 0;

    color: rgba(255,255,255,.89);

    font-size: 16px;
    line-height: 1.72;
}


/* ==========================================================
   AZIONI HERO
========================================================== */

.sc-oil-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;

    margin-top: 28px;
}

.sc-oil-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 47px;

    padding: 0 21px;

    border-radius: 999px;

    background: #ffffff;
    color: var(--verde-principale, #264733) !important;

    font-size: 12px;
    font-weight: 850;
    line-height: 1.2;

    text-align: center;
    text-decoration: none !important;

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

    transition:
        transform .2s ease,
        background .2s ease;
}

.sc-oil-actions a + a {
    border: 1px solid rgba(255,255,255,.40);

    background: rgba(255,255,255,.09);
    color: #ffffff !important;

    box-shadow: none;
}

.sc-oil-actions a:hover {
    transform: translateY(-2px);
}

.sc-oil-actions a:first-child:hover {
    background: #f7f4ea;
}

.sc-oil-actions a + a:hover {
    background: rgba(255,255,255,.17);
}


/* ==========================================================
   DATI CHIAVE
========================================================== */

.sc-oil-facts {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 42px auto 0;
}

.sc-oil-fact {
    min-width: 0;

    padding: 24px;

    border: 1px solid rgba(70,85,47,.16);
    border-radius: 21px;

    background: #ffffff;

    box-shadow:
        0 7px 22px rgba(39,53,30,.045);
}

.sc-oil-fact > span {
    display: block;

    margin-bottom: 7px;

    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .6px;
}

.sc-oil-fact > strong {
    display: block;

    color: var(--verde-principale, #264733);

    font-size: 24px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-oil-fact > p {
    margin: 10px 0 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.6;
}


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

.sc-oil-note {
    display: flex;
    align-items: flex-start;
    gap: 13px;

    width: 100%;
    max-width: 700px;

    margin: 28px auto 0;
    padding: 18px 20px;

    border: 1px solid rgba(217,180,107,.52);
    border-radius: 17px;

    background: #fffaf0;
}

.sc-oil-note-dot {
    flex: 0 0 9px;

    width: 9px;
    height: 9px;

    margin-top: 6px;

    border-radius: 50%;

    background: var(--oro-accento, #d9b46b);
}

.sc-oil-note strong {
    display: block;

    margin: 0 0 4px;

    color: var(--verde-principale, #264733);

    font-size: 14px;
    font-weight: 850;
}

.sc-oil-note p {
    margin: 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.58;
}


/* ==========================================================
   SPAZIATURA
========================================================== */

.sc-oil-page .sc-cotronei-section-head {
    margin-top: 72px;
}


/* ==========================================================
   PERCORSO OLIO
========================================================== */

.sc-oil-path-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-oil-path-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 320px;

    padding: 27px;

    border: 1px solid rgba(70,85,47,.15);
    border-radius: 24px;

    background: #fbfaf6;

    box-shadow:
        0 7px 22px rgba(39,53,30,.045);
}

.sc-oil-path-card-featured {
    border-color: rgba(217,180,107,.68);

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f7f3e8 100%
        );

    box-shadow:
        0 13px 30px rgba(39,53,30,.08);
}

.sc-oil-path-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;
}

.sc-oil-path-number {
    color: rgba(38,71,51,.30);

    font-size: 12px;
    font-weight: 850;
}

.sc-oil-path-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8c6524;

    font-size: 9px;
    font-weight: 850;
    line-height: 1;

    text-transform: uppercase;

    letter-spacing: .55px;
}

.sc-oil-path-card h3 {
    margin: 28px 0 13px;

    color: var(--verde-principale, #264733);

    font-size: 28px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-oil-path-card p {
    margin: 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.67;
}


/* ==========================================================
   PREMIO VERGA
========================================================== */

.sc-oil-highlight {
    display: grid;

    grid-template-columns:
        minmax(0, 1.65fr)
        minmax(230px, .65fr);

    gap: 28px;

    width: 100%;
    max-width: 1080px;

    margin: 72px auto 0;
    padding: 35px;

    border-radius: 27px;

    background:
        linear-gradient(
            135deg,
            #46552f 0%,
            #61703f 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(39,53,30,.10);
}

.sc-oil-highlight-content {
    align-self: center;
}

.sc-oil-highlight-content > span {
    display: inline-block;

    margin-bottom: 10px;

    color: #e4c982;

    font-size: 10px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .7px;
}

.sc-oil-highlight-content h2 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(31px,4vw,45px);
    font-weight: 850;
    line-height: 1.06;

    letter-spacing: -.5px;
}

.sc-oil-highlight-content p {
    max-width: 670px;

    margin: 15px 0 0;

    color: rgba(255,255,255,.87);

    font-size: 14px;
    line-height: 1.68;
}

.sc-oil-highlight-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 44px;

    margin-top: 23px;
    padding: 0 18px;

    border-radius: 999px;

    background: #ffffff;
    color: var(--verde-principale, #264733) !important;

    font-size: 11px;
    font-weight: 850;

    text-decoration: none !important;

    transition:
        transform .2s ease,
        background .2s ease;
}

.sc-oil-highlight-button:hover {
    transform: translateY(-2px);

    background: #f7f4ea;
}

.sc-oil-highlight-mark {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 250px;

    padding: 22px;

    border: 1px solid rgba(255,255,255,.16);
    border-radius: 22px;

    background: rgba(255,255,255,.08);

    text-align: center;
}

.sc-oil-highlight-mark span {
    color: rgba(255,255,255,.72);

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

    text-transform: uppercase;

    letter-spacing: 1px;
}

.sc-oil-highlight-mark strong {
    display: block;

    max-width: 190px;

    margin-top: 8px;

    color: #ffffff;

    font-size: 30px;
    font-weight: 850;
    line-height: 1.05;
}

.sc-oil-highlight-mark small {
    display: block;

    margin-top: 13px;

    color: #e4c982;

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

    letter-spacing: .5px;
}


/* ==========================================================
   RETE CITTÀ DELL'OLIO
========================================================== */

.sc-oil-network {
    display: grid;

    grid-template-columns:
        minmax(0,1.6fr)
        minmax(200px,.55fr);

    gap: 28px;

    align-items: stretch;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
    padding: 31px;

    border: 1px solid rgba(70,85,47,.16);
    border-radius: 25px;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #faf8f1 100%
        );
}

.sc-oil-network-content {
    align-self: center;
}

.sc-oil-network-content > span {
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .65px;
}

.sc-oil-network-content h3 {
    max-width: 620px;

    margin: 10px 0 0;

    color: var(--verde-principale,#264733);

    font-size: clamp(27px,3vw,36px);
    font-weight: 850;
    line-height: 1.1;
}

.sc-oil-network-content p {
    max-width: 690px;

    margin: 13px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.67;
}

.sc-oil-network-badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 210px;

    padding: 20px;

    border-radius: 21px;

    background: #566536;

    color: #ffffff;

    text-align: center;
}

.sc-oil-network-badge small {
    font-size: 9px;
    font-weight: 800;

    text-transform: uppercase;

    letter-spacing: .7px;

    opacity: .75;
}

.sc-oil-network-badge strong {
    display: block;

    margin-top: 8px;

    font-size: 31px;
    font-weight: 850;
    line-height: 1.02;
}


/* ==========================================================
   PROCESSO
========================================================== */

.sc-oil-process {
    display: grid;

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

    gap: 17px;

    width: 100%;
    max-width: 900px;

    margin: 0 auto;
}

.sc-oil-process-item {
    display: grid;

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

    gap: 17px;

    min-width: 0;

    padding: 23px;

    border: 1px solid rgba(70,85,47,.14);
    border-radius: 20px;

    background: #fbfaf6;
}

.sc-oil-process-item > span {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 41px;
    height: 41px;

    border-radius: 50%;

    background: #566536;
    color: #ffffff;

    font-size: 10px;
    font-weight: 850;
}

.sc-oil-process-item strong {
    display: block;

    color: var(--verde-principale,#264733);

    font-size: 19px;
    font-weight: 850;
    line-height: 1.15;
}

.sc-oil-process-item p {
    margin: 8px 0 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.6;
}


/* ==========================================================
   IDENTITÀ / OLEOTURISMO
========================================================== */

.sc-oil-identity-grid,
.sc-oil-tourism-grid,
.sc-oil-sources-grid,
.sc-oil-related-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-oil-identity-card,
.sc-oil-tourism-card,
.sc-oil-source-card,
.sc-oil-related-card {
    min-width: 0;

    padding: 25px;

    border: 1px solid rgba(70,85,47,.14);
    border-radius: 22px;

    background: #ffffff;

    color: inherit !important;
    text-decoration: none !important;

    box-shadow:
        0 7px 22px rgba(39,53,30,.045);
}

.sc-oil-tourism-card,
.sc-oil-related-card {
    background: #fbfaf6;
}

.sc-oil-source-card,
.sc-oil-related-card {
    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.sc-oil-source-card:hover,
.sc-oil-related-card:hover {
    transform: translateY(-3px);

    border-color: rgba(70,85,47,.30);

    box-shadow:
        0 16px 34px rgba(39,53,30,.10);
}

.sc-oil-identity-card > span,
.sc-oil-tourism-card > span,
.sc-oil-source-card > span,
.sc-oil-related-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .6px;
}

.sc-oil-identity-card h3,
.sc-oil-tourism-card > strong,
.sc-oil-source-card > strong,
.sc-oil-related-card > strong {
    display: block;

    margin: 21px 0 0;

    color: var(--verde-principale,#264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.15;
}

.sc-oil-identity-card p,
.sc-oil-tourism-card p,
.sc-oil-source-card p,
.sc-oil-related-card p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.63;
}


/* ==========================================================
   PROSSIMI CAPITOLI
========================================================== */

.sc-oil-future-grid {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-oil-future-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 230px;

    padding: 25px;

    border: 1px solid rgba(70,85,47,.13);
    border-radius: 22px;

    background: #fbfaf6;
}

.sc-oil-future-card > span {
    color: rgba(38,71,51,.28);

    font-size: 12px;
    font-weight: 850;
}

.sc-oil-future-card > strong {
    display: block;

    margin-top: 20px;

    color: var(--verde-principale,#264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.14;
}

.sc-oil-future-card > p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.62;
}

.sc-oil-future-card > small {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    align-self: flex-start;

    min-height: 32px;

    margin-top: auto;
    padding: 0 12px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8b682e;

    font-size: 10px;
    font-weight: 800;
}


/* ==========================================================
   CTA
========================================================== */

.sc-oil-page .sc-cotronei-story {
    margin-top: 72px;
}


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

@media (max-width: 900px) {

    .sc-oil-hero {
        padding: 46px 38px;
    }

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

    .sc-oil-fact:last-child {
        grid-column: 1 / -1;
    }

    .sc-oil-path-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap: 18px;
    }

    .sc-oil-path-card-featured {
        order: -1;
        grid-column: 1 / -1;

        min-height: 260px;
    }

    .sc-oil-highlight,
    .sc-oil-network {
        grid-template-columns: 1fr;
    }

    .sc-oil-highlight-mark,
    .sc-oil-network-badge {
        min-height: 170px;
    }

    .sc-oil-identity-grid,
    .sc-oil-tourism-grid,
    .sc-oil-sources-grid,
    .sc-oil-related-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap: 18px;
    }

    .sc-oil-identity-card:last-child,
    .sc-oil-tourism-card:last-child,
    .sc-oil-source-card:last-child,
    .sc-oil-related-card:last-child {
        grid-column: 1 / -1;
    }

}


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

@media (max-width: 680px) {

    .sc-oil-hero {
        padding: 34px 22px;

        border-radius: 24px;
    }

    .sc-oil-hero h1 {
        font-size: clamp(37px,11vw,48px);
    }

    .sc-oil-lead {
        font-size: 14px;
    }

    .sc-oil-actions {
        flex-direction: column;
    }

    .sc-oil-actions a {
        width: 100%;
    }


    .sc-oil-facts {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 30px;
    }

    .sc-oil-fact:last-child {
        grid-column: auto;
    }


    .sc-oil-page .sc-cotronei-section-head {
        margin-top: 56px;
    }


    .sc-oil-path-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-oil-path-card,
    .sc-oil-path-card-featured {
        grid-column: auto;
        order: initial;

        min-height: 0;

        padding: 23px;
    }


    .sc-oil-highlight {
        grid-template-columns: 1fr;

        gap: 22px;

        margin-top: 56px;
        padding: 25px 22px;

        border-radius: 24px;
    }


    .sc-oil-network {
        grid-template-columns: 1fr;

        padding: 23px;
    }


    .sc-oil-process {
        grid-template-columns: 1fr;

        gap: 14px;
    }


    .sc-oil-identity-grid,
    .sc-oil-tourism-grid,
    .sc-oil-future-grid,
    .sc-oil-sources-grid,
    .sc-oil-related-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-oil-identity-card:last-child,
    .sc-oil-tourism-card:last-child,
    .sc-oil-source-card:last-child,
    .sc-oil-related-card:last-child {
        grid-column: auto;
    }

    .sc-oil-future-card {
        min-height: 0;

        padding: 23px;
    }


    .sc-oil-page .sc-cotronei-story {
        margin-top: 56px;
    }

}


/* ==========================================================
   ACCESSIBILITÀ
========================================================== */

.sc-oil-page a:focus-visible {
    outline: 3px solid rgba(217,180,107,.62);
    outline-offset: 3px;
}


@media (prefers-reduced-motion: reduce) {

    .sc-oil-page *,
    .sc-oil-page *::before,
    .sc-oil-page *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }

}

/* ==========================================================
   CENTRO STORICO DI COTRONEI - LA GRIA
   Classi specifiche .sc-centro-*
========================================================== */


/* ==========================================================
   BASE
========================================================== */

.sc-centro-page,
.sc-centro-page *,
.sc-centro-page *::before,
.sc-centro-page *::after {
    box-sizing: border-box;
}


/* ==========================================================
   HERO
========================================================== */

.sc-centro-hero {
    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
    padding: 58px 56px;

    border-radius: 28px;

    background:
        radial-gradient(
            circle at 87% 17%,
            rgba(255,255,255,.10) 0,
            rgba(255,255,255,0) 30%
        ),
        linear-gradient(
            135deg,
            #30483a 0%,
            #3c5847 58%,
            #526758 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(27,52,37,.10);
}

.sc-centro-hero-content {
    max-width: 780px;
}

.sc-centro-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 31px;

    padding: 0 13px;

    border-radius: 999px;

    background: rgba(255,255,255,.14);
    color: #ffffff;

    font-size: 10px;
    font-weight: 850;
    line-height: 1;

    text-align: center;
    text-transform: uppercase;

    letter-spacing: .65px;
}

.sc-centro-hero h1 {
    max-width: 760px;

    margin: 18px 0 0;

    color: #ffffff;

    font-size: clamp(40px,5.4vw,63px);
    font-weight: 850;
    line-height: 1.02;

    letter-spacing: -1px;
}

.sc-centro-lead {
    max-width: 700px;

    margin: 21px 0 0;

    color: rgba(255,255,255,.89);

    font-size: 16px;
    line-height: 1.72;
}


/* ==========================================================
   AZIONI HERO
========================================================== */

.sc-centro-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;

    margin-top: 28px;
}

.sc-centro-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 47px;

    padding: 0 21px;

    border-radius: 999px;

    background: #ffffff;
    color: var(--verde-principale,#264733) !important;

    font-size: 12px;
    font-weight: 850;
    line-height: 1.2;

    text-align: center;
    text-decoration: none !important;

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

    transition:
        transform .2s ease,
        background .2s ease;
}

.sc-centro-actions a + a {
    border: 1px solid rgba(255,255,255,.40);

    background: rgba(255,255,255,.09);
    color: #ffffff !important;

    box-shadow: none;
}

.sc-centro-actions a:hover {
    transform: translateY(-2px);
}

.sc-centro-actions a:first-child:hover {
    background: #f7f4ea;
}

.sc-centro-actions a + a:hover {
    background: rgba(255,255,255,.17);
}


/* ==========================================================
   DATI CHIAVE
========================================================== */

.sc-centro-facts {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 42px auto 0;
}

.sc-centro-fact {
    min-width: 0;

    padding: 24px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 21px;

    background: #ffffff;

    box-shadow:
        0 7px 22px rgba(27,52,37,.045);
}

.sc-centro-fact > span {
    display: block;

    margin-bottom: 7px;

    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .6px;
}

.sc-centro-fact > strong {
    display: block;

    color: var(--verde-principale,#264733);

    font-size: 24px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-centro-fact > p {
    margin: 10px 0 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.6;
}


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

.sc-centro-note {
    display: flex;
    align-items: flex-start;
    gap: 13px;

    width: 100%;
    max-width: 700px;

    margin: 28px auto 0;
    padding: 18px 20px;

    border: 1px solid rgba(217,180,107,.52);
    border-radius: 17px;

    background: #fffaf0;
}

.sc-centro-note-dot {
    flex: 0 0 9px;

    width: 9px;
    height: 9px;

    margin-top: 6px;

    border-radius: 50%;

    background: var(--oro-accento,#d9b46b);
}

.sc-centro-note strong {
    display: block;

    margin: 0 0 4px;

    color: var(--verde-principale,#264733);

    font-size: 14px;
    font-weight: 850;
}

.sc-centro-note p {
    margin: 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.58;
}


/* ==========================================================
   SPAZIATURA
========================================================== */

.sc-centro-page .sc-cotronei-section-head {
    margin-top: 72px;
}


/* ==========================================================
   PERCORSO
========================================================== */

.sc-centro-path-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-centro-path-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 320px;

    padding: 27px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 24px;

    background: #fbfaf6;

    box-shadow:
        0 7px 22px rgba(27,52,37,.045);
}

.sc-centro-path-card-featured {
    border-color: rgba(217,180,107,.68);

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f7f3e8 100%
        );

    box-shadow:
        0 13px 30px rgba(27,52,37,.08);
}

.sc-centro-path-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;
}

.sc-centro-path-number {
    color: rgba(38,71,51,.30);

    font-size: 12px;
    font-weight: 850;
}

.sc-centro-path-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8c6524;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .55px;
}

.sc-centro-path-card h3 {
    margin: 28px 0 13px;

    color: var(--verde-principale,#264733);

    font-size: 28px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-centro-path-card p {
    margin: 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.67;
}


/* ==========================================================
   HIGHLIGHT LA GRIA
========================================================== */

.sc-centro-highlight {
    display: grid;

    grid-template-columns:
        minmax(0,1.65fr)
        minmax(230px,.65fr);

    gap: 28px;

    width: 100%;
    max-width: 1080px;

    margin: 72px auto 0;
    padding: 35px;

    border-radius: 27px;

    background:
        linear-gradient(
            135deg,
            #30483a 0%,
            #425d4b 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(27,52,37,.10);
}

.sc-centro-highlight-content {
    align-self: center;
}

.sc-centro-highlight-content > span {
    display: inline-block;

    margin-bottom: 10px;

    color: #e4c982;

    font-size: 10px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .7px;
}

.sc-centro-highlight-content h2 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(31px,4vw,45px);
    font-weight: 850;
    line-height: 1.06;

    letter-spacing: -.5px;
}

.sc-centro-highlight-content p {
    max-width: 670px;

    margin: 15px 0 0;

    color: rgba(255,255,255,.87);

    font-size: 14px;
    line-height: 1.68;
}

.sc-centro-highlight-mark {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 250px;

    padding: 22px;

    border: 1px solid rgba(255,255,255,.16);
    border-radius: 22px;

    background: rgba(255,255,255,.08);

    text-align: center;
}

.sc-centro-highlight-mark span {
    color: rgba(255,255,255,.72);

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

    text-transform: uppercase;

    letter-spacing: 1px;
}

.sc-centro-highlight-mark strong {
    display: block;

    margin-top: 7px;

    color: #ffffff;

    font-size: 38px;
    font-weight: 850;
    line-height: 1;
}

.sc-centro-highlight-mark small {
    display: block;

    margin-top: 13px;

    color: #e4c982;

    font-size: 10px;
    font-weight: 700;
}


/* ==========================================================
   MEMORIA
========================================================== */

.sc-centro-memory-grid,
.sc-centro-related-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-centro-memory-card,
.sc-centro-related-card {
    min-width: 0;

    padding: 25px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 22px;

    background: #ffffff;

    box-shadow:
        0 7px 22px rgba(27,52,37,.045);
}

.sc-centro-related-card {
    background: #fbfaf6;

    color: inherit !important;
    text-decoration: none !important;

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

.sc-centro-related-card:hover {
    transform: translateY(-3px);

    border-color: rgba(38,71,51,.30);

    box-shadow:
        0 16px 34px rgba(27,52,37,.10);
}

.sc-centro-memory-card > span,
.sc-centro-related-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .6px;
}

.sc-centro-memory-card h3,
.sc-centro-related-card > strong {
    display: block;

    margin: 21px 0 0;

    color: var(--verde-principale,#264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.15;
}

.sc-centro-memory-card p,
.sc-centro-related-card p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.63;
}


/* ==========================================================
   IERI / OGGI
========================================================== */

.sc-centro-compare {
    display: grid;

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

    gap: 24px;

    align-items: center;

    width: 100%;
    max-width: 900px;

    margin: 0 auto;
    padding: 28px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 24px;

    background: #fbfaf6;
}

.sc-centro-compare-item > span {
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .65px;
}

.sc-centro-compare-item > strong {
    display: block;

    margin-top: 8px;

    color: var(--verde-principale,#264733);

    font-size: 23px;
    font-weight: 850;
}

.sc-centro-compare-item > p {
    margin: 10px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.62;
}

.sc-centro-compare-divider {
    color: rgba(38,71,51,.25);

    font-size: 30px;
    font-weight: 300;
}


/* ==========================================================
   PROSSIMI APPROFONDIMENTI
========================================================== */

.sc-centro-future-grid {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-centro-future-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 230px;

    padding: 25px;

    border: 1px solid rgba(38,71,51,.13);
    border-radius: 22px;

    background: #fbfaf6;
}

.sc-centro-future-card > span {
    color: rgba(38,71,51,.28);

    font-size: 12px;
    font-weight: 850;
}

.sc-centro-future-card > strong {
    display: block;

    margin-top: 20px;

    color: var(--verde-principale,#264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.14;
}

.sc-centro-future-card > p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.62;
}

.sc-centro-future-card > small {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    align-self: flex-start;

    min-height: 32px;

    margin-top: auto;
    padding: 0 12px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8b682e;

    font-size: 10px;
    font-weight: 800;
}


/* ==========================================================
   FONTE
========================================================== */

.sc-centro-source {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 28px;

    width: 100%;
    max-width: 900px;

    margin: 0 auto;
    padding: 27px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 22px;

    background: #ffffff;
}

.sc-centro-source > div {
    max-width: 620px;
}

.sc-centro-source span {
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .6px;
}

.sc-centro-source strong {
    display: block;

    margin-top: 7px;

    color: var(--verde-principale,#264733);

    font-size: 21px;
    font-weight: 850;
}

.sc-centro-source p {
    margin: 8px 0 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.6;
}

.sc-centro-source > a {
    flex: 0 0 auto;

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

    min-height: 43px;

    padding: 0 17px;

    border-radius: 999px;

    background: var(--verde-principale,#264733);
    color: #ffffff !important;

    font-size: 11px;
    font-weight: 850;

    text-decoration: none !important;
}


/* ==========================================================
   CTA
========================================================== */

.sc-centro-page .sc-cotronei-story {
    margin-top: 72px;
}


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

@media (max-width:900px) {

    .sc-centro-hero {
        padding: 46px 38px;
    }

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

    .sc-centro-fact:last-child {
        grid-column: 1 / -1;
    }

    .sc-centro-path-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap: 18px;
    }

    .sc-centro-path-card-featured {
        grid-column: 1 / -1;
        order: -1;

        min-height: 260px;
    }

    .sc-centro-highlight {
        grid-template-columns: 1fr;
    }

    .sc-centro-highlight-mark {
        min-height: 170px;
    }

    .sc-centro-memory-grid,
    .sc-centro-related-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .sc-centro-memory-card:last-child,
    .sc-centro-related-card:last-child {
        grid-column: 1 / -1;
    }

}


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

@media (max-width:680px) {

    .sc-centro-hero {
        padding: 34px 22px;

        border-radius: 24px;
    }

    .sc-centro-hero h1 {
        font-size: clamp(37px,11vw,48px);
    }

    .sc-centro-lead {
        font-size: 14px;
    }

    .sc-centro-actions {
        flex-direction: column;
    }

    .sc-centro-actions a {
        width: 100%;
    }


    .sc-centro-facts {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 30px;
    }

    .sc-centro-fact:last-child {
        grid-column: auto;
    }


    .sc-centro-page .sc-cotronei-section-head {
        margin-top: 56px;
    }


    .sc-centro-path-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-centro-path-card,
    .sc-centro-path-card-featured {
        grid-column: auto;
        order: initial;

        min-height: 0;

        padding: 23px;
    }


    .sc-centro-highlight {
        grid-template-columns: 1fr;

        gap: 22px;

        margin-top: 56px;
        padding: 25px 22px;

        border-radius: 24px;
    }


    .sc-centro-memory-grid,
    .sc-centro-related-grid,
    .sc-centro-future-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-centro-memory-card:last-child,
    .sc-centro-related-card:last-child {
        grid-column: auto;
    }


    .sc-centro-compare {
        grid-template-columns: 1fr;

        gap: 20px;

        padding: 23px;
    }

    .sc-centro-compare-divider {
        display: none;
    }


    .sc-centro-future-card {
        min-height: 0;

        padding: 23px;
    }


    .sc-centro-source {
        flex-direction: column;
        align-items: stretch;

        padding: 23px;
    }

    .sc-centro-source > a {
        width: 100%;
    }


    .sc-centro-page .sc-cotronei-story {
        margin-top: 56px;
    }

}


/* ==========================================================
   ACCESSIBILITÀ
========================================================== */

.sc-centro-page a:focus-visible {
    outline: 3px solid rgba(217,180,107,.62);
    outline-offset: 3px;
}


@media (prefers-reduced-motion:reduce) {

    .sc-centro-page *,
    .sc-centro-page *::before,
    .sc-centro-page *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }

}

/* ==========================================================
   QUARTIERI DI COTRONEI
   Classi specifiche .sc-quartieri-*
========================================================== */


/* ==========================================================
   BASE
========================================================== */

.sc-quartieri-page,
.sc-quartieri-page *,
.sc-quartieri-page *::before,
.sc-quartieri-page *::after {
    box-sizing: border-box;
}


/* ==========================================================
   HERO
========================================================== */

.sc-quartieri-hero {
    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
    padding: 58px 56px;

    border-radius: 28px;

    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(255,255,255,.10) 0,
            rgba(255,255,255,0) 30%
        ),
        linear-gradient(
            135deg,
            #30483a 0%,
            #41594a 58%,
            #586b5c 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(27,52,37,.10);
}

.sc-quartieri-hero-content {
    max-width: 780px;
}

.sc-quartieri-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 31px;

    padding: 0 13px;

    border-radius: 999px;

    background: rgba(255,255,255,.14);
    color: #ffffff;

    font-size: 10px;
    font-weight: 850;
    line-height: 1;

    text-transform: uppercase;

    letter-spacing: .65px;
}

.sc-quartieri-hero h1 {
    max-width: 760px;

    margin: 18px 0 0;

    color: #ffffff;

    font-size: clamp(40px,5.4vw,63px);
    font-weight: 850;
    line-height: 1.02;

    letter-spacing: -1px;
}

.sc-quartieri-lead {
    max-width: 700px;

    margin: 21px 0 0;

    color: rgba(255,255,255,.89);

    font-size: 16px;
    line-height: 1.72;
}


/* ==========================================================
   AZIONI HERO
========================================================== */

.sc-quartieri-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;

    margin-top: 28px;
}

.sc-quartieri-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 47px;

    padding: 0 21px;

    border-radius: 999px;

    background: #ffffff;
    color: var(--verde-principale,#264733) !important;

    font-size: 12px;
    font-weight: 850;
    line-height: 1.2;

    text-align: center;
    text-decoration: none !important;

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

    transition:
        transform .2s ease,
        background .2s ease;
}

.sc-quartieri-actions a + a {
    border: 1px solid rgba(255,255,255,.40);

    background: rgba(255,255,255,.09);
    color: #ffffff !important;

    box-shadow: none;
}

.sc-quartieri-actions a:hover {
    transform: translateY(-2px);
}

.sc-quartieri-actions a:first-child:hover {
    background: #f7f4ea;
}

.sc-quartieri-actions a + a:hover {
    background: rgba(255,255,255,.17);
}


/* ==========================================================
   DATI CHIAVE
========================================================== */

.sc-quartieri-facts {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 42px auto 0;
}

.sc-quartieri-fact {
    min-width: 0;

    padding: 24px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 21px;

    background: #ffffff;

    box-shadow:
        0 7px 22px rgba(27,52,37,.045);
}

.sc-quartieri-fact > span {
    display: block;

    margin-bottom: 7px;

    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .6px;
}

.sc-quartieri-fact > strong {
    display: block;

    color: var(--verde-principale,#264733);

    font-size: 24px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-quartieri-fact > p {
    margin: 10px 0 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.6;
}


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

.sc-quartieri-note {
    display: flex;
    align-items: flex-start;
    gap: 13px;

    width: 100%;
    max-width: 700px;

    margin: 28px auto 0;
    padding: 18px 20px;

    border: 1px solid rgba(217,180,107,.52);
    border-radius: 17px;

    background: #fffaf0;
}

.sc-quartieri-note-dot {
    flex: 0 0 9px;

    width: 9px;
    height: 9px;

    margin-top: 6px;

    border-radius: 50%;

    background: var(--oro-accento,#d9b46b);
}

.sc-quartieri-note strong {
    display: block;

    margin: 0 0 4px;

    color: var(--verde-principale,#264733);

    font-size: 14px;
    font-weight: 850;
}

.sc-quartieri-note p {
    margin: 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.58;
}


/* ==========================================================
   SPAZIATURA
========================================================== */

.sc-quartieri-page .sc-cotronei-section-head {
    margin-top: 72px;
}


/* ==========================================================
   PERCORSO
========================================================== */

.sc-quartieri-path-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-quartieri-path-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 320px;

    padding: 27px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 24px;

    background: #fbfaf6;

    box-shadow:
        0 7px 22px rgba(27,52,37,.045);
}

.sc-quartieri-path-card-featured {
    border-color: rgba(217,180,107,.68);

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f7f3e8 100%
        );

    box-shadow:
        0 13px 30px rgba(27,52,37,.08);
}

.sc-quartieri-path-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;
}

.sc-quartieri-path-number {
    color: rgba(38,71,51,.30);

    font-size: 12px;
    font-weight: 850;
}

.sc-quartieri-path-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8c6524;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .55px;
}

.sc-quartieri-path-card h3 {
    margin: 28px 0 13px;

    color: var(--verde-principale,#264733);

    font-size: 28px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-quartieri-path-card p {
    margin: 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.67;
}


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

.sc-quartieri-highlight {
    display: grid;

    grid-template-columns:
        minmax(0,1.65fr)
        minmax(230px,.65fr);

    gap: 28px;

    width: 100%;
    max-width: 1080px;

    margin: 72px auto 0;
    padding: 35px;

    border-radius: 27px;

    background:
        linear-gradient(
            135deg,
            #30483a 0%,
            #425d4b 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(27,52,37,.10);
}

.sc-quartieri-highlight-content {
    align-self: center;
}

.sc-quartieri-highlight-content > span {
    display: inline-block;

    margin-bottom: 10px;

    color: #e4c982;

    font-size: 10px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .7px;
}

.sc-quartieri-highlight-content h2 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(31px,4vw,45px);
    font-weight: 850;
    line-height: 1.06;

    letter-spacing: -.5px;
}

.sc-quartieri-highlight-content p {
    max-width: 670px;

    margin: 15px 0 0;

    color: rgba(255,255,255,.87);

    font-size: 14px;
    line-height: 1.68;
}

.sc-quartieri-highlight-mark {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 250px;

    padding: 22px;

    border: 1px solid rgba(255,255,255,.16);
    border-radius: 22px;

    background: rgba(255,255,255,.08);

    text-align: center;
}

.sc-quartieri-highlight-mark span {
    color: rgba(255,255,255,.72);

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

    text-transform: uppercase;

    letter-spacing: 1px;
}

.sc-quartieri-highlight-mark strong {
    display: block;

    max-width: 200px;

    margin-top: 7px;

    color: #ffffff;

    font-size: 31px;
    font-weight: 850;
    line-height: 1.04;
}

.sc-quartieri-highlight-mark small {
    display: block;

    margin-top: 13px;

    color: #e4c982;

    font-size: 10px;
    font-weight: 700;
}


/* ==========================================================
   TIPOLOGIE / MEMORIA / RELATED
========================================================== */

.sc-quartieri-types-grid,
.sc-quartieri-memory-grid,
.sc-quartieri-related-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-quartieri-type-card,
.sc-quartieri-memory-card,
.sc-quartieri-related-card {
    min-width: 0;

    padding: 25px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 22px;

    background: #ffffff;

    box-shadow:
        0 7px 22px rgba(27,52,37,.045);
}

.sc-quartieri-related-card {
    background: #fbfaf6;

    color: inherit !important;
    text-decoration: none !important;

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

.sc-quartieri-related-card:hover {
    transform: translateY(-3px);

    border-color: rgba(38,71,51,.30);

    box-shadow:
        0 16px 34px rgba(27,52,37,.10);
}

.sc-quartieri-type-card > span,
.sc-quartieri-memory-card > span,
.sc-quartieri-related-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .6px;
}

.sc-quartieri-type-card h3,
.sc-quartieri-memory-card h3,
.sc-quartieri-related-card > strong {
    display: block;

    margin: 21px 0 0;

    color: var(--verde-principale,#264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.15;
}

.sc-quartieri-type-card p,
.sc-quartieri-memory-card p,
.sc-quartieri-related-card p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.63;
}


/* ==========================================================
   SCHEDE FUTURE
========================================================== */

.sc-quartieri-future-grid {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-quartieri-future-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 230px;

    padding: 25px;

    border: 1px solid rgba(38,71,51,.13);
    border-radius: 22px;

    background: #fbfaf6;
}

.sc-quartieri-future-card > span {
    color: rgba(38,71,51,.28);

    font-size: 12px;
    font-weight: 850;
}

.sc-quartieri-future-card > strong {
    display: block;

    margin-top: 20px;

    color: var(--verde-principale,#264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.14;
}

.sc-quartieri-future-card > p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.62;
}

.sc-quartieri-future-card > small {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    align-self: flex-start;

    min-height: 32px;

    margin-top: auto;
    padding: 0 12px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8b682e;

    font-size: 10px;
    font-weight: 800;
}


/* ==========================================================
   CENTRO STORICO
========================================================== */

.sc-quartieri-centro {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;

    width: 100%;
    max-width: 900px;

    margin: 72px auto 0;
    padding: 30px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 24px;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f8f6ef 100%
        );
}

.sc-quartieri-centro > div {
    max-width: 630px;
}

.sc-quartieri-centro span {
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .65px;
}

.sc-quartieri-centro h2 {
    margin: 8px 0 0;

    color: var(--verde-principale,#264733);

    font-size: clamp(27px,3vw,36px);
    font-weight: 850;
    line-height: 1.1;
}

.sc-quartieri-centro p {
    margin: 12px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.65;
}

.sc-quartieri-centro > a {
    flex: 0 0 auto;

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

    min-height: 44px;

    padding: 0 18px;

    border-radius: 999px;

    background: var(--verde-principale,#264733);
    color: #ffffff !important;

    font-size: 11px;
    font-weight: 850;

    text-align: center;
    text-decoration: none !important;
}


/* ==========================================================
   CTA
========================================================== */

.sc-quartieri-page .sc-cotronei-story {
    margin-top: 72px;
}


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

@media (max-width:900px) {

    .sc-quartieri-hero {
        padding: 46px 38px;
    }

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

    .sc-quartieri-fact:last-child {
        grid-column: 1 / -1;
    }

    .sc-quartieri-path-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap: 18px;
    }

    .sc-quartieri-path-card-featured {
        grid-column: 1 / -1;
        order: -1;

        min-height: 260px;
    }

    .sc-quartieri-highlight {
        grid-template-columns: 1fr;
    }

    .sc-quartieri-highlight-mark {
        min-height: 170px;
    }

    .sc-quartieri-types-grid,
    .sc-quartieri-memory-grid,
    .sc-quartieri-related-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .sc-quartieri-type-card:last-child,
    .sc-quartieri-memory-card:last-child,
    .sc-quartieri-related-card:last-child {
        grid-column: 1 / -1;
    }

}


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

@media (max-width:680px) {

    .sc-quartieri-hero {
        padding: 34px 22px;

        border-radius: 24px;
    }

    .sc-quartieri-hero h1 {
        font-size: clamp(37px,11vw,48px);
    }

    .sc-quartieri-lead {
        font-size: 14px;
    }

    .sc-quartieri-actions {
        flex-direction: column;
    }

    .sc-quartieri-actions a {
        width: 100%;
    }


    .sc-quartieri-facts {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 30px;
    }

    .sc-quartieri-fact:last-child {
        grid-column: auto;
    }


    .sc-quartieri-page .sc-cotronei-section-head {
        margin-top: 56px;
    }


    .sc-quartieri-path-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-quartieri-path-card,
    .sc-quartieri-path-card-featured {
        grid-column: auto;
        order: initial;

        min-height: 0;

        padding: 23px;
    }


    .sc-quartieri-highlight {
        grid-template-columns: 1fr;

        gap: 22px;

        margin-top: 56px;
        padding: 25px 22px;

        border-radius: 24px;
    }


    .sc-quartieri-types-grid,
    .sc-quartieri-memory-grid,
    .sc-quartieri-future-grid,
    .sc-quartieri-related-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-quartieri-type-card:last-child,
    .sc-quartieri-memory-card:last-child,
    .sc-quartieri-related-card:last-child {
        grid-column: auto;
    }


    .sc-quartieri-future-card {
        min-height: 0;

        padding: 23px;
    }


    .sc-quartieri-centro {
        flex-direction: column;
        align-items: stretch;

        margin-top: 56px;
        padding: 23px;
    }

    .sc-quartieri-centro > a {
        width: 100%;
    }


    .sc-quartieri-page .sc-cotronei-story {
        margin-top: 56px;
    }

}


/* ==========================================================
   ACCESSIBILITÀ
========================================================== */

.sc-quartieri-page a:focus-visible {
    outline: 3px solid rgba(217,180,107,.62);
    outline-offset: 3px;
}


@media (prefers-reduced-motion:reduce) {

    .sc-quartieri-page *,
    .sc-quartieri-page *::before,
    .sc-quartieri-page *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }

}

/* ==========================================================
   CHIESE DI COTRONEI
   Classi specifiche .sc-chiese-*
========================================================== */

.sc-chiese-page,
.sc-chiese-page *,
.sc-chiese-page *::before,
.sc-chiese-page *::after {
    box-sizing: border-box;
}


/* ==========================================================
   HERO
========================================================== */

.sc-chiese-hero {
    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
    padding: 58px 56px;

    border-radius: 28px;

    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(255,255,255,.10) 0,
            rgba(255,255,255,0) 30%
        ),
        linear-gradient(
            135deg,
            #30473b 0%,
            #40584a 58%,
            #596a5d 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(27,52,37,.10);
}

.sc-chiese-hero-content {
    max-width: 780px;
}

.sc-chiese-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 31px;

    padding: 0 13px;

    border-radius: 999px;

    background: rgba(255,255,255,.14);
    color: #ffffff;

    font-size: 10px;
    font-weight: 850;
    line-height: 1;

    text-transform: uppercase;

    letter-spacing: .65px;
}

.sc-chiese-hero h1 {
    max-width: 760px;

    margin: 18px 0 0;

    color: #ffffff;

    font-size: clamp(40px,5.4vw,63px);
    font-weight: 850;
    line-height: 1.02;

    letter-spacing: -1px;
}

.sc-chiese-lead {
    max-width: 700px;

    margin: 21px 0 0;

    color: rgba(255,255,255,.89);

    font-size: 16px;
    line-height: 1.72;
}


/* ==========================================================
   AZIONI HERO
========================================================== */

.sc-chiese-actions {
    display: flex;
    flex-wrap: wrap;

    gap: 12px;

    margin-top: 28px;
}

.sc-chiese-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 47px;

    padding: 0 21px;

    border-radius: 999px;

    background: #ffffff;
    color: var(--verde-principale,#264733) !important;

    font-size: 12px;
    font-weight: 850;
    line-height: 1.2;

    text-align: center;
    text-decoration: none !important;

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

    transition:
        transform .2s ease,
        background .2s ease;
}

.sc-chiese-actions a + a {
    border: 1px solid rgba(255,255,255,.40);

    background: rgba(255,255,255,.09);
    color: #ffffff !important;

    box-shadow: none;
}

.sc-chiese-actions a:hover {
    transform: translateY(-2px);
}

.sc-chiese-actions a:first-child:hover {
    background: #f7f4ea;
}

.sc-chiese-actions a + a:hover {
    background: rgba(255,255,255,.17);
}


/* ==========================================================
   DATI CHIAVE
========================================================== */

.sc-chiese-facts {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 42px auto 0;
}

.sc-chiese-fact {
    min-width: 0;

    padding: 24px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 21px;

    background: #ffffff;

    box-shadow:
        0 7px 22px rgba(27,52,37,.045);
}

.sc-chiese-fact > span {
    display: block;

    margin-bottom: 7px;

    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .6px;
}

.sc-chiese-fact > strong {
    display: block;

    color: var(--verde-principale,#264733);

    font-size: 24px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-chiese-fact > p {
    margin: 10px 0 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.6;
}


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

.sc-chiese-note {
    display: flex;
    align-items: flex-start;

    gap: 13px;

    width: 100%;
    max-width: 700px;

    margin: 28px auto 0;
    padding: 18px 20px;

    border: 1px solid rgba(217,180,107,.52);
    border-radius: 17px;

    background: #fffaf0;
}

.sc-chiese-note-dot {
    flex: 0 0 9px;

    width: 9px;
    height: 9px;

    margin-top: 6px;

    border-radius: 50%;

    background: var(--oro-accento,#d9b46b);
}

.sc-chiese-note strong {
    display: block;

    margin: 0 0 4px;

    color: var(--verde-principale,#264733);

    font-size: 14px;
    font-weight: 850;
}

.sc-chiese-note p {
    margin: 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.58;
}


/* ==========================================================
   SPAZIATURA
========================================================== */

.sc-chiese-page .sc-cotronei-section-head {
    margin-top: 72px;
}


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

.sc-chiese-places-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-chiese-place-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 365px;

    padding: 27px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 24px;

    background: #fbfaf6;

    box-shadow:
        0 7px 22px rgba(27,52,37,.045);
}

.sc-chiese-place-featured {
    border-color: rgba(217,180,107,.68);

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f7f3e8 100%
        );

    box-shadow:
        0 13px 30px rgba(27,52,37,.08);
}

.sc-chiese-place-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 12px;
}

.sc-chiese-place-number {
    color: rgba(38,71,51,.30);

    font-size: 12px;
    font-weight: 850;
}

.sc-chiese-place-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8c6524;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .55px;
}

.sc-chiese-place-card h3 {
    margin: 28px 0 13px;

    color: var(--verde-principale,#264733);

    font-size: 27px;
    font-weight: 850;
    line-height: 1.08;
}

.sc-chiese-place-card > p {
    margin: 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.67;
}

.sc-chiese-place-footer {
    display: flex;
    align-items: flex-start;

    margin-top: auto;
    padding-top: 24px;
}

.sc-chiese-place-footer > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 34px;

    padding: 0 13px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8b682e;

    font-size: 10px;
    font-weight: 800;
}


/* ==========================================================
   SAN NICOLA HIGHLIGHT
========================================================== */

.sc-chiese-highlight {
    display: grid;

    grid-template-columns:
        minmax(0,1.65fr)
        minmax(230px,.65fr);

    gap: 28px;

    width: 100%;
    max-width: 1080px;

    margin: 72px auto 0;
    padding: 35px;

    border-radius: 27px;

    background:
        linear-gradient(
            135deg,
            #30473b 0%,
            #425c4c 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(27,52,37,.10);
}

.sc-chiese-highlight-content {
    align-self: center;
}

.sc-chiese-highlight-content > span {
    display: inline-block;

    margin-bottom: 10px;

    color: #e4c982;

    font-size: 10px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .7px;
}

.sc-chiese-highlight-content h2 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(31px,4vw,45px);
    font-weight: 850;
    line-height: 1.06;

    letter-spacing: -.5px;
}

.sc-chiese-highlight-content p {
    max-width: 670px;

    margin: 15px 0 0;

    color: rgba(255,255,255,.87);

    font-size: 14px;
    line-height: 1.68;
}

.sc-chiese-highlight-mark {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 250px;

    padding: 22px;

    border: 1px solid rgba(255,255,255,.16);
    border-radius: 22px;

    background: rgba(255,255,255,.08);

    text-align: center;
}

.sc-chiese-highlight-mark span {
    color: rgba(255,255,255,.72);

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

    text-transform: uppercase;

    letter-spacing: 1px;
}

.sc-chiese-highlight-mark strong {
    display: block;

    margin-top: 7px;

    color: #ffffff;

    font-size: 35px;
    font-weight: 850;
    line-height: 1.04;
}

.sc-chiese-highlight-mark small {
    display: block;

    margin-top: 13px;

    color: #e4c982;

    font-size: 10px;
    font-weight: 700;
}


/* ==========================================================
   CARMINE
========================================================== */

.sc-chiese-carmine {
    display: grid;

    grid-template-columns:
        minmax(0,1.45fr)
        minmax(230px,.55fr);

    gap: 24px;

    width: 100%;
    max-width: 900px;

    margin: 0 auto;
}

.sc-chiese-carmine-history,
.sc-chiese-carmine-side {
    min-width: 0;

    padding: 27px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 23px;
}

.sc-chiese-carmine-history {
    background: #ffffff;
}

.sc-chiese-carmine-side {
    display: flex;
    flex-direction: column;
    justify-content: center;

    background: #fbfaf6;
}

.sc-chiese-carmine span {
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .65px;
}

.sc-chiese-carmine h3 {
    margin: 9px 0 0;

    color: var(--verde-principale,#264733);

    font-size: 28px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-chiese-carmine-history p,
.sc-chiese-carmine-side p {
    margin: 12px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.66;
}

.sc-chiese-carmine-side strong {
    display: block;

    margin-top: 8px;

    color: var(--verde-principale,#264733);

    font-size: 23px;
    font-weight: 850;
    line-height: 1.12;
}


/* ==========================================================
   SAN FRANCESCO
========================================================== */

.sc-chiese-francesco {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;

    width: 100%;
    max-width: 900px;

    margin: 0 auto;
    padding: 29px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 23px;

    background: #fbfaf6;
}

.sc-chiese-francesco > div {
    max-width: 650px;
}

.sc-chiese-francesco > div > span {
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .65px;
}

.sc-chiese-francesco h3 {
    margin: 8px 0 0;

    color: var(--verde-principale,#264733);

    font-size: 27px;
    font-weight: 850;
    line-height: 1.12;
}

.sc-chiese-francesco p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.65;
}

.sc-chiese-francesco-status {
    flex: 0 0 auto;

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

    min-height: 34px;

    padding: 0 13px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8b682e;

    font-size: 10px;
    font-weight: 800;
}


/* ==========================================================
   STORIA / TRADIZIONI / FONTI / RELATED
========================================================== */

.sc-chiese-history-grid,
.sc-chiese-traditions-grid,
.sc-chiese-sources-grid,
.sc-chiese-related-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-chiese-history-card,
.sc-chiese-tradition-card,
.sc-chiese-source-card,
.sc-chiese-related-card {
    min-width: 0;

    padding: 25px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 22px;

    background: #ffffff;

    color: inherit !important;
    text-decoration: none !important;

    box-shadow:
        0 7px 22px rgba(27,52,37,.045);
}

.sc-chiese-related-card {
    background: #fbfaf6;
}

.sc-chiese-source-card,
.sc-chiese-related-card {
    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.sc-chiese-source-card:hover,
.sc-chiese-related-card:hover {
    transform: translateY(-3px);

    border-color: rgba(38,71,51,.30);

    box-shadow:
        0 16px 34px rgba(27,52,37,.10);
}

.sc-chiese-history-card > span,
.sc-chiese-tradition-card > span,
.sc-chiese-source-card > span,
.sc-chiese-related-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;

    padding: 0 11px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;

    letter-spacing: .6px;
}

.sc-chiese-history-card h3,
.sc-chiese-tradition-card h3,
.sc-chiese-source-card > strong,
.sc-chiese-related-card > strong {
    display: block;

    margin: 21px 0 0;

    color: var(--verde-principale,#264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.15;
}

.sc-chiese-history-card p,
.sc-chiese-tradition-card p,
.sc-chiese-source-card p,
.sc-chiese-related-card p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.63;
}


/* ==========================================================
   FUTURO
========================================================== */

.sc-chiese-future-grid {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-chiese-future-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 230px;

    padding: 25px;

    border: 1px solid rgba(38,71,51,.13);
    border-radius: 22px;

    background: #fbfaf6;
}

.sc-chiese-future-card > span {
    color: rgba(38,71,51,.28);

    font-size: 12px;
    font-weight: 850;
}

.sc-chiese-future-card > strong {
    display: block;

    margin-top: 20px;

    color: var(--verde-principale,#264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.14;
}

.sc-chiese-future-card > p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.62;
}

.sc-chiese-future-card > small {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    align-self: flex-start;

    min-height: 32px;

    margin-top: auto;
    padding: 0 12px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8b682e;

    font-size: 10px;
    font-weight: 800;
}


/* ==========================================================
   CTA
========================================================== */

.sc-chiese-page .sc-cotronei-story {
    margin-top: 72px;
}


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

@media (max-width:900px) {

    .sc-chiese-hero {
        padding: 46px 38px;
    }

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

    .sc-chiese-fact:last-child {
        grid-column: 1 / -1;
    }

    .sc-chiese-places-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));

        gap: 18px;
    }

    .sc-chiese-place-featured {
        grid-column: 1 / -1;

        min-height: 280px;
    }

    .sc-chiese-highlight {
        grid-template-columns: 1fr;
    }

    .sc-chiese-highlight-mark {
        min-height: 170px;
    }

    .sc-chiese-history-grid,
    .sc-chiese-traditions-grid,
    .sc-chiese-sources-grid,
    .sc-chiese-related-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .sc-chiese-history-card:last-child,
    .sc-chiese-tradition-card:last-child,
    .sc-chiese-source-card:last-child,
    .sc-chiese-related-card:last-child {
        grid-column: 1 / -1;
    }

}


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

@media (max-width:680px) {

    .sc-chiese-hero {
        padding: 34px 22px;

        border-radius: 24px;
    }

    .sc-chiese-hero h1 {
        font-size: clamp(37px,11vw,48px);
    }

    .sc-chiese-lead {
        font-size: 14px;
    }

    .sc-chiese-actions {
        flex-direction: column;
    }

    .sc-chiese-actions a {
        width: 100%;
    }


    .sc-chiese-facts {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 30px;
    }

    .sc-chiese-fact:last-child {
        grid-column: auto;
    }


    .sc-chiese-page .sc-cotronei-section-head {
        margin-top: 56px;
    }


    .sc-chiese-places-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-chiese-place-card,
    .sc-chiese-place-featured {
        grid-column: auto;

        min-height: 0;

        padding: 23px;
    }


    .sc-chiese-highlight {
        grid-template-columns: 1fr;

        gap: 22px;

        margin-top: 56px;
        padding: 25px 22px;

        border-radius: 24px;
    }


    .sc-chiese-carmine {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-chiese-carmine-history,
    .sc-chiese-carmine-side {
        padding: 23px;
    }


    .sc-chiese-francesco {
        flex-direction: column;
        align-items: stretch;

        padding: 23px;
    }

    .sc-chiese-francesco-status {
        width: 100%;
    }


    .sc-chiese-history-grid,
    .sc-chiese-traditions-grid,
    .sc-chiese-sources-grid,
    .sc-chiese-related-grid,
    .sc-chiese-future-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-chiese-history-card:last-child,
    .sc-chiese-tradition-card:last-child,
    .sc-chiese-source-card:last-child,
    .sc-chiese-related-card:last-child {
        grid-column: auto;
    }


    .sc-chiese-future-card {
        min-height: 0;

        padding: 23px;
    }


    .sc-chiese-page .sc-cotronei-story {
        margin-top: 56px;
    }

}


/* ==========================================================
   ACCESSIBILITÀ
========================================================== */

.sc-chiese-page a:focus-visible {
    outline: 3px solid rgba(217,180,107,.62);
    outline-offset: 3px;
}


@media (prefers-reduced-motion:reduce) {

    .sc-chiese-page *,
    .sc-chiese-page *::before,
    .sc-chiese-page *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }

}

/* ==========================================================
   PALAZZO VERGA
   Classi specifiche .sc-verga-*
========================================================== */

.sc-verga-page,
.sc-verga-page *,
.sc-verga-page *::before,
.sc-verga-page *::after {
    box-sizing: border-box;
}


/* ==========================================================
   HERO
========================================================== */

.sc-verga-hero {
    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
    padding: 58px 56px;

    border-radius: 28px;

    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(255,255,255,.10) 0,
            rgba(255,255,255,0) 30%
        ),
        linear-gradient(
            135deg,
            #3b4438 0%,
            #505945 58%,
            #6b7054 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(27,52,37,.10);
}

.sc-verga-hero-content {
    max-width: 780px;
}

.sc-verga-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 31px;
    padding: 0 13px;

    border-radius: 999px;

    background: rgba(255,255,255,.14);
    color: #ffffff;

    font-size: 10px;
    font-weight: 850;
    line-height: 1;

    text-transform: uppercase;
    letter-spacing: .65px;
}

.sc-verga-hero h1 {
    margin: 18px 0 0;

    color: #ffffff;

    font-size: clamp(42px,5.8vw,66px);
    font-weight: 850;
    line-height: 1.02;

    letter-spacing: -1px;
}

.sc-verga-lead {
    max-width: 700px;

    margin: 21px 0 0;

    color: rgba(255,255,255,.89);

    font-size: 16px;
    line-height: 1.72;
}


/* ==========================================================
   HERO ACTIONS
========================================================== */

.sc-verga-actions {
    display: flex;
    flex-wrap: wrap;

    gap: 12px;

    margin-top: 28px;
}

.sc-verga-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 47px;
    padding: 0 21px;

    border-radius: 999px;

    background: #ffffff;
    color: var(--verde-principale,#264733) !important;

    font-size: 12px;
    font-weight: 850;

    text-decoration: none !important;

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

    transition:
        transform .2s ease,
        background .2s ease;
}

.sc-verga-actions a + a {
    border: 1px solid rgba(255,255,255,.40);

    background: rgba(255,255,255,.09);
    color: #ffffff !important;

    box-shadow: none;
}

.sc-verga-actions a:hover {
    transform: translateY(-2px);
}

.sc-verga-actions a:first-child:hover {
    background: #f7f4ea;
}

.sc-verga-actions a + a:hover {
    background: rgba(255,255,255,.17);
}


/* ==========================================================
   FACTS
========================================================== */

.sc-verga-facts {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 42px auto 0;
}

.sc-verga-fact {
    min-width: 0;

    padding: 24px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 21px;

    background: #ffffff;

    box-shadow:
        0 7px 22px rgba(27,52,37,.045);
}

.sc-verga-fact > span {
    display: block;

    margin-bottom: 7px;

    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;
    letter-spacing: .6px;
}

.sc-verga-fact > strong {
    display: block;

    color: var(--verde-principale,#264733);

    font-size: 24px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-verga-fact > p {
    margin: 10px 0 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.6;
}


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

.sc-verga-note {
    display: flex;
    align-items: flex-start;

    gap: 13px;

    width: 100%;
    max-width: 700px;

    margin: 28px auto 0;
    padding: 18px 20px;

    border: 1px solid rgba(217,180,107,.52);
    border-radius: 17px;

    background: #fffaf0;
}

.sc-verga-note-dot {
    flex: 0 0 9px;

    width: 9px;
    height: 9px;

    margin-top: 6px;

    border-radius: 50%;

    background: var(--oro-accento,#d9b46b);
}

.sc-verga-note strong {
    display: block;

    margin: 0 0 4px;

    color: var(--verde-principale,#264733);

    font-size: 14px;
    font-weight: 850;
}

.sc-verga-note p {
    margin: 0;

    color: #606660;

    font-size: 13px;
    line-height: 1.58;
}


/* ==========================================================
   SPAZI
========================================================== */

.sc-verga-page .sc-cotronei-section-head {
    margin-top: 72px;
}


/* ==========================================================
   TIMELINE
========================================================== */

.sc-verga-timeline {
    position: relative;

    width: 100%;
    max-width: 900px;

    margin: 0 auto;
}

.sc-verga-timeline::before {
    content: "";

    position: absolute;

    top: 0;
    bottom: 0;
    left: 94px;

    width: 1px;

    background: rgba(38,71,51,.16);
}

.sc-verga-timeline-item {
    position: relative;

    display: grid;

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

    gap: 44px;

    padding-bottom: 28px;
}

.sc-verga-timeline-year {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 39px;

    padding: 0 8px;

    border-radius: 999px;

    background: var(--verde-principale,#264733);
    color: #ffffff;

    font-size: 10px;
    font-weight: 850;

    text-align: center;
}

.sc-verga-timeline-content {
    position: relative;

    padding-bottom: 24px;
}

.sc-verga-timeline-content::before {
    content: "";

    position: absolute;

    top: 12px;
    left: -27px;

    width: 9px;
    height: 9px;

    border: 3px solid #ffffff;
    border-radius: 50%;

    background: var(--oro-accento,#d9b46b);

    box-shadow:
        0 0 0 1px rgba(38,71,51,.18);
}

.sc-verga-timeline-content > span {
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;
    letter-spacing: .6px;
}

.sc-verga-timeline-content h3 {
    margin: 6px 0 0;

    color: var(--verde-principale,#264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.15;
}

.sc-verga-timeline-content p {
    max-width: 690px;

    margin: 10px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.65;
}


/* ==========================================================
   HIGHLIGHT
========================================================== */

.sc-verga-highlight {
    display: grid;

    grid-template-columns:
        minmax(0,1.65fr)
        minmax(230px,.65fr);

    gap: 28px;

    width: 100%;
    max-width: 1080px;

    margin: 72px auto 0;
    padding: 35px;

    border-radius: 27px;

    background:
        linear-gradient(
            135deg,
            #3b4438 0%,
            #586049 100%
        );

    color: #ffffff;

    box-shadow:
        0 12px 30px rgba(27,52,37,.10);
}

.sc-verga-highlight-content {
    align-self: center;
}

.sc-verga-highlight-content > span {
    color: #e4c982;

    font-size: 10px;
    font-weight: 850;

    text-transform: uppercase;
    letter-spacing: .7px;
}

.sc-verga-highlight-content h2 {
    margin: 10px 0 0;

    color: #ffffff;

    font-size: clamp(31px,4vw,45px);
    font-weight: 850;
    line-height: 1.06;
}

.sc-verga-highlight-content p {
    max-width: 670px;

    margin: 15px 0 0;

    color: rgba(255,255,255,.87);

    font-size: 14px;
    line-height: 1.68;
}

.sc-verga-highlight-mark,
.sc-verga-chapel-mark {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 250px;

    padding: 22px;

    border: 1px solid rgba(255,255,255,.16);
    border-radius: 22px;

    background: rgba(255,255,255,.08);

    text-align: center;
}

.sc-verga-highlight-mark span,
.sc-verga-chapel-mark span {
    color: rgba(255,255,255,.72);

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

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

.sc-verga-highlight-mark strong,
.sc-verga-chapel-mark strong {
    display: block;

    margin-top: 8px;

    color: #ffffff;

    font-size: 31px;
    font-weight: 850;
    line-height: 1.04;
}

.sc-verga-highlight-mark small,
.sc-verga-chapel-mark small {
    margin-top: 13px;

    color: #e4c982;

    font-size: 10px;
    font-weight: 700;
}


/* ==========================================================
   FAMILY / LINKS / SOURCES / RELATED
========================================================== */

.sc-verga-family-grid,
.sc-verga-links-grid,
.sc-verga-sources-grid,
.sc-verga-related-grid {
    display: grid;

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

    gap: 20px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-verga-family-card,
.sc-verga-link-card,
.sc-verga-source-card,
.sc-verga-related-card {
    min-width: 0;

    padding: 25px;

    border: 1px solid rgba(38,71,51,.14);
    border-radius: 22px;

    background: #ffffff;

    color: inherit !important;
    text-decoration: none !important;

    box-shadow:
        0 7px 22px rgba(27,52,37,.045);
}

.sc-verga-link-card,
.sc-verga-related-card {
    background: #fbfaf6;
}

.sc-verga-link-card,
.sc-verga-source-card,
.sc-verga-related-card {
    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.sc-verga-link-card:hover,
.sc-verga-source-card:hover,
.sc-verga-related-card:hover {
    transform: translateY(-3px);

    border-color: rgba(38,71,51,.30);

    box-shadow:
        0 16px 34px rgba(27,52,37,.10);
}

.sc-verga-family-card > span,
.sc-verga-link-card > span,
.sc-verga-source-card > span,
.sc-verga-related-card > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 29px;
    padding: 0 11px;

    border-radius: 999px;

    background: #f7f4ea;
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;
    letter-spacing: .6px;
}

.sc-verga-family-card h3,
.sc-verga-link-card > strong,
.sc-verga-source-card > strong,
.sc-verga-related-card > strong {
    display: block;

    margin: 21px 0 0;

    color: var(--verde-principale,#264733);

    font-size: 22px;
    font-weight: 850;
    line-height: 1.15;
}

.sc-verga-family-card p,
.sc-verga-link-card p,
.sc-verga-source-card p,
.sc-verga-related-card p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.63;
}


/* ==========================================================
   ARCHIVIO
========================================================== */

.sc-verga-archive {
    display: grid;

    grid-template-columns:
        minmax(220px,.6fr)
        minmax(0,1.4fr);

    gap: 28px;

    width: 100%;
    max-width: 900px;

    margin: 0 auto;
}

.sc-verga-archive-number {
    display: flex;
    flex-direction: column;
    justify-content: center;

    min-height: 230px;

    padding: 25px;

    border-radius: 22px;

    background: var(--verde-principale,#264733);
    color: #ffffff;

    text-align: center;
}

.sc-verga-archive-number > span {
    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;
    letter-spacing: .7px;

    opacity: .75;
}

.sc-verga-archive-number > strong {
    margin-top: 10px;

    color: #ffffff;

    font-size: 35px;
    font-weight: 850;
}

.sc-verga-archive-number > small {
    margin-top: 8px;

    color: rgba(255,255,255,.75);

    font-size: 10px;
}

.sc-verga-archive-content {
    align-self: center;
}

.sc-verga-archive-content > span {
    color: #956b22;

    font-size: 9px;
    font-weight: 850;

    text-transform: uppercase;
}

.sc-verga-archive-content h3 {
    margin: 8px 0 0;

    color: var(--verde-principale,#264733);

    font-size: 28px;
    font-weight: 850;
    line-height: 1.1;
}

.sc-verga-archive-content p {
    margin: 12px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.66;
}


/* ==========================================================
   CAPPELLA
========================================================== */

.sc-verga-chapel {
    display: grid;

    grid-template-columns:
        minmax(0,1.6fr)
        minmax(230px,.65fr);

    gap: 28px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
    padding: 35px;

    border-radius: 27px;

    background:
        linear-gradient(
            135deg,
            #424a3d 0%,
            #616750 100%
        );

    color: #ffffff;
}

.sc-verga-chapel-content > span {
    color: #e4c982;

    font-size: 10px;
    font-weight: 850;

    text-transform: uppercase;
}

.sc-verga-chapel-content h3 {
    margin: 9px 0 0;

    color: #ffffff;

    font-size: clamp(29px,3.5vw,40px);
    font-weight: 850;
}

.sc-verga-chapel-content p {
    max-width: 690px;

    margin: 14px 0 0;

    color: rgba(255,255,255,.87);

    font-size: 14px;
    line-height: 1.68;
}


/* ==========================================================
   FUTURE
========================================================== */

.sc-verga-future-grid {
    display: grid;

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

    gap: 18px;

    width: 100%;
    max-width: 1080px;

    margin: 0 auto;
}

.sc-verga-future-card {
    display: flex;
    flex-direction: column;

    min-height: 230px;

    padding: 25px;

    border: 1px solid rgba(38,71,51,.13);
    border-radius: 22px;

    background: #fbfaf6;
}

.sc-verga-future-card > span {
    color: rgba(38,71,51,.28);

    font-size: 12px;
    font-weight: 850;
}

.sc-verga-future-card > strong {
    margin-top: 20px;

    color: var(--verde-principale,#264733);

    font-size: 22px;
    font-weight: 850;
}

.sc-verga-future-card > p {
    margin: 11px 0 0;

    color: #606660;

    font-size: 14px;
    line-height: 1.62;
}

.sc-verga-future-card > small {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    align-self: flex-start;

    min-height: 32px;

    margin-top: auto;
    padding: 0 12px;

    border-radius: 999px;

    background: #f3eedf;
    color: #8b682e;

    font-size: 10px;
    font-weight: 800;
}


/* ==========================================================
   CTA
========================================================== */

.sc-verga-page .sc-cotronei-story {
    margin-top: 72px;
}


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

@media (max-width:900px) {

    .sc-verga-hero {
        padding: 46px 38px;
    }

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

    .sc-verga-fact:last-child {
        grid-column: 1 / -1;
    }

    .sc-verga-highlight,
    .sc-verga-chapel {
        grid-template-columns: 1fr;
    }

    .sc-verga-highlight-mark,
    .sc-verga-chapel-mark {
        min-height: 170px;
    }

    .sc-verga-family-grid,
    .sc-verga-links-grid,
    .sc-verga-sources-grid,
    .sc-verga-related-grid {
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .sc-verga-family-card:last-child,
    .sc-verga-link-card:last-child,
    .sc-verga-source-card:last-child,
    .sc-verga-related-card:last-child {
        grid-column: 1 / -1;
    }

}


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

@media (max-width:680px) {

    .sc-verga-hero {
        padding: 34px 22px;

        border-radius: 24px;
    }

    .sc-verga-lead {
        font-size: 14px;
    }

    .sc-verga-actions {
        flex-direction: column;
    }

    .sc-verga-actions a {
        width: 100%;
    }

    .sc-verga-facts {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 30px;
    }

    .sc-verga-fact:last-child {
        grid-column: auto;
    }

    .sc-verga-page .sc-cotronei-section-head {
        margin-top: 56px;
    }

    .sc-verga-timeline::before {
        display: none;
    }

    .sc-verga-timeline-item {
        grid-template-columns: 1fr;

        gap: 12px;
    }

    .sc-verga-timeline-year {
        width: fit-content;
        min-width: 72px;
    }

    .sc-verga-timeline-content::before {
        display: none;
    }

    .sc-verga-highlight {
        margin-top: 56px;
        padding: 25px 22px;
    }

    .sc-verga-archive {
        grid-template-columns: 1fr;
    }

    .sc-verga-archive-number {
        min-height: 160px;
    }

    .sc-verga-chapel {
        padding: 25px 22px;
    }

    .sc-verga-family-grid,
    .sc-verga-links-grid,
    .sc-verga-future-grid,
    .sc-verga-sources-grid,
    .sc-verga-related-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .sc-verga-family-card:last-child,
    .sc-verga-link-card:last-child,
    .sc-verga-source-card:last-child,
    .sc-verga-related-card:last-child {
        grid-column: auto;
    }

    .sc-verga-future-card {
        min-height: 0;

        padding: 23px;
    }

    .sc-verga-page .sc-cotronei-story {
        margin-top: 56px;
    }

}


/* ==========================================================
   ACCESSIBILITÀ
========================================================== */

.sc-verga-page a:focus-visible {
    outline: 3px solid rgba(217,180,107,.62);
    outline-offset: 3px;
}

@media (prefers-reduced-motion:reduce) {

    .sc-verga-page *,
    .sc-verga-page *::before,
    .sc-verga-page *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }

}