/* ======================================================
   PRODUCT – Madéa v1.02
   Layout editoriale derivato dal vecchio product.css
   ====================================================== */

.product-page {
  background: #fbfaf8;
  padding: 44px 20px 90px;
}

.product-page__wrap {
  width: min(1400px, calc(100% - 40px));
  margin: 0 auto;
}

.product-breadcrumb {
  margin-bottom: 18px;
  font-family: "Manrope", sans-serif;
  font-size: 10px;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(20,20,20,.58);
}

.product-breadcrumb a:hover {
  color: #b2142a;
}

.product-breadcrumb span {
  margin: 0 6px;
}

.product-book {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 26px;
  align-items: stretch;
}

.product-book__media,
.product-book__info {
  min-height: 720px;
  background: #f6f1ee;
  border: 1px solid rgba(20,20,20,.10);
}

.product-book__media {
  overflow: hidden;
}

.product-book__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-book__info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(54px, 7vw, 90px);
}

.product-book__kicker {
  margin-bottom: 18px;
  color: #b2142a;
  font-family: "Manrope", sans-serif;
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
}

.product-book__title {
  margin: 0 0 20px;
  font-family: "Playfair Display", serif;
  font-size: clamp(42px, 5vw, 58px);
  line-height: 1.02;
  font-weight: 600;
  color: #111;
}

.product-book__desc {
  max-width: 560px;
  margin: 0 0 24px;
  font-family: "Manrope", sans-serif;
  font-size: 13px;
  line-height: 1.8;
  color: #4a4a4a;
}

.product-book__meta {
  max-width: 560px;
  margin-top: 8px;
  padding-top: 20px;
  border-top: 1px solid rgba(20,20,20,.10);
}

.product-book__price {
  font-family: "Manrope", sans-serif;
  font-size: 15px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.product-book__micro {
  margin-top: 8px;
  color: rgba(20,20,20,.58);
  font-family: "Manrope", sans-serif;
  font-size: 10px;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.product-book__field {
  max-width: 560px;
  margin-top: 22px;
}

.product-book__field label {
  display: block;
  margin-bottom: 8px;
  font-family: "Manrope", sans-serif;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(20,20,20,.65);
}

.product-book__field select,
.product-book__field input {
  width: 100%;
  min-height: 44px;
  border-radius: 12px;
  background: #fff;
}

.product-book__buy {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 12px;
  align-items: end;
  max-width: 560px;
}

.product-book__buy .btn {
  min-height: 44px;
}

.product-book__notes {
  display: grid;
  gap: 7px;
  max-width: 560px;
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid rgba(20,20,20,.10);
  font-family: "Manrope", sans-serif;
  font-size: 10px;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: rgba(20,20,20,.58);
}

.product-book__back {
  width: fit-content;
  margin-top: 30px;
  font-family: "Manrope", sans-serif;
  font-size: 10px;
  letter-spacing: .10em;
  text-transform: uppercase;
  border-bottom: 1px solid currentColor;
}

.product-not-found {
  padding: 90px 0;
  text-align: center;
}

.product-not-found__kicker {
  color: #b2142a;
  font-family: "Manrope", sans-serif;
  font-size: 11px;
  letter-spacing: .22em;
  text-transform: uppercase;
}

.product-not-found h1 {
  margin: 10px 0;
  font-family: "Playfair Display", serif;
  font-size: 48px;
}

@media (max-width: 900px) {
  .product-book {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .product-book__media {
    min-height: 500px;
  }

  .product-book__info {
    min-height: auto;
    padding: 50px 34px;
  }
}

@media (max-width: 560px) {
  .product-page {
    padding: 28px 14px 60px;
  }

  .product-page__wrap {
    width: 100%;
  }

  .product-book__media {
    min-height: 380px;
  }

  .product-book__info {
    padding: 38px 22px;
  }

  .product-book__buy {
    grid-template-columns: 1fr;
  }

  .product-book__field--qty {
    max-width: 120px;
  }
}


/* ======================================================
   Madéa v1.12 — DETTAGLIO PRODOTTO
   ====================================================== */

.product-book__subtitle {
  max-width: 560px;
  margin: -8px 0 18px;
  font-family: "Manrope", sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.55;
  color: #292929;
}

.product-book__format {
  margin-top: 7px;
  font-family: "Manrope", sans-serif;
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(20,20,20,.58);
}

.product-detail-section {
  display: grid;
  grid-template-columns: minmax(180px, .32fr) minmax(0, 1fr);
  gap: 50px;
  padding: 70px 0;
  border-bottom: 1px solid rgba(20,20,20,.10);
}

.product-detail-section__label {
  font-family: "Manrope", sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #b2142a;
}

.product-detail-section__content {
  max-width: 860px;
}

.product-detail-section__content--prose p {
  margin: 0 0 20px;
  font-family: "Manrope", sans-serif;
  font-size: 14px;
  line-height: 1.85;
  color: #3f3f3f;
}

.product-feature-list {
  margin: 0;
  padding: 0;
  list-style: none;
  columns: 2;
  column-gap: 45px;
}

.product-feature-list li {
  break-inside: avoid;
  margin: 0 0 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(20,20,20,.08);
  font-family: "Manrope", sans-serif;
  font-size: 13px;
  line-height: 1.55;
}

.product-inci {
  margin: 0;
  font-family: "Manrope", sans-serif;
  font-size: 12px;
  line-height: 1.85;
  color: #565656;
}

.product-gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.product-gallery img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

@media (max-width: 760px) {
  .product-detail-section {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 48px 0;
  }

  .product-feature-list {
    columns: 1;
  }

  .product-gallery {
    grid-template-columns: 1fr;
  }
}


/* Madéa v1.64 — due azioni affiancate nella scheda prodotto. */
.product-book__actions {
  display: flex;
  align-items: stretch;
  gap: 10px;
  width: 100%;
  margin-top: 28px;
}

.product-book__actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 0;
  min-width: 0;
  min-height: 44px;
  margin: 0;
  text-align: center;
  cursor: pointer;
}

.product-book__actions .btn:disabled {
  cursor: default;
  opacity: .72;
}

@media (max-width: 560px) {
  .product-book__actions {
    flex-direction: column;
    gap: 10px;
  }

  .product-book__actions .btn {
    width: 100%;
    flex: 0 0 auto;
  }
}
\n\n/* ======================================================\n   Madéa v1.70 — GALLERIA PRODOTTO\n   immagine principale + miniature + navigazione\n   ====================================================== */\n\n.product-book__visual {\n  min-width: 0;\n}\n\n.product-book__visual .product-book__media {\n  position: relative;\n}\n\n.product-gallery-main img {\n  display: block;\n  transition: opacity .18s ease;\n}\n\n.product-gallery-main.is-changing img {\n  opacity: .55;\n}\n\n.product-gallery-nav {\n  position: absolute;\n  top: 50%;\n  z-index: 3;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 42px;\n  height: 42px;\n  padding: 0;\n  border: 1px solid rgba(23,21,18,.16);\n  border-radius: 50%;\n  color: #171512;\n  background: rgba(255,255,255,.88);\n  box-shadow: 0 5px 20px rgba(23,21,18,.08);\n  font-family: Arial, sans-serif;\n  font-size: 30px;\n  font-weight: 300;\n  line-height: 1;\n  cursor: pointer;\n  transform: translateY(-50%);\n  transition: background .2s ease, transform .2s ease;\n}\n\n.product-gallery-nav:hover {\n  background: #fff;\n}\n\n.product-gallery-nav--prev {\n  left: 18px;\n}\n\n.product-gallery-nav--next {\n  right: 18px;\n}\n\n.product-gallery-strip {\n  padding: 20px 8px 0;\n}\n\n.product-gallery-strip__label {\n  margin-bottom: 16px;\n  color: #b2142a;\n  font-family: "Manrope", sans-serif;\n  font-size: 10px;\n  font-weight: 600;\n  letter-spacing: .18em;\n  text-transform: uppercase;\n}\n\n.product-gallery-thumbs {\n  display: flex;\n  gap: 12px;\n  overflow-x: auto;\n  padding: 0 0 6px;\n  scrollbar-width: thin;\n}\n\n.product-gallery-thumb {\n  position: relative;\n  flex: 0 0 96px;\n  width: 96px;\n  height: 116px;\n  padding: 0;\n  overflow: hidden;\n  border: 1px solid transparent;\n  background: #fff;\n  cursor: pointer;\n  opacity: .72;\n  transition: opacity .2s ease, border-color .2s ease;\n}\n\n.product-gallery-thumb:hover,\n.product-gallery-thumb.is-active {\n  opacity: 1;\n}\n\n.product-gallery-thumb.is-active {\n  border-color: #171512;\n}\n\n.product-gallery-thumb img {\n  display: block;\n  width: 100%;\n  height: 100%;\n  object-fit: cover;\n}\n\n@media (max-width: 900px) {\n  .product-book__visual {\n    margin-bottom: 0;\n  }\n\n  .product-gallery-strip {\n    padding: 18px 0 28px;\n  }\n}\n\n@media (max-width: 560px) {\n  .product-gallery-nav {\n    width: 36px;\n    height: 36px;\n    font-size: 26px;\n  }\n\n  .product-gallery-nav--prev {\n    left: 10px;\n  }\n\n  .product-gallery-nav--next {\n    right: 10px;\n  }\n\n  .product-gallery-thumb {\n    flex-basis: 76px;\n    width: 76px;\n    height: 92px;\n  }\n}\n

/* ======================================================
   Madéa v1.71 — GALLERIA PRODOTTO
   immagine più compatta · miniature sotto · frecce on hover
   ====================================================== */

.product-book__visual {
  min-width: 0;
}

.product-book__visual .product-book__media.product-gallery-main {
  position: relative;
  min-height: 0;
  height: clamp(540px, 47vw, 640px);
  background: #f6f1ee;
}

.product-book__visual .product-book__media.product-gallery-main > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Le frecce sono centrali sui lati e nascoste finché il mouse non entra sulla foto */
.product-gallery-nav {
  top: 50%;
  width: 42px;
  height: 42px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-50%);
  transition:
    opacity .18s ease,
    visibility .18s ease,
    background .18s ease;
}

.product-gallery-main:hover .product-gallery-nav,
.product-gallery-main:focus-within .product-gallery-nav {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.product-gallery-nav--prev {
  left: 16px;
}

.product-gallery-nav--next {
  right: 16px;
}

/* Miniature immediatamente sotto l'immagine principale */
.product-gallery-strip {
  padding: 16px 0 0;
}

.product-gallery-strip__label {
  margin: 0 0 12px;
}

.product-gallery-thumbs {
  display: flex;
  align-items: center;
  gap: 10px;
  overflow-x: auto;
  padding: 0 0 6px;
}

.product-gallery-thumb {
  flex: 0 0 78px;
  width: 78px;
  height: 94px;
  border: 1px solid rgba(23,21,18,.12);
  opacity: .68;
  background: #fff;
}

.product-gallery-thumb:hover,
.product-gallery-thumb.is-active {
  opacity: 1;
}

.product-gallery-thumb.is-active {
  border-color: #171512;
}

.product-gallery-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Su dispositivi touch non esiste un vero hover: manteniamo i controlli utilizzabili. */
@media (hover: none), (pointer: coarse) {
  .product-gallery-nav {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
}

@media (max-width: 900px) {
  .product-book__visual .product-book__media.product-gallery-main {
    height: clamp(480px, 78vw, 620px);
  }

  .product-gallery-strip {
    padding-top: 14px;
  }
}

@media (max-width: 560px) {
  .product-book__visual .product-book__media.product-gallery-main {
    height: clamp(360px, 110vw, 500px);
  }

  .product-gallery-nav {
    width: 36px;
    height: 36px;
    font-size: 26px;
  }

  .product-gallery-nav--prev {
    left: 10px;
  }

  .product-gallery-nav--next {
    right: 10px;
  }

  .product-gallery-thumb {
    flex-basis: 66px;
    width: 66px;
    height: 80px;
  }
}


/* ======================================================
   Madéa v1.72 — CONTROLLI GALLERIA MINIMAL
   < a sinistra · > a destra · centrati verticalmente
   ====================================================== */

.product-gallery-main {
  position: relative;
}

.product-gallery-nav {
  position: absolute;
  top: 50% !important;
  z-index: 6;

  display: flex;
  align-items: center;
  justify-content: center;

  width: 52px;
  height: 88px;
  padding: 0;

  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  color: #171512;
  background: rgba(255,255,255,.20);

  font-family: "Helvetica Neue", Arial, sans-serif;
  font-size: 38px;
  font-weight: 200;
  line-height: 1;

  cursor: pointer;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;

  transform: translateY(-50%) !important;

  transition:
    opacity .18s ease,
    visibility .18s ease,
    background .18s ease,
    color .18s ease;
}

.product-gallery-main:hover .product-gallery-nav,
.product-gallery-main:focus-within .product-gallery-nav {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.product-gallery-nav:hover,
.product-gallery-nav:focus-visible {
  background: rgba(255,255,255,.78);
  color: #000;
  outline: none;
}

.product-gallery-nav--prev {
  left: 0 !important;
  right: auto !important;
}

.product-gallery-nav--next {
  right: 0 !important;
  left: auto !important;
}

/* Area touch: controlli sempre disponibili, sempre al centro dei lati */
@media (hover: none), (pointer: coarse) {
  .product-gallery-nav {
    opacity: .88;
    visibility: visible;
    pointer-events: auto;
    width: 44px;
    height: 76px;
    background: rgba(255,255,255,.48);
  }
}

@media (max-width: 560px) {
  .product-gallery-nav {
    width: 40px;
    height: 68px;
    font-size: 32px;
  }
}


/* ======================================================
   Madéa v1.73 — FOTO PRINCIPALE DOPO SELEZIONE
   desktop: immagine visualizzata all'80% · mobile invariato
   ====================================================== */

@media (min-width: 901px) {
  .product-gallery-main.has-selected-image > img {
    width: 80%;
    height: 80%;
    margin: auto;
    object-fit: contain;
  }
}

/* Mobile e tablet mantengono il comportamento precedente */
@media (max-width: 900px) {
  .product-gallery-main.has-selected-image > img {
    width: 100%;
    height: 100%;
    margin: 0;
    object-fit: cover;
  }
}


/* ======================================================
   Madéa v1.74 — IMMAGINE PRINCIPALE INTERA
   nessun ritaglio sopra/sotto
   ====================================================== */

/* L'immagine principale viene sempre mostrata per intero */
.product-book__visual .product-book__media.product-gallery-main > img {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  object-position: center center;
}

/* Dopo la selezione, desktop: resta all'80% ma sempre intera */
@media (min-width: 901px) {
  .product-gallery-main.has-selected-image > img {
    width: 80%;
    height: 80%;
    margin: auto;
    object-fit: contain !important;
    object-position: center center;
  }
}

/* Mobile/tablet: immagine intera senza tagli */
@media (max-width: 900px) {
  .product-gallery-main.has-selected-image > img,
  .product-book__visual .product-book__media.product-gallery-main > img {
    width: 100%;
    height: 100%;
    margin: 0;
    object-fit: contain !important;
    object-position: center center;
  }
}


/* ======================================================
   Madéa v1.75 — FOTO PRODOTTO 100% + PROPORZIONE REALE
   riferimento immagini circa 1025 x 1239 (~5:6)
   ====================================================== */

/* Il riquadro sinistro segue una proporzione vicina alle foto reali */
.product-book__visual .product-book__media.product-gallery-main {
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  aspect-ratio: 1025 / 1239;
  background: #f6f1ee;
}

/* Foto sempre al 100%, completa e non ritagliata */
.product-book__visual .product-book__media.product-gallery-main > img,
.product-gallery-main.has-selected-image > img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  object-fit: contain !important;
  object-position: center center !important;
}

/* Desktop: annulla la riduzione all'80% introdotta in precedenza */
@media (min-width: 901px) {
  .product-gallery-main.has-selected-image > img {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
  }
}

/* Mobile e tablet mantengono la stessa logica: 100% e foto intera */
@media (max-width: 900px) {
  .product-book__visual .product-book__media.product-gallery-main {
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 1025 / 1239;
  }

  .product-gallery-main.has-selected-image > img,
  .product-book__visual .product-book__media.product-gallery-main > img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }
}