
html,body{margin:0;padding:0}
*{box-sizing:border-box}
.sv3-body{
    margin:0!important;
    background:#fff;
    color:#121212;
    font-family:Arial,Helvetica,sans-serif;
    overflow-x:hidden;
}
.sv3-body a{text-decoration:none;color:inherit}

.sv3-header{
    height:100px;
    display:grid;
    grid-template-columns:minmax(240px,1fr) auto minmax(300px,1fr);
    align-items:center;
    gap:34px;
    padding:0 38px;
    background:#fff;
    border-bottom:1px solid #ececec;
    position:relative;
    z-index:20;
}
.admin-bar .sv3-header{margin-top:32px}

.sv3-brand{
    font-size:29px;
    line-height:1;
    font-weight:900;
    letter-spacing:-1.1px;
    white-space:nowrap;
}
.sv3-nav{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:34px;
}
.sv3-nav a{
    font-size:14px;
    font-weight:800;
    letter-spacing:.01em;
    transition:color .18s ease;
}
.sv3-nav a:hover{color:#ff4d63}

.sv3-actions{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:18px;
}
.sv3-quote{
    min-height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 24px;
    color:#fff!important;
    font-size:13px;
    font-weight:900;
    background:linear-gradient(90deg,#ff5b26,#e91e78);
    border-radius:4px;
    box-shadow:0 8px 20px rgba(239,47,100,.18);
    transition:transform .18s ease, box-shadow .18s ease;
}
.sv3-quote:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 28px rgba(239,47,100,.27);
}
.sv3-icon{
    appearance:none;
    border:0;
    background:transparent;
    color:#111;
    cursor:pointer;
    font-size:28px;
    line-height:1;
    padding:8px;
}
.sv3-menu{font-size:25px}

.sv3-panels{
    width:100%;
    min-height:calc(100vh - 100px);
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    background:#111;
}
.sv3-panel{
    position:relative;
    min-height:calc(100vh - 100px);
    background-position:center top;
    background-size:cover;
    background-repeat:no-repeat;
    overflow:hidden;
    isolation:isolate;
    transition:filter .28s ease, transform .28s ease;
    outline:none;
}
.sv3-panel + .sv3-panel{
    border-left:1px solid rgba(255,255,255,.8);
}
.sv3-aziende{background-image:url('aziende.jpg')}
.sv3-commerciali{background-image:url('commerciali.jpg')}
.sv3-social{background-image:url('social.jpg')}

.sv3-panel::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:1;
    background:rgba(255,255,255,0);
    transition:background .28s ease, box-shadow .28s ease;
    pointer-events:none;
}
.sv3-shine{
    position:absolute;
    inset:-25%;
    z-index:2;
    opacity:0;
    background:linear-gradient(115deg,
        transparent 30%,
        rgba(255,255,255,.06) 42%,
        rgba(255,255,255,.34) 50%,
        rgba(255,255,255,.06) 58%,
        transparent 70%);
    transform:translateX(-60%);
    pointer-events:none;
}

@media (hover:hover) and (pointer:fine){
    .sv3-panel:hover{
        filter:brightness(1.18) saturate(1.08);
        z-index:4;
    }
    .sv3-panel:hover::after{
        background:rgba(255,255,255,.07);
        box-shadow:inset 0 0 70px rgba(255,255,255,.22), 0 0 32px rgba(255,255,255,.20);
    }
    .sv3-panel:hover .sv3-shine{
        opacity:1;
        animation:sv3Sweep .7s ease forwards;
    }
}
.sv3-panel.is-lit,
.sv3-panel:focus-visible{
    filter:brightness(1.2) saturate(1.1);
    z-index:5;
}
.sv3-panel.is-lit::after,
.sv3-panel:focus-visible::after{
    background:rgba(255,255,255,.09);
    box-shadow:inset 0 0 80px rgba(255,255,255,.25),0 0 35px rgba(255,255,255,.22);
}
.sv3-panel.is-lit .sv3-shine{
    opacity:1;
    animation:sv3Sweep .7s ease forwards;
}
@keyframes sv3Sweep{
    from{transform:translateX(-60%)}
    to{transform:translateX(60%)}
}

@media(max-width:1100px){
    .sv3-header{
        grid-template-columns:1fr auto;
        height:84px;
        padding:0 22px;
    }
    .admin-bar .sv3-header{margin-top:32px}
    .sv3-nav{display:none}
    .sv3-brand{font-size:24px}
    .sv3-panels{min-height:calc(100vh - 84px)}
    .sv3-panel{min-height:calc(100vh - 84px)}
}
@media(max-width:700px){
    .admin-bar .sv3-header{margin-top:46px}
    .sv3-header{
        min-height:72px;
        height:auto;
        padding:14px 16px;
        gap:12px;
    }
    .sv3-brand{
        font-size:20px;
        letter-spacing:-.6px;
    }
    .sv3-actions{gap:6px}
    .sv3-quote{
        min-height:42px;
        padding:0 12px;
        font-size:10px;
    }
    .sv3-icon{font-size:22px;padding:6px}
    .sv3-panels{
        grid-template-columns:1fr;
        min-height:0;
    }
    .sv3-panel{
        min-height:68vw;
        background-size:cover;
        background-position:center center;
        border-left:0!important;
        border-top:1px solid rgba(255,255,255,.9);
    }
}
@media(max-width:430px){
    .sv3-brand{font-size:18px}
    .sv3-quote{display:none}
    .sv3-panel{min-height:82vw}
}
