:root{
  --fondo:#0C0D10; --pannello:rgba(18,19,23,.78); --pannello-2:rgba(14,15,18,.86);
  --oro:#9BE818; --oro-vivo:#CFFF70; --oro-bordo:rgba(155,232,24,.5);
  --carta:#F2EFE6; --testo:#D2CDBF; --grigio:#A8A294;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden}
body{
  background:var(--fondo); color:var(--testo);
  font-family:'Montserrat',-apple-system,'Helvetica Neue',Arial,sans-serif;
  font-weight:400; line-height:1.7; -webkit-font-smoothing:antialiased;
}
.sfondo{position:fixed;top:0;left:0;right:0;bottom:0;z-index:0;
  background:#0C0D10 url('img/velluto.jpg') center top no-repeat;background-size:cover}
.sotto-pagina .sfondo{background-image:url('../img/velluto.jpg')}
header,main,footer{position:relative;z-index:1}
img{max-width:100%;display:block}
a{color:var(--oro-vivo);text-decoration:none}
a:focus-visible{outline:2px solid var(--oro-vivo);outline-offset:3px}
.wrap{max-width:1120px;margin:0 auto;padding:0 26px}
.sez{padding:96px 0}
.centro{text-align:center}
.eyebrow{font-size:13px;letter-spacing:.3em;text-transform:uppercase;color:var(--oro);font-weight:600;margin-bottom:16px}
h1,h2{font-weight:700;letter-spacing:-.01em;color:var(--carta)}
h1{font-size:52px;line-height:1.1;margin-bottom:18px}
h2{font-size:42px;line-height:1.12;margin-bottom:16px}
.oro-testo{color:var(--oro);
  background:-webkit-linear-gradient(top,#E9FF9A,#9BE818 58%,#5F9E10);
  background:linear-gradient(180deg,#E9FF9A,#9BE818 58%,#5F9E10);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  text-shadow:0 2px 3px rgba(0,0,0,.45)}
.sotto-titolo{max-width:660px;font-size:17px}
.centro .sotto-titolo{margin:0 auto}

/* topbar */
.topbar{position:-webkit-sticky;position:sticky;top:0;z-index:20;
  background:rgba(244,242,235,.94);border-bottom:1px solid rgba(30,35,25,.14)}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .topbar{background:rgba(244,242,235,.72);
    -webkit-backdrop-filter:saturate(160%) blur(18px);backdrop-filter:saturate(160%) blur(18px)}
}
.topbar .wrap{display:grid;grid-template-columns:auto 1fr;align-items:center;padding-top:13px;padding-bottom:13px}
.marchio{display:grid;grid-template-columns:auto auto;align-items:center;gap:11px}
.marchio img{height:31px;width:auto}
.marchio span{font-size:16px;font-weight:600;letter-spacing:.3em;color:#262B1F}
nav{justify-self:end;display:grid;grid-auto-flow:column;gap:26px;align-items:center}
.topbar nav a{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:#3A4030;padding:6px 0;border-bottom:2px solid transparent}
.topbar nav a:hover{color:#1F2418}
.topbar nav a.attiva{color:#1F2418;border-bottom-color:#4A5A28}
.topbar nav a.pill{border:none;border-radius:99px;padding:10px 18px;color:#111A02;font-weight:700;
  background:-webkit-linear-gradient(top,#D4FF66,#9BE818);background:linear-gradient(180deg,#D4FF66,#9BE818)}
.topbar nav a.pill:hover{background:#D4FF66}

/* bottoni */
.cta{display:inline-block;color:#111A02;
  background:-webkit-linear-gradient(top,#D4FF66,#9BE818);
  background:linear-gradient(180deg,#D4FF66,#9BE818);
  font-weight:700;font-size:14px;letter-spacing:.1em;text-transform:uppercase;
  padding:17px 38px;border-radius:99px;
  box-shadow:inset 0 1px 0 rgba(243,255,214,.7),0 14px 30px rgba(0,0,0,.45);
  -webkit-transition:-webkit-transform .3s,box-shadow .3s;transition:transform .3s,box-shadow .3s}
.cta:hover{-webkit-transform:translateY(-3px);transform:translateY(-3px);
  box-shadow:inset 0 1px 0 rgba(243,255,214,.7),0 20px 40px rgba(0,0,0,.5)}
.cta-secondario{display:inline-block;color:var(--oro-vivo);border:1px solid var(--oro-bordo);
  font-weight:600;font-size:14px;letter-spacing:.1em;text-transform:uppercase;
  padding:16px 34px;border-radius:99px;-webkit-transition:all .3s;transition:all .3s}
.cta-secondario:hover{border-color:var(--oro-vivo);background:rgba(155,232,24,.08)}

/* pannelli */
.rilievo{background:var(--pannello);border:1px solid var(--oro-bordo);border-radius:18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 26px 54px rgba(0,0,0,.45)}

/* hero prospettico */
.hero-pro{position:relative;overflow:visible;padding:110px 0 170px}
.hero-wiz{position:absolute;right:2%;bottom:-42px;top:auto;height:88%;max-height:640px;width:auto;z-index:1;-webkit-filter:drop-shadow(0 24px 46px rgba(0,0,0,.55));filter:drop-shadow(0 24px 46px rgba(0,0,0,.55))}
.hero-contenuto{position:relative;z-index:2;max-width:600px}
.logo-eopono{width:92%;max-width:520px;height:auto;margin-bottom:24px;
  -webkit-filter:drop-shadow(0 10px 22px rgba(0,0,0,.5));filter:drop-shadow(0 10px 22px rgba(0,0,0,.5))}
.hero-pro .tag{font-size:27px;font-weight:500;color:var(--carta);margin-bottom:18px}
.hero-pro p.sotto{font-size:17.5px;margin-bottom:36px;max-width:520px}
.gruppo-cta{display:grid;grid-auto-flow:column;justify-content:start;gap:16px}

/* striscia sovrapposta */
.sovrapposta{position:relative;z-index:3;margin-top:-92px}

/* griglie e card */
.griglia{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:20px}
.card{overflow:hidden;-webkit-transition:-webkit-transform .35s,box-shadow .35s,border-color .35s;
  transition:transform .35s,box-shadow .35s,border-color .35s}
.card:hover{-webkit-transform:translateY(-8px);transform:translateY(-8px);
  border-color:rgba(212,255,102,.75);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 36px 70px rgba(0,0,0,.55)}
.card .foto{background:#f2f1ee;border-bottom:1px solid var(--oro-bordo)}
.card .info{padding:22px 16px 24px;text-align:center}
.badge-mm{width:58px;height:58px;margin:0 auto;border:1.5px solid var(--oro);border-radius:50%;
  color:var(--oro-vivo);text-align:center;padding-top:9px}
.badge-mm b{display:block;font-size:21px;font-weight:700;line-height:1}
.badge-mm i{display:block;font-style:normal;font-size:9.5px;letter-spacing:.18em;font-weight:600;margin-top:2px;color:var(--oro)}
.card .pezzi{display:block;margin-top:13px;font-size:12.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--carta)}
.card ul.specs{list-style:none;margin-top:14px;text-align:left;padding:0 6px}
.card ul.specs li{font-size:13px;color:var(--testo);padding:6px 0;border-top:1px solid rgba(155,232,24,.16)}
.card.ghost{display:grid;align-content:center;justify-items:center;text-align:center;padding:34px 18px;min-height:300px;background:var(--pannello-2)}
.badge-doppio{display:grid;grid-template-columns:auto auto;gap:12px;justify-content:center}
.card.ghost .presto{margin-top:18px;font-size:12.5px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--oro-vivo)}
.card.ghost p{margin-top:10px;font-size:13.5px;color:var(--grigio)}

/* due colonne */
.due-col{display:grid;grid-template-columns:1fr 1.12fr;gap:52px;align-items:center;text-align:left}
.quadro{overflow:hidden;background:#f2f1ee}
.punto{padding:24px 0;border-bottom:1px solid rgba(155,232,24,.22)}
.punto:last-child{border-bottom:none}
.punto h3{font-size:19px;font-weight:600;color:var(--oro-vivo);margin-bottom:8px}
.punto p{font-size:15.5px}
.materia{display:grid;grid-template-columns:300px 1fr;gap:52px;align-items:center;text-align:left}

/* banda cta */
.banda{padding:64px 44px;text-align:center;background:var(--pannello-2)}
.banda p{max-width:620px;margin:0 auto 32px;font-size:17px}

/* form */
form.modulo{padding:48px 44px;text-align:left}
.campi{display:grid;grid-template-columns:1fr 1fr;gap:20px 24px}
.campo{display:block}
.campo.largo{grid-column:1 / -1}
.campo span{display:block;font-size:11.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--oro);margin-bottom:8px}
.campo span em{color:var(--oro-vivo);font-style:normal}
.campo input,.campo select,.campo textarea{
  width:100%;background:rgba(9,10,12,.66);border:1px solid var(--oro-bordo);border-radius:10px;
  color:var(--carta);font-family:inherit;font-size:15px;padding:13px 14px;
  -webkit-transition:border-color .25s,box-shadow .25s;transition:border-color .25s,box-shadow .25s}
.campo textarea{min-height:110px;resize:vertical}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  outline:none;border-color:var(--oro-vivo);box-shadow:0 0 0 3px rgba(155,232,24,.18)}
.campo select{-webkit-appearance:none;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239BE818' stroke-width='2' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center}
.modulo .invio{margin-top:30px;text-align:center}
.modulo .privacy{margin-top:16px;font-size:12.5px;color:var(--grigio);text-align:center}
.nascosto{display:none}

/* footer */
footer{padding:50px 0 60px;border-top:1px solid rgba(155,232,24,.22);background:rgba(10,11,13,.55)}
footer .colonne{display:grid;grid-template-columns:1fr auto;gap:30px;margin-bottom:26px}
footer nav{display:grid;grid-auto-flow:column;gap:22px}
footer nav a{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--testo)}
footer nav a:hover{color:var(--oro-vivo)}
footer .contatti a{margin-right:22px;font-weight:500}
footer .legale{font-size:12.5px;color:var(--grigio);line-height:2}

/* animazioni scroll */
.reveal{opacity:0;-webkit-transform:translateY(28px);transform:translateY(28px);
  -webkit-transition:opacity .75s ease,-webkit-transform .75s ease;
  transition:opacity .75s ease,transform .75s ease}
.reveal.visibile{opacity:1;-webkit-transform:none;transform:none}
.r2{-webkit-transition-delay:.12s;transition-delay:.12s}
.r3{-webkit-transition-delay:.24s;transition-delay:.24s}
.r4{-webkit-transition-delay:.36s;transition-delay:.36s}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;-webkit-transform:none;transform:none;-webkit-transition:none;transition:none}
  .card,.cta{-webkit-transition:none;transition:none}
}

/* responsive */
@media (max-width:860px){
  .sez{padding:64px 0}
  h1{font-size:36px} h2{font-size:29px}
  .topbar .wrap{grid-template-columns:1fr}
  .marchio{justify-content:start}
  nav{justify-self:start;margin-top:10px;gap:16px;overflow-x:auto;max-width:100%}
  .hero-pro{padding:64px 0 120px}
  .hero-wiz{right:-24%;bottom:-24px;height:60%;opacity:.32}
  .hero-contenuto{max-width:100%}
  .gruppo-cta{grid-auto-flow:row;justify-items:start}
  .sovrapposta{margin-top:-70px}
  .due-col{grid-template-columns:1fr;gap:30px}
  .materia{grid-template-columns:1fr;gap:30px}
  .materia .quadro{max-width:320px}
  .campi{grid-template-columns:1fr}
  footer .colonne{grid-template-columns:1fr}
  .banda{padding:44px 22px}
}

/* banner A+ */
.banner-a{max-width:900px;margin:0 auto;border-radius:18px;overflow:hidden;
  border:1px solid var(--oro-bordo);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 26px 54px rgba(0,0,0,.45)}
.banner-a img{width:100%;height:auto;display:block}
.banner-a + .banner-a{margin-top:26px}