/* Collezione Premier. Linee guida del brand: rosso #A41414 solo per accenti, nero, bianco, #2C2C2C, #E5E5E5;
   Inter per i titoli, Work Sans per i testi. Tutto sotto #ecmcoll: nessuna regola tocca il resto del sito. */

@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;src:url('../fonts/Inter-var.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Work Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url('../fonts/WorkSans-var.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

#ecmcoll{
  --ec-red:#A41414; --ec-black:#000; --ec-white:#fff; --ec-dark:#2C2C2C; --ec-light:#E5E5E5;
  --ec-muted:#6b6b6b; --ec-pad:clamp(16px,4vw,60px);
  --ec-head:'Inter',Arial,sans-serif; --ec-body:'Work Sans',Arial,sans-serif;
  font-family:var(--ec-body); color:var(--ec-black); -webkit-font-smoothing:antialiased;
}
#ecmcoll *,#ecmcoll *::before,#ecmcoll *::after{box-sizing:border-box}
#ecmcoll a{color:inherit;text-decoration:none}
#ecmcoll h1,#ecmcoll h2,#ecmcoll h3{font-family:var(--ec-head);color:inherit;margin:0}
#ecmcoll .is-hidden{display:none!important}

/* sezioni a tutta larghezza anche dentro il contenitore del tema */
#ecmcoll .ecmcoll-bleed{width:calc(100vw - var(--ecmcoll-sbw,0px));margin-left:calc(50% - 50vw + var(--ecmcoll-sbw,0px) / 2)}

/* barra di anteprima (solo finché la pagina non è pubblicata) */
#ecmcoll .ecmcoll-previewbar{background:var(--ec-black);color:#cfcfcf;font:500 12px/1.4 var(--ec-body);letter-spacing:.08em;
  text-transform:uppercase;text-align:center;padding:8px var(--ec-pad)}
#ecmcoll .ecmcoll-previewbar__dbg{color:#777;margin-left:10px;text-transform:none;letter-spacing:0}

/* hero */
#ecmcoll .ecmcoll-hero{background:var(--ec-dark);color:var(--ec-white);overflow:hidden}
#ecmcoll .ecmcoll-hero__inner{max-width:1440px;margin:0 auto;padding:clamp(36px,5vw,64px) var(--ec-pad);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(24px,4vw,56px);align-items:center}
#ecmcoll .ecmcoll-kicker{font:500 12px var(--ec-body);letter-spacing:.3em;text-transform:uppercase;color:#a9a9a9;margin:0 0 18px}
#ecmcoll .ecmcoll-hero__title{font-weight:800;font-size:clamp(40px,5.6vw,72px);line-height:.95;letter-spacing:-.02em;text-transform:uppercase;margin-bottom:20px}
#ecmcoll .ecmcoll-hero__lead{font-size:17px;line-height:1.55;color:#d6d6d6;max-width:30em;margin:0 0 28px}
#ecmcoll .ecmcoll-stats{display:flex;gap:clamp(20px,3vw,40px);margin:0;flex-wrap:wrap}
#ecmcoll .ecmcoll-stats div{display:flex;flex-direction:column-reverse}
#ecmcoll .ecmcoll-stats dd{font:700 clamp(24px,2.6vw,34px)/1 var(--ec-head);margin:0}
#ecmcoll .ecmcoll-stats dt{font:500 11px var(--ec-body);letter-spacing:.2em;text-transform:uppercase;color:#a9a9a9;margin-top:6px}
#ecmcoll .ecmcoll-stats div:first-child dd{color:var(--ec-white)}

/* carosello a ventaglio (tipo Cover Flow): la card al centro è più grande e sollevata, le altre scalano dietro.
   Le posizioni le calcola il JS (--d distanza col segno, --a distanza assoluta); senza JS le card restano in fila. */
#ecmcoll .ecmcoll-flow{min-width:0;display:flex;flex-direction:column;align-items:center}
#ecmcoll .ecmcoll-flow__stage{display:flex;gap:12px;overflow-x:auto;width:100%;padding:8px 0}
#ecmcoll .ecmcoll-flow__card{flex:0 0 160px;display:block;position:relative;background:var(--ec-white);border-radius:10px;overflow:hidden;
  box-shadow:0 18px 40px rgba(0,0,0,.45)}
#ecmcoll .ecmcoll-flow__card img{width:100%;height:auto;aspect-ratio:452/584;object-fit:contain;display:block}
#ecmcoll .ecmcoll-flow__card .ecmcoll-badge-n{position:absolute;top:10px;left:10px}
#ecmcoll .ecmcoll-flow.is-flow .ecmcoll-flow__stage{position:relative;display:block;overflow:visible;padding:0;
  height:calc(var(--ecmcoll-card-w) * 1.292 + 48px)}
#ecmcoll .ecmcoll-flow.is-flow{--ecmcoll-card-w:clamp(150px,15vw,230px)}
#ecmcoll .ecmcoll-flow.is-flow .ecmcoll-flow__card{position:absolute;left:50%;top:50%;width:var(--ecmcoll-card-w);
  transform:translate(-50%,-50%) translateX(calc(var(--d,0) * 64%)) translateY(calc((2 - var(--a,0)) * -9px)) scale(calc(1 - var(--a,0) * .15));
  z-index:calc(10 - var(--a,0));opacity:1;filter:brightness(calc(1 - var(--a,0) * .12));
  transition:transform .7s cubic-bezier(.2,.8,.2,1),opacity .5s,filter .5s,box-shadow .5s;cursor:pointer}
#ecmcoll .ecmcoll-flow.is-flow .ecmcoll-flow__card.is-far{opacity:0;pointer-events:none}
#ecmcoll .ecmcoll-flow.is-flow .ecmcoll-flow__card.is-center{box-shadow:0 28px 60px rgba(0,0,0,.55)}
#ecmcoll .ecmcoll-flow.is-flow .ecmcoll-flow__card:not(.is-center) .ecmcoll-badge-n{opacity:.0}
#ecmcoll .ecmcoll-flow__card:focus-visible{outline:2px solid var(--ec-white);outline-offset:3px}
#ecmcoll .ecmcoll-flow__cap{display:flex;flex-direction:column;align-items:center;gap:2px;margin-top:18px;min-height:64px;text-align:center;transition:opacity .3s}
#ecmcoll .ecmcoll-flow__cap.is-fading{opacity:0}
#ecmcoll .ecmcoll-flow__fam{font:500 10.5px var(--ec-body);letter-spacing:.24em;text-transform:uppercase;color:#e05a5a}
#ecmcoll .ecmcoll-flow__name{font:800 22px/1.1 var(--ec-head);text-transform:uppercase;color:var(--ec-white)}
#ecmcoll .ecmcoll-flow__graf{font:500 13px var(--ec-body);color:#bdbdbd}
#ecmcoll .ecmcoll-flow__nav{display:flex;align-items:center;gap:16px;margin-top:14px}
#ecmcoll .ecmcoll-flow__btn{width:38px;height:38px;border:1px solid #5a5a5a;border-radius:50%;background:transparent;color:var(--ec-white);font-size:16px;cursor:pointer}
#ecmcoll .ecmcoll-flow__btn:hover,#ecmcoll .ecmcoll-flow__btn:focus-visible{border-color:var(--ec-white)}
#ecmcoll .ecmcoll-flow__dots{display:flex;gap:6px}
#ecmcoll .ecmcoll-flow__dots i{width:6px;height:6px;border-radius:50%;background:#5a5a5a;transition:background .3s,width .3s}
#ecmcoll .ecmcoll-flow__dots i.is-on{background:var(--ec-white);width:18px;border-radius:3px}

/* badge */
#ecmcoll .ecmcoll-badge-n{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 5px;
  background:var(--ec-red);color:var(--ec-white);font:800 12px/1 var(--ec-head);letter-spacing:0;vertical-align:middle}
#ecmcoll .ecmcoll-card__ph .ecmcoll-badge-n{position:absolute;top:8px;left:8px}
#ecmcoll .ecmcoll-model__name .ecmcoll-badge-n{font-size:12px;position:relative;top:-3px}
#ecmcoll .ecmcoll-badge-carbon{position:absolute;top:8px;right:8px;background:var(--ec-black);color:var(--ec-white);
  font:600 10px var(--ec-body);letter-spacing:.14em;text-transform:uppercase;padding:4px 7px}

/* barra filtri */
#ecmcoll .ecmcoll-bar{position:sticky;top:var(--ecmcoll-sticky-top,0px);z-index:20;background:var(--ec-white);border-bottom:1px solid var(--ec-light)}
#ecmcoll .ecmcoll-bar__inner{max-width:1440px;margin:0 auto;padding:12px var(--ec-pad);display:flex;align-items:center;gap:16px;flex-wrap:wrap}
#ecmcoll .ecmcoll-tabs{display:flex;border:1px solid var(--ec-black);flex-shrink:0}
#ecmcoll .ecmcoll-tabs button{font:600 12px var(--ec-body);letter-spacing:.12em;text-transform:uppercase;padding:10px 16px;border:0;background:var(--ec-white);color:var(--ec-black);cursor:pointer;white-space:nowrap}
#ecmcoll .ecmcoll-tabs button.is-on{background:var(--ec-black);color:var(--ec-white)}
#ecmcoll .ecmcoll-chips{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
#ecmcoll .ecmcoll-chips button{font:500 13px var(--ec-body);padding:7px 14px;border:1px solid var(--ec-light);background:var(--ec-white);color:var(--ec-black);border-radius:40px;cursor:pointer;white-space:nowrap}
#ecmcoll .ecmcoll-chips button:hover{border-color:var(--ec-black)}
#ecmcoll .ecmcoll-chips button.is-on{border-color:var(--ec-red);color:var(--ec-red)}
#ecmcoll .ecmcoll-chips__sep{width:1px;height:22px;background:var(--ec-light);margin:0 4px}
#ecmcoll .ecmcoll-search{margin-left:auto;display:flex;align-items:center;gap:14px}
#ecmcoll .ecmcoll-search input{font:14px var(--ec-body);padding:9px 12px;border:1px solid var(--ec-light);width:210px;border-radius:0}
#ecmcoll .ecmcoll-search input:focus{outline:none;border-color:var(--ec-black)}
#ecmcoll .ecmcoll-count{font:500 11.5px var(--ec-body);letter-spacing:.12em;text-transform:uppercase;color:var(--ec-muted);white-space:nowrap}

/* corpo */
#ecmcoll .ecmcoll-body{max-width:1440px;margin:0 auto;padding:0 var(--ec-pad) 48px}
#ecmcoll .ecmcoll-line{padding-top:40px}
#ecmcoll .ecmcoll-line__head{display:flex;align-items:baseline;gap:22px;border-bottom:2px solid var(--ec-black);padding-bottom:12px;margin-bottom:6px}
#ecmcoll .ecmcoll-line__head h2{font-weight:800;font-size:clamp(26px,3vw,36px);text-transform:uppercase;letter-spacing:-.01em}
#ecmcoll .ecmcoll-line__head p{margin:0;color:var(--ec-muted);font-size:15px}
#ecmcoll .ecmcoll-fam__title{font:600 12px var(--ec-body);letter-spacing:.34em;text-transform:uppercase;color:var(--ec-red);margin:36px 0 0}
#ecmcoll .ecmcoll-model{padding:22px 0 28px;border-bottom:1px solid var(--ec-light)}
#ecmcoll .ecmcoll-model__head{display:flex;align-items:flex-end;gap:18px;margin-bottom:16px}
#ecmcoll .ecmcoll-model__name{font-weight:800;font-size:clamp(20px,2vw,26px);text-transform:uppercase;letter-spacing:.01em}
#ecmcoll .ecmcoll-model__meta{margin:4px 0 0;color:var(--ec-muted);font-size:14px}
#ecmcoll .ecmcoll-model__link{margin-left:auto;font:600 12px var(--ec-body);letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid var(--ec-black);padding-bottom:2px;white-space:nowrap}
#ecmcoll .ecmcoll-model__link:hover{color:var(--ec-red);border-color:var(--ec-red)}

/* griglia e schede */
#ecmcoll .ecmcoll-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:14px}
#ecmcoll .ecmcoll-card{display:flex;flex-direction:column;border:1px solid var(--ec-light);background:var(--ec-white);position:relative;transition:border-color .2s,box-shadow .2s,transform .2s}
#ecmcoll .ecmcoll-card:hover,#ecmcoll .ecmcoll-card:focus-visible{border-color:var(--ec-black);box-shadow:0 10px 26px rgba(0,0,0,.08);transform:translateY(-2px);outline:none}
#ecmcoll .ecmcoll-card__ph{position:relative;display:block;aspect-ratio:236/305;background:var(--ec-white);overflow:hidden}
#ecmcoll .ecmcoll-card__ph img{width:100%;height:100%;object-fit:contain;display:block}
#ecmcoll .ecmcoll-card__cap{display:flex;flex-direction:column;gap:2px;padding:10px 12px 4px}
#ecmcoll .ecmcoll-card__model{font:500 10.5px var(--ec-body);letter-spacing:.2em;text-transform:uppercase;color:var(--ec-muted)}
#ecmcoll .ecmcoll-card__graf{font:700 15px/1.2 var(--ec-head);text-transform:uppercase}
#ecmcoll .ecmcoll-card__price{font-size:13px;font-weight:600;color:#2C2C2C;margin-top:2px}
#ecmcoll .ecmcoll-card.is-carbon .ecmcoll-card__price{color:#d9d9d9}
#ecmcoll .ecmcoll-card__go{font:500 11.5px var(--ec-body);letter-spacing:.06em;color:var(--ec-red);padding:4px 12px 12px;opacity:0;transition:opacity .2s;margin-top:auto}
#ecmcoll .ecmcoll-card:hover .ecmcoll-card__go,#ecmcoll .ecmcoll-card:focus-visible .ecmcoll-card__go{opacity:1}
#ecmcoll .ecmcoll-card.is-carbon{background:#161616;border-color:#161616;color:var(--ec-white)}
#ecmcoll .ecmcoll-card.is-carbon .ecmcoll-card__model{color:#a0a0a0}
#ecmcoll .ecmcoll-card.is-carbon .ecmcoll-card__go{color:#ff8a8a}
#ecmcoll .ecmcoll-card.is-carbon:hover{border-color:var(--ec-red)}
#ecmcoll .ecmcoll-noimg{position:absolute;inset:auto 8px 8px 8px;background:#fff3cd;color:#6b5100;font-size:11px;padding:4px 6px;text-align:center}
#ecmcoll .ecmcoll-empty{padding:40px 0;color:var(--ec-muted);text-align:center}

/* mobile */
@media (max-width:991px){
  #ecmcoll .ecmcoll-hero__inner{grid-template-columns:1fr}
}
@media (max-width:767px){
  #ecmcoll .ecmcoll-hero__lead{font-size:15px}
  #ecmcoll .ecmcoll-flow.is-flow{--ecmcoll-card-w:36vw}
  #ecmcoll .ecmcoll-flow__name{font-size:19px}
  #ecmcoll .ecmcoll-bar__inner{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;gap:10px;padding:10px 16px}
  #ecmcoll .ecmcoll-bar__inner::-webkit-scrollbar{display:none}
  #ecmcoll .ecmcoll-chips{flex-wrap:nowrap}
  #ecmcoll .ecmcoll-search{margin-left:0;flex-shrink:0}
  #ecmcoll .ecmcoll-search input{width:160px}
  #ecmcoll .ecmcoll-line__head{flex-direction:column;gap:4px}
  #ecmcoll .ecmcoll-model__head{flex-wrap:wrap}
  #ecmcoll .ecmcoll-model__link{margin-left:0}
  #ecmcoll .ecmcoll-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  #ecmcoll .ecmcoll-card__go{opacity:1}
}
@media (prefers-reduced-motion:reduce){
  #ecmcoll .ecmcoll-flow.is-flow .ecmcoll-flow__card{transition:none}
  #ecmcoll .ecmcoll-card{transition:none}
  #ecmcoll .ecmcoll-card:hover{transform:none}
}

/* briciole: quelle del tema staccavano la testata dalla pagina con una fascia bianca; le nostre stanno nel box scuro */
#module-ecmcollezioni-collezione #wrapper > .container > nav.breadcrumb{display:none}
#module-ecmcollezioni-collezione #wrapper{padding-top:0}
#ecmcoll .ecmcoll-bc{margin:0 0 22px}
#ecmcoll .ecmcoll-bc ol{display:flex;flex-wrap:wrap;gap:0;margin:0;padding:0;list-style:none}
#ecmcoll .ecmcoll-bc li{font:500 11px var(--ec-body);letter-spacing:.2em;text-transform:uppercase;color:#fff}
#ecmcoll .ecmcoll-bc li + li::before{content:"/";margin:0 10px;color:#6b6b6b}
#ecmcoll .ecmcoll-bc a{color:#9a9a9a;text-decoration:none;transition:color .2s}
#ecmcoll .ecmcoll-bc a:hover{color:#fff}
