/* ==========================================================================
   STYLE.CSS - STUDIO IMMOBILIARE DIANA (Versione Definitiva v4.1)
   ========================================================================== */

/* --- 1. VARIABILI E COLORI GLOBALI --- */
:root {
    --brand-color: #266058;
    --brand-dark: #1e4d46;
    --brand-accent: #d4af37; 
    --header-height: 85px;
    --bg-warm: #f4f1ea; 
    --nav-shape-bg: #f9f5f0;
    --copper-gradient-start: rgba(255, 255, 255, 0.95);
    --copper-gradient-end: rgba(255, 235, 225, 0.92); 
    --copper-border: rgba(184, 115, 51, 0.25); 
    --copper-shadow: rgba(160, 82, 45, 0.08); 
}

/* --- 2. RESET E BASE --- */
html { scroll-behavior: smooth; }
body {
    font-family: 'Open Sans', sans-serif;
    background-color: var(--bg-warm);
    color: #333;
    line-height: 1.6;
    padding-top: var(--header-height);
    overflow-x: hidden;
}
h1, h2, h3, h4, h5, h6, .btn-custom { font-family: 'Montserrat', sans-serif; }
a { text-decoration: none; transition: color 0.2s; }

/* --- 3. SFONDO AMBIENTALE --- */
.ambient-bg { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: -1; pointer-events: none; }
.orb { position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.5; animation: moveOrb 20s infinite alternate ease-in-out; }
.orb-1 { width: 400px; height: 400px; background: #e6c9a8; top: -100px; left: -100px; }
.orb-2 { width: 300px; height: 300px; background: #f8d7da; bottom: -50px; right: -50px; }
@keyframes moveOrb { 0% { transform: translate(0, 0) scale(1); } 100% { transform: translate(50px, 50px) scale(1.1); } }

/* --- 4. NAVBAR --- */
.navbar {
    background: linear-gradient(105deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.98) 60%, var(--nav-shape-bg) 60%, var(--nav-shape-bg) 100%);
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    z-index: 9999999 !important;
}

.navbar-brand img { height: 65px; width: auto; transition: transform 0.3s; }

.navbar-nav .nav-link {
    color: #333 !important; font-weight: 600; text-transform: uppercase;
    letter-spacing: 0.5px; padding: 10px 15px !important;
}
.navbar-nav .nav-link:hover, .navbar-nav .nav-link.active { color: var(--brand-color) !important; }

.btn-custom-header {
    background: var(--brand-color); color: white !important; padding: 10px 24px;
    border-radius: 4px; font-weight: 600; text-transform: uppercase;
    clip-path: polygon(10% 0, 100% 0, 100% 100%, 0% 100%, 0% 25%);
}

/* --- MENU MOBILE --- */
@media (max-width: 991px) {
    .navbar-collapse {
        background: white;
        padding: 1rem;
        border-top: 1px solid #eee;
        box-shadow: 0 10px 40px rgba(0,0,0,0.1);
        margin-top: 10px;
        border-radius: 0 0 15px 15px;
    }
    .collapsing { transition: height 0.35s ease-in-out; }
}

/* --- 5. CARDS & HERO --- */
.hero-section {
    position: relative; height: 75vh; min-height: 500px;
    overflow: hidden; display: flex; align-items: flex-end;
    margin-top: -30px; border-radius: 0 0 30px 30px;
}
.hero-bg { position: absolute; top:0; left:0; width:100%; height:100%; object-fit: cover; z-index: -2; }
.hero-overlay { position: absolute; top:0; left:0; width:100%; height:100%; background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.85) 100%); z-index: -1; }

.glass-card { 
    background: linear-gradient(145deg, var(--copper-gradient-start) 0%, var(--copper-gradient-end) 100%);
    backdrop-filter: blur(16px); border-radius: 24px; border: 1px solid var(--copper-border);
    box-shadow: 0 15px 35px -5px var(--copper-shadow); padding: 30px; margin-bottom: 30px;
}

/* --- 6. FOOTER --- */
footer.footer-full {
    background-color: #1a1a1a; color: #f8f9fa; padding: 60px 0 20px;
    margin-top: 50px; border-top: 4px solid var(--brand-color);
}

/* Impedisce al titolo di finire sotto il menu quando viene ingrandito */
body.acc-zoom-1 .hero-section { 
    margin-top: 20px !important; 
}
body.acc-zoom-2 .hero-section { 
    margin-top: 60px !important; 
}

/* Opzionale: assicura che il contenuto della hero non sia tagliato */
body.acc-zoom-1 .hero-content, 
body.acc-zoom-2 .hero-content {
    padding-bottom: 120px;
}