/* HERO */
.hero__col { padding-block: var(--space-10); }
p.hero__overtitle { font-size: var(--fs-20); line-height: 1.1; margin: 0 0 var(--space-1); }
h1.hero__title { font-size: var(--fs-65); line-height: 1.1; text-wrap: balance; max-inline-size: 14ch; margin: 0; }

/* GESTIONE */
section.gestione { padding-block: var(--space-10); position: relative;}
p.gestione__text { font-size: var(--fs-30); }
p.gestione__text:not(:last-of-type) { margin: 0 0 var(--space-4); }
p.gestione__text:last-of-type { margin: 0; }
.gestione__triangle { position: absolute; width: 0; height: 0; border-left: 40px solid transparent; border-right: 40px solid transparent; border-top: 40px solid var(--platinum); margin: 0 auto; bottom: -40px; left: 50%; transform: translateX(-50%);}

/* MODULI */
section.moduli { padding-block: var(--space-10); }
.moduli__group:last-of-type { --radius-bottom: clamp(2rem, calc(0.71vw + 1.86rem), 2.5rem); border-radius: 0 0 var(--radius-bottom) var(--radius-bottom); overflow: hidden;}
.moduli__header { padding-block: var(--space-1); }
h2.moduli__title { margin: 0; font-size: var(--fs-45); line-height: 1;}
.accordion__row { position: relative;}
.accordion__row:not(:first-child)::before { position: absolute; content: ""; width: 100%; height: 3px; background: white; top: 0; left: 0; }
button.accordion__btn { border: none; background: transparent; padding-block: var(--space-2); width: 100%; display: flex; align-items: center; justify-content: space-between; cursor: pointer; &:after{ content: "\e145"; font-weight: 900; font-family: 'Material Symbols Outlined'; font-size: clamp(1.5rem, calc(0.84vw + 1.38rem), 2rem); color: var(--cobalt);}}
.accordion__row.is-open > button.accordion__btn::after { content: '\e15b'; }
span.accordion__btn-text { font-size: var(--fs-30); text-align: start; text-wrap: balance;}
.accordion__body { padding-block: 0 var(--space-4);}
.moduli__grid { display: grid; gap: var(--space-4) var(--space-6);}
.moduli__file { display: flex; align-items: start; gap: var(--space-1);}
a.moduli__file-link { display: block; line-height: 0; }
a.moduli__file-link img { max-height: 2.5rem; height: 100%; }
a.moduli__file-name, p.moduli__file-actions a { font-size: var(--fs-15); text-decoration: none;}
p.moduli__file-actions { margin: 0; } 

@media (min-width: 551px) and (max-width: 899.9px){

    /* MODULI */
    .moduli__grid { grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 766.9px) {

    /* HERO */
    picture.hero__picture { display: block; line-height: 0; }
    picture.hero__picture img { width: 100%; height: auto; }

    /* MODULI */
    .moduli__header { padding-inline: var(--space-4); }
    button.accordion__btn { padding-inline: var(--space-4); gap: var(--space-4);}
    .accordion__body { padding-inline: var(--space-4); }
}
@media (min-width: 767px) {

    /* HERO */
    .hero { background-size: cover !important; background-position: right center !important; background-repeat: no-repeat !important; }
    picture.hero__picture { display: none;}

    /* MODULI */
    .moduli__header { padding-inline: var(--space-6); }
    button.accordion__btn { padding-inline: var(--space-6); }
    .accordion__body { padding-inline: var(--space-6); }
}
@media (min-width: 767px) and (max-width: 899.9px){

    /* HERO */
    .hero{ background: url('/media/heroModulistica767.webp'); }
}
@media (min-width: 900px) and (max-width: 1099.9px){

    /* HERO */
    .hero{ background: url('/media/heroModulistica900.webp'); }
}
@media (min-width: 900px) and (max-width: 1400px){

    /* MODULI */
    .moduli__grid { grid-template-columns: repeat(3, 1fr);}
}
@media (min-width: 1100px) and (max-width: 1400px){

    /* HERO */
    .hero{ background: url('/media/heroModulistica1100.webp'); }
}
@media (min-width: 1401px) {

    /* HERO */
    .hero{ background: url('/media/heroModulistica1401.webp'); }

    /* MODULI */
    .moduli__grid { grid-template-columns: repeat(4, 1fr);}
}