/* ==========================================================================
   LONGO Design - restyling 2026
   Caricato per ULTIMO in header.php (dopo style.css, responsive.css e skin).
   Palette e font invariati: Montserrat, beige #a69685, marrone #5d544b, nero.
   Tutte le classi nuove hanno il prefisso lg-.
   ========================================================================== */

:root {
    --lg-ink: #16130f;          /* nero caldo per testi e sfondi scuri */
    --lg-black: #0b0b0b;        /* topbar, come oggi */
    --lg-brown: #5d544b;        /* marrone aziendale */
    --lg-beige: #a69685;        /* beige aziendale */
    --lg-beige-dark: #857665;   /* beige piu' scuro: testo piccolo su bianco (contrasto AA) */
    --lg-sand: #e9e3da;
    --lg-cream: #f5f3ef;
    --lg-paper: #fbfaf8;
    --lg-line: rgba(93, 84, 75, .16);
    --lg-text: #4b443d;
    --lg-radius: 4px;
    --lg-shadow: 0 18px 50px -18px rgba(22, 19, 15, .28);
    --lg-ease: cubic-bezier(.22, .61, .36, 1);
    --lg-header-h: 84px;
}

/* --- Base -------------------------------------------------------------- */
html { scroll-behavior: smooth; scroll-padding-top: 110px; }
body.lg-body {
    font-family: 'Montserrat', sans-serif;
    font-size: 15px; line-height: 1.75; color: var(--lg-text);
    background: #fff; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
.lg-body h1, .lg-body h2, .lg-body h3, .lg-body h4, .lg-body h5 {
    font-family: 'Montserrat', sans-serif; color: var(--lg-ink); line-height: 1.18; letter-spacing: -.01em;
}
:where(.lg-body) img { max-width: 100%; height: auto; }
.lg-body a { color: var(--lg-brown); }
.lg-body a:hover, .lg-body a:focus { color: var(--lg-beige-dark); }
.lg-body ::selection { background: var(--lg-brown); color: #fff; }
.lg-skip { position: absolute; left: -9999px; top: 0; z-index: 3000; background: #fff; color: var(--lg-ink); padding: 12px 18px; }
.lg-skip:focus { left: 12px; top: 12px; }
:focus-visible { outline: 2px solid var(--lg-beige); outline-offset: 3px; }
@media (min-width: 1400px) { .lg-body .container { max-width: 1280px; } }
.lg-section { padding: clamp(64px, 9vw, 120px) 0; position: relative; }
.lg-section-tight { padding: clamp(48px, 6vw, 80px) 0; }
.lg-bg-cream { background: var(--lg-cream); }
.lg-bg-paper { background: var(--lg-paper); }
.lg-bg-dark { background: var(--lg-ink); color: rgba(255,255,255,.78); }
.lg-bg-dark h2, .lg-bg-dark h3, .lg-bg-dark h4 { color: #fff; }

/* Etichetta sopra i titoli */
.lg-eyebrow {
    display: inline-flex; align-items: center; gap: 12px;
    font-size: 12px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--lg-beige-dark);
    margin-bottom: 18px;
}
.lg-eyebrow::before { content: ""; width: 34px; height: 1px; background: currentColor; opacity: .7; }
.lg-eyebrow-light { color: var(--lg-beige); }
.lg-title { font-size: clamp(1.9rem, 3.6vw, 3rem); font-weight: 300; margin: 0 0 20px; }
.lg-title strong { font-weight: 700; }
.lg-lead { font-size: clamp(1rem, 1.4vw, 1.15rem); font-weight: 300; color: var(--lg-text); max-width: 62ch; }
.lg-head { max-width: 760px; margin: 0 0 clamp(36px, 5vw, 64px); }
.lg-head-center { margin-left: auto; margin-right: auto; text-align: center; }
.lg-head-center .lg-eyebrow { justify-content: center; }
.lg-head-center .lg-lead { margin-left: auto; margin-right: auto; }

/* Bottoni */
.lg-btn, .lg-body .lg-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    padding: 16px 34px; border: 1px solid var(--lg-brown); border-radius: 2px;
    background: var(--lg-brown); color: #fff !important;
    font: 600 12.5px/1 'Montserrat', sans-serif; letter-spacing: .16em; text-transform: uppercase; text-decoration: none !important;
    cursor: pointer; transition: background .35s var(--lg-ease), color .35s var(--lg-ease), border-color .35s var(--lg-ease), transform .35s var(--lg-ease), box-shadow .35s var(--lg-ease);
}
.lg-btn:hover, .lg-body .lg-btn:hover { background: var(--lg-ink); border-color: var(--lg-ink); color: #fff !important; transform: translateY(-2px); box-shadow: 0 12px 28px -12px rgba(22,19,15,.5); }
.lg-btn-gold, .lg-body .lg-btn-gold { background: var(--lg-beige); border-color: var(--lg-beige); color: var(--lg-ink) !important; }
.lg-btn-gold:hover, .lg-body .lg-btn-gold:hover { background: #fff; border-color: #fff; color: var(--lg-ink) !important; }
.lg-btn-light, .lg-body .lg-btn-light { background: #fff; border-color: #fff; color: var(--lg-ink) !important; }
.lg-btn-light:hover, .lg-body .lg-btn-light:hover { background: var(--lg-beige); border-color: var(--lg-beige); color: var(--lg-ink) !important; }
.lg-btn-ghost, .lg-body .lg-btn-ghost { background: transparent; border-color: rgba(255,255,255,.55); color: #fff !important; }
.lg-btn-ghost:hover, .lg-body .lg-btn-ghost:hover { background: #fff; border-color: #fff; color: var(--lg-ink) !important; }
.lg-btn-outline, .lg-body .lg-btn-outline { background: transparent; border-color: var(--lg-brown); color: var(--lg-brown) !important; }
.lg-btn-outline:hover, .lg-body .lg-btn-outline:hover { background: var(--lg-brown); color: #fff !important; }
.lg-btn-sm, .lg-body .lg-btn-sm { padding: 12px 20px; font-size: 11px; }
.lg-link-arrow { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase; text-decoration: none !important; color: var(--lg-brown); }
.lg-link-arrow::after { content: "\2192"; transition: transform .35s var(--lg-ease); }
.lg-link-arrow:hover::after { transform: translateX(6px); }

/* Comparsa allo scroll (gestita da js/longo-2026.js) */
.lg-js .lg-reveal { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--lg-ease), transform .9s var(--lg-ease); transition-delay: var(--lg-d, 0s); }
.lg-js .lg-reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .lg-js .lg-reveal { opacity: 1; transform: none; transition: none; }
    * { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* --- Header ------------------------------------------------------------ */
#header.lg-header { position: sticky !important; top: -42px !important; z-index: 1500; box-shadow: none; background: #fff; }
.lg-header .topbar { background: var(--lg-black) !important; height: 42px; padding: 0; border: 0; }
.lg-topbar-inner { display: flex; align-items: center; justify-content: space-between; height: 42px; gap: 20px; }
.lg-topbar-left { display: flex; align-items: center; gap: 18px; color: rgba(255,255,255,.72); font-size: 12px; letter-spacing: .02em; min-width: 0; }
.lg-hours-short { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lg-header .topbar-call { padding: 0; margin: 0; float: none; }
.lg-header .topbar-call ul { display: flex; align-items: center; justify-content: flex-end; gap: 26px; margin: 0; padding: 0; list-style: none; }
.lg-header .topbar-call li { display: flex; align-items: center; margin: 0; font-size: 12px; font-weight: 500; color: rgba(255,255,255,.85); }
.lg-header .topbar-call li a { color: rgba(255,255,255,.85) !important; margin: 0; text-decoration: none; transition: color .25s; }
.lg-header .topbar-call li a:hover { color: var(--lg-beige) !important; }
.lg-header .topbar-call i { color: var(--lg-beige) !important; margin-right: 8px; font-size: 13px; }
.lg-status { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; letter-spacing: .04em; }
.lg-dot { width: 8px; height: 8px; border-radius: 50%; background: #9b9388; display: inline-block; flex: none; }
.lg-status.is-open .lg-dot { background: #4cc97c; box-shadow: 0 0 0 0 rgba(76,201,124,.6); animation: lg-pulse 2.2s infinite; }
.lg-status.is-closed .lg-dot { background: #d9885b; }
@keyframes lg-pulse { 70% { box-shadow: 0 0 0 8px rgba(76,201,124,0); } 100% { box-shadow: 0 0 0 0 rgba(76,201,124,0); } }

.lg-header .menu, .lg-header .menu-list-items { background: #fff !important; }
.lg-header .menu { border-bottom: 1px solid var(--lg-line); transition: box-shadow .4s var(--lg-ease); }
.lg-header #menu, .lg-header .menu-list-items { height: auto; }
.lg-header .menu-logo img { height: 52px; width: auto; transition: height .35s var(--lg-ease); }
@media (min-width: 992px) {
    .lg-header .menu-list-items .row { align-items: center; }
    .lg-header .menu-list-items .col-lg-12 { display: flex; align-items: center; justify-content: space-between; min-height: var(--lg-header-h); padding-top: 6px; padding-bottom: 6px; }
    .lg-header .menu-logo { float: none; margin: 0; padding: 0; }
    .lg-header .menu-bar { float: none; margin: 0; }
    .lg-header .menu-links { display: flex; align-items: center; margin: 0; }
    .lg-header .menu-links > li { float: none; }
    .lg-header .menu-links > li > a {
        font-family: 'Montserrat', sans-serif !important; font-size: 12px !important; font-weight: 600 !important;
        letter-spacing: .13em; text-transform: uppercase; color: var(--lg-ink) !important;
        padding: 30px 15px !important; position: relative; background: transparent !important;
    }
    .lg-header .menu-links > li:not(.lg-nav-cta) > a::after {
        content: ""; position: absolute; left: 15px; right: 15px; bottom: 22px; height: 1px; background: var(--lg-beige);
        transform: scaleX(0); transform-origin: left; transition: transform .4s var(--lg-ease);
    }
    .lg-header .menu-links > li:hover > a::after, .lg-header .menu-links > li.active > a::after { transform: scaleX(1); }
    .lg-header .menu-links > li:hover > a { color: var(--lg-beige-dark) !important; }
    .lg-header .lg-nav-cta { margin-left: 14px; }
    .lg-header .lg-nav-cta > a { padding: 0 !important; }
    .lg-header .lg-nav-cta > a::after { display: none !important; }
    .lg-header .menu-links > li.lg-nav-cta > a.lg-btn { padding: 14px 22px !important; color: #fff !important; background: var(--lg-brown) !important; border: 1px solid var(--lg-brown); font-size: 11px !important; letter-spacing: .14em; }
    .lg-header .menu-links > li.lg-nav-cta > a.lg-btn:hover { background: var(--lg-ink) !important; border-color: var(--lg-ink); color: #fff !important; }
    .lg-header .drop-down-multilevel {
        background: #fff; border: 1px solid var(--lg-line); border-top: 2px solid var(--lg-beige); border-radius: 0 0 var(--lg-radius) var(--lg-radius);
        box-shadow: var(--lg-shadow); padding: 10px 0; min-width: 270px; top: 100%;
    }
    .lg-header .drop-down-multilevel > li > a {
        font-family: 'Montserrat', sans-serif !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: .02em;
        text-transform: none; color: var(--lg-text) !important; padding: 11px 24px !important; transition: background .25s, color .25s, padding .25s;
    }
    .lg-header .drop-down-multilevel > li > a:hover { background: var(--lg-cream) !important; color: var(--lg-ink) !important; padding-left: 30px !important; }
}
@media (max-width: 991px) {
    .lg-header .menu-list-items { padding: 6px 0; }
    .lg-header .menu-logo img { height: 42px; }
    .lg-header .menu-links > li > a { font-family: 'Montserrat', sans-serif !important; font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
    .lg-header .lg-nav-cta { padding: 14px 20px; }
    .lg-header .lg-nav-cta .lg-btn { width: 100%; }
    .lg-hours-short, .lg-topbar-wa { display: none !important; }
    .lg-header .topbar-call ul { gap: 16px; }
    .lg-topbar-inner { justify-content: center; }
}
@media (max-width: 575px) {
    .lg-header .topbar-call li:first-child { display: none; }
    .lg-topbar-inner { justify-content: space-between; }
}

/* --- Hero -------------------------------------------------------------- */
.lg-hero { position: relative; background: var(--lg-black); color: #fff; overflow: hidden; height: min(88vh, 860px); min-height: 560px; }
@supports (height: 100svh) { .lg-hero { height: min(88svh, 860px); } }
.lg-slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity 1.4s var(--lg-ease), visibility 0s 1.4s; }
.lg-slide.is-active { opacity: 1; visibility: visible; z-index: 2; transition: opacity 1.4s var(--lg-ease), visibility 0s; }
.lg-slide-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transform: scale(1.09); transition: transform 9s linear; will-change: transform; }
.lg-slide.is-active .lg-slide-img { transform: scale(1); }
.lg-slide::after { content: ""; position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(90deg, rgba(11,9,7,.72) 0%, rgba(11,9,7,.38) 48%, rgba(11,9,7,.08) 100%), linear-gradient(0deg, rgba(11,9,7,.55) 0%, rgba(11,9,7,0) 38%); }
.lg-slide-body { position: absolute; z-index: 3; inset: 0; display: flex; align-items: center; }
.lg-slide-copy { max-width: 720px; padding-bottom: 40px; }
.lg-hero-eyebrow { display: block; font-size: 12.5px; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; color: #fff; margin-bottom: 26px; text-shadow: 0 1px 14px rgba(0,0,0,.45); }
.lg-hero-eyebrow::before { content: ""; display: inline-block; width: 34px; height: 2px; background: var(--lg-beige); vertical-align: middle; margin-right: 14px; }
.lg-hero h1, .lg-hero .lg-h1 { font-size: clamp(2.5rem, 6.4vw, 5.4rem); font-weight: 300; line-height: 1.04; letter-spacing: -.025em; color: #fff !important; margin: 0 0 24px; text-transform: none; }
.lg-hero .lg-h1 strong, .lg-hero h1 strong { font-weight: 700; }
.lg-hero p.lg-sub { font-size: clamp(1rem, 1.5vw, 1.25rem); font-weight: 300; color: rgba(255,255,255,.9); max-width: 48ch; margin: 0 0 38px; letter-spacing: .01em; }
.lg-hero-cta { display: flex; flex-wrap: wrap; gap: 14px; }
.lg-slide-copy > * { opacity: 0; transform: translateY(26px); }
.lg-slide.is-active .lg-slide-copy > * { animation: lg-rise 1s var(--lg-ease) forwards; }
.lg-slide.is-active .lg-slide-copy > *:nth-child(1) { animation-delay: .25s; }
.lg-slide.is-active .lg-slide-copy > *:nth-child(2) { animation-delay: .4s; }
.lg-slide.is-active .lg-slide-copy > *:nth-child(3) { animation-delay: .55s; }
.lg-slide.is-active .lg-slide-copy > *:nth-child(4) { animation-delay: .7s; }
@keyframes lg-rise { to { opacity: 1; transform: none; } }
.lg-hero-nav { position: absolute; z-index: 5; left: 0; right: 0; bottom: 92px; }
.lg-hero-nav .container { display: flex; align-items: center; gap: 28px; }
.lg-hero-count { font-size: 12px; font-weight: 600; letter-spacing: .2em; color: rgba(255,255,255,.85); min-width: 64px; }
.lg-hero-count b { color: #fff; font-size: 15px; }
.lg-hero-bars { display: flex; gap: 8px; flex: 1; max-width: 420px; }
.lg-hero-bar { flex: 1; height: 24px; background: none; border: 0; padding: 10px 0; cursor: pointer; position: relative; }
.lg-hero-bar::before, .lg-hero-bar::after { content: ""; position: absolute; left: 0; right: 0; top: 10px; height: 2px; }
.lg-hero-bar::before { background: rgba(255,255,255,.28); }
.lg-hero-bar::after { background: #fff; transform: scaleX(0); transform-origin: left; }
.lg-hero-bar.is-active::after { animation: lg-bar var(--lg-slide-ms, 6500ms) linear forwards; }
.lg-hero-bar.is-done::after { transform: scaleX(1); }
@keyframes lg-bar { to { transform: scaleX(1); } }
.lg-hero-arrows { margin-left: auto; display: flex; gap: 10px; }
.lg-hero-arrows button { width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255,255,255,.5); background: rgba(255,255,255,.06); color: #fff; cursor: pointer; transition: background .3s, color .3s; backdrop-filter: blur(6px); }
.lg-hero-arrows button:hover { background: #fff; color: var(--lg-ink); }
@media (max-width: 767px) {
    .lg-hero { min-height: 540px; height: min(82vh, 720px); }
    @supports (height: 100svh) { .lg-hero { height: min(82svh, 720px); } }
    .lg-slide::after { background: linear-gradient(0deg, rgba(11,9,7,.78) 0%, rgba(11,9,7,.35) 60%, rgba(11,9,7,.35) 100%); }
    .lg-slide-body { align-items: flex-end; padding-bottom: 96px; }
    .lg-hero-arrows { display: none; }
    .lg-hero-nav { bottom: 78px; }
    .lg-hero-cta .lg-btn { padding: 15px 22px; }
}

/* Barra "perche' noi" sotto l'hero */
.lg-trust { position: relative; z-index: 6; margin-top: -58px; }
.lg-trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); background: #fff; border-radius: var(--lg-radius); box-shadow: var(--lg-shadow); }
.lg-trust-item { display: flex; gap: 16px; align-items: flex-start; padding: 30px 28px; border-right: 1px solid var(--lg-line); }
.lg-trust-item:last-child { border-right: 0; }
.lg-trust-item i { font-size: 26px; color: var(--lg-beige); line-height: 1; margin-top: 3px; width: 28px; text-align: center; }
.lg-trust-item strong { display: block; font-size: 14px; font-weight: 700; color: var(--lg-ink); letter-spacing: .01em; margin-bottom: 4px; }
.lg-trust-item span { display: block; font-size: 13px; line-height: 1.55; color: var(--lg-text); }
@media (max-width: 991px) { .lg-trust-grid { grid-template-columns: 1fr 1fr; } .lg-trust-item:nth-child(2) { border-right: 0; } .lg-trust-item:nth-child(-n+2) { border-bottom: 1px solid var(--lg-line); } }
@media (max-width: 575px) { .lg-trust { margin-top: -34px; } .lg-trust-grid { grid-template-columns: 1fr; } .lg-trust-item { border-right: 0; border-bottom: 1px solid var(--lg-line); padding: 22px 22px; } .lg-trust-item:last-child { border-bottom: 0; } }

/* --- Intro / chi siamo (home) ------------------------------------------ */
.lg-intro-grid { display: grid; grid-template-columns: 1.02fr 1fr; gap: clamp(32px, 6vw, 96px); align-items: center; }
.lg-intro-media { position: relative; }
.lg-intro-media img { width: 100%; display: block; border-radius: var(--lg-radius); aspect-ratio: 4 / 5; object-fit: cover; }
.lg-intro-media .lg-intro-sub { position: absolute; right: -28px; bottom: -34px; width: 46%; border: 8px solid #fff; border-radius: var(--lg-radius); box-shadow: var(--lg-shadow); aspect-ratio: 1; object-fit: cover; }
.lg-intro-badge { position: absolute; left: -18px; top: 34px; background: var(--lg-brown); color: #fff; padding: 20px 24px; border-radius: 2px; box-shadow: var(--lg-shadow); text-align: center; }
.lg-intro-badge b { display: block; font-size: 38px; font-weight: 300; line-height: 1; letter-spacing: -.02em; }
.lg-intro-badge span { font-size: 11px; letter-spacing: .18em; text-transform: uppercase; }
.lg-intro-text p { font-weight: 300; font-size: 16px; }
.lg-intro-text .lg-actions { display: flex; flex-wrap: wrap; gap: 14px 26px; align-items: center; margin-top: 30px; }
@media (max-width: 991px) { .lg-intro-grid { grid-template-columns: 1fr; } .lg-intro-media .lg-intro-sub { right: 8px; bottom: -26px; } .lg-intro-badge { left: 10px; } .lg-intro-media img.lg-intro-main { aspect-ratio: 4 / 3; } }

/* --- Aree (4 categorie principali) -------------------------------------- */
.lg-areas { display: grid; grid-template-columns: repeat(12, 1fr); gap: 20px; }
.lg-area { position: relative; display: block; overflow: hidden; border-radius: var(--lg-radius); color: #fff !important; text-decoration: none !important; isolation: isolate; min-height: 340px; background: var(--lg-ink); }
.lg-area:nth-child(1) { grid-column: span 7; }
.lg-area:nth-child(2) { grid-column: span 5; }
.lg-area:nth-child(3) { grid-column: span 5; }
.lg-area:nth-child(4) { grid-column: span 7; }
.lg-area img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--lg-ease), filter .6s; z-index: -2; }
.lg-area::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(11,9,7,.78) 0%, rgba(11,9,7,.15) 58%, rgba(11,9,7,.1) 100%); transition: opacity .5s; }
.lg-area-body { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 32px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.lg-area-num { font-size: 12px; font-weight: 600; letter-spacing: .22em; color: var(--lg-beige); display: block; margin-bottom: 8px; }
.lg-area h3 { color: #fff !important; font-size: clamp(1.3rem, 2.1vw, 1.9rem); font-weight: 600; margin: 0 0 6px; }
.lg-area p { margin: 0; font-size: 13.5px; font-weight: 300; color: rgba(255,255,255,.85); max-width: 40ch; }
.lg-area-go { flex: none; width: 52px; height: 52px; border-radius: 50%; border: 1px solid rgba(255,255,255,.6); display: grid; place-items: center; font-size: 18px; transition: background .4s, color .4s, transform .5s var(--lg-ease); }
.lg-area:hover img { transform: scale(1.07); }
.lg-area:hover .lg-area-go { background: #fff; color: var(--lg-ink); transform: rotate(-45deg); }
@media (max-width: 991px) { .lg-areas { grid-template-columns: 1fr 1fr; } .lg-area:nth-child(n) { grid-column: span 1; min-height: 300px; } }
@media (max-width: 575px) { .lg-areas { grid-template-columns: 1fr; gap: 14px; } .lg-area-body { padding: 22px; } }

/* --- Servizi (elenco editoriale) ---------------------------------------- */
.lg-services { border-top: 1px solid var(--lg-line); }
.lg-service { display: grid; grid-template-columns: 70px 1fr 1.3fr 48px; gap: 24px; align-items: center; padding: 30px 12px; border-bottom: 1px solid var(--lg-line); text-decoration: none !important; color: var(--lg-ink) !important; transition: background .4s var(--lg-ease), padding .4s var(--lg-ease); }
.lg-service:hover { background: var(--lg-cream); padding-left: 28px; padding-right: 28px; }
.lg-service-num { font-size: 13px; font-weight: 600; letter-spacing: .2em; color: var(--lg-beige-dark); }
.lg-service h3 { margin: 0; font-size: clamp(1.15rem, 1.8vw, 1.5rem); font-weight: 600; }
.lg-service p { margin: 0; font-size: 14px; font-weight: 300; }
.lg-service-go { font-size: 20px; color: var(--lg-brown); transition: transform .4s var(--lg-ease); text-align: right; }
.lg-service:hover .lg-service-go { transform: translateX(8px); }
@media (max-width: 767px) { .lg-service { grid-template-columns: 44px 1fr 28px; } .lg-service p { grid-column: 2 / 3; grid-row: 2; } .lg-service-go { grid-row: 1; grid-column: 3; } }

/* --- Metodo (4 passi) ---------------------------------------------------- */
.lg-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; counter-reset: lg-step; position: relative; }
.lg-step { position: relative; padding: 0 30px 0 0; }
.lg-step::before { content: ""; position: absolute; top: 34px; left: 70px; right: 0; height: 1px; background: rgba(255,255,255,.22); }
.lg-step:last-child::before { display: none; }
.lg-step-icon { width: 68px; height: 68px; border-radius: 50%; border: 1px solid var(--lg-beige); display: grid; place-items: center; font-size: 24px; color: var(--lg-beige); margin-bottom: 26px; background: var(--lg-ink); position: relative; z-index: 1; transition: background .4s, color .4s; }
.lg-step:hover .lg-step-icon { background: var(--lg-beige); color: var(--lg-ink); }
.lg-step-n { font-size: 12px; font-weight: 600; letter-spacing: .22em; color: var(--lg-beige); display: block; margin-bottom: 10px; }
.lg-step h3 { color: #fff !important; font-size: 1.15rem; font-weight: 600; margin: 0 0 10px; }
.lg-step p { margin: 0; font-size: 14px; font-weight: 300; color: rgba(255,255,255,.72); }
@media (max-width: 991px) { .lg-steps { grid-template-columns: 1fr 1fr; gap: 44px 20px; } .lg-step::before { display: none; } }
@media (max-width: 575px) { .lg-steps { grid-template-columns: 1fr; } }

/* --- Marchi (scorrimento continuo) -------------------------------------- */
.lg-brands { overflow: hidden; position: relative; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.lg-brands-track { display: flex; width: max-content; gap: 24px; animation: lg-marquee 60s linear infinite; }
.lg-brands:hover .lg-brands-track { animation-play-state: paused; }
.lg-brand { flex: none; width: 190px; height: 96px; display: grid; place-items: center; background: #fff; border: 1px solid var(--lg-line); border-radius: var(--lg-radius); padding: 14px 18px; transition: border-color .3s, box-shadow .3s; }
.lg-brand img { max-height: 100%; max-width: 100%; width: auto; object-fit: contain; filter: grayscale(1); opacity: .72; transition: filter .4s, opacity .4s; }
.lg-brand:hover { border-color: var(--lg-beige); box-shadow: var(--lg-shadow); }
.lg-brand:hover img { filter: none; opacity: 1; }
@keyframes lg-marquee { to { transform: translateX(calc(-50% - 12px)); } }
@media (prefers-reduced-motion: reduce) { .lg-brands-track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; } .lg-brands { mask-image: none; -webkit-mask-image: none; } }

/* --- Progetti / card ---------------------------------------------------- */
.lg-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px 26px; }
.lg-card { display: block; text-decoration: none !important; color: var(--lg-ink) !important; background: #fff; border-radius: var(--lg-radius); }
.lg-card-media { position: relative; overflow: hidden; border-radius: var(--lg-radius); aspect-ratio: 4 / 3; background: var(--lg-sand); }
.lg-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s var(--lg-ease); }
.lg-card:hover .lg-card-media img { transform: scale(1.07); }
.lg-card-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(11,9,7,.45), transparent 45%); opacity: 0; transition: opacity .5s; }
.lg-card:hover .lg-card-media::after { opacity: 1; }
.lg-card-tag { position: absolute; left: 16px; top: 16px; z-index: 2; background: rgba(255,255,255,.94); color: var(--lg-ink); font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; padding: 7px 12px; border-radius: 2px; }
.lg-card-body { padding: 20px 4px 4px; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.lg-card h3, .lg-card h2 { font-size: 1.1rem; font-weight: 600; margin: 0; line-height: 1.3; }
.lg-card-go { flex: none; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--lg-line); display: grid; place-items: center; color: var(--lg-brown); transition: background .4s, color .4s, border-color .4s, transform .5s var(--lg-ease); }
.lg-card:hover .lg-card-go { background: var(--lg-brown); color: #fff; border-color: var(--lg-brown); transform: rotate(-45deg); }
.lg-cards-4 { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 28px 20px; }
.lg-cards-4:has(> :nth-child(4)) { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1199px) { .lg-cards-4, .lg-cards-4:has(> :nth-child(4)) { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 991px) { .lg-cards, .lg-cards-4, .lg-cards-4:has(> :nth-child(4)) { grid-template-columns: repeat(2, 1fr); gap: 28px 18px; } }
@media (max-width: 575px) { .lg-cards, .lg-cards-4, .lg-cards-4:has(> :nth-child(4)) { grid-template-columns: 1fr; } }

/* --- Showroom ------------------------------------------------------------ */
.lg-showroom { display: grid; grid-template-columns: 1.1fr 1fr; background: var(--lg-ink); border-radius: var(--lg-radius); overflow: hidden; color: rgba(255,255,255,.8); }
.lg-showroom-img { position: relative; min-height: 460px; }
.lg-showroom-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lg-showroom-panel { padding: clamp(32px, 5vw, 64px); }
.lg-showroom-panel h2 { color: #fff; font-size: clamp(1.7rem, 3vw, 2.5rem); font-weight: 300; margin-bottom: 26px; }
.lg-showroom-panel h2 strong { font-weight: 700; }
.lg-showroom-list { list-style: none; margin: 0 0 30px; padding: 0; }
.lg-showroom-list li { display: flex; gap: 16px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.12); font-size: 14.5px; }
.lg-showroom-list li i { color: var(--lg-beige); width: 20px; text-align: center; margin-top: 5px; }
.lg-showroom-list a { color: #fff !important; text-decoration: none; }
.lg-showroom-list a:hover { color: var(--lg-beige) !important; }
.lg-showroom-list b { color: #fff; font-weight: 600; }
.lg-showroom-actions { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 991px) { .lg-showroom { grid-template-columns: 1fr; } .lg-showroom-img { min-height: 280px; } }

/* --- FAQ ------------------------------------------------------------------ */
.lg-faq { max-width: 900px; margin: 0 auto; }
.lg-faq details { border-bottom: 1px solid var(--lg-line); }
.lg-faq details:first-child { border-top: 1px solid var(--lg-line); }
.lg-faq summary { list-style: none; cursor: pointer; padding: 24px 50px 24px 0; position: relative; font-size: 1.05rem; font-weight: 600; color: var(--lg-ink); }
.lg-faq summary::-webkit-details-marker { display: none; }
.lg-faq summary::after { content: "+"; position: absolute; right: 6px; top: 50%; transform: translateY(-50%); font-size: 26px; font-weight: 300; color: var(--lg-beige-dark); transition: transform .35s var(--lg-ease); }
.lg-faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.lg-faq details p { margin: 0 0 24px; padding-right: 40px; font-weight: 300; }

/* --- Testo SEO home ------------------------------------------------------ */
.lg-seo-text { max-width: 900px; margin: 0 auto; font-weight: 300; font-size: 15px; }
.lg-seo-text a { font-weight: 500; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--lg-beige); }

/* --- Fascia invito al contatto (prima del footer) ------------------------ */
.lg-cta-band { background: linear-gradient(120deg, #4b443d 0%, var(--lg-brown) 55%, #6d6358 100%); color: rgba(255,255,255,.85); padding: clamp(56px, 7vw, 96px) 0; position: relative; overflow: hidden; }
.lg-cta-band::before { content: ""; position: absolute; right: -8%; top: -40%; width: 520px; height: 520px; border-radius: 50%; border: 1px solid rgba(255,255,255,.12); box-shadow: 0 0 0 60px rgba(255,255,255,.03), 0 0 0 120px rgba(255,255,255,.02); }
.lg-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; flex-wrap: wrap; position: relative; }
.lg-cta-text { max-width: 640px; }
.lg-cta-text h2 { color: #fff !important; font-size: clamp(1.7rem, 3.2vw, 2.6rem); font-weight: 300; margin: 0 0 14px; }
.lg-cta-text p { margin: 0; font-weight: 300; font-size: 16px; }
.lg-cta-actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* --- Footer ----------------------------------------------------------------- */
.lg-footer { background: var(--lg-ink); color: rgba(255,255,255,.66); padding-top: clamp(56px, 7vw, 92px); font-size: 14px; }
.lg-footer a { color: rgba(255,255,255,.78) !important; text-decoration: none; transition: color .25s; }
.lg-footer a:hover { color: var(--lg-beige) !important; }
.lg-footer-logo img { filter: brightness(0) invert(1); height: 54px; width: auto; margin-bottom: 22px; }
.lg-footer-about { font-weight: 300; max-width: 38ch; }
.lg-footer-title { color: #fff !important; font-size: 12px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; margin: 6px 0 22px; }
.lg-footer-links { list-style: none; padding: 0; margin: 0; }
.lg-footer-links li { margin-bottom: 11px; }
.lg-footer-address a { display: block; margin-bottom: 12px; line-height: 1.6; }
.lg-footer-address i { color: var(--lg-beige); width: 22px; }
.lg-footer-hours { font-size: 13px; line-height: 1.85; margin-top: 18px; }
.lg-social { display: flex; gap: 10px; margin-top: 24px; }
.lg-social a { width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); display: grid; place-items: center; font-size: 16px; transition: background .3s, border-color .3s, color .3s; }
.lg-social a:hover { background: var(--lg-beige); border-color: var(--lg-beige); color: var(--lg-ink) !important; }
.lg-footer-grid > div { margin-bottom: 40px; }
.lg-footer-bottom { border-top: 1px solid rgba(255,255,255,.1); padding: 22px 0; margin-top: 10px; font-size: 12.5px; text-align: center; }
.lg-footer-bottom p { margin: 0; color: rgba(255,255,255,.5); }

/* Barra azioni mobile + freccia "su" */
.lg-mobile-bar { display: none; }
@media (max-width: 767px) {
    .lg-mobile-bar { display: grid; grid-template-columns: repeat(4, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 1600; background: rgba(11,11,11,.96); backdrop-filter: blur(10px); padding: 8px 6px calc(8px + env(safe-area-inset-bottom)); border-top: 1px solid rgba(255,255,255,.1); }
    .lg-mobile-bar a { display: flex; flex-direction: column; align-items: center; gap: 4px; color: #fff !important; text-decoration: none; font-size: 10.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 4px 0; }
    .lg-mobile-bar i { font-size: 19px; color: var(--lg-beige); }
    body.lg-body { padding-bottom: 68px; }
}

/* --- Testata pagine interne ------------------------------------------------ */
.lg-pagehero { background: linear-gradient(180deg, var(--lg-cream) 0%, #fff 100%); padding: clamp(40px, 5.5vw, 72px) 0 clamp(28px, 4vw, 48px); border-bottom: 1px solid var(--lg-line); position: relative; overflow: hidden; }
.lg-pagehero::after { content: ""; position: absolute; right: -60px; top: -80px; width: 340px; height: 340px; border-radius: 50%; border: 1px solid var(--lg-line); box-shadow: 0 0 0 44px rgba(166,150,133,.06), 0 0 0 88px rgba(166,150,133,.04); pointer-events: none; }
.lg-pagehero .container { position: relative; z-index: 1; }
.lg-pagehero h1 { font-size: clamp(2rem, 4.4vw, 3.4rem); font-weight: 300; margin: 0 0 16px; letter-spacing: -.02em; text-transform: none; }
.lg-pagehero h1 strong { font-weight: 700; }
.lg-pagehero .lg-lead { margin-bottom: 0; }
.lg-pagehero-center { text-align: center; }
.lg-pagehero-center .lg-lead { margin-left: auto; margin-right: auto; }
.lg-pagehero-center .lg-crumbs ol { justify-content: center; }
.lg-crumbs { margin-bottom: 26px; }
.lg-crumbs ol { display: flex; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; gap: 4px 0; font-size: 12px; letter-spacing: .06em; }
.lg-crumbs li { color: var(--lg-text); }
.lg-crumbs li + li::before { content: "/"; margin: 0 10px; color: var(--lg-beige); }
.lg-crumbs a { text-decoration: none; color: var(--lg-beige-dark) !important; }
.lg-crumbs a:hover { color: var(--lg-ink) !important; }
.lg-crumbs [aria-current] { color: var(--lg-ink); font-weight: 600; }
.lg-page-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: clamp(44px, 6vw, 72px); padding: 0 0 clamp(20px, 3vw, 40px); }

/* --- Galleria fotografica (progetti e prodotti) ------------------------------ */
.simple-gallery-grid { display: grid !important; grid-template-columns: repeat(4, 1fr); grid-auto-flow: dense; gap: 14px; }
.simple-gallery-grid .gallery-thumb { position: relative; display: block; overflow: hidden; border-radius: var(--lg-radius); background: var(--lg-sand); aspect-ratio: 4 / 3; margin: 0; padding: 0; cursor: zoom-in; }
.simple-gallery-grid .gallery-thumb:nth-child(6n + 1) { grid-column: span 2; grid-row: span 2; aspect-ratio: auto; }
.simple-gallery-grid .gallery-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--lg-ease); border: 0 !important; padding: 0 !important; }
.simple-gallery-grid .gallery-thumb::after { content: "\f00e"; font-family: FontAwesome; position: absolute; inset: 0; display: grid; place-items: center; font-size: 26px; color: #fff; background: rgba(22,19,15,.38); opacity: 0; transition: opacity .4s; }
.simple-gallery-grid .gallery-thumb:hover img, .simple-gallery-grid .gallery-thumb:focus-visible img { transform: scale(1.08); }
.simple-gallery-grid .gallery-thumb:hover::after, .simple-gallery-grid .gallery-thumb:focus-visible::after { opacity: 1; }
@media (max-width: 991px) { .simple-gallery-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 575px) { .simple-gallery-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; } }

/* Lightbox (markup creato da js/simple-gallery.js) */
.simple-lightbox { background: rgba(9,8,7,.96) !important; backdrop-filter: blur(6px); }
.simple-lightbox img { box-shadow: 0 30px 80px -20px rgba(0,0,0,.7); border-radius: 2px; }
.simple-lightbox .sl-close, .simple-lightbox .sl-prev, .simple-lightbox .sl-next { background: rgba(255,255,255,.08) !important; border: 1px solid rgba(255,255,255,.3) !important; color: #fff !important; border-radius: 50% !important; transition: background .3s, color .3s; }
.simple-lightbox .sl-close:hover, .simple-lightbox .sl-prev:hover, .simple-lightbox .sl-next:hover { background: #fff !important; color: var(--lg-ink) !important; }
.simple-lightbox .sl-counter { font-family: 'Montserrat', sans-serif; letter-spacing: .24em; font-size: 12px; font-weight: 600; color: rgba(255,255,255,.85) !important; }

/* Scheda progetto / prodotto */
.lg-detail-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.lg-detail-text { font-weight: 300; font-size: 16px; line-height: 1.9; }
.lg-detail-side { background: var(--lg-cream); border-radius: var(--lg-radius); padding: 32px 30px; position: sticky; top: 130px; }
.lg-detail-side h2, .lg-detail-side h3 { font-size: 1.2rem; font-weight: 600; margin: 0 0 12px; }
.lg-detail-side p { font-size: 14px; font-weight: 300; margin-bottom: 22px; }
.lg-detail-side .lg-btn { width: 100%; margin-bottom: 10px; }
@media (max-width: 991px) { .lg-detail-grid { grid-template-columns: 1fr; } .lg-detail-side { position: static; } }
.lg-related-title { text-align: center; margin: 0 0 40px; }
.lg-prevnext { display: flex; justify-content: space-between; gap: 16px; margin-top: 56px; padding-top: 28px; border-top: 1px solid var(--lg-line); flex-wrap: wrap; }

/* --- Pagine di testo (servizi, landing SEO) ------------------------------------ */
.lg-article-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: clamp(32px, 5vw, 80px); align-items: start; }
.lg-article { font-size: 16px; font-weight: 300; line-height: 1.95; color: var(--lg-text); }
.lg-article b, .lg-article strong { font-weight: 600; color: var(--lg-ink); }
.lg-article img { border-radius: var(--lg-radius); box-shadow: var(--lg-shadow); border: 0 !important; padding: 0 !important; height: auto; }
.lg-article img.seo-img-right, .lg-article img.seo-img-left, .lg-article img.seo-img-center { margin-top: 8px; }
.lg-article a { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--lg-beige); font-weight: 500; }
.lg-article h1 { font-size: clamp(1.9rem, 3.4vw, 2.7rem) !important; font-weight: 300 !important; margin-bottom: 26px; }
.lg-article-side { position: sticky; top: 130px; display: grid; gap: 22px; }
.lg-side-card { background: var(--lg-cream); border-radius: var(--lg-radius); padding: 30px; }
.lg-side-card h2 { font-size: 1.15rem; font-weight: 600; margin: 0 0 10px; }
.lg-side-card p { font-size: 14px; font-weight: 300; margin-bottom: 20px; }
.lg-side-card .lg-btn { width: 100%; }
.lg-side-links { list-style: none; margin: 0; padding: 0; }
.lg-side-links li { border-bottom: 1px solid var(--lg-line); }
.lg-side-links li:last-child { border-bottom: 0; }
.lg-side-links a { display: flex; justify-content: space-between; padding: 12px 0; font-size: 14px; font-weight: 500; text-decoration: none !important; }
.lg-side-links a::after { content: "\2192"; color: var(--lg-beige-dark); }
@media (max-width: 991px) { .lg-article-wrap { grid-template-columns: 1fr; } .lg-article-side { position: static; } .lg-article img.seo-img-right, .lg-article img.seo-img-left { float: none !important; max-width: 100% !important; margin: 18px 0 !important; } }

/* --- Marchi (pagina brand) ------------------------------------------------------- */
.lg-brand-group { padding: clamp(40px, 5vw, 64px) 0; border-bottom: 1px solid var(--lg-line); }
.lg-brand-group h2 { font-size: clamp(1.2rem, 2vw, 1.6rem); font-weight: 600; letter-spacing: .02em; margin: 0 0 30px; display: flex; align-items: center; gap: 18px; }
.lg-brand-group h2::after { content: ""; flex: 1; height: 1px; background: var(--lg-line); }
.lg-brand-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.lg-brand-tile { display: grid; place-items: center; aspect-ratio: 5 / 3; background: #fff; border: 1px solid var(--lg-line); border-radius: var(--lg-radius); padding: 18px 22px; transition: border-color .3s, box-shadow .4s, transform .4s var(--lg-ease); }
.lg-brand-tile img { max-width: 100%; max-height: 100%; width: auto; object-fit: contain; filter: grayscale(1); opacity: .78; transition: filter .4s, opacity .4s; }
a.lg-brand-tile:hover, .lg-brand-tile:hover { border-color: var(--lg-beige); box-shadow: var(--lg-shadow); transform: translateY(-4px); }
.lg-brand-tile:hover img { filter: none; opacity: 1; }
@media (max-width: 1199px) { .lg-brand-grid { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 767px) { .lg-brand-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; } }

/* --- Contatti -------------------------------------------------------------------- */
.lg-contact-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-bottom: 56px; }
.lg-contact-card { background: var(--lg-cream); border-radius: var(--lg-radius); padding: 34px 30px; text-align: left; transition: transform .4s var(--lg-ease), box-shadow .4s; }
.lg-contact-card:hover { transform: translateY(-5px); box-shadow: var(--lg-shadow); }
.lg-contact-card i { font-size: 26px; color: var(--lg-beige-dark); margin-bottom: 18px; display: block; }
.lg-contact-card h2 { font-size: 12px; letter-spacing: .2em; text-transform: uppercase; font-weight: 700; margin: 0 0 8px; }
.lg-contact-card p { margin: 0; font-size: 15px; }
.lg-contact-card a { text-decoration: none; font-weight: 600; }
.lg-contact-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(28px, 5vw, 72px); align-items: start; }
.lg-map { border-radius: var(--lg-radius); overflow: hidden; border: 1px solid var(--lg-line); min-height: 460px; height: 100%; background: var(--lg-sand); }
.lg-map iframe { display: block; width: 100%; height: 100%; min-height: 460px; border: 0; filter: grayscale(.25); }
.lg-hours { width: 100%; font-size: 14px; margin: 0 0 8px; }
.lg-hours td { padding: 9px 0; border-bottom: 1px solid var(--lg-line); }
.lg-hours td:last-child { text-align: right; font-weight: 600; color: var(--lg-ink); }
@media (max-width: 991px) { .lg-contact-cards { grid-template-columns: 1fr; } .lg-contact-grid { grid-template-columns: 1fr; } }

/* Moduli */
.lg-form { background: #fff; border: 1px solid var(--lg-line); border-radius: var(--lg-radius); padding: clamp(26px, 4vw, 46px); box-shadow: var(--lg-shadow); }
.lg-form h2, .lg-form h3 { font-size: 1.5rem; font-weight: 300; margin: 0 0 8px; }
.lg-form > p { font-weight: 300; margin-bottom: 26px; }
.lg-form .form-control, .lg-body .contact-form .form-control {
    height: auto; padding: 15px 18px; border: 1px solid var(--lg-line); border-radius: 2px; background: var(--lg-paper);
    font: 400 14.5px 'Montserrat', sans-serif; color: var(--lg-ink); box-shadow: none; transition: border-color .3s, background .3s, box-shadow .3s;
}
.lg-form .form-control:focus, .lg-body .contact-form .form-control:focus { border-color: var(--lg-beige); background: #fff; box-shadow: 0 0 0 4px rgba(166,150,133,.18); }
.lg-form textarea.form-control { min-height: 150px; }
.lg-form label { font-size: 13px; font-weight: 400; }
.lg-form .field-trap { position: absolute; left: -9999px; }
.lg-form .button, .lg-body .contact-form .button { background: var(--lg-brown); color: #fff; border: 1px solid var(--lg-brown); border-radius: 2px; padding: 16px 40px; font: 600 12.5px 'Montserrat', sans-serif; letter-spacing: .16em; text-transform: uppercase; transition: background .3s, transform .3s; }
.lg-form .button:hover { background: var(--lg-ink); border-color: var(--lg-ink); transform: translateY(-2px); }

/* Pulsanti "torna a" storici: stesso stile dei nuovi */
.btn-home-custom, .btn-back-custom { display: inline-flex !important; align-items: center; justify-content: center; padding: 16px 34px !important; border: 1px solid var(--lg-brown) !important; border-radius: 2px !important; background: transparent !important; color: var(--lg-brown) !important; font: 600 12.5px/1 'Montserrat', sans-serif !important; letter-spacing: .16em !important; text-transform: uppercase !important; text-decoration: none !important; transition: background .35s, color .35s; }
.btn-home-custom:hover, .btn-back-custom:hover { background: var(--lg-brown) !important; color: #fff !important; transform: none !important; box-shadow: none !important; }

/* Pulsante WhatsApp flottante (solo desktop, la barra mobile copre gli schermi piccoli) */
.lg-wa-float { position: fixed; left: 16px; bottom: 72px; z-index: 1400; width: 56px; height: 56px; border-radius: 50%; background: #25d366; color: #fff !important; display: grid; place-items: center; font-size: 28px; box-shadow: 0 10px 28px -8px rgba(0,0,0,.5); transition: transform .35s var(--lg-ease); text-decoration: none !important; }
.lg-wa-float:hover { transform: scale(1.08); }
@media (max-width: 767px) { .lg-wa-float { display: none; } }
#back-to-top { z-index: 1400; }

/* --- Correzioni di contrasto e rifiniture (verificate a video) --------------- */
.lg-body h1, .lg-body h2, .lg-body h3 { text-wrap: balance; }
.lg-bg-dark p, .lg-showroom-panel p, .lg-cta-text p, .lg-footer p, .lg-footer-about { color: rgba(255,255,255,.74) !important; }
.lg-footer-hours { color: rgba(255,255,255,.66) !important; }
.lg-showroom-list .lg-dot { width: 8px; height: 8px; margin: 0 8px 0 0; display: inline-block; text-align: left; }
.lg-showroom-list .lg-status { display: inline-flex; align-items: center; }
.lg-showroom-actions .lg-btn { padding: 15px 26px; }
.lg-lead a, .lg-intro-text a:not(.lg-btn):not(.lg-link-arrow) { text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--lg-beige); font-weight: 500; }
.lg-area h3 { font-size: clamp(1.2rem, 1.7vw, 1.65rem); }
.lg-hero-cta .lg-btn { padding: 17px 32px; }

/* Elenco a 2 colonne (categorie dei progetti) */
.lg-areas-2 .lg-area:nth-child(n) { grid-column: span 6; min-height: 380px; }
@media (max-width: 767px) { .lg-areas-2 .lg-area:nth-child(n) { grid-column: 1 / -1; min-height: 300px; } }
.lg-btn { line-height: 1.35; text-align: center; }

/* Blocco "tre impegni" senza cornice (pagina chi siamo) */
.lg-trust-flat { grid-template-columns: repeat(3, 1fr); box-shadow: none; background: transparent; border-radius: 0; }
.lg-trust-flat .lg-trust-item { border: 0; padding: 10px 28px 10px 0; }
@media (max-width: 767px) { .lg-trust-flat { grid-template-columns: 1fr; } }
.field-trap { display: none !important; }

/* Testi legali (privacy): stessa grafica, testo invariato */
.lg-legal { max-width: 900px; margin: 0 auto; font-size: 15px; line-height: 1.85; }
.lg-legal h1 { font-size: 1.5rem !important; margin: 32px 0 14px; }
.lg-legal h2 { font-size: 1.1rem !important; text-decoration: none !important; margin: 34px 0 10px; font-weight: 600 !important; }
.lg-legal h3 { font-size: 1.15rem; margin: 0 0 8px; }
.lg-legal a { color: var(--lg-brown) !important; font-weight: 500 !important; word-break: break-word; }
.lg-legal ul { margin: 8px 0 8px 22px; }

/* Modulo contatti: campi a tutta larghezza (il template li metteva in fila per tre) */
.lg-form .contact-form .section-field { float: none; width: 100%; margin-right: 0; margin-bottom: 14px; }
.lg-form .contact-form .section-field:nth-child(n) { margin-right: 0; }
.lg-form select.form-control { appearance: auto; height: auto; }
.lg-form .form-group label { display: flex; gap: 10px; align-items: flex-start; line-height: 1.5; }
.lg-form .form-group input[type=checkbox] { margin-top: 4px; flex: none; }
p.lg-status { display: flex; }

/* Titoletti negli articoli dei servizi */
.lg-article .lg-art-h2 { font-size: clamp(1.25rem, 2vw, 1.6rem); font-weight: 600; margin: 40px 0 14px; letter-spacing: -.005em; }
.lg-article > .lg-art-h2:first-child { margin-top: 0; }

/* Il bollo dei cookie (acconsento.click) sta fisso in basso a sinistra: WhatsApp sta sopra di lui,
   e su smartphone il bollo sale sopra la barra dei contatti rapidi per non coprirla. */
@media (max-width: 767px) { #acconsento-lock { bottom: 82px !important; } }

/* Il menu originale, allo scroll, trasforma .menu-list-items in una barra "fissa" a parte (alta solo 60px,
   con ombra): tagliava il logo. Il nostro header e' gia' fisso, quindi quella modalita' va spenta. */
#header.lg-header .mega-menu.desktopTopFixed .menu-list-items,
#header.lg-header .mega-menu.mobileTopFixed .menu-list-items {
    position: static !important; height: auto !important; padding: 0 !important;
    background: #fff !important; box-shadow: none !important; border: 0 !important;
}
#header.lg-header .mega-menu.desktopTopFixed .menu-list-items .menu-logo > li > a img,
#header.lg-header .mega-menu.mobileTopFixed .menu-list-items .menu-logo > li > a img { margin: 0 !important; padding: 0 !important; }

/* Barra nera in alto: testi piu' leggibili (bianco pieno, un po' piu' grandi e marcati) */
.lg-header .topbar-call li, .lg-header .topbar-call li a { font-size: 13px !important; font-weight: 600 !important; color: #fff !important; letter-spacing: .01em; }
.lg-header .topbar-call li a:hover { color: var(--lg-beige) !important; }
.lg-header .topbar-call i { color: #d9c7b0 !important; font-size: 14px; }
.lg-topbar-left { color: rgba(255,255,255,.95); font-size: 12.5px; font-weight: 500; }
.lg-hours-short { color: rgba(255,255,255,.92); }
@media (max-width: 991px) {
    #header.lg-header .mega-menu.mobileTopFixed .menu-list-items { padding: 8px 0 !important; }
}
@media (max-width: 991px) {
    #header.lg-header .mega-menu.desktopTopFixed .menu-list-items { padding: 8px 0 !important; }
}

/* Il template imponeva #999 con !important sulla barra nera: qui la superiamo (bianco pieno, ben leggibile) */
#header.lg-header .topbar .topbar-call ul li,
#header.lg-header .topbar .topbar-call ul li a,
#header.lg-header .topbar ul li,
#header.lg-header .topbar ul li a { color: #fff !important; font-size: 13px !important; font-weight: 600 !important; }
#header.lg-header .topbar .topbar-call ul li a:hover { color: var(--lg-beige) !important; }
#header.lg-header .topbar .topbar-call ul li i { color: #d9c7b0 !important; }

/* Foto della sezione "il tuo partner": formato piu' largo, cosi' restano nitide */
.lg-intro-media img.lg-intro-main { aspect-ratio: 5 / 4; object-position: 55% 50%; }
.lg-intro-media img.lg-intro-sub { object-position: 50% 60%; }

/* Marchi in home: casella nello stesso formato (5:3) delle miniature, cosi' i loghi non vengono mai tagliati */
.lg-brand { width: 210px; height: 126px; padding: 12px 16px; }
.lg-brand img { width: 100%; height: 100%; max-width: 100%; max-height: 100%; object-fit: contain; }
@media (max-width: 575px) { .lg-brand { width: 170px; height: 102px; padding: 10px 12px; } }

/* ===== Galleria: struttura base del lightbox (il markup lo crea js/simple-gallery.js) ===== */
.simple-lightbox { position: fixed; inset: 0; z-index: 1000000; display: none; align-items: center; justify-content: center; }
.simple-lightbox.active { display: flex; }
.simple-lightbox img { max-width: 92vw; max-height: 86vh; object-fit: contain; display: block; }
.simple-lightbox button { position: absolute; display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; padding: 0; font-size: 20px; line-height: 1; cursor: pointer; touch-action: manipulation; }
.simple-lightbox .sl-close { top: 18px; right: 18px; z-index: 2; font-size: 26px; }
.simple-lightbox .sl-prev { left: 18px; top: 50%; transform: translateY(-50%); }
.simple-lightbox .sl-next { right: 18px; top: 50%; transform: translateY(-50%); }
.simple-lightbox .sl-counter { position: absolute; bottom: 18px; left: 50%; transform: translateX(-50%); }
@media (max-width: 575px) {
    .simple-lightbox img { max-width: 100vw; max-height: 80vh; }
    .simple-lightbox .sl-prev, .simple-lightbox .sl-next { width: 40px; height: 40px; font-size: 16px; }
    .simple-lightbox .sl-prev { left: 8px; } .simple-lightbox .sl-next { right: 8px; }
}
.simple-gallery-grid .gallery-thumb { touch-action: manipulation; }

/* Galleria v2: gesti, altezze su smartphone (barra del browser) e stato di caricamento */
.simple-lightbox { overscroll-behavior: contain; touch-action: none; -webkit-tap-highlight-color: transparent; }
.simple-lightbox img { max-height: 86vh; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; transition: opacity .25s; }
@supports (height: 100dvh) { .simple-lightbox img { max-height: 86dvh; } }
.simple-lightbox.sl-loading img { opacity: .85; }
.simple-lightbox .sl-msg { position: absolute; bottom: 56px; left: 50%; transform: translateX(-50%); max-width: 88vw; padding: 8px 16px; border-radius: 3px; background: rgba(255,255,255,.14); color: #fff; font-size: 13px; text-align: center; }
.simple-lightbox .sl-msg[hidden] { display: none; }
.simple-lightbox button:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
@media (max-width: 575px) { .simple-lightbox img { max-height: 78vh; } }
@supports (height: 100dvh) { @media (max-width: 575px) { .simple-lightbox img { max-height: 78dvh; } } }

/* Schede (progetti, prodotti, categorie): cornice sottile e testo con margine interno */
.lg-card { border: 1px solid var(--lg-line); border-radius: var(--lg-radius); overflow: hidden; transition: box-shadow .5s var(--lg-ease), transform .5s var(--lg-ease), border-color .4s; }
.lg-card:hover { box-shadow: var(--lg-shadow); transform: translateY(-4px); border-color: transparent; }
.lg-card-media { border-radius: 0; }
.lg-card-body { padding: 20px 22px 22px; align-items: center; }
.lg-cards-4 .lg-card-body { padding: 16px 18px 18px; }
.lg-cards-4 .lg-card-go { width: 34px; height: 34px; }

/* Slider fermo (mouse sopra o dito appoggiato): ferma anche la barra di avanzamento */
.lg-hero.is-paused .lg-hero-bar.is-active::after { animation-play-state: paused; }


/* ===================================================================================
   INTESTAZIONE: riduzione PROGRESSIVA legata allo scorrimento (nessun "scatto")
   js/longo-2026.js scrive in #header la variabile --lg-p: 0 = pagina in cima, 1 = ridotta al minimo.
   Il menu e' fisso e lo spazio sotto e' gia' riservato (--lg-hh): ridursi non sposta la pagina.
   =================================================================================== */
:root { --lg-hh: 134px; }
@media (max-width: 991px) { :root { --lg-hh: 108px; } }
.lg-body .wrapper { padding-top: var(--lg-hh); }
#header.lg-header { --lg-p: 0; position: fixed !important; top: 0 !important; left: 0; right: 0; width: 100%; box-shadow: none; }
/* il template imponeva 90px di altezza minima appena si scorre: era il "lampeggio" e faceva sparire lo slider */
#header.lg-header nav#menu, #header.lg-header nav#menu.desktopTopFixed, #header.lg-header nav#menu.mobileTopFixed { min-height: 0 !important; }

/* barra nera: si chiude piano piano */
#header.lg-header .topbar { height: calc(42px * (1 - var(--lg-p))); overflow: hidden; opacity: calc(1 - var(--lg-p) * 1.4); }
/* linea sotto il menu che sfuma e ombra che compare */
#header.lg-header .menu { border-bottom-color: rgba(93, 84, 75, calc(.16 * (1 - var(--lg-p)))); box-shadow: 0 10px 30px -14px rgba(22, 19, 15, calc(.26 * var(--lg-p))); transition: none; }

/* altezza della barra ESPLICITA: logo e pulsante ci stanno sempre dentro (non dipende piu' dai float del template) */
#header.lg-header { --lg-bar: calc(88px - 36px * var(--lg-p)); }
@media (max-width: 991px) { #header.lg-header { --lg-bar: calc(66px - 26px * var(--lg-p)); } }
#header.lg-header .menu { height: var(--lg-bar); overflow: visible; }
/* nav e striscia bianca: altezza esplicita uguale alla barra (senza, la % non si risolve e con la classe del template la striscia arrivava a 140px coprendo lo slider) */
#header.lg-header .menu > nav#menu, #header.lg-header .menu > nav#menu > section.menu-list-items { height: var(--lg-bar) !important; max-height: var(--lg-bar); overflow: visible; }

/* logo: parte piu' grande, si riduce di piu' */
#header.lg-header .menu-logo img { height: calc(60px - 28px * var(--lg-p)) !important; width: auto !important; margin: 0 !important; padding: 0 !important; transition: none !important; }
#header.lg-header .menu-logo, #header.lg-header .menu-logo > li, #header.lg-header .menu-logo > li > a { padding: 0 !important; margin: 0 !important; line-height: 0; }

@media (min-width: 992px) {
    #header.lg-header .menu-list-items, #header.lg-header .menu-list-items > .container, #header.lg-header .menu-list-items .row { height: 100%; }
    #header.lg-header .menu-list-items .col-lg-12 { display: flex; align-items: center; justify-content: space-between; height: 100%; min-height: 0; padding-top: 0; padding-bottom: 0; }
    #header.lg-header .menu-logo { float: none; height: 100%; display: flex; align-items: center; }
    #header.lg-header .menu-logo > li { display: flex; align-items: center; }
    #header.lg-header .menu-bar { float: none; height: 100%; display: flex !important; align-items: center; margin: 0; }
    #header.lg-header .menu-links { height: 100%; width: auto; display: flex !important; align-items: center; flex-wrap: nowrap; margin: 0; }
    #header.lg-header .menu-links > li { float: none; height: 100%; display: flex !important; align-items: center; flex: none; }
    #header.lg-header .menu-links > li > a { display: flex !important; align-items: center; height: 100%; padding: 0 15px !important; line-height: 1.2 !important; white-space: nowrap; }
    #header.lg-header .menu-links > li:not(.lg-nav-cta) > a::after { bottom: calc(var(--lg-bar) / 2 - 15px); }
    #header.lg-header .menu-links > li.lg-nav-cta > a.lg-btn { height: calc(48px - 8px * var(--lg-p)); padding: 0 22px !important; white-space: nowrap; }
}
/* tra 992 e 1199 px lo spazio e' poco: voci piu' strette e pulsante corto ("Prenota"), niente a capo */
@media (min-width: 992px) and (max-width: 1199px) {
    #header.lg-header .menu-links > li > a { padding: 0 9px !important; font-size: 11px !important; letter-spacing: .08em; }
    #header.lg-header .menu-links > li.lg-nav-cta > a.lg-btn { padding: 0 16px !important; }
    #header.lg-header .lg-nav-cta { margin-left: 6px; }
    .lg-cta-long { display: none; }
}
@media (max-width: 991px) {
    #header.lg-header .mega-menu .menu-list-items,
    #header.lg-header .mega-menu.desktopTopFixed .menu-list-items,
    #header.lg-header .mega-menu.mobileTopFixed .menu-list-items { padding: 0 !important; height: 100%; }
}
.lg-detail-side, .lg-article-side { top: 110px; }


/* ===== Pulsante TOP =====
   Nel template il pulsante vero e' il link interno (a.top, posizione fissa): visibilita' sul contenitore, posizione sul link.
   Le regole con !important battono quelle "in linea" scritte da jQuery (fadeIn/fadeOut). */
#back-to-top { position: static !important; display: block !important; opacity: 0 !important; visibility: hidden; pointer-events: none;
    transition: opacity .2s ease, visibility 0s linear .2s; }
#back-to-top.is-on { opacity: 1 !important; visibility: visible; transition-delay: 0s; }
#back-to-top a.top { position: fixed !important; right: 22px !important; bottom: 22px !important; left: auto !important; z-index: 1400;
    display: flex; flex-direction: column; align-items: center; justify-content: center; width: 50px; height: 50px; padding: 0; margin: 0; border-radius: 50%;
    background: var(--lg-ink); color: #fff !important; border: 1px solid rgba(255,255,255,.18); box-shadow: 0 10px 26px -10px rgba(0,0,0,.6);
    text-decoration: none !important; line-height: 1; touch-action: manipulation; -webkit-tap-highlight-color: transparent; user-select: none;
    transform: translateY(14px) scale(.9); pointer-events: none; transition: transform .22s var(--lg-ease), background .2s; }
#back-to-top.is-on a.top { transform: none; pointer-events: auto; }
#back-to-top a.top i { font-size: 22px; line-height: 1; margin: 0; }
#back-to-top a.top span { display: block; font-size: 8.5px; font-weight: 700; letter-spacing: .12em; line-height: 1; margin-top: 1px; }
#back-to-top a.top:hover { background: var(--lg-brown); }
#back-to-top.is-on a.top:active { transform: scale(.9); background: var(--lg-beige-dark); }
@media (max-width: 767px) {
    #back-to-top a.top { right: 14px !important; bottom: 84px !important; width: 54px; height: 54px; }   /* sopra la barra dei contatti, bersaglio piu' grande per il pollice */
}
.lg-nav-cta .lg-cta-long { font: inherit !important; letter-spacing: inherit !important; text-transform: inherit; color: inherit !important; }

/* TOP ridisegnato: freccia SVG a misura esatta + scritta compensata, gruppo centrato nel cerchio */
#back-to-top a.top { gap: 4px; }
#back-to-top a.top svg.lg-top-ico { display: block; flex: none; width: 16px; height: 10px; }
#back-to-top a.top span { display: block; margin: 0 !important; padding: 0; font-size: 9px; font-weight: 700; letter-spacing: .14em; text-indent: .14em; line-height: 1; }
@media (max-width: 767px) { #back-to-top a.top svg.lg-top-ico { width: 17px; height: 10.6px; } #back-to-top a.top span { font-size: 9.5px; } }

/* ===== Telefono e tablet: barra e logo con margine sopra e sotto (anche compatti) ===== */
@media (max-width: 991px) {
    #header.lg-header { --lg-bar: calc(68px - 22px * var(--lg-p)); }                        /* 68 -> 46 */
    #header.lg-header .menu-logo img { height: calc(46px - 16px * var(--lg-p)) !important; }  /* 46 -> 30: 11px di aria sopra e sotto da fermo, 8px da compatto */
    :root { --lg-hh: 110px; }
    /* il menu a tendina e' CHIUSO di default: lo apre il pulsante (istruzione in linea del codice del menu).
       Prima, finche' gli script del fondo pagina non arrivavano, sul telefono restava aperto. */
    #header.lg-header .menu-links { display: none; }
}

/* Telefono: logo e pulsante hamburger centrati in verticale nella barra */
@media (max-width: 991px) {
    #header.lg-header .menu-logo { float: none; display: flex; align-items: center; width: 100%; height: var(--lg-bar); position: relative; margin: 0; padding: 0; }
    #header.lg-header .menu-logo > li, #header.lg-header .menu-logo > li > a { float: none; display: flex; align-items: center; height: 100%; }
    #header.lg-header .menu-mobile-collapse-trigger { top: 50% !important; }   /* il template lo sposta gia' di -50% verso l'alto */
    #header.lg-header .menu-links { box-shadow: 0 22px 34px -20px rgba(22, 19, 15, .4); border-top: 1px solid var(--lg-line); }
}

/* Modulo contatti: il campo "Cosa stai cercando?" e' alto come gli altri e il testo si legge tutto
   (una regola del template lo teneva a 38px con 15px di spazio sopra e sotto: il testo veniva tagliato) */
.lg-form select.form-control, .lg-form select.form-control:not([size]):not([multiple]) {
    height: 50px !important; padding: 0 46px 0 18px !important; line-height: 1.3 !important; display: block; width: 100%;
    appearance: none; -webkit-appearance: none; -moz-appearance: none; cursor: pointer; text-overflow: ellipsis;
    background-color: var(--lg-paper);
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'><path d='M1.5 1.5 7 7l5.5-5.5' fill='none' stroke='%235d544b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>");
    background-repeat: no-repeat; background-position: right 18px center; background-size: 14px 9px;
}
.lg-form select.form-control:focus { background-color: #fff; }
.lg-form select.form-control option { color: var(--lg-ink); font-size: 15px; }