/* =========================================
   LIGHTGALLERY LUXURY OVERRIDE (FIX DEFINITIVO)
   ========================================= */

/* --- 1. FIX TITOLI E TESTI (Separazione e Stile) --- */

/* Spostiamo il testo SOPRA le miniature, non sopra di esse */
.lg-sub-html {
    background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, transparent 100%) !important;
    /* Fondamentale: alziamo il testo di 100px per non coprire le thumb */
    bottom: 100px !important; 
    padding: 20px 40px !important;
    position: absolute !important;
    width: 100%;
    pointer-events: none;
    text-align: center;
    z-index: 1080; /* Sotto ai controlli, sopra l'immagine */
}

/* Stile Titolo H4 */
.lg-sub-html h4 {
    font-family: 'Cinzel', serif !important;
    color: #c5a059 !important; /* ORO */
    font-size: 2rem !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0 0 5px 0 !important;
    display: block !important; /* Forza a capo */
    text-shadow: 0 2px 10px #000 !important;
}

/* Stile Sottotitolo P */
.lg-sub-html p {
    font-family: 'Lato', sans-serif !important;
    font-size: 1.1rem !important;
    color: #fff !important;
    font-style: italic;
    margin: 0 !important;
    display: block !important; /* Forza a capo */
    opacity: 0.8;
}

/* --- 2. FIX MINIATURE (THUMBNAILS) --- */

/* Il contenitore delle miniature deve essere Nero Puro e Sopra al gradiente */
.lg-outer .lg-thumb-outer {
    background-color: #000 !important; /* Nero solido, niente trasparenze */
    position: fixed !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100px !important;
    z-index: 2147483647 !important; /* SOPRA A TUTTO */
    padding: 10px 0 !important;
    border-top: 1px solid #c5a059 !important; /* Riga oro */
}

/* Le singole miniature */
.lg-outer .lg-thumb-item {
    border-radius: 4px !important;
    border: 2px solid transparent !important;
    opacity: 0.5 !important;
    filter: grayscale(100%) !important;
    transition: all 0.3s ease !important;
}

/* Miniatura Attiva (Luminosa) */
.lg-outer .lg-thumb-item.active, 
.lg-outer .lg-thumb-item:hover {
    opacity: 1 !important;
    filter: grayscale(0%) !important;
    border-color: #c5a059 !important;
    transform: scale(1.1);
}

/* --- 3. Z-INDEX GLOBALE --- */
.lg-backdrop {
    z-index: 2147483640 !important; /* Sotto la gallery */
    background-color: rgba(5, 10, 12, 0.98) !important;
}

.lg-outer {
    z-index: 2147483641 !important; /* Sopra il backdrop */
}
.visual-page{
max-width:1200px;
margin:auto;
padding:4rem 2rem;
}

.visual-intro{
display:flex;
gap:3rem;
margin-top:3rem;
flex-wrap:wrap;
align-items:flex-start;
}

.visual-image img{
width:100%;
max-width:500px;
}

.visual-text{
flex:1;
}

.portfolio-section{
margin-top:5rem;
}

.section-desc{
text-align:center;
color:#C5A059;
font-size:1.05rem;
line-height:1.6;
letter-spacing:0.03em;
max-width:720px;
margin:auto;
margin-top:12px;
margin-bottom:2rem;
}

.portfolio-grid{
display:grid;
grid-template-columns:repeat(3, 1fr);
gap:40px;
margin-top:48px;
}

.portfolio-grid img:hover{
transform:scale(1.02);
box-shadow:
0 20px 40px rgba(0,0,0,0.6),
0 0 20px rgba(197,160,89,0.25);
}

.portfolio-section{
font-size:3rem;
font-weight:500;
letter-spacing:0.18em;
text-transform:uppercase;
color:#E2DCC9;
text-align:center;
margin-top:3rem;
margin-bottom:12px;
}

.portfolio-section::after{
content:"";
display:block;
width:70px;
height:1px;
background:#C5A059;
margin:18px auto 28px;
opacity:0.8;
}

@media (max-width: 900px){
.portfolio-grid{
grid-template-columns:repeat(2,1fr);
}
}

@media (max-width: 600px){
.portfolio-grid{
grid-template-columns:1fr;
}
}
.portfolio-grid img{
object-fit:cover;
border-radius:6px;
transition:transform .5s ease, box-shadow .5s ease;
}

.portfolio-grid img:hover{
transform:scale(1.02);
box-shadow:
0 0 0px rgba(0,0,0,0.3),
0 10px 30px rgba(0,0,0,0.5),
0 0 25px rgba(241, 193, 102, 0.95);
}

.cta-text{
font-size:1.4rem;
font-weight:300;
letter-spacing:0.04em;
color:#E2DCC9;
text-align:center;
margin-bottom:2rem;
line-height:1.7;
}

.portfolio-grid img{
transition:transform .6s ease;
}

.portfolio-grid img:hover{
transform:scale(1.05);
}