/* =============================================================
   VINOVERITAS — layer grafico su Hummingbird 2.0.0
   PrestaShop 9.1.4 · child theme "vinoveritas"
   v1.1.0 — sezioni 07 e 09 riscritte sul BEM reale di Hummingbird
   -------------------------------------------------------------
   00 token · 01 font · 02 base · 03 header · 04 icone
   05 slider · 06 sezioni home · 07 card prodotto · 08 controlli
   09 footer · 10 accessibilità
   ============================================================= */


/* =============================================================
   00 · TOKEN
   ============================================================= */
:root{
  --vv-navy:        #18223D;
  --vv-navy-2:      #2E3750;
  --vv-navy-deep:   #121A2E;
  --vv-gold:        #D4AF37;
  --vv-gold-light:  #E8CC6A;
  --vv-gold-deep:   #A8862A;
  --vv-ivory:       #F7F5F0;
  --vv-paper:       #FFFFFF;
  --vv-line:        rgba(24,34,61,.12);
  --vv-line-gold:   rgba(212,175,55,.38);

  --vv-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --vv-sans:    "Josefin Sans", "Century Gothic", "Futura", system-ui, sans-serif;

  --vv-track-wide: .28em;
  --vv-track-mid:  .16em;

  --vv-gap:      clamp(1rem, 2.2vw, 1.75rem);
  --vv-section:  clamp(3.5rem, 7vw, 6.5rem);

  --vv-ease: cubic-bezier(.22,.61,.36,1);
  --vv-dur:  .38s;

  /* override delle variabili Bootstrap usate da Hummingbird */
  --bs-primary:            #18223D;
  --bs-primary-rgb:        24,34,61;
  --bs-link-color:         #18223D;
  --bs-link-color-rgb:     24,34,61;
  --bs-link-hover-color:   #A8862A;
  --bs-body-color:         #1A2033;
  --bs-body-bg:            #FFFFFF;
  --bs-border-color:       rgba(24,34,61,.12);
  --bs-border-radius:      0;
  --bs-border-radius-sm:   0;
  --bs-border-radius-lg:   0;
  --bs-body-font-family:   "Josefin Sans", "Century Gothic", system-ui, sans-serif;
}


/* =============================================================
   01 · FONT
   ============================================================= */
@font-face{ font-family:"Cormorant Garamond"; font-style:normal; font-weight:300;
  font-display:swap; src:url("../fonts/CormorantGaramond-Light.woff2") format("woff2"); }
@font-face{ font-family:"Cormorant Garamond"; font-style:italic; font-weight:300;
  font-display:swap; src:url("../fonts/CormorantGaramond-LightItalic.woff2") format("woff2"); }
@font-face{ font-family:"Cormorant Garamond"; font-style:normal; font-weight:400;
  font-display:swap; src:url("../fonts/CormorantGaramond-Regular.woff2") format("woff2"); }
@font-face{ font-family:"Cormorant Garamond"; font-style:italic; font-weight:400;
  font-display:swap; src:url("../fonts/CormorantGaramond-Italic.woff2") format("woff2"); }
@font-face{ font-family:"Josefin Sans"; font-style:normal; font-weight:300;
  font-display:swap; src:url("../fonts/JosefinSans-Light.woff2") format("woff2"); }
@font-face{ font-family:"Josefin Sans"; font-style:normal; font-weight:400;
  font-display:swap; src:url("../fonts/JosefinSans-Regular.woff2") format("woff2"); }
@font-face{ font-family:"Josefin Sans"; font-style:normal; font-weight:500;
  font-display:swap; src:url("../fonts/JosefinSans-Medium.woff2") format("woff2"); }


/* =============================================================
   02 · BASE
   ============================================================= */
body{
  font-family:var(--vv-sans); font-weight:300; color:#1A2033; background:var(--vv-paper);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,.h1,.h2,.h3,.h4{
  font-family:var(--vv-display); font-weight:300; color:var(--vv-navy);
  letter-spacing:.005em; line-height:1.14;
}
a{ color:var(--vv-navy); text-decoration:none; transition:color var(--vv-dur) var(--vv-ease); }
a:hover,a:focus{ color:var(--vv-gold-deep); }

.vv-rule{ height:1px; background:linear-gradient(90deg,var(--vv-gold),transparent); border:0; }
.vv-kicker{
  display:block; font-family:var(--vv-sans); font-weight:400; font-size:.7rem;
  letter-spacing:var(--vv-track-wide); text-transform:uppercase; color:var(--vv-gold);
}


/* =============================================================
   03 · HEADER
   ============================================================= */
.header-banner,
.header-top,
.header-bottom,
.header-nav-full-width{
  background:var(--vv-navy);
  color:rgba(247,245,240,.9);
  border:0;
}
.header-top{ border-bottom:1px solid rgba(247,245,240,.08); }

.header-bottom a,
.header-top a{ color:rgba(247,245,240,.88); }
.header-bottom a:hover,
.header-top a:hover{ color:var(--vv-gold-light); }

.header-bottom__container{ padding-top:.9rem; padding-bottom:.9rem; }
.header-bottom__logo img{ max-height:70px; width:auto; display:block; }
.header-bottom__h1{ line-height:0; }

/* --- blocchi modulo dell'header (signin, carrello, ricerca) --- */
.header-block__action-btn{
  display:inline-flex; align-items:center; justify-content:center;
  position:relative; width:38px; height:38px;
  color:rgba(247,245,240,.85);
  transition:transform var(--vv-dur) var(--vv-ease), color var(--vv-dur) var(--vv-ease);
}
.header-block__action-btn:hover{ transform:translateY(-2px); color:var(--vv-gold-light); }
.header-block__icon{ font-size:23px; }

.header-block__badge{
  position:absolute; top:0; right:0; min-width:17px; height:17px; padding:0 4px;
  display:flex; align-items:center; justify-content:center;
  background:var(--vv-gold); color:var(--vv-navy-deep);
  font-family:var(--vv-sans); font-weight:500; font-size:.6rem; line-height:1;
  border-radius:50px; box-shadow:0 0 0 2px var(--vv-navy);
}
.header-block__badge:empty{ display:none; }

/* --- menu principale --- */
.header-nav-full-width .menu a,
.header-bottom .menu a{
  font-family:var(--vv-sans); font-weight:400; font-size:.76rem;
  letter-spacing:var(--vv-track-mid); text-transform:uppercase;
  position:relative;
}
.header-nav-full-width .menu > ul > li > a::after{
  content:""; position:absolute; left:0; right:0; bottom:.35rem; height:1px;
  background:var(--vv-gold); transform:scaleX(0); transform-origin:left;
  transition:transform var(--vv-dur) var(--vv-ease);
}
.header-nav-full-width .menu > ul > li > a:hover::after,
.header-nav-full-width .menu > ul > li.current > a::after{ transform:scaleX(1); }

/* --- tendine e popover --- */
.header-bottom .dropdown-menu,
.header-bottom .popover,
.header-nav-full-width .sub-menu{
  background:var(--vv-navy-deep);
  border:1px solid rgba(212,175,55,.2);
  border-radius:0;
  box-shadow:0 18px 46px rgba(9,14,26,.45);
}

/* --- ricerca --- */
.header-bottom input[type="text"],
.header-bottom input[type="search"]{
  background:transparent; border:0; border-bottom:1px solid rgba(212,175,55,.35);
  border-radius:0; color:#F7F5F0;
  font-family:var(--vv-sans); font-weight:300; font-size:.85rem;
  letter-spacing:.06em; padding:.5rem 0;
}
.header-bottom input[type="text"]::placeholder,
.header-bottom input[type="search"]::placeholder{
  color:rgba(247,245,240,.45); letter-spacing:.16em; text-transform:uppercase; font-size:.7rem;
}
.header-bottom input[type="text"]:focus,
.header-bottom input[type="search"]:focus{
  border-bottom-color:var(--vv-gold); box-shadow:none; outline:none;
}


/* =============================================================
   04 · ICONE PNG DEDICATE  (partial vv-icons.tpl)
   ============================================================= */
.vv-icons{ display:flex; align-items:center; gap:clamp(.85rem,1.6vw,1.4rem); }
.vv-ico{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; line-height:0;
  transition:transform var(--vv-dur) var(--vv-ease);
}
.vv-ico img{ width:26px; height:26px; display:block; filter:drop-shadow(0 1px 3px rgba(9,14,26,.5)); }
.vv-ico:hover{ transform:translateY(-2px); }
.vv-ico:hover img{ filter:drop-shadow(0 3px 9px rgba(212,175,55,.45)); }

.vv-ico__label{
  position:absolute; top:calc(100% + 4px); left:50%; transform:translateX(-50%);
  font-size:.55rem; letter-spacing:.2em; text-transform:uppercase;
  color:rgba(247,245,240,.5); white-space:nowrap; display:none;
}
@media(min-width:1200px){ .vv-ico__label{ display:block; } }

.vv-ico__badge{
  position:absolute; top:-3px; right:-5px; min-width:17px; height:17px; padding:0 4px;
  display:flex; align-items:center; justify-content:center;
  background:var(--vv-gold); color:var(--vv-navy-deep);
  font-family:var(--vv-sans); font-weight:500; font-size:.6rem; line-height:1;
  border-radius:50px; box-shadow:0 0 0 2px var(--vv-navy);
}
.vv-ico__badge:empty,
.vv-ico__badge[data-count="0"]{ display:none; }

@media(max-width:575px){
  .vv-ico{ width:30px; height:30px; }
  .vv-ico img{ width:23px; height:23px; }
}


/* =============================================================
   05 · SLIDER  (ps_imageslider — markup Bootstrap di Hummingbird)
   ============================================================= */
#ps_imageslider .carousel-control-prev,
#ps_imageslider .carousel-control-next{ display:none !important; }

#ps_imageslider .carousel-indicators{
  margin:0; padding:0; bottom:22px; gap:14px; align-items:center; justify-content:center;
}
#ps_imageslider .carousel-indicators button,
#ps_imageslider .carousel-indicators [data-bs-target]{
  width:9px; height:9px; flex:0 0 9px; padding:0; margin:0; border-radius:50%;
  background:transparent; background-clip:padding-box;
  border:1px solid rgba(212,175,55,.75);
  opacity:1; text-indent:-9999px; box-shadow:none;
  transition:background-color var(--vv-dur) var(--vv-ease),
             transform var(--vv-dur) var(--vv-ease),
             box-shadow var(--vv-dur) var(--vv-ease);
}
#ps_imageslider .carousel-indicators button:hover{ background-color:rgba(212,175,55,.45); }
#ps_imageslider .carousel-indicators button.active{
  background-color:var(--vv-gold); transform:scale(1.25);
  box-shadow:0 0 0 4px rgba(212,175,55,.18);
}

#ps_imageslider .carousel-item{ position:relative; background:var(--vv-navy-deep); }
#ps_imageslider .carousel-item::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg,
    rgba(18,26,46,.90) 0%, rgba(18,26,46,.70) 34%,
    rgba(18,26,46,.15) 64%, rgba(18,26,46,0) 100%);
}
#ps_imageslider .carousel-item img{ width:100%; height:auto; display:block; }

#ps_imageslider .carousel-caption,
#ps_imageslider .caption{
  position:absolute; z-index:3; left:6.5%; right:auto; top:50%; bottom:auto;
  transform:translateY(-50%); max-width:46%; text-align:left; padding:0; text-shadow:none;
}
/* il template del modulo mette un <h2> vuoto se il titolo non è compilato */
#ps_imageslider .caption > h2:empty{ display:none; }

.vv-slide__kicker{
  display:block; font-family:var(--vv-sans); font-weight:400; font-size:.7rem;
  letter-spacing:.34em; text-transform:uppercase; color:var(--vv-gold);
  margin-bottom:1.1rem; padding-left:44px; position:relative;
}
.vv-slide__kicker::before{
  content:""; position:absolute; left:0; top:.55em; width:30px; height:1px; background:var(--vv-gold);
}
.vv-slide__title{
  font-family:var(--vv-display); font-weight:300;
  font-size:clamp(1.6rem,3.6vw,3.4rem); line-height:1.06;
  color:#F7F5F0; margin:0 0 .35rem;
}
.vv-slide__sub{
  display:block; font-family:var(--vv-display); font-style:italic; font-weight:300;
  font-size:clamp(1rem,1.9vw,1.75rem); line-height:1.2;
  color:var(--vv-gold-light); margin:0 0 1.15rem;
}
.vv-slide__lead{
  font-family:var(--vv-sans); font-weight:300;
  font-size:clamp(.78rem,1.02vw,.95rem); line-height:1.85;
  color:rgba(247,245,240,.78); margin:0; max-width:46ch;
}
.vv-slide__cta{
  display:inline-block; margin-top:1.4rem;
  font-family:var(--vv-sans); font-weight:400; font-size:.68rem;
  letter-spacing:.26em; text-transform:uppercase; color:var(--vv-gold);
  padding-bottom:.5rem; border-bottom:1px solid rgba(212,175,55,.45);
  transition:border-color var(--vv-dur) var(--vv-ease), color var(--vv-dur) var(--vv-ease);
}
.vv-slide__cta::after{
  content:"→"; margin-left:.75em; display:inline-block;
  transition:transform var(--vv-dur) var(--vv-ease);
}
#ps_imageslider .carousel-item:hover .vv-slide__cta{ color:var(--vv-gold-light); border-color:var(--vv-gold); }
#ps_imageslider .carousel-item:hover .vv-slide__cta::after{ transform:translateX(5px); }

#ps_imageslider .carousel-item.active .vv-slide__kicker,
#ps_imageslider .carousel-item.active .vv-slide__title,
#ps_imageslider .carousel-item.active .vv-slide__sub,
#ps_imageslider .carousel-item.active .vv-slide__lead,
#ps_imageslider .carousel-item.active .vv-slide__cta{
  animation:vvRise .9s var(--vv-ease) both;
}
#ps_imageslider .carousel-item.active .vv-slide__title{ animation-delay:.08s; }
#ps_imageslider .carousel-item.active .vv-slide__sub{   animation-delay:.16s; }
#ps_imageslider .carousel-item.active .vv-slide__lead{  animation-delay:.24s; }
#ps_imageslider .carousel-item.active .vv-slide__cta{   animation-delay:.32s; }
@keyframes vvRise{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }

@media(max-width:991px){
  #ps_imageslider .carousel-caption,
  #ps_imageslider .caption{ max-width:62%; left:7%; }
  #ps_imageslider .carousel-item::after{
    background:linear-gradient(90deg,rgba(18,26,46,.92) 0%,rgba(18,26,46,.62) 58%,rgba(18,26,46,.1) 100%);
  }
}
@media(max-width:575px){
  #ps_imageslider .carousel-caption,
  #ps_imageslider .caption{ max-width:82%; left:8%; }
  .vv-slide__lead{ display:none; }
  .vv-slide__kicker{ padding-left:0; margin-bottom:.7rem; }
  .vv-slide__kicker::before{ display:none; }
  #ps_imageslider .carousel-indicators{ bottom:12px; gap:10px; }
}


/* =============================================================
   06 · SEZIONI HOME
   ============================================================= */
.vv-band{ padding:var(--vv-section) 0; }
.vv-band--ivory{ background:var(--vv-ivory); }
.vv-band--navy{ background:var(--vv-navy); color:rgba(247,245,240,.85); }
.vv-band--navy h1,.vv-band--navy h2,.vv-band--navy h3{ color:#F7F5F0; }

.vv-section-head{ margin-bottom:clamp(2rem,4vw,3.25rem); }
.vv-section-head .vv-kicker{ display:flex; align-items:center; gap:1rem; margin-bottom:.85rem; }
.vv-section-head .vv-kicker::after{
  content:""; flex:1; height:1px; background:linear-gradient(90deg,var(--vv-line-gold),transparent);
}
.vv-section-head h2{ font-size:clamp(1.75rem,3.2vw,2.9rem); margin:0; }

/* titoli dei blocchi prodotto (ps_featuredproducts, ps_newproducts, ps_specials) */
.products-section-title,
.featured-products__title,
h2.products-section-title{
  font-family:var(--vv-display); font-weight:300; color:var(--vv-navy);
  font-size:clamp(1.6rem,3vw,2.6rem); text-align:center; text-transform:none;
  margin-bottom:2.5rem; position:relative; padding-bottom:1.1rem;
}
.products-section-title::after,
.featured-products__title::after{
  content:""; position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  width:56px; height:1px; background:var(--vv-gold);
}


/* =============================================================
   07 · CARD PRODOTTO — BEM di Hummingbird 2.0
   .product-miniature > __inner > __top / __bottom
   ============================================================= */
.product-miniature{ height:100%; }

.product-miniature__inner{
  height:100%; display:flex; flex-direction:column;
  background:var(--vv-paper);
  border:1px solid var(--vv-line);
  border-radius:0; box-shadow:none; overflow:hidden;
  transition:border-color var(--vv-dur) var(--vv-ease),
             box-shadow var(--vv-dur) var(--vv-ease),
             transform var(--vv-dur) var(--vv-ease);
}
.product-miniature:hover .product-miniature__inner{
  border-color:var(--vv-line-gold);
  box-shadow:0 16px 40px rgba(24,34,61,.10);
  transform:translateY(-4px);
}

/* --- zona immagine --- */
.product-miniature__top{
  position:relative; background:var(--vv-paper);
  padding:1.6rem 1.4rem .6rem; overflow:hidden;
}
.product-miniature__top img{
  width:100%; height:auto; aspect-ratio:1/1; object-fit:contain; display:block;
  mix-blend-mode:multiply;  /* uniforma i fondi bianchi non identici delle foto */
  transition:transform .55s var(--vv-ease);
}
.product-miniature:hover .product-miniature__top img{ transform:scale(1.045); }

/* --- badge Nuovo / Promo --- */
.product-miniature__top .product-flags{
  position:absolute; top:0; left:0; z-index:2;
  margin:0; padding:0; list-style:none;
  display:flex; flex-direction:column; gap:6px;
}
.product-miniature__top .product-flag{
  position:static;
  background:var(--vv-navy); color:var(--vv-gold-light);
  font-family:var(--vv-sans); font-weight:400; font-size:.6rem;
  letter-spacing:.22em; text-transform:uppercase;
  padding:.42rem .85rem; border:0; border-radius:0; box-shadow:none;
}
.product-miniature__top .product-flag.discount,
.product-miniature__top .product-flag.on-sale{
  background:var(--vv-gold); color:var(--vv-navy-deep);
}

/* --- anteprima rapida --- */
.product-miniature__top .quickview,
.product-miniature__quickview{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  background:rgba(18,26,46,.88); color:var(--vv-gold-light);
  font-family:var(--vv-sans); font-size:.62rem;
  letter-spacing:var(--vv-track-wide); text-transform:uppercase;
  border:0; border-radius:0; padding:.7rem;
  opacity:0; transform:translateY(100%);
  transition:opacity var(--vv-dur) var(--vv-ease), transform var(--vv-dur) var(--vv-ease);
}
.product-miniature:hover .product-miniature__top .quickview,
.product-miniature:hover .product-miniature__quickview{ opacity:1; transform:none; }

/* --- zona testo --- */
.product-miniature__bottom{
  flex:1; display:flex; flex-direction:column;
  padding:0 1.4rem 1.4rem; gap:.55rem;
}
.product-miniature__infos{ display:flex; flex-direction:column; gap:.5rem; }

.product-miniature__title{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  font-family:var(--vv-display); font-weight:400;
  font-size:1.06rem; line-height:1.28; letter-spacing:.01em;
  color:var(--vv-navy); text-transform:none; margin:0;
}
.product-miniature:hover .product-miniature__title{ color:var(--vv-gold-deep); }

/* filetto oro che cresce sotto il titolo */
.product-miniature__infos::after{
  content:""; display:block; order:-1; /* neutro: il vero filetto è sotto */
}
.product-miniature__title + *::before{ content:none; }
.product-miniature__prices{
  display:flex; align-items:baseline; gap:.6rem; flex-wrap:wrap;
  margin:0; padding-top:.55rem; position:relative;
}
.product-miniature__prices::before{
  content:""; position:absolute; left:0; top:0;
  width:22px; height:1px; background:var(--vv-gold);
  transition:width var(--vv-dur) var(--vv-ease);
}
.product-miniature:hover .product-miniature__prices::before{ width:52px; }

.product-miniature__price{
  font-family:var(--vv-display); font-weight:500;
  font-size:1.24rem; letter-spacing:.02em; color:var(--vv-gold-deep);
}
.product-miniature__discount-price{ display:inline-flex; }
.product-miniature__regular-price{
  font-family:var(--vv-sans); font-weight:300; font-size:.82rem;
  color:rgba(26,32,51,.42); text-decoration:line-through;
}
.product-miniature__variants{ display:flex; gap:.4rem; }

/* --- azioni --- */
.product-miniature__actions{ margin-top:auto; padding-top:1rem; }
.product-miniature__form{
  display:flex; gap:.55rem; align-items:stretch; margin:0;
}
.product-miniature__form .quantity-button{
  flex:0 0 auto;
  border:1px solid var(--vv-line); border-radius:0; overflow:hidden;
  display:flex; align-items:stretch;
}
.product-miniature__add{
  flex:1 1 auto;
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  background:var(--vv-navy); border:1px solid var(--vv-navy); border-radius:0;
  color:var(--vv-gold-light);
  font-family:var(--vv-sans); font-weight:400; font-size:.66rem;
  letter-spacing:var(--vv-track-wide); text-transform:uppercase;
  padding:.7rem 1rem; min-height:44px; width:auto;
  transition:background-color var(--vv-dur) var(--vv-ease),
             border-color var(--vv-dur) var(--vv-ease),
             color var(--vv-dur) var(--vv-ease);
}
.product-miniature__add:hover{
  background:var(--vv-gold); border-color:var(--vv-gold); color:var(--vv-navy-deep);
}
.product-miniature__add .material-icons{ font-size:18px; }
.product-miniature__add-text{ display:inline; }

.product-miniature__details{
  display:inline-flex; align-items:center; justify-content:center; width:100%;
  background:transparent; border:1px solid var(--vv-navy); border-radius:0;
  color:var(--vv-navy);
  font-family:var(--vv-sans); font-weight:400; font-size:.66rem;
  letter-spacing:var(--vv-track-wide); text-transform:uppercase;
  padding:.7rem 1rem; min-height:44px;
}
.product-miniature__details:hover{
  background:var(--vv-navy); color:var(--vv-gold-light);
}

@media(max-width:575px){
  .product-miniature__top{ padding:1.1rem 1rem .5rem; }
  .product-miniature__bottom{ padding:0 1rem 1rem; }
  .product-miniature__title{ font-size:.98rem; }
  .product-miniature__add-text{ display:none; }   /* solo icona su schermo stretto */
  .product-miniature__add{ flex:0 0 46px; padding:.7rem; }
}


/* =============================================================
   08 · CONTROLLI
   ============================================================= */
.btn,.btn-primary,.btn-secondary,.btn-outline-primary,button.btn{
  border-radius:0;
  font-family:var(--vv-sans); font-weight:400; font-size:.7rem;
  letter-spacing:var(--vv-track-wide); text-transform:uppercase;
  padding:.85rem 1.5rem; border-width:1px; box-shadow:none;
  transition:background-color var(--vv-dur) var(--vv-ease),
             color var(--vv-dur) var(--vv-ease),
             border-color var(--vv-dur) var(--vv-ease);
}
.btn-primary{ background:var(--vv-navy); border-color:var(--vv-navy); color:var(--vv-gold-light); }
.btn-primary:hover,.btn-primary:focus{
  background:var(--vv-gold); border-color:var(--vv-gold); color:var(--vv-navy-deep);
}
.btn-primary:disabled{ background:rgba(24,34,61,.28); border-color:transparent; color:rgba(247,245,240,.7); }
.btn-secondary,.btn-outline-primary{ background:transparent; border-color:var(--vv-navy); color:var(--vv-navy); }
.btn-secondary:hover,.btn-outline-primary:hover{
  background:var(--vv-navy); border-color:var(--vv-navy); color:var(--vv-gold-light);
}

/* selettore quantità (components/qty-input.tpl) */
.quantity-button{ border:1px solid var(--vv-line); border-radius:0; }
.quantity-button input,
input[name="qty"]{
  border:0; border-radius:0; text-align:center; box-shadow:none; background:transparent;
  font-family:var(--vv-sans); font-weight:400; font-size:.9rem; color:var(--vv-navy);
  width:44px; padding:0;
}
.quantity-button button,
.quantity-button .btn{
  background:transparent; border:0; border-radius:0; color:var(--vv-navy);
  padding:0 .7rem; min-height:auto;
}
.quantity-button button:hover{ background:var(--vv-ivory); color:var(--vv-gold-deep); }
/* toglie le frecce native dei number input */
.quantity-button input[type="number"]{ -moz-appearance:textfield; appearance:textfield; }
.quantity-button input[type="number"]::-webkit-outer-spin-button,
.quantity-button input[type="number"]::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }

.form-control,.form-select,input[type="text"],input[type="email"],textarea{
  border-radius:0; border:1px solid var(--vv-line);
  font-family:var(--vv-sans); font-weight:300; box-shadow:none;
}
.form-control:focus,.form-select:focus{
  border-color:var(--vv-gold); box-shadow:0 0 0 3px rgba(212,175,55,.14);
}

.breadcrumb,.breadcrumb a,.breadcrumb li{
  font-family:var(--vv-sans); font-weight:300; font-size:.68rem;
  letter-spacing:var(--vv-track-mid); text-transform:uppercase;
  color:rgba(26,32,51,.55); background:transparent;
}


/* =============================================================
   09 · FOOTER  (.footer__before / .footer__main di Hummingbird)
   ============================================================= */
.footer__before{
  background:var(--vv-ivory);
  padding:clamp(2rem,4vw,3.25rem) 0;
  border:0;
}
.footer__main{
  background:var(--vv-navy);
  color:rgba(247,245,240,.72);
  padding:clamp(3rem,6vw,5rem) 0 0;
  border:0; box-shadow:none;
}
.footer__main a{ color:rgba(247,245,240,.72); }
.footer__main a:hover{ color:var(--vv-gold-light); }

.footer__main h1,.footer__main h2,.footer__main h3,
.footer__main .h3,.footer__main .block-title{
  font-family:var(--vv-sans); font-weight:400; font-size:.68rem;
  letter-spacing:var(--vv-track-wide); text-transform:uppercase;
  color:var(--vv-gold); margin-bottom:1.2rem;
}
.footer__main-top{ padding-bottom:clamp(1.5rem,3vw,2.5rem); }

/* --- blocco due sedi (vv-venues.tpl) --- */
.vv-footer__venues{
  display:grid; grid-template-columns:1fr 1px 1fr;
  gap:clamp(2rem,5vw,4.5rem); align-items:start;
  padding-top:clamp(1rem,2vw,2rem);
}
.vv-footer__divider{ background:rgba(247,245,240,.14); align-self:stretch; }
.vv-footer__venue{ font-style:normal; margin:0; }

.vv-footer__label{
  display:flex; align-items:center; gap:1rem;
  font-family:var(--vv-sans); font-weight:400; font-size:.68rem;
  letter-spacing:var(--vv-track-wide); text-transform:uppercase;
  color:var(--vv-gold); margin-bottom:1.6rem;
}
.vv-footer__label::after{ content:""; flex:1; height:1px; background:rgba(212,175,55,.35); }

.vv-footer__name{
  font-family:var(--vv-display); font-weight:300;
  font-size:clamp(1.35rem,2.2vw,1.75rem); line-height:1.25;
  color:#F7F5F0; margin:0 0 1.15rem;
}
.vv-footer__addr{
  font-family:var(--vv-sans); font-weight:300; font-size:.86rem; line-height:1.95;
  letter-spacing:.03em; color:rgba(247,245,240,.6); margin:0 0 1.3rem;
}
.vv-footer__phone{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--vv-sans); font-weight:400; font-size:.95rem;
  letter-spacing:.08em; color:var(--vv-gold) !important; margin-bottom:1.3rem;
}
.vv-footer__phone svg{ width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.6; }
.vv-footer__phone:hover{ color:var(--vv-gold-light) !important; }
.vv-footer__hours{
  font-family:var(--vv-sans); font-weight:300; font-size:.8rem; line-height:2;
  letter-spacing:.05em; color:rgba(247,245,240,.5); margin:0;
}
.vv-footer__hours b{ font-weight:400; color:rgba(247,245,240,.72); margin-right:.5rem; }

/* --- copyright --- */
.vv-footer__bottom{
  margin-top:clamp(2.5rem,5vw,4rem);
  border-top:1px solid rgba(247,245,240,.12);
  padding:1.75rem 0 2rem; text-align:center;
}
.vv-footer__bottom p{
  margin:0; font-family:var(--vv-sans); font-weight:300; font-size:.66rem;
  letter-spacing:.24em; text-transform:uppercase; color:rgba(247,245,240,.38);
}
.vv-footer__bottom a{ color:rgba(247,245,240,.38); }

@media(max-width:767px){
  .vv-footer__venues{ grid-template-columns:1fr; gap:2.5rem; }
  .vv-footer__divider{ height:1px; width:100%; }
}


/* =============================================================
   10 · ACCESSIBILITÀ
   ============================================================= */
:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:2px solid var(--vv-gold); outline-offset:3px;
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
}

/* =============================================================
   VINOVERITAS — appendice v1.2.0
   Da incollare IN FONDO a custom.css (dopo la sezione 10).
   Copre: icone PNG nell'header, didascalie slider su mobile.
   ============================================================= */


/* --- icone PNG al posto delle material-icons -------------- */
.header-block__icon--png{
  width:26px; height:26px; object-fit:contain; display:block;
  filter:drop-shadow(0 1px 3px rgba(9,14,26,.5));
  transition:filter var(--vv-dur) var(--vv-ease);
}
.header-block__action-btn:hover .header-block__icon--png{
  filter:drop-shadow(0 3px 9px rgba(212,175,55,.45));
}
.header-block__action-btn{ gap:.55rem; }

.header-block__title{
  font-family:var(--vv-sans); font-weight:400; font-size:.66rem;
  letter-spacing:var(--vv-track-mid); text-transform:uppercase;
  color:rgba(247,245,240,.8);
}

/* il badge va agganciato al bordo dell'icona, non del blocco intero */
.header-block{ position:relative; }
.header-block__badge{ top:-2px; right:auto; left:20px; }
.header-block.inactive .header-block__badge{ display:none; }


/* --- didascalie slider: ora visibili su tutte le larghezze --- */
.ps-imageslider__figure{ position:relative; margin:0; }

.ps-imageslider__figcaption{
  position:absolute; z-index:3;
  left:6.5%; right:auto; top:50%; bottom:auto;
  transform:translateY(-50%);
  max-width:46%; text-align:left; padding:0; text-shadow:none;
}
/* neutralizza le utility Bootstrap se restano su qualche slide */
.ps-imageslider__figcaption.fs-5{ font-size:inherit; }
.ps-imageslider__figcaption > h2.h1{ font-size:clamp(1.6rem,3.6vw,3.4rem); text-transform:none; }
.ps-imageslider__figcaption > h2:empty{ display:none; }
.vv-slide__body > *:first-child{ margin-top:0; }

@media(max-width:991px){
  .ps-imageslider__figcaption{ max-width:64%; left:7%; }
}
@media(max-width:575px){
  .ps-imageslider__figcaption{ max-width:84%; left:8%; }
}

/* =============================================================
   APPENDICE v1.2.1 — icone header: doppie e senza etichette
   ============================================================= */

/* via le scritte "Accedi" / "Carrello" */
.header-block__title{ display:none !important; }

/* icone al doppio */
.header-block__icon--png{ width:22px; height:22px; }

/* il bottone si adatta all'icona */
.header-block__action-btn{
  width:auto; height:auto; padding:0; gap:0;
}

/* distanza doppia tra i due blocchi */
#_desktop_ps_customersignin {
	padding-top: 0.4rem;
}
#_desktop_ps_customersignin,
#_desktop_ps_shoppingcart{
  margin-left:1.0rem;
}

/* badge riagganciato all'angolo dell'icona grande */
.header-block__badge{
  top:-2px; left:auto; right:-6px;
  min-width:20px; height:20px; font-size:.66rem;
}

@media(max-width:575px){
  .header-block__icon--png{ width:40px; height:40px; }
  #_desktop_ps_customersignin,
  #_desktop_ps_shoppingcart{ margin-left:1.5rem; }
}

/* =============================================================
   APPENDICE v1.3.1 — manifesto Gambero Rosso
   Sostituisce integralmente il blocco v1.3.0
   ============================================================= */

/* pesi aggiuntivi di Cormorant */
@font-face{ font-family:"Cormorant Garamond"; font-style:italic; font-weight:500;
  font-display:swap; src:url("../fonts/CormorantGaramond-MediumItalic.woff2") format("woff2"); }
@font-face{ font-family:"Cormorant Garamond"; font-style:normal; font-weight:700;
  font-display:swap; src:url("../fonts/CormorantGaramond-Bold.woff2") format("woff2"); }

:root{
  --vv-red:      #8E1B2E;
  --vv-red-deep: #6E1223;
}

.vv-manifesto{
  position:relative; max-width:1180px; margin:0 auto;
  padding:clamp(3rem,6vw,5.5rem) clamp(1.25rem,4vw,3rem);
}
.vv-manifesto::after{
  content:""; position:absolute; right:clamp(.5rem,2vw,2rem);
  top:clamp(2rem,5vw,4rem); bottom:clamp(2rem,5vw,4rem);
  width:1px; background:var(--vv-gold);
}

.vv-manifesto__award{
  display:inline-flex; align-items:center; gap:.85rem;
  background:var(--vv-red); color:var(--vv-ivory);
  border-left:4px solid var(--vv-gold);
  font-family:var(--vv-sans); font-weight:500; font-size:.75rem;
  letter-spacing:.2em; text-transform:uppercase;
  padding:.72rem 1.5rem .72rem 1.25rem;
  margin:0 0 clamp(1.6rem,3vw,2.4rem);
  box-shadow:0 6px 22px rgba(142,27,46,.22);
}

/* le tre bottiglie: maschera SVG, zero markup */
.vv-manifesto__award::before{
  content:"";
  flex:0 0 auto; width:26px; height:18px; display:block;
  background-color:var(--vv-gold-light);
  -webkit-mask-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 28"%3E%3Cpath d="M4 8.5V4.2c0-.5.4-.9.9-.9h1.4c.5 0 .9.4.9.9v4.3c1.2.7 2 2 2 3.5v11.4c0 .9-.7 1.6-1.6 1.6H3.6c-.9 0-1.6-.7-1.6-1.6V12c0-1.5.8-2.8 2-3.5z"/%3E%3Cpath d="M17 8.5V4.2c0-.5.4-.9.9-.9h1.4c.5 0 .9.4.9.9v4.3c1.2.7 2 2 2 3.5v11.4c0 .9-.7 1.6-1.6 1.6h-4c-.9 0-1.6-.7-1.6-1.6V12c0-1.5.8-2.8 2-3.5z"/%3E%3Cpath d="M30 8.5V4.2c0-.5.4-.9.9-.9h1.4c.5 0 .9.4.9.9v4.3c1.2.7 2 2 2 3.5v11.4c0 .9-.7 1.6-1.6 1.6h-4c-.9 0-1.6-.7-1.6-1.6V12c0-1.5.8-2.8 2-3.5z"/%3E%3C/svg%3E');
  mask-image:url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 28"%3E%3Cpath d="M4 8.5V4.2c0-.5.4-.9.9-.9h1.4c.5 0 .9.4.9.9v4.3c1.2.7 2 2 2 3.5v11.4c0 .9-.7 1.6-1.6 1.6H3.6c-.9 0-1.6-.7-1.6-1.6V12c0-1.5.8-2.8 2-3.5z"/%3E%3Cpath d="M17 8.5V4.2c0-.5.4-.9.9-.9h1.4c.5 0 .9.4.9.9v4.3c1.2.7 2 2 2 3.5v11.4c0 .9-.7 1.6-1.6 1.6h-4c-.9 0-1.6-.7-1.6-1.6V12c0-1.5.8-2.8 2-3.5z"/%3E%3Cpath d="M30 8.5V4.2c0-.5.4-.9.9-.9h1.4c.5 0 .9.4.9.9v4.3c1.2.7 2 2 2 3.5v11.4c0 .9-.7 1.6-1.6 1.6h-4c-.9 0-1.6-.7-1.6-1.6V12c0-1.5.8-2.8 2-3.5z"/%3E%3C/svg%3E');
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-position:center;  mask-position:center;
  -webkit-mask-size:contain;     mask-size:contain;
}

.vv-manifesto__award em{ font-style:normal; font-weight:600; color:var(--vv-gold-light); }
.vv-manifesto__bottles{ flex:0 0 auto; width:26px; height:18px; display:block; }
.vv-manifesto__bottles path{ fill:var(--vv-gold-light); }

.vv-manifesto__text{
  font-family:var(--vv-display); font-style:italic; font-weight:500;
  font-size:clamp(1.3rem,2.25vw,1.95rem);
  line-height:1.92; letter-spacing:.004em;
  color:var(--vv-navy);
  margin:0; padding:0 clamp(1rem,3vw,3.5rem) 0 0; border:0; quotes:none;
}

.vv-manifesto__text strong{
  font-style:normal; font-weight:700; color:var(--vv-red-deep);
}

@media(max-width:767px){
  .vv-manifesto__text{ line-height:1.78; padding-right:0; }
  .vv-manifesto::after{ right:.25rem; }
}

/* =============================================================
   APPENDICE v1.4.0 — barra fissa + header basso
   ============================================================= */

/* --- desktop: barra superiore fissa, la seconda scorre via --- */
@media(min-width:768px){
  .header-top{
    position:sticky; top:0; z-index:1030;
    background:var(--vv-navy-deep);
    box-shadow:0 2px 18px rgba(9,14,26,.35);
    padding:0;
  }
  .header-top .row{ align-items:center; min-height:54px; }
  .header-top__right{
    display:flex; align-items:center; gap:1.5rem;
    justify-content:flex-start;
  }
  /* il menu prima di tutto, le icone spinte in fondo a destra */
  .header-top__right .ps-mainmenu{ order:1; margin-right:auto; }
  .header-top__right #_desktop_ps_customersignin{ order:2; }
  .header-top__right #_desktop_ps_shoppingcart{ order:3; }

  /* il menu vive qui: compatto, senza margini verticali */
  .header-top .ps-mainmenu,
  .header-top .menu{ margin:0; }
  .header-top .menu > ul{ margin:0; display:flex; align-items:center; }

  /* le tendine devono poter uscire dalla barra */
  .header-top,
  .header-top .container-md,
  .header-top .row{ overflow:visible; }

  /* seconda fascia: bassa e non fissa */
  .header-bottom{
    position:static;
    border-bottom:1px solid rgba(247,245,240,.08);
  }
  .header-bottom__container{ padding-top:.55rem; padding-bottom:.55rem; }
  .header-bottom__logo img{ max-height:46px; }
}

/* --- mobile: è la seconda fascia a restare fissa --- */
@media(max-width:767.98px){
  .header-bottom{
    position:sticky; top:0; z-index:1030;
    box-shadow:0 2px 18px rgba(9,14,26,.35);
  }
  .header-bottom__container{ padding-top:.5rem; padding-bottom:.5rem; }
  .header-bottom__logo img{ max-height:40px; }
}

/* le ancore non finiscono sotto la barra */
:target{ scroll-margin-top:120px; }

/* =============================================================
   APPENDICE v1.5.0 — fascia ricerca collassabile (solo desktop)
   Da incollare IN FONDO a assets/css/custom.css
   ============================================================= */

/* --- il bottone lente nella barra fissa --- */
.vv-search-toggle{
  order:4;                      /* dopo menu, account, carrello */
  flex:0 0 auto;
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; padding:0;
  background:transparent; border:0; border-radius:0;
  color:rgba(247,245,240,.82); cursor:pointer;
  transition:color var(--vv-dur) var(--vv-ease),
             transform var(--vv-dur) var(--vv-ease);
}
.vv-search-toggle:hover{ color:var(--vv-gold-light); transform:translateY(-2px); }
.vv-search-toggle svg{
  width:21px; height:21px;
  fill:none; stroke:currentColor; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round;
}
/* la lente ruota leggermente quando la fascia è chiusa: dice "c'è altro" */
.vv-search-collapsed .vv-search-toggle svg{ transform:rotate(-90deg); }
.vv-search-toggle svg{ transition:transform var(--vv-dur) var(--vv-ease); }

@media(max-width:767.98px){
  .vv-search-toggle{ display:none; }
}

/* --- la fascia che si apre e si chiude --- */
@media(min-width:768px){
  .header-bottom{
    overflow:hidden;
    max-height:220px; opacity:1;
    transition:max-height .42s var(--vv-ease),
               opacity .28s var(--vv-ease),
               border-color .42s var(--vv-ease);
    will-change:max-height;
  }
  .vv-search-collapsed .header-bottom{
    max-height:0; opacity:0; border-bottom-color:transparent;
    pointer-events:none;
  }
}

/* niente animazione se l'utente l'ha disattivata a sistema */
@media (prefers-reduced-motion:reduce){
  .header-bottom{ transition:none !important; }
}

/* =============================================================
   APPENDICE v1.6.0 — densità griglia prodotti (solo desktop)
   ============================================================= */
:root{
  /* ⇩ L'UNICO VALORE DA CAMBIARE: card per riga da 1200px in su */
  --vv-cols: 5;

  /* card per riga tra 992 e 1199px */
  --vv-cols-md: 4;
  /* card per riga tra 768 e 991px */
  --vv-cols-sm: 3;
}

@media(min-width:768px){
  .products,
  .featured-products .products,
  .product-accessories .products{
    display:grid !important;
    grid-template-columns:repeat(var(--vv-cols-sm), minmax(0,1fr));
    gap:clamp(.9rem, 1.4vw, 1.6rem);
    margin-left:0; margin-right:0;
  }
  /* neutralizza le col-* di Bootstrap sui figli */
  .products > *{
    width:auto !important; max-width:none !important;
    flex:none !important; padding-left:0 !important; padding-right:0 !important;
  }
}
@media(min-width:992px){
  .products,
  .featured-products .products,
  .product-accessories .products{
    grid-template-columns:repeat(var(--vv-cols-md), minmax(0,1fr));
  }
}
@media(min-width:1200px){
  .products,
  .featured-products .products,
  .product-accessories .products{
    grid-template-columns:repeat(var(--vv-cols), minmax(0,1fr));
  }
}

/* --- la card si rimpicciolisce di conseguenza --- */
@media(min-width:1200px){
  .product-miniature__top{ padding:1.1rem 1rem .5rem; }
  .product-miniature__bottom{ padding:0 1rem 1.1rem; gap:.45rem; }
  .product-miniature__title{ font-size:.96rem; line-height:1.24; }
  .product-miniature__price{ font-size:1.08rem; }
  .product-miniature__add{
    font-size:.6rem; letter-spacing:.18em; padding:.6rem .7rem; min-height:40px;
  }
  .product-miniature__form .quantity-button input{ width:36px; }
  .product-miniature__form .quantity-button button{ padding:0 .5rem; }
}

/* con 6 o più colonne il testo del bottone non ci sta: solo icona */
@media(min-width:1200px){
  .vv-dense .product-miniature__add-text{ display:none; }
  .vv-dense .product-miniature__add{ flex:0 0 42px; padding:.6rem; }
}

/* =============================================================
   APPENDICE v1.7.0 — carrello sempre sotto il selettore quantità
   ============================================================= */
.product-miniature__form{
  display:flex;
  flex-direction:column;      /* impilati, mai affiancati */
  align-items:stretch;
  gap:.7rem;
  margin:0;
}

/* selettore quantità: centrato e a tutta larghezza */
.product-miniature__form .quantity-button{
  flex:0 0 auto;
  width:100%;
  display:flex; align-items:stretch; justify-content:space-between;
  border:1px solid var(--vv-line); border-radius:0; overflow:hidden;
  min-height:42px;
}
.product-miniature__form .quantity-button input{
  flex:1 1 auto; width:auto; text-align:center;
}
.product-miniature__form .quantity-button button{ padding:0 1rem; }

/* bottone carrello: barra piena sotto */
.product-miniature__add{
  flex:0 0 auto;
  width:100%;
  background:#1A223D; border-color:#1A223D;
  padding:.85rem 1rem; min-height:52px;
}
.product-miniature__add:hover{
  background:var(--vv-gold); border-color:var(--vv-gold); color:var(--vv-navy-deep);
}

/* il testo torna visibile ovunque: ora lo spazio c'è */
.product-miniature__add-text{ display:inline !important; }

/* annulla le compressioni delle appendici precedenti */
@media(min-width:1200px){
  .product-miniature__add{ flex:0 0 auto; padding:.85rem 1rem; min-height:52px; }
  .product-miniature__form .quantity-button input{ width:auto; }
  .product-miniature__form .quantity-button button{ padding:0 1rem; }
  .vv-dense .product-miniature__add{ flex:0 0 auto; padding:.85rem 1rem; }
  .vv-dense .product-miniature__add-text{ display:inline !important; }
}
@media(max-width:575px){
  .product-miniature__add{ flex:0 0 auto; padding:.85rem 1rem; }
}

/* =============================================================
   APPENDICE v1.8.0 — barra superiore anche su mobile (solo menu)
   ============================================================= */
@media(max-width:767.98px){
  .header-top{
    display:block;
    padding:0;
    border-bottom:1px solid rgba(247,245,240,.08);
  }
  .header-top .row{ margin:0; align-items:center; min-height:48px; }

  /* "Contattaci" e i selettori non servono qui: restano nel footer */
  .header-top__left,
  .header-top .ps-languageselector,
  .header-top .ps-currencyselector{ display:none; }

  /* account e carrello vivono nei placeholder mobile di header-bottom */
  .header-top #_desktop_ps_customersignin,
  .header-top #_desktop_ps_shoppingcart{ display:none; }

  /* resta il solo menu, allineato a sinistra */
  .header-top__right{
    display:flex; align-items:center; justify-content:flex-start;
    padding:0; width:100%;
  }
  .header-top__right .ps-mainmenu{ order:0; margin:0; width:100%; }

  /* il burger deve essere ben toccabile */
  .header-top .menu-icons,
  .header-top [data-bs-toggle="collapse"],
  .header-top .js-top-menu-toggle{
    min-width:44px; min-height:44px;
    display:inline-flex; align-items:center; justify-content:center;
    color:rgba(247,245,240,.9);
  }
}

/* =============================================================
   APPENDICE v1.8.1 — pannello mobile: fondo navy, testo leggibile
   Corregge il testo avorio su fondo bianco introdotto dalle
   regole dell'header (sez. 03), pensate per la barra navy.
   ============================================================= */

/* --- offcanvas del menu --- */
.offcanvas,
#mobile_top_menu_wrapper{
  --bs-offcanvas-bg: var(--vv-navy);
  --bs-offcanvas-color: rgba(247,245,240,.9);
  background:var(--vv-navy) !important;
  color:rgba(247,245,240,.9) !important;
}
.offcanvas-header,
.offcanvas-body{ background:transparent; }

/* la X di chiusura, nera su navy, va schiarita */
.offcanvas .btn-close{
  filter:invert(1) grayscale(100%) brightness(200%);
  opacity:.75;
}
.offcanvas .btn-close:hover{ opacity:1; }

/* voci di menu */
.offcanvas a,
#mobile_top_menu_wrapper a{
  color:rgba(247,245,240,.92) !important;
  font-family:var(--vv-sans); font-weight:400;
  letter-spacing:var(--vv-track-mid); text-transform:uppercase;
}
.offcanvas a:hover,
.offcanvas a:focus{ color:var(--vv-gold-light) !important; }

.offcanvas .top-menu > li,
.offcanvas .menu > ul > li{
  border-bottom:1px solid rgba(247,245,240,.08);
}
.offcanvas .top-menu a,
.offcanvas .menu a{ display:block; padding:.95rem 0; }

/* freccia dei sottomenu */
.offcanvas .navbar-toggler,
.offcanvas [data-bs-toggle="collapse"]{
  color:var(--vv-gold) !important;
  background:transparent; border:0;
}

/* --- burger ben visibile nella barra navy --- */
@media(max-width:767.98px){
  .header-top .navbar-toggler,
  .header-top .js-top-menu-toggle,
  .header-top [data-bs-toggle="offcanvas"],
  .header-top [data-bs-target*="menu"]{
    color:var(--vv-gold) !important;
    border:0; background:transparent; box-shadow:none;
    min-width:46px; min-height:46px;
    display:inline-flex !important; align-items:center; justify-content:center;
    opacity:1;
  }
  .header-top .navbar-toggler-icon{
    filter:invert(78%) sepia(38%) saturate(700%) hue-rotate(2deg) brightness(95%);
  }
  .header-top .material-icons{ color:var(--vv-gold) !important; font-size:26px; }
}

/* --- ricerca: testo chiaro su fondo navy, ovunque --- */
input[type="text"],
input[type="search"],
.search-widget input,
.ps-searchbar input,
.offcanvas input[type="text"],
.offcanvas input[type="search"]{
  color:#F7F5F0;
}
.search-widget input,
.ps-searchbar input,
.offcanvas input[type="search"]{
  background:transparent;
  -webkit-text-fill-color:#F7F5F0;
  caret-color:var(--vv-gold);
  border:0;
  border-bottom:1px solid var(--vv-gold);
  border-radius:0;
}
.search-widget input::placeholder,
.ps-searchbar input::placeholder,
.offcanvas input::placeholder{
  color:rgba(247,245,240,.5);
  -webkit-text-fill-color:rgba(247,245,240,.5);
}

/* il bottone "Annulla" accanto al campo */
.search-widget button,
.ps-searchbar button,
.offcanvas .search-widget .btn{
  color:var(--vv-gold-light) !important;
  background:transparent; border:0;
}

/* autocompletamento del browser: sfondo bianco imposto da Chrome */
.search-widget input:-webkit-autofill,
.ps-searchbar input:-webkit-autofill{
  -webkit-text-fill-color:#F7F5F0;
  -webkit-box-shadow:0 0 0 1000px var(--vv-navy) inset;
}

/* =============================================================
   APPENDICE v1.8.2 — tendine del menu desktop
   Il pannello resta bianco per default: i link avorio della
   sezione 03 vi diventano invisibili. Lo portiamo su navy.
   ============================================================= */
@media(min-width:768px){

  .header-top .sub-menu,
  .header-top .popover,
  .header-top .dropdown-menu,
  .header-top .js-sub-menu,
  .ps-mainmenu .sub-menu,
  .ps-mainmenu .popover{
    background:var(--vv-navy) !important;
    border:1px solid rgba(212,175,55,.22) !important;
    border-radius:0 !important;
    box-shadow:0 20px 48px rgba(9,14,26,.42) !important;
    padding:.5rem 0;
  }

  /* le voci: chiare, leggibili, con separatore tenue */
  .header-top .sub-menu a,
  .header-top .dropdown-menu a,
  .ps-mainmenu .sub-menu a{
    color:rgba(247,245,240,.88) !important;
    font-family:var(--vv-sans); font-weight:300;
    font-size:.74rem; letter-spacing:var(--vv-track-mid);
    text-transform:uppercase;
    display:block; padding:.7rem 1.4rem;
    background:transparent;
    transition:background-color var(--vv-dur) var(--vv-ease),
               color var(--vv-dur) var(--vv-ease),
               padding-left var(--vv-dur) var(--vv-ease);
  }
  
/* =============================================================
   APPENDICE v1.8.4 — mega-menu Hummingbird (.submenu__*)
   Il sottomenu non usa ul/li: sono <a class="submenu__left-item">
   dentro <div class="submenu__left">. Lo stato evidenziato e'
   .active / [aria-selected="true"], non :hover.
   ============================================================= */

.submenu,
.submenu__left,
.submenu__right,
.submenu__content{
  background:var(--vv-navy) !important;
}

.submenu__left-item,
.submenu__right-item,
.submenu a{
  color:rgba(247,245,240,.88) !important;
  background:transparent !important;
  font-family:var(--vv-sans); font-weight:300;
  font-size:.76rem; letter-spacing:var(--vv-track-mid);
  text-transform:uppercase;
  display:block; padding:.85rem 1.4rem;
  border:0; border-radius:0;
  transition:background-color var(--vv-dur) var(--vv-ease),
             color var(--vv-dur) var(--vv-ease),
             padding-left var(--vv-dur) var(--vv-ease);
}

/* voce attiva: era la barra bianca */
.submenu__left-item.active,
.submenu__left-item[aria-selected="true"],
.submenu__right-item.active,
.submenu__right-item[aria-selected="true"]{
  background:#2F3750 !important;
  color:var(--vv-gold-light) !important;
  box-shadow:inset 3px 0 0 var(--vv-gold);
}

/* passaggio del mouse e messa a fuoco da tastiera */
.submenu__left-item:hover,
.submenu__left-item:focus,
.submenu__right-item:hover,
.submenu__right-item:focus,
.submenu a:hover,
.submenu a:focus{
  background:#2F3750 !important;
  color:var(--vv-gold-light) !important;
  padding-left:1.7rem;
}
  /* la voce attiva */
  .header-top .sub-menu li.current > a,
  .ps-mainmenu .sub-menu li.current > a{
    color:var(--vv-gold) !important;
  }

  /* freccia indicatore accanto alle voci di primo livello */
  .header-top .ps-mainmenu .material-icons,
  .header-top .menu .material-icons{
    color:var(--vv-gold) !important;
    font-size:18px;
  }
}

/* --- colonna categorie a sinistra (ps_categorytree): fondo chiaro,
       quindi qui serve il navy sul testo, non l'avorio --- */
#left-column .category-tree a,
#left-column .block-categories a,
.block-categories a{
  color:var(--vv-navy);
  font-family:var(--vv-sans); font-weight:300;
  font-size:.8rem; letter-spacing:.08em;
}
#left-column .category-tree a:hover,
.block-categories a:hover{ color:var(--vv-gold-deep); }
.block-categories li.current > a{ color:var(--vv-gold-deep); font-weight:400; }

/* =============================================================
   APPENDICE v1.9.0 — suggerimenti di ricerca sempre in primo piano
   ============================================================= */

/* jQuery UI assegna un z-index basso: lo portiamo sopra a tutto */
.ui-autocomplete,
.ui-menu,
.ui-front{
  z-index:2000 !important;
  background:var(--vv-navy) !important;
  border:1px solid rgba(212,175,55,.25) !important;
  border-radius:0 !important;
  box-shadow:0 18px 44px rgba(9,14,26,.5) !important;
  padding:.35rem 0 !important;
  max-height:min(60vh, 420px);
  overflow-y:auto;
}

.ui-autocomplete .ui-menu-item,
.ui-autocomplete .ui-menu-item-wrapper,
.ui-autocomplete a{
  color:rgba(247,245,240,.9) !important;
  background:transparent !important;
  border:0 !important;
  font-family:var(--vv-sans); font-weight:300;
  font-size:.82rem; letter-spacing:.04em;
  padding:.6rem 1.1rem !important;
  display:block;
}

.ui-autocomplete .ui-menu-item-wrapper.ui-state-active,
.ui-autocomplete .ui-menu-item-wrapper:hover,
.ui-autocomplete .ui-state-focus,
.ui-autocomplete a:hover{
  background:#2F3750 !important;
  color:var(--vv-gold-light) !important;
  margin:0 !important;
}

/* il termine cercato, che il modulo evidenzia in grassetto */
.ui-autocomplete strong,
.ui-autocomplete .ui-state-highlight{
  color:var(--vv-gold) !important;
  font-weight:400;
  background:transparent !important;
}

/* la barra che ospita il campo deve poter far uscire la lista */
.header-bottom,
.header-bottom__container,
.search-widget,
.ps-searchbar{
  overflow:visible;
}

/* lo slider crea un contesto di impilamento che scavalcava la lista */
#ps_imageslider,
.ps-imageslider{
  position:relative;
  z-index:1;
}

/* =============================================================
   APPENDICE v1.9.1 — campo ricerca: spazio per lente e X
   La sez. 03 azzera il padding dell'input, facendo finire il
   testo digitato sotto l'icona posizionata in assoluto.
   ============================================================= */
.ps-searchbar__form{
  position:relative;
  display:flex; align-items:center;
}

.ps-searchbar__magnifier{
  position:absolute; left:0; top:50%;
  transform:translateY(-50%);
  color:var(--vv-gold);
  font-size:20px; line-height:1;
  pointer-events:none;   /* non deve rubare il clic al campo */
  z-index:2;
}

.ps-searchbar__input{
  padding-left:2rem !important;    /* spazio per la lente */
  padding-right:2.6rem !important; /* spazio per la X */
  width:100%;
}

.ps-searchbar__clear{
  position:absolute; right:0; top:50%;
  transform:translateY(-50%);
  width:34px; height:34px; min-height:0;
  padding:0; border:0; background:transparent; box-shadow:none;
  display:inline-flex; align-items:center; justify-content:center;
  color:rgba(247,245,240,.6);
  z-index:2;
}
.ps-searchbar__clear:hover{
  color:var(--vv-gold-light);
  background:transparent;
}
.ps-searchbar__clear .material-icons{ font-size:19px; }

//Lomazzi 
div.vv-manifesto,
section.ps-customtext {
	margin-top: -10.4rem !important;
}

/* =============================================================
   APPENDICE v1.9.2 — correzione: il testo chiaro vale solo
   nell'header. Ovunque altro i campi tornano leggibili.
   ============================================================= */
input[type="text"],
input[type="search"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
textarea,
select,
.form-control{
  color:#1A2033;
  -webkit-text-fill-color:#1A2033;
  background-color:#fff;
}
input::placeholder,
textarea::placeholder{
  color:rgba(26,32,51,.5);
  -webkit-text-fill-color:rgba(26,32,51,.5);
}

/* solo nell'header il testo resta chiaro */
.header-top input,
.header-bottom input,
.offcanvas input,
.search-widget input,
.ps-searchbar input{
  color:#F7F5F0;
  -webkit-text-fill-color:#F7F5F0;
  background-color:transparent;
}
.header-top input::placeholder,
.header-bottom input::placeholder,
.offcanvas input::placeholder,
.search-widget input::placeholder,
.ps-searchbar input::placeholder{
  color:rgba(247,245,240,.5);
  -webkit-text-fill-color:rgba(247,245,240,.5);
}

/* quantità nel carrello e in pagina prodotto */
.quantity-button input,
input[name="qty"],
.js-cart-line-product-quantity{
  color:#1A2033 !important;
  -webkit-text-fill-color:#1A2033 !important;
  background:#fff !important;
}

/* =============================================================
   VINOVERITAS — APPENDICE v2.0.0
   Scheda del vino: icona sulla card + anteprima rapida ridisegnata

   (c) Lomazzi Federico 2026
   Da incollare IN FONDO a themes/vinoveritas/assets/css/custom.css
   ============================================================= */


/* -------------------------------------------------------------
   1 · L'ICONA SULLA CARD

   Hummingbird mostrava il pulsante solo al passaggio del mouse.
   Qui e' sempre visibile: su telefono e tablet l'hover non esiste,
   ed e' il motivo per cui finora quella funzione c'era ma non la
   usava nessuno.
   ------------------------------------------------------------- */

/* neutralizza la vecchia regola dell'appendice v1.1.0, che mirava
   a una classe mai esistita (.product-miniature__quickview) */
.product-miniature__top .quickview,
.product-miniature__quickview{ all:unset; }

.product-miniature__top .vv-scheda-apri,
.vv-scheda-apri{
  position:absolute;
  top:10px;
  right:10px;
  z-index:3;

  display:inline-flex !important;   /* batte gli hide di Hummingbird su touch */
  align-items:center;
  justify-content:center;
  gap:0;

  width:36px;
  height:36px;
  min-height:0;
  padding:0;

  background:rgba(247,245,240,.94);
  border:1px solid rgba(212,175,55,.75);
  border-radius:50%;
  box-shadow:0 2px 10px rgba(24,34,61,.14);
  color:var(--vv-navy);
  cursor:pointer;

  opacity:1;
  transform:none;
  overflow:hidden;
  transition:background-color var(--vv-dur) var(--vv-ease),
             border-color var(--vv-dur) var(--vv-ease),
             color var(--vv-dur) var(--vv-ease),
             width var(--vv-dur) var(--vv-ease),
             box-shadow var(--vv-dur) var(--vv-ease);
}

.vv-scheda-apri__ico{
  flex:0 0 17px;
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.5;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* la parola compare solo sui dispositivi con puntatore: il cerchio
   si allunga in una pastiglia. Su touch resta il solo cerchio. */
.vv-scheda-apri__t{
  font-family:var(--vv-sans);
  font-weight:400;
  font-size:.6rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  white-space:nowrap;
  max-width:0;
  opacity:0;
  overflow:hidden;
  transition:max-width var(--vv-dur) var(--vv-ease),
             opacity var(--vv-dur) var(--vv-ease),
             margin-left var(--vv-dur) var(--vv-ease);
}

@media (hover:hover) and (pointer:fine){
  .product-miniature:hover .vv-scheda-apri,
  .vv-scheda-apri:hover,
  .vv-scheda-apri:focus-visible{
    width:auto;
    border-radius:50px;
    padding:0 .85rem 0 .7rem;
  }
  .product-miniature:hover .vv-scheda-apri .vv-scheda-apri__t,
  .vv-scheda-apri:hover .vv-scheda-apri__t,
  .vv-scheda-apri:focus-visible .vv-scheda-apri__t{
    max-width:7rem;
    opacity:1;
    margin-left:.5rem;
  }
}

.vv-scheda-apri:hover,
.vv-scheda-apri:focus-visible{
  background:var(--vv-navy);
  border-color:var(--vv-gold);
  color:var(--vv-gold-light);
  box-shadow:0 6px 18px rgba(24,34,61,.28);
}
.vv-scheda-apri:focus-visible{ outline:2px solid var(--vv-gold); outline-offset:2px; }

@media(max-width:575px){
  .vv-scheda-apri{ width:32px; height:32px; top:8px; right:8px; }
  .vv-scheda-apri__ico{ flex-basis:16px; width:16px; height:16px; }
}


/* -------------------------------------------------------------
   2 · IL MODALE — superficie di lettura

   Avorio, non navy: qui si leggono mille caratteri, e il testo
   chiaro su fondo scuro a quella lunghezza stanca.
   ------------------------------------------------------------- */

.quickview .modal-dialog,
.quickview__dialog{
  max-width:min(980px, calc(100vw - 2.5rem));
}

.quickview__content,
.quickview .modal-content{
  background:var(--vv-paper);
  border:1px solid rgba(212,175,55,.45);
  border-radius:0;
  box-shadow:0 32px 80px rgba(9,14,26,.45);
  overflow:hidden;
}

/* filetto oro in testa alla scheda */
.quickview__content::before{
  content:"";
  display:block;
  height:3px;
  background:linear-gradient(90deg,
    var(--vv-gold-deep) 0%, var(--vv-gold) 38%,
    var(--vv-gold-light) 54%, var(--vv-gold) 70%, var(--vv-gold-deep) 100%);
}

.quickview__header,
.quickview .modal-header{
  background:transparent;
  border:0;
  padding:.85rem 1rem 0 1rem;
  min-height:0;
}
.quickview .btn-close{
  opacity:.5;
  transition:opacity var(--vv-dur) var(--vv-ease);
}
.quickview .btn-close:hover{ opacity:1; }

.quickview__body,
.quickview .modal-body{
  display:grid;
  /* la colonna del testo e' la piu' larga: meno righe, meno scorrimento */
  grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);
  gap:clamp(1.2rem,2.6vw,2.2rem);
  padding:clamp(1rem,2.6vw,2rem) clamp(1.3rem,3vw,2.4rem) clamp(1.3rem,3vw,2.2rem);
  background:var(--vv-paper);
}


/* -------------------------------------------------------------
   3 · LA BOTTIGLIA
   ------------------------------------------------------------- */
.quickview .product__left{
  background:var(--vv-ivory);
  border:1px solid var(--vv-line);
  padding:clamp(1rem,2.4vw,2rem);
  display:flex;
  align-items:center;
  justify-content:center;
  align-self:start;
}
.quickview .product__left img{
  width:100%;
  height:auto;
  max-height:38vh;
  object-fit:contain;
  mix-blend-mode:multiply;    /* uniforma i fondi bianchi non identici */
}
/* le miniature sotto la copertina: nella scheda sono rumore */
.quickview .product__left .product-images,
.quickview .product__left .js-qv-product-images{
  display:none;
}


/* -------------------------------------------------------------
   4 · LA COLONNA DI DESTRA
   ------------------------------------------------------------- */
.quickview .product__right{
  display:flex;
  flex-direction:column;
  min-width:0;
}

/* kicker "Scheda del vino" prima del nome */
.quickview .product__right::before{
  content:"Scheda del vino";
  display:flex;
  align-items:center;
  gap:.85rem;
  font-family:var(--vv-sans);
  font-weight:400;
  font-size:.62rem;
  letter-spacing:var(--vv-track-wide);
  text-transform:uppercase;
  color:var(--vv-gold-deep);
  margin-bottom:.9rem;
}
.quickview .product__right::before{
  /* il filetto che prosegue dopo la scritta */
  background:none;
}

.quickview .product__name{
  font-family:var(--vv-display) !important;
  font-weight:400;
  font-size:clamp(1.45rem,2.7vw,2.15rem) !important;
  line-height:1.18;
  letter-spacing:.008em;
  color:var(--vv-navy);
  text-transform:none;
  margin:0 0 .5rem;
}

.quickview .product__manufacturer{
  font-family:var(--vv-sans);
  font-weight:300;
  font-size:.68rem;
  letter-spacing:var(--vv-track-mid);
  text-transform:uppercase;
  margin:0 0 .9rem;
}
.quickview .product__manufacturer a{ color:rgba(26,32,51,.6); }
.quickview .product__manufacturer a:hover{ color:var(--vv-gold-deep); }

/* --- prezzo --- */
.quickview .product__prices,
.quickview .product-prices{
  position:relative;
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:.1rem .7rem;
  padding-top:.9rem;
  margin:0 0 1.2rem;
}
.quickview .product__prices::before,
.quickview .product-prices::before{
  content:"";
  position:absolute;
  left:0; top:0;
  width:44px; height:1px;
  background:var(--vv-gold);
}
.quickview .product__prices .current-price,
.quickview .product-prices .current-price,
.quickview .product-price,
.quickview .current-price-value{
  font-family:var(--vv-display);
  font-weight:600;
  font-size:clamp(1.5rem,2.6vw,2rem);
  letter-spacing:.015em;
  color:var(--vv-gold-deep);
}
.quickview .product__prices .regular-price,
.quickview .product-prices .regular-price{
  font-family:var(--vv-sans);
  font-weight:300;
  font-size:.9rem;
  color:rgba(26,32,51,.42);
  text-decoration:line-through;
  margin-right:.6rem;
}
/* disponibilita' */
.quickview .product-availability,
.quickview .js-product-availability{
  flex:0 0 100%;              /* sempre su una riga propria, sotto il prezzo */
  display:flex;
  align-items:center;
  gap:.5rem;
  font-family:var(--vv-sans);
  font-weight:400;
  font-size:.62rem;
  letter-spacing:var(--vv-track-mid);
  text-transform:uppercase;
  color:#4E7B52;
  margin-top:.45rem;
}


/* -------------------------------------------------------------
   5 · IL TESTO

   I testi hanno una struttura costante. Invece di analizzarli lato
   server, li impaginiamo per quello che sono gia':

      <p>  presentazione
      <p>  degustazione
      <p><strong>Abbinamenti</strong>   -> diventa un titoletto
      <ul> gli abbinamenti              -> elenco con rombo oro
      <p>  servizio                     -> nota finale rientrata
   ------------------------------------------------------------- */

.vv-scheda__testo{
  font-family:var(--vv-sans);
  font-weight:300;
  font-size:.875rem;
  line-height:1.82;
  color:#2A3149;
  margin:0 0 1.3rem;

  /* Il testo scorre dentro il suo riquadro, cosi' "Aggiungi al
     carrello" resta sempre in vista: e' il motivo per cui la scheda
     esiste. Con testi di questa lunghezza su schermo normale ci sta
     tutto senza scorrere; la barra sottile dorata appare solo quando
     serve davvero. */
  max-height:min(54vh, 520px);
  overflow-y:auto;
  padding-right:.8rem;
  scrollbar-width:thin;
  scrollbar-color:rgba(212,175,55,.45) transparent;
}
.vv-scheda__testo::-webkit-scrollbar{ width:5px; }
.vv-scheda__testo::-webkit-scrollbar-thumb{ background:rgba(212,175,55,.45); }

.vv-scheda__testo p{ margin:0 0 .95rem; }
.vv-scheda__testo p:last-child{ margin-bottom:0; }

.vv-scheda__testo strong{
  font-weight:400;
  color:var(--vv-navy);
}

/* --- il titoletto di sezione ---------------------------------
   Lo riconosciamo da cosa lo SEGUE, non da cosa contiene: e' il
   paragrafo immediatamente prima dell'elenco.

   Attenzione: ":has(> strong:only-child)" NON va bene. :only-child
   conta solo gli elementi, e in
       <p><strong>Nome del vino</strong> nasce in Umbria...</p>
   lo <strong> e' l'unico elemento figlio (il resto e' testo), quindi
   anche il primo paragrafo verrebbe trasformato in titolo.
   ------------------------------------------------------------- */
.vv-scheda__testo p:has(+ ul){
  display:flex;
  align-items:center;
  gap:.85rem;
  margin:1.5rem 0 .7rem;
}
.vv-scheda__testo p:has(+ ul)::after{
  content:"";
  flex:1;
  height:1px;
  background:linear-gradient(90deg,rgba(212,175,55,.55),transparent);
}
.vv-scheda__testo p:has(+ ul) strong{
  font-family:var(--vv-sans);
  font-weight:400;
  font-size:.62rem;
  letter-spacing:var(--vv-track-wide);
  text-transform:uppercase;
  color:var(--vv-gold-deep);
  white-space:nowrap;
}

/* --- gli abbinamenti --- */
.vv-scheda__testo ul{
  list-style:none;
  margin:0 0 1.1rem;
  padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:.1rem .9rem;
}
.vv-scheda__testo li{
  position:relative;
  padding:.28rem 0 .28rem 1.15rem;
  font-family:var(--vv-display);
  font-size:1.015rem;
  line-height:1.5;
  color:var(--vv-navy-2);
}
.vv-scheda__testo li::before{
  content:"";
  position:absolute;
  left:0;
  top:.92em;
  width:4px;
  height:4px;
  background:var(--vv-gold);
  transform:rotate(45deg);
}

/* --- la nota di servizio: l'ultimo paragrafo dopo l'elenco --- */
.vv-scheda__testo ul + p{
  margin-top:1.1rem;
  padding:.8rem 0 0 0;
  border-top:1px solid var(--vv-line);
  font-size:.82rem;
  color:rgba(42,49,73,.78);
}


/* -------------------------------------------------------------
   6 · QUANTITA' E CARRELLO
   ------------------------------------------------------------- */
.quickview .product__actions{
  margin-top:auto;
  padding-top:1.1rem;
  border-top:1px solid var(--vv-line);
}
.quickview .product__actions form{ margin:0; }

.quickview .product-add-to-cart,
.quickview .product__add-to-cart{
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
  gap:.7rem;
}

.quickview .quantity-button,
.quickview .product-quantity .input-group{
  flex:0 0 auto;
  border:1px solid var(--vv-line);
  border-radius:0;
  display:flex;
  align-items:stretch;
  min-height:50px;
}
.quickview .quantity-button input,
.quickview input[name="qty"]{
  border:0;
  background:transparent;
  text-align:center;
  width:50px;
  color:#1A2033 !important;
  -webkit-text-fill-color:#1A2033 !important;
  font-family:var(--vv-sans);
  font-weight:400;
  font-size:.95rem;
}
.quickview .quantity-button button{
  background:transparent;
  border:0;
  color:var(--vv-navy);
  padding:0 .85rem;
}
.quickview .quantity-button button:hover{
  background:var(--vv-ivory);
  color:var(--vv-gold-deep);
}

.quickview .add-to-cart,
.quickview button.add-to-cart,
.quickview .product__actions .btn-primary{
  flex:1 1 200px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  min-height:50px;
  padding:.8rem 1.4rem;
  background:#1A223D;
  border:1px solid #1A223D;
  border-radius:0;
  color:var(--vv-gold-light);
  font-family:var(--vv-sans);
  font-weight:400;
  font-size:.68rem;
  letter-spacing:var(--vv-track-wide);
  text-transform:uppercase;
}
.quickview .add-to-cart:hover,
.quickview button.add-to-cart:hover{
  background:var(--vv-gold);
  border-color:var(--vv-gold);
  color:var(--vv-navy-deep);
}
.quickview .add-to-cart:disabled{
  background:rgba(24,34,61,.26);
  border-color:transparent;
  color:rgba(247,245,240,.75);
}


/* -------------------------------------------------------------
   7 · PIEDE
   ------------------------------------------------------------- */
.quickview__footer,
.quickview .modal-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  background:var(--vv-ivory);
  border-top:1px solid var(--vv-line);
  padding:.85rem clamp(1.3rem,3vw,2.6rem);
}
.quickview__details-link{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  font-family:var(--vv-sans);
  font-weight:400;
  font-size:.64rem;
  letter-spacing:var(--vv-track-wide);
  text-transform:uppercase;
  color:var(--vv-navy);
}
.quickview__details-link:hover{ color:var(--vv-gold-deep); }
.quickview__details-link .material-icons{ font-size:17px; }


/* -------------------------------------------------------------
   8 · SCHERMI STRETTI
   ------------------------------------------------------------- */
@media(max-width:767px){
  .quickview__body,
  .quickview .modal-body{
    grid-template-columns:1fr;
    gap:1.1rem;
    padding:1rem 1.1rem 1.3rem;
  }
  .quickview .product__left{
    padding:.9rem;
    max-height:34vh;
  }
  .quickview .product__left img{ max-height:30vh; }
  .vv-scheda__testo{ max-height:none; overflow:visible; padding-right:0; }
  .vv-scheda__testo ul{ grid-template-columns:1fr; }
  .quickview .add-to-cart{ flex:1 1 100%; }
  .quickview__footer,
  .quickview .modal-footer{ padding:.75rem 1.1rem; }
}


/* -------------------------------------------------------------
   9 · RIPIEGO per i browser senza :has()
   Il titoletto non diventa una sezione, ma resta una riga in
   grassetto leggibile. Niente si rompe.
   ------------------------------------------------------------- */
@supports not selector(:has(*)){
  .vv-scheda__testo strong{
    color:var(--vv-gold-deep);
    font-weight:400;
  }
}


/* -------------------------------------------------------------
   10 · MOVIMENTO RIDOTTO
   ------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .vv-scheda-apri,
  .vv-scheda-apri__t{ transition:none !important; }
}