html, body {
scroll-behavior: smooth;
font-family: "Manrope", sans-serif;
font-optical-sizing: auto;
font-weight: 300;
font-style: normal;
color:#555;
}

/* FONTS */

/* Anybody - Variable Font */
@font-face {
    font-family: 'Anybody';
    src: url('../fonts/Anybody-VariableFont_wdth,wght.ttf') format('truetype');
    font-weight: 100 900;
    font-stretch: 50% 150%; /* Anybody supporta anche larghezza variabile */
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Anybody';
    src: url('../fonts/Anybody-Italic-VariableFont_wdth,wght.ttf') format('truetype');
    font-weight: 100 900;
    font-stretch: 50% 150%;
    font-style: italic;
    font-display: swap;
}

/* Manrope - Variable Font */
@font-face {
    font-family: 'Manrope';
    src: url('../fonts/Manrope-VariableFont_wght.ttf') format('truetype');
    font-weight: 200 800; /* Manrope va da 200 a 800 */
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Material Symbols Outlined';
    src: url('../fonts/MaterialSymbolsOutlined.ttf') format('truetype');
    font-weight: 100 700;
    font-style: normal;
    font-display: swap;
}

.material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
    font-weight: 100;
    font-style: normal;
    font-size: 2rem;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

.grecaptcha-badge { 
visibility: hidden; 
}

hr {
margin-top:2rem;
padding-top:2rem;
border-top:1px solid rgba(0,126,183,1);
}

hr .bianco {
margin-top:1rem;
padding-top:1rem;
border-top:1px solid #fff;
}

.mini {
margin-top:2rem;
padding-top:2rem;
border-top:2px solid rgba(233,80,14,.5);
}

.icon {
color:rgba(233, 80, 14, 1);
margin-right:.5rem;
}

a, a:hover {
color:inherit;
text-decoration:none;
}

.contenuto a {
color:rgba(0,126,183,1);
text-decoration:none;
}

img {
width:100%;
height:auto;
}

b, strong, .bold {
font-weight:600;
}

/* TIPOGRAFIA */

h1,h2,h3,h4,h5,h6 {
font-family: "Anybody", sans-serif;
line-height:1;
}

h1 {
font-size:5rem;
}
.interna h1 {
font-size:4rem;
}
h2 {
font-size:3.5rem;
}
h3 {
font-size:1.5rem;
line-height:1.5;
}

.contenuto h2 {
font-size:2rem;
line-height:1.1;
}
h4 {
font-size:1.15rem
}

.grande {
font-size:1.25rem;
}

.medio {
font-size:1.25rem;
}

/* PESI */

.lite {
font-weight:300;
}

.medium {
font-weight:500;
}

.heavy {
font-weight:700;
}

.indice {
font-size:5rem;
font-weight:800;
line-height:.8;
}

.claimhome {
font-size:2.5rem;
line-height:1;
}

.legenda {
font-size:.8rem;
font-weight:600;
}

@media only screen and (max-width: 768px) {
h1 {font-size:3rem}
h2 {font-size:2.5rem}
h3 {font-size:2rem}
.imgback {height:50vh;padding:20vh 0}
}

/* COLORI */

.dls {
color:rgba(0,126,183,1);
}
.green {
color:teal;
}

.bianco {
color:#fff;
}
.biancobg {
background-color:#fff;
}

.chiaro {
color:#eee;
}
.chiarobg {
background-color:#fafafa;
}

.scuro {
color:#555;
}
.scurobg {
background-color:#555;
}

/* Navigation */

.navbar-collapse {
    display: block !important;
}
.navbar-header {
    display: none !important;
}

nav {
font-family: "Anybody", sans-serif;
}

.mega-sub-menu {
background: rgba(0,126,183,1)!important;
}

.mega-sub-menu img {
min-height: 15rem;
width: auto;
object-fit: cover;
}

.logo img {
height:5rem;
}

.name {
font-weight:800;
font-size:1.25rem;
line-height:1;
padding-top:.5rem;
}

/* Header */

header {
height:85vh;
position: relative;
width:100%;
}

header .container {
position: relative;
z-index: 2;
}

.bread {
font-size:.9rem;
border-bottom:1px solid #fff;
margin-bottom:2rem;
padding-bottom:1rem;
}

/* Heroes */

.herohome {
position:relative;
height:70vh;
border-radius:1rem;
width:100%;
}

/* CONTENT */

.sezione {
position:relative;
padding: 15vh 0;
}

.centrale h3 {
font-size:1.5rem;
line-height:1.2;
border-top:1px solid rgba(0,126,183,1);
padding-top:2rem;
margin:2rem 0;
width:50%;
}


.centrale h4 {
font-size:1.25rem;
line-height:1.2;
color: rgba(0,126,183,1);
padding-top:1rem;
margin:1rem 0;
width:50%;
}

.centrale img {
margin:2rem 0;
}

.laterale h2 {
font-size:2.5rem;
}

.contenuto h1,h2,h3 {
margin-bottom:2rem;
}

.immagine {
height:20vh;
margin:1rem 0;
}

/* Caratteristiche */

.caratteristiche {
padding:0 3rem;
border-left: 1px solid rgba(0,126,183,1);
}

.caratteristiche ul {
padding:0;
list-style: none;
}

.caratteristiche ul li {
padding:1rem 0;
margin:.5rem 0;
border-bottom:1px solid #eee;
position: relative;
font-weight:500;
}

/* TABELLA */

.tabella-acf {
width: 100%;
border-collapse: collapse;
}

.tabella-acf th,
.tabella-acf td {
padding: 1rem;
text-align: left;
}

.tabella-acf tr {
border-top: 1px solid rgba(0,126,183,.5);
border-bottom: 1px solid rgba(0,126,183,.5);
transition: 0.25s;
}

.tabella-acf tr:hover {
background-color:rgba(255,255,255,.5);
}

.tabella-acf td:first-child {
font-weight: bold;
}

/* MORE BIANCO */

.morebianco, .morebianco:hover {
font-family: "Anybody", sans-serif;
padding:.5rem 1rem;
transition: 0.25s;
color:#555;
font-weight:400;
font-size:1rem;
border:1px solid #555;
border-radius:0;
}

.morebianco span {
cursor: pointer;
display: inline-block;
position: relative;
transition: 0.25s;
}

.morebianco span:after {
font-family: 'Material Symbols Outlined';
content: '\e5c8';
position: absolute;
opacity: 0;
top: 0;
right: 0;
transition: 0.25s;
}

.morebianco:hover span {
left:0;
padding-right: 2rem;
color:#555;
}

.morebianco:hover span:after {
opacity: 1;
right: 0;
color:#555;
}

.morebianco:hover span:before {
opacity: 0;
right: 0;
color:#555;
}

/* MORE NEGATIVO */

.moreneg, .moreneg:hover {
font-family: "Anybody", sans-serif;
padding:.5rem 1rem;
transition: 0.25s;
color:#fff;
font-weight:400;
font-size:1rem;
border:1px solid #fff;
border-radius:0;
}

.moreneg span {
cursor: pointer;
display: inline-block;
position: relative;
transition: 0.25s;
}

.moreneg span:after {
font-family: 'Material Symbols Outlined';
content: '\e5c8';
position: absolute;
opacity: 0;
top: 0;
right: 0;
transition: 0.25s;
}

.moreneg:hover span {
left:0;
padding-right: 2rem;
color:#fff;
}

.moreneg:hover span:after {
opacity: 1;
right: 0;
color:#fff;
}

.moreneg:hover span:before {
opacity: 0;
right: 0;
color:#fff;
}

/* MORE PRODOTTI */

.moreprodotti, .moreprodotti:hover {
font-family: "Anybody", sans-serif;
padding:.5rem 1rem;
transition: 0.25s;
color:#555;
font-weight:400;
font-size:1rem;
border:1px solid #555;
border-radius:0;
}

.moreprodotti span {
cursor: pointer;
display: inline-block;
position: relative;
transition: 0.25s;
}

.moreprodotti span:after {
font-family: 'Material Symbols Outlined';
content: '\f1e4';
position: absolute;
opacity: 0;
top: 0;
right: 0;
transition: 0.25s;
}

.moreprodotti:hover span {
left:0;
padding-right: 2rem;
color:#555;
}

.moreprodotti:hover span:after {
opacity: 1;
right: 0;
color:#555;
}

.moreprodotti:hover span:before {
opacity: 0;
right: 0;
color:#555;
}

/* EFFETTO */

.image-container {
height: 50vh;
overflow: hidden;
position: relative;
}

.image-container::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-image: inherit;
background-size: cover;
background-position: center;
transition: transform 0.3s ease;
}

.image-container:hover::before {
transform: scale(1.1);
}

/* pennellata */

.brush {
position: relative;
display: inline-block;
z-index:999;
}

.brush::after {
content: '';
position: absolute;
left: -2%;
bottom: 0;
width: 104%;
height: 50%;
background: linear-gradient(90deg,rgba(0,126,183,.5) 0%, rgba(0,126,183,.1) 100%);
opacity: 1;
z-index: -1;
transform: rotate(-1deg);
}

/* pennellata su hover */

.effetto .brushed {
position: relative;
display: inline-block;
}

.effetto .brushed::after {
content: '';
position: absolute;
left: -20%;
bottom: 20%;
width: 125%;
height: 50%;
background: linear-gradient(90deg, rgba(0,126,183,.25) 0%, rgba(0,126,183,.1) 100%);
z-index: -1;
transform: rotate(1deg);
transform-origin: left center;
clip-path: inset(0 100% 0 0); /* Nasconde completamente il tratto */
transition: clip-path 0.2s cubic-bezier(0.65, 0, 0.35, 1);
z-index:999;
}

.effetto:hover .brushed::after {
clip-path: inset(0 0 0 0); /* Rivela il tratto completamente */
}

/* FOOT */

footer {
background-color:rgba(0,126,183,1);
padding:10vh 0;
position:relative;
color:#fff;
line-height:1.2;
}