/**
 * FONDAZIONE ARMANDO - ARMANDO PAGE SPECIFIC STYLES
 * 
 * Stili specifici per la pagina Armando
 */

/*
 * La navbar (.site-header) è position:fixed e z-index 1000.
 * Il body ha padding-top 60px in main.css: con logo + menu più alti la hero
 * (about-hero / armando-hero) resta visivamente sotto il menu.
 * Qui aumentiamo il rientro solo per i template Armando / Armando bis.
 */
body.page-template-page-armando-php,
body.page-template-page-armando-bis-php {
    padding-top: 96px;
}

body.admin-bar.page-template-page-armando-php,
body.admin-bar.page-template-page-armando-bis-php {
    padding-top: 128px;
}

@media (max-width: 768px) {
    body.page-template-page-armando-php,
    body.page-template-page-armando-bis-php {
        padding-top: 72px;
    }

    body.admin-bar.page-template-page-armando-php,
    body.admin-bar.page-template-page-armando-bis-php {
        padding-top: 104px;
    }
}

.armando-page-main {
    padding-top: 0;
}

/*
 * Hero globale (about-hero + hero-slideshow): su main.css .about-hero ha height fissa (400px / 300px mobile),
 * che impedisce al min-height inline (Opzioni + campo pagina) di definire il riquadro e al background di seguirlo.
 * Qui alziamo la specificità solo per i template Armando.
 */
body.page-template-page-armando-php .about-hero.hero-slideshow,
body.page-template-page-armando-bis-php .about-hero.hero-slideshow {
    height: auto !important;
    max-height: none !important;
    min-height: 60vh;
}

@media (max-width: 768px) {
    body.page-template-page-armando-php .about-hero.hero-slideshow,
    body.page-template-page-armando-bis-php .about-hero.hero-slideshow {
        height: auto !important;
        max-height: none !important;
        min-height: 50vh !important;
    }
}

/* Hero da immagine in evidenza: overlay ancorato ai bordi così copre tutto il box definito da min-height */
.armando-page-main .armando-hero.hero-featured-only .hero-overlay {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: auto;
    height: auto;
}

.armando-hero {
    position: relative;
    width: 100%;
    min-height: 60vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    margin-top: 0;
}

/* Gradiente come i pulsanti quando non c'è immagine */
.armando-hero:not([style*="background-image"]) {
    background: linear-gradient(to right, #26BF94, #0078e8);
    background-color: #0078e8;
}

/* La hero resta sotto la navbar in stacking (z-index menu 1000); il posizionamento verticale è sul padding body sopra. */
.armando-hero.hero-featured-only {
    position: relative;
    z-index: 1;
    margin-top: 0;
}

/* Assicura che l'immagine di background sia visibile */
.armando-hero.hero-featured-only {
    background-attachment: scroll;
}

/* Hero overlay */
.armando-hero .hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.1);
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.armando-hero .hero-content {
    position: relative;
    z-index: 10;
    text-align: center;
    color: #fff;
}

.armando-hero .hero-title {
    color: #fff;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    margin: 0;
}

/* Default background: gradiente come i pulsanti (verde → blu) */
.armando-hero.default-background {
    background: linear-gradient(to right, #26BF94, #0078e8);
    background-color: #0078e8;
}

/* Responsive */
@media (max-width: 768px) {
    .armando-hero {
        min-height: 50vh;
    }
}
