/* Reset e colori */
*{box-sizing:border-box;margin:0;padding:0}
:root{
    --navy:#001f3f;
    --gold:#d1bb76;
    --beige:#f2ede3;
    --muted:#6d6d6d;
    --white: #ffffff;
}
html,body{height:100%}
body{
    font-family:'Lato',sans-serif;
    color:var(--navy);
    background:var(--beige);
}
h1,h2,h3,h4,h5,h6 { font-family:'Playfair Display', serif; }
.btn-primary:hover { opacity:0.9; transition:0.3s; }
.btn-outline:hover { background:rgba(255,255,255,0.2); }

/* container */
.container{width:90%;max-width:1200px;margin:0 auto}

/* ----------------------- HEADER ----------------------- */
.site-header {
    background: transparent !important;
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    box-shadow: none !important;
    z-index: 999;
}

.header-inner{
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:90%;
    max-width:1200px;
    margin-top: 18px;
    pointer-events:auto;
}

.logo-small{height:48px;width:auto;display:block}

/* MAIN NAVIGATION */
.main-nav{
    display:flex;
    gap:18px;
    align-items:center;
}
.main-nav a{
    color:var(--navy);
    text-decoration:none !important;
    font-weight:700;
    padding:6px 10px;
    border-radius:6px;
    transition:0.25s ease;
}
.main-nav a:hover{color:var(--gold)}
.main-nav a.active {color: var(--gold);}
.main-nav.open{display:flex}

/* HAMBURGER MENU */
.nav-toggle{
    display:none;
    background:transparent;
    border:0;
    font-size:1.9rem;
    color:var(--white);
    cursor:pointer;
    z-index:1100;
}

/* HERO FULL */
.hero{
    margin-top: 0 !important;
    padding-top: 0 !important;
    height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    background-image:url('../images/hero-bg.jpg');
    background-size:cover;
    background-position:center;
    position:relative;
    overflow:hidden;
}
.hero::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,rgba(0,0,0,0.45),rgba(0,0,0,0.5));
    z-index:1;
}
.hero-text{
    position:relative;
    z-index:2;
    padding:0 20px;
    max-width:1100px;
}
.hero-text h2{
    font-family:'Playfair Display',serif;
    color:var(--gold);
    font-size:2rem;
    line-height:1;
    margin-bottom:0px;
    letter-spacing:1px;
    text-transform:uppercase;
    text-shadow:3px 4px 12px rgba(0,0,0,1);
}
.hero-text h1{
    font-family:'Playfair Display',serif;
    color:var(--gold);
    font-size:4.5rem;
    line-height:1;
    margin-bottom:1px;
    text-transform:uppercase;
    text-shadow:3px 4px 12px rgba(0,0,0,0.7);
}
.hero-text h3{
    color:#f2ede3;
    font-family: 'Cormorant Garamond', serif;
    font-size:1.05rem;
    opacity:1.5;
    margin-bottom:14px;
    text-shadow: 2px 2px 8px rgba(0,0,0,0.7);
}
.hero-text h4 {
    font-family: 'Cormorant Garamond', serif;
    color: #0a1e3f;
    font-weight: 700;
    font-size: 1.4rem;
}
.hero-subtext{
    margin-top: 10rem;
    font-family: 'Cormorant Garamond', serif;
    color: #f8f3e6;
    font-size: 1.2rem;
    font-weight: 600;
    text-shadow: 2px 2px 8px rgba(0,0,0,0.45);
}
.hero-sub{
    color:rgba(255,255,255,0.95);
    font-family: 'Cormorant Garamond', serif;
    font-size:1.05rem;
    margin-bottom:18px;
}
.team-subtitle{
    color: var(--gold) !important;
    text-align: center;
    font-family: 'Playfair Display', serif;
    margin-top: 8px;
    font-size: 1.2rem;
}

/* HERO CTAs */
.hero-ctas{display:flex;gap:12px;justify-content:center}
.btn{display:inline-block;padding:10px 16px;border-radius:8px;text-decoration:none;font-weight:700}
.btn-primary{background:var(--gold);color:var(--navy)}
.btn-outline{background:transparent;border:1px solid rgba(255,255,255,0.22);color:#fff}

/* ----------------------- FEATURES ----------------------- */
.features{display:grid;grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));gap:18px;margin:40px auto;justify-content: center;max-width: 1200px;}
.feature-card{background:linear-gradient(180deg,#fff,#fbf8f3);padding:18px;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,0.05);text-align:center}
.feature-card h4{font-family: 'Cormorant Garamond', serif;color:var(--navy);margin-bottom:8px}
.feature-card p{color:var(--muted)}

/* ----------------------- HERO SMALL ----------------------- */
.hero-small{height:35vh;background-image:url('../images/hero-bg.jpg');background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;position:relative}
.hero-small::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0.42),rgba(0,0,0,0.42));z-index:1}
.hero-small .hero-text.small{position:relative;z-index:2}
.hero-small h1{font-family:'Playfair Display',serif;color:var(--gold);font-size:3rem;text-transform:uppercase;letter-spacing:1px}

/* ----------------------- SERVICES / STAFF ----------------------- */
.services, .staff{padding:28px 0}
.service-card{background:#fff;padding:18px;border-radius:10px;margin-bottom:16px;box-shadow:0 8px 24px rgba(0,0,0,0.04)}
.service-card h3{font-family:'Playfair Display',serif;color:var(--navy);margin-bottom:6px}
.member { text-align: center; margin-bottom: 32px; }
.member-banner { background: var(--gold); padding: 10px 0; border-radius: 6px; color: var(--navy); margin-bottom: 6px; }
.member-banner h3 { font-family: 'Playfair Display', serif; margin: 0; }
.member-role { font-family: 'Lato', sans-serif; font-size: 1rem; color: var(--muted); }

/* ----------------------- SEZIONE SERVIZI MODERNA ----------------------- */
.services { padding: 50px 0; background: #fefefe; }
.section-title { text-align: center; font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: 2rem; color: #001f3f; margin-bottom: 2rem; }
.services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 2rem; }
.service-card { background: #ffffff; padding: 24px; border-radius: 16px; box-shadow: 0 10px 25px rgba(0,0,0,0.08); text-align: center; transition: transform 0.3s, box-shadow 0.3s; }
.service-card:hover { transform: translateY(-6px); box-shadow: 0 14px 35px rgba(0,0,0,0.12); }
.service-icon { font-size: 2.5rem; color: #d1bb76; margin-bottom: 16px; }
.service-card h4 { font-family: 'Montserrat', sans-serif; font-weight: 600; color: #001f3f; margin-bottom: 12px; font-size: 1.2rem; }
.service-card p { font-family: 'Lato', sans-serif; color: #6d6d6d; font-size: 0.95rem; line-height: 1.5; }

/* ----------------------- CONTACT ----------------------- */
.contact-title { text-align: center; margin-top: 30px; margin-bottom: 20px; }
.contact-title h4 { font-family: 'Playfair Display', serif; font-size: 1.8rem; color: var(--navy); }
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start;padding:28px 0;}
.contact-card{background:#fff;padding:1.5rem;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,0.04);}
.map-container iframe{width:100%;height:360px;border:0;border-radius:10px;}
.contact-card.info a, .contact-card.info p { font-weight:600; font-size:1.05rem; color:var(--navy); }

/* ----------------------- ABOUT ----------------------- */
.about-intro { padding: 40px 0 10px; text-align: center; }
.about-intro .about-tagline { font-family: "tunga", serif; font-size: 28px; font-weight: 600; color: #444; letter-spacing: 0.5px; }

/* ----------------------- CTA NUMERO ----------------------- */
.hero-cta-number{background:linear-gradient(90deg,var(--navy),rgba(0,31,63,0.85));color:#fff;padding:18px 0;margin:28px 0;text-align:center;}
.hero-cta-number a{color:var(--gold);font-weight:700;text-decoration:none;}

/* ----------------------- FOOTER ----------------------- */
.site-footer{background:var(--beige);padding:36px 20px;margin-top:40px}
.footer-container{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;width:100%}
.footer-left,.footer-center,.footer-right{flex:1;min-width:200px}
.footer-left a,.footer-right a{color:var(--navy);text-decoration:none;font-weight:600}
.footer-center img{max-width:120px;display:block;margin:0 auto}

/* small tweaks */
a{color:inherit}
p{margin:8px 0;color:var(--muted)}

/* ----------------------- RESPONSIVE ----------------------- */
@media (max-width:1024px){
    .features{grid-template-columns:repeat(2,1fr)}
    .contact-grid{grid-template-columns:1fr}
}

/* ----------------------- MOBILE FIX ----------------------- */
@media (max-width:768px){
    .header-inner { width: 90%; }
    .logo-small { height: 40px; }

    /* HERO text più leggibile */
    .hero-text h1 { font-size: 2.2rem; }
    .hero-text h2 { font-size: 1.3rem; }
    .hero-text h3 { font-size: 1rem; }

    /* Layout servizi */
    .services-grid { grid-template-columns: 1fr !important; }
    .service-card { padding: 20px !important; }

    .about-intro .about-tagline { font-size: 22px; }

    /* ----------------------- MOBILE NAV ----------------------- */
    .nav-toggle { display:block; color: var(--white); }
    .main-nav {
        position: fixed;
        top: 0;
        right: -100%;
        width: 70%;
        height: 100vh;
        background: rgba(255,255,255,0.03) !important;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 28px;
        padding-top: 120px;
        transition: 0.35s ease;
        z-index: 1050;
    }
    .main-nav.open { right: 0; }
    .main-nav a { font-size:22px; font-weight:600; color:#fff; text-shadow:0 3px 10px rgba(0,0,0,0.7); }
}
