/* ============================================================
   Header + footer
   ============================================================ */

/* ---------- HEADER (top 2-strip nav) ---------- */
.t-header {
    position: sticky;
    top: 0;
    left: 0; right: 0;
    z-index: 100;
    color: #fff;
    background: var(--t-black);
}

/* TOP STRIP (dark grey) — brand + secondary nav + lang + burger */
.t-header__top {
    background: var(--t-black);
    color: #fff;
}
.t-header__top-inner {
    display: flex;
    align-items: center;
    gap: var(--t-sp-5);
    min-height: 72px;
    padding-block: var(--t-sp-3);
}
.t-header__brand {
    display: flex;
    align-items: center;
    margin-right: var(--t-sp-5);
}
.t-header__brand img,
.t-header__brand svg { height: 46px; width: auto; display: block; }

.t-header__secondary {
    display: flex;
    align-items: center;
    gap: var(--t-sp-6);
    flex: 1 1 auto;
    justify-content: flex-end;
}
.t-header__secondary a {
    color: rgba(255,255,255,.9);
    font-size: .82rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-weight: var(--t-fw-bold);
    transition: color .2s ease;
}
.t-header__secondary a:hover,
.t-header__secondary a.is-active { color: #fff; }

.t-header__lang {
    display: flex;
    gap: 2px;
    align-items: stretch;
    align-self: stretch;
    margin-left: var(--t-sp-4);
    /* annulla il padding verticale del wrapper così le pillole arrivano top/bottom */
    margin-block: calc( var(--t-sp-3) * -1 );
}
.t-header__lang-link {
    display: inline-flex;
    align-items: center;
    padding: 0 .65rem;
    color: rgba(255,255,255,.6);
    font-size: .78rem;
    font-weight: var(--t-fw-bold);
    letter-spacing: .04em;
    text-transform: uppercase;
    transition: color .2s ease, background .2s ease;
}
.t-header__lang-link.is-active { color: #fff; background: #3b3b3b; }
.t-header__lang-link:hover { color: #fff; }

/* PRIMARY STRIP (blue) */
.t-header__primary {
    background: var(--t-industria);
}
.t-header__primary-inner {
    min-height: 52px;
    display: flex;
    align-items: stretch;
    justify-content: center;
}
.t-header__main {
    display: flex;
    align-items: stretch;
    justify-content: center;
    flex-wrap: wrap;
}
.t-nav-item {
    position: relative;
    display: flex;
    align-items: stretch;
}
.t-nav-item__link {
    display: flex;
    align-items: center;
    padding: 0 var(--t-sp-6);
    color: #fff;
    font-size: .85rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-weight: var(--t-fw-bold);
    line-height: 1;
    transition: background .2s ease, color .2s ease;
}
.t-nav-item:hover > .t-nav-item__link {
    background: #3b3b3b;
    color: #fff;
}

/* SUB-DROPDOWN — fascia FULL-WIDTH grigio scuro sotto la striscia blu */
.t-nav-item__sub {
    position: absolute;
    top: 100%;
    left: 0;
    /* trucco full-width senza JS: ombra orizzontale che si estende oltre l'item */
    background: #3b3b3b;
    padding: var(--t-sp-3) var(--t-sp-5);
    display: none;
    z-index: 10;
    min-width: 100%;
    white-space: nowrap;
    box-shadow: 0 0 0 100vmax #3b3b3b;
    clip-path: inset(0 -100vmax);
}
/* Mostra il dropdown su hover/focus. Non dipende dalla classe .has-sub
   (il walker non la imposta): basta che esista il .t-nav-item__sub. */
.t-nav-item:hover > .t-nav-item__sub,
.t-nav-item:focus-within > .t-nav-item__sub {
    display: flex;
    flex-direction: column;
    gap: .3rem;
}
.t-nav-item__sub a {
    display: block;
    padding: .25rem 0;
    color: rgba(255,255,255,.88);
    font-size: .9rem;
    font-weight: var(--t-fw-semibold);
    letter-spacing: .02em;
    transition: color .2s ease;
}
.t-nav-item__sub a:hover { color: #fff; }

/* Voce di menu marcata "Font leggero" (checkbox per-voce in Aspetto › Menu).
   Vale per desktop (primario/secondario) e drawer mobile. */
.t-mi-light { font-weight: var(--t-fw-light) !important; }

/* Burger — visibile solo su mobile (vedi media query in fondo) */
.t-header__burger {
    appearance: none;
    background: transparent;
    border: 0;
    color: #fff;
    cursor: pointer;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    padding: 0;
    display: none;
}
.t-header__burger span,
.t-header__burger span::before,
.t-header__burger span::after {
    content: "";
    display: block;
    width: 28px;
    height: 2px;
    background: currentColor;
    position: relative;
    transition: transform var(--t-trans), opacity var(--t-trans);
}
.t-header__burger span::before { position: absolute; top: -8px; left: 0; }
.t-header__burger span::after  { position: absolute; top:  8px; left: 0; }

.t-header__burger[aria-expanded="true"] span { background: transparent; }
.t-header__burger[aria-expanded="true"] span::before { transform: translateY(8px) rotate(45deg); }
.t-header__burger[aria-expanded="true"] span::after  { transform: translateY(-8px) rotate(-45deg); }

/* ---------- MEGA MENU (overlay) ---------- */
.t-megamenu {
    position: fixed;
    inset: 0;
    background: #fff;
    color: var(--t-ink);
    transform: translateY(-100%);
    transition: transform .4s cubic-bezier(.22,.61,.36,1);
    overflow-y: auto;
    z-index: 101;
}

/* Backdrop — visibile solo in modalità drawer (mobile) */
.t-megamenu__backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s ease, visibility .35s ease;
    z-index: 98;
}
.t-megamenu__backdrop.is-visible { opacity: 1; visibility: visible; }

/* Topbar interna al megamenu (logo + close X). In flusso → scorre col contenuto */
.t-megamenu__topbar {
    position: relative;
    z-index: 2;
    background: var(--t-black);
    min-height: 72px;
    display: flex;
    align-items: center;
}
.t-megamenu__topbar-inner {
    display: flex;
    align-items: center;
    width: 100%;
    gap: var(--t-sp-4);
}
.t-megamenu__brand { display: inline-flex; align-items: center; }
.t-megamenu__brand img { height: 36px; width: auto; display: block; }
.t-megamenu__close {
    margin-left: auto;
    appearance: none;
    background: transparent;
    border: 0;
    cursor: pointer;
    width: 44px;
    height: 44px;
    color: #fff;
    padding: 0;
    position: relative;
    flex: 0 0 auto;
}
.t-megamenu__close span {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 22px;
    height: 2px;
    background: currentColor;
    transform: translate(-50%, -50%) rotate(45deg);
}
.t-megamenu__close span + span { transform: translate(-50%, -50%) rotate(-45deg); }

/* Nascondi l'header del sito mentre il megamenu è aperto */
body.t-menu-open .t-header { visibility: hidden; }
/* Black strip on top covering top items row */
.t-megamenu::before {
    content: "";
    position: absolute;
    left: 0; right: 0;
    top: 0;
    height: 139px;
    background: var(--t-black);
    z-index: 0;
    pointer-events: none;
}
.t-megamenu__inner { position: relative; z-index: 1; }
.t-megamenu[aria-hidden="false"] { transform: translateY(0); }

.t-megamenu__inner {
    padding: var(--t-sp-3) 0 var(--t-sp-7);
}
.t-megamenu__primary {
    padding-top: var(--t-sp-3);
    padding-bottom: 0;
    margin-bottom: 0;
}
.t-mm-sub { margin-top: var(--t-sp-5); }
.t-megamenu__secondary { margin-top: var(--t-sp-8); margin-bottom: var(--t-sp-6); }
.t-megamenu__label { display: none; }
/* ----- Primary mega-menu (sitemap layout — grid 6 cols × 2 rows) ----- */
.t-mm-primary {
    display: grid;
    grid-template-columns:
        90px         /* HOME */
        260px        /* INDUSTRIA (2 sub-cols) */
        minmax(540px, 1fr)  /* EDILIZIA (4 sub-cols) — grows */
        130px        /* VIRTUAL TOUR */
        180px        /* SERVIZI */
        240px;       /* SETTORI */
    grid-template-rows: auto auto;
    gap: var(--t-sp-3) var(--t-sp-5);
    align-items: start;
}
.t-mm-item { display: contents; }
.t-mm-top { grid-row: 1; }
.t-mm-sub { grid-row: 2; padding-top: 0; }

/* tablet: 2-col grid */
@media (max-width: 1280px) and (min-width: 901px) {
    .t-mm-primary {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;
        gap: var(--t-sp-6);
    }
    .t-mm-item { display: block; }
    .t-mm-top, .t-mm-sub { grid-row: auto; }
    .t-mm-item--edilizia { grid-column: span 2; }
}

/* TOP buttons (HOME, INDUSTRIA pill, EDILIZIA pill, VIRTUAL TOUR, …) */
.t-mm-top {
    display: inline-block;
    font-size: .95rem;
    font-weight: var(--t-fw-bold);
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fff;
    line-height: 1.15;
    width: max-content;
    max-width: 100%;
    align-self: end;
    justify-self: start;
}
.t-mm-top--plain { padding: 0 0 8px; position: relative; }
.t-mm-top--plain.is-active::after { display: none; }
.t-mm-top--industria { background: var(--t-industria); padding: 8px 18px; }
.t-mm-top--industria:hover { background: var(--t-industria-dark); color: #fff; }
.t-mm-top--edilizia  { background: var(--t-edilizia);  padding: 8px 18px; }
.t-mm-top--edilizia:hover { background: var(--t-edilizia-dark); color: #fff; }

/* "Filtra per" caption */
.t-mm-filter {
    font-size: .72rem;
    letter-spacing: .35em;
    text-transform: none;
    font-style: normal;
    color: var(--t-mute);
    margin: var(--t-sp-3) 0 var(--t-sp-3);
}

/* Sub-category columns (Materiali / Formati / Lavorati / Accessori / Applicazioni) */
.t-mm-cats {
    display: grid;
    column-gap: var(--t-sp-4);
    row-gap: var(--t-sp-3);
    align-items: flex-start;
}
.t-mm-cats--2 { grid-template-columns: repeat(2, 1fr); }
.t-mm-cats--4 { grid-template-columns: repeat(4, 1fr); }

/* gray header bar — spans full row, contains all sub-category names */
.t-mm-cats__bar {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: inherit;
    background: #BDBDBD;
    margin-bottom: var(--t-sp-3);
}
.t-mm-cats--2 .t-mm-cats__bar { grid-template-columns: repeat(2, 1fr); }
.t-mm-cats--4 .t-mm-cats__bar { grid-template-columns: repeat(4, 1fr); }
.t-mm-cats__head {
    padding: 7px 12px;
    color: var(--t-ink);
    font-size: .7rem;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-weight: var(--t-fw-bold);
}

/* Lista voci */
.t-mm-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.t-mm-list li { line-height: 1.95; }
.t-mm-list a {
    font-size: .92rem;
    font-weight: var(--t-fw-regular);
    color: var(--t-ink);
}
.t-mm-list a:hover { color: var(--t-mute); }
.t-mm-list--spaced li { line-height: 2.1; }

.t-mm-note {
    font-size: .72rem;
    color: var(--t-mute);
    margin: var(--t-sp-1) 0 var(--t-sp-3);
    font-style: italic;
}

/* ----- Secondary menu (gray bar with header cells + columns below) ----- */
.t-mm-secondary__bar {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    background: #E5E5E5;
    color: var(--t-ink);
    margin-bottom: var(--t-sp-5);
}
.t-mm-secondary__cell {
    display: block;
    padding: 14px 18px;
    font-size: .85rem;
    font-weight: var(--t-fw-bold);
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--t-ink);
}
a.t-mm-secondary__cell:hover { color: var(--t-sector); }
.t-mm-secondary__cols {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0 var(--t-sp-5);
    padding: 0 18px;
}
.t-mm-secondary__cols > div { min-width: 0; }
.t-mm-secondary__cols .t-mm-list li { line-height: 2; }

@media (max-width: 880px) {
    .t-mm-secondary__bar  { grid-template-columns: 1fr; }
    .t-mm-secondary__cols { grid-template-columns: 1fr; padding: 0; }
    .t-mm-secondary__bar .t-mm-secondary__cell { padding: 10px 14px; border-bottom: 1px solid rgba(0,0,0,.08); }
}

/* ============================================================
   HEADER MOBILE: nascondi i menu desktop, mostra il burger
   ============================================================ */
@media (max-width: 900px) {
    .t-header__secondary,
    .t-header__lang,
    .t-header__primary { display: none; }
    .t-header__burger { display: inline-flex; margin-left: auto; }
    .t-header__top-inner { min-height: 60px; gap: 0; }
    .t-header__brand { margin-right: 0; }
    .t-header__brand img,
    .t-header__brand svg { height: 32px; }
}

/* ============================================================
   MOBILE DRAWER (<= 900px) — deve restare a fondo file
   per sovrascrivere le regole base più sopra.
   ============================================================ */
@media (max-width: 900px) {
    /* niente striscia nera in alto */
    .t-megamenu::before { display: none; }

    /* drawer: scivola da sinistra, non più overlay full-screen */
    .t-megamenu {
        right: auto;
        left: 0;
        top: 0;
        bottom: 0;
        width: 88vw;
        max-width: 360px;
        height: 100vh;
        height: 100dvh;
        box-shadow: 8px 0 24px rgba(0,0,0,.18);
        transform: translateX(-100%);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
    }
    .t-megamenu[aria-hidden="false"] { transform: translateX(0); }
    .t-megamenu__inner { padding: 0 0 var(--t-sp-7); }

    /* drawer scuro */
    .t-megamenu { background: var(--t-black); }
    .t-megamenu__inner { padding: 0; }

    /* topbar NERA (come la striscia alta del desktop) */
    .t-megamenu__topbar { background: var(--t-black); min-height: 64px; border-bottom: 1px solid rgba(255,255,255,.12); }
    .t-megamenu__close { color: #fff; margin-left: var(--t-sp-3); }

    /* language switcher dentro al drawer (a destra, accanto alla X) */
    .t-megamenu__lang { display: flex; align-items: center; gap: 2px; margin-left: auto; }
    .t-megamenu__lang-link {
        display: inline-flex;
        align-items: center;
        padding: 4px 7px;
        font-size: .78rem;
        font-weight: var(--t-fw-bold);
        letter-spacing: .04em;
        text-transform: uppercase;
        color: rgba(255,255,255,.6);
        line-height: 1;
        border-radius: 3px;
        transition: color .2s ease, background .2s ease;
    }
    .t-megamenu__lang-link.is-active { color: #fff; background: #3b3b3b; }

    /* === DUE SEZIONI con gli stessi sfondi del desktop === */
    /* primaria = BLU (come la striscia principale) */
    .t-megamenu__primary   { background: var(--t-industria); }
    /* secondaria = NERA (come la striscia alta), staccata visivamente */
    .t-megamenu__secondary { background: var(--t-black); margin-top: 0; box-shadow: inset 0 4px 8px rgba(0,0,0,.35); }

    .t-mm-primary { display: block; }

    /* riga voce: link (naviga) + bottone chevron (espande) sulla stessa riga,
       sotto-menu a tutta larghezza sotto. */
    .t-mm-item { display: flex; flex-wrap: wrap; align-items: stretch; border-bottom: 1px solid rgba(255,255,255,.14); }

    .t-mm-top,
    .t-mm-top--plain,
    .t-mm-top--industria,
    .t-mm-top--edilizia {
        flex: 1 1 auto;
        display: flex;
        align-items: center;
        width: auto;
        max-width: none;
        margin: 0;
        padding: .85rem var(--t-container-x);
        font-size: .9rem;
        color: #fff;
        background: transparent;
        line-height: 1.3;
    }
    .t-mm-top--plain.is-active::after { display: none; }
    /* niente vecchio chevron sul link: ora c'è il bottone separato */
    .t-mm-item.has-sub > .t-mm-top::after { content: none; }

    /* bottone chevron separato: espande il sotto-menu senza navigare */
    .t-mm-toggle {
        flex: 0 0 auto;
        width: 54px;
        padding: 0;
        border: 0;
        border-left: 1px solid rgba(255,255,255,.18);
        background: transparent;
        color: #fff;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
        -webkit-tap-highlight-color: transparent;
    }
    .t-mm-toggle::before { content: "+"; font-size: 1.6rem; font-weight: var(--t-fw-light); }
    .t-mm-item.is-open > .t-mm-toggle::before { content: "\2212"; }

    /* sotto-menu: collassato, a tutta larghezza */
    .t-mm-sub {
        flex: 1 1 100%;
        display: none;
        margin: 0;
        padding: var(--t-sp-2) var(--t-container-x) var(--t-sp-4);
        background: rgba(0,0,0,.20);
    }
    .t-mm-item.is-open > .t-mm-sub { display: block; }
    .t-mm-sub .t-mm-list { columns: 1; padding: 0; margin: 0; list-style: none; }
    .t-mm-sub .t-mm-list li { line-height: 1.9; break-inside: avoid; }
    .t-mm-sub .t-mm-list a { color: rgba(255,255,255,.85); font-size: .82rem; }
    .t-mm-sub .t-mm-list a:hover { color: #fff; }

    /* elementi legacy non usati dal walker mobile: nascosti per sicurezza */
    .t-mm-cats__bar, .t-mm-filter, .t-mm-secondary__bar { display: none; }
}

/* ---------- FOOTER ---------- */
.t-footer-wrap { padding: var(--t-sp-6) 0 var(--t-sp-5); }
.t-footer {
    background: var(--t-black);
    color: rgba(255,255,255,.78);
    padding: var(--t-sp-7) var(--t-sp-7);
    font-size: var(--t-fs-sm);
}
.t-footer__brand img,
.t-footer__brand svg {
    width: 160px;
    height: auto;
    opacity: .45;
    filter: grayscale(1);
}
.t-footer a { color: rgba(255,255,255,.78); }
.t-footer a:hover { color: #fff; }

.t-footer__grid {
    display: grid;
    gap: var(--t-sp-6);
    grid-template-columns: 1fr;
    align-items: start;
}
.t-footer__grid > * { min-width: 0; word-wrap: break-word; overflow-wrap: anywhere; }
@media (min-width: 820px) {
    .t-footer__grid {
        grid-template-columns: minmax(160px, auto) 1.4fr 1.3fr 1fr auto;
        gap: var(--t-sp-7);
    }
}


.t-footer__contact strong { color: #fff; font-weight: var(--t-fw-bold); display:block; margin-bottom: var(--t-sp-2); }

.t-footer__legal {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    line-height: 1.4;
}
.t-footer__legal a { color: rgba(255,255,255,.78); display: block; }
.t-footer__legal a:hover { color: #fff; }
/* quando reso da wp_nav_menu → <ul><li><a> */
.t-footer__legal ul,
.t-footer__legal .t-footer__legal-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}
.t-footer__legal li { margin: 0; }

/* "with love Pragma Nava" — centrato, sotto la fascia nera */
.t-footer__credit {
    text-align: center;
    margin: var(--t-sp-4) 0 0;
    font-size: .82rem;
    color: var(--t-mute);
    font-weight: var(--t-fw-bold);
}
.t-footer__credit a { color: inherit; }
.t-footer__credit a:hover { color: var(--t-ink); text-decoration: underline; }
.t-footer__social {
    display: flex;
    gap: var(--t-sp-3);
    align-items: center;
}
.t-footer__social a {
    width: 28px; height: 28px;
    display: inline-flex; align-items: center; justify-content: center;
    color: #fff;
}
.t-footer__social svg { width: 20px; height: 20px; fill: currentColor; }