/* ================================================================
   LAYOUT GENERALE E TIPOGRAFIA (no flex)
================================================================ */
html, body { margin: 0; padding: 0; }
body {
  font-family: Poppins, Arial, sans-serif;
  background: #fafafa;
  color: #111;
}
#catalogue-container {
  max-width: 960px;
  margin: 0 auto;
  padding: 20px;
}

/* Logo */
.logo-img {
  width: 100%;
  height: auto;
  object-fit: contain;
  margin: 40px 0px;
  display: block;
}
.logo-piccolo{
  width: 400px;
  height: auto;
  object-fit: contain;
  margin: 40px 0px;
  display: block;
}

/* Pulsante Download PDF */
.download-button {
  background: #0073aa;
  color: #fff;
  border: none;
  padding: 10px 20px;
  border-radius: 6px;
  cursor: pointer;
  margin: 20px auto;
  display: block;
  font-size: 14px;
}
.download-button:hover { background: #005f8d; }

/* ================================================================
   FOOTER on-screen (in stampa nascosto) – no flex
================================================================ */
#pdf-footer, #pdf-header {
  display: block;
  position: sticky;
  bottom: 0;
  left: 0; right: 0;
  z-index: 10;
  background: #fff;
  border-top: 1px solid #e5e5e5;
}

.footer-inner, .header-inner {
  max-width: 960px;
  margin: 0 auto;
  padding: 12px 20px;
  display: table;        /* tabella per allineare sx/dx */
  width: 100%;
  font-size: 12px;
  color: #444;
}
.footer-left,
.footer-right {
  display: table-cell;
  vertical-align: middle;
}
.footer-right { text-align: right; }

/* Contenitore principale */
#catalogue { padding: 40px 0; }
.page-break { page-break-after: always; }

/* ================================================================
   COPERTINA E PAGINE SEZIONE – no flex, centrate via table-cell
================================================================ */
.page, .pdf-page {
  width: 794px;       /* A4 verticale @96dpi */
  min-height: 1123px; /* A4 verticale */
  padding-top:20px;
  background: #fff;
  display: block;
  padding: 20px !important;
  margin: 0 auto 20px;
  page-break-after: always;
  /* niente height fissa: evita tagli e drift */
}
.pdf-page img {
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.cover-page,
.section-cover {
  display: table;
  text-align: center;
}
.cover-content,
.section-cover-content {
  display: table-cell;
  vertical-align: middle;
  padding: 60px 20px;
}
.cover-content { max-width: 700px; margin: 0 auto; }
.cover-text p { font-size: 14px; line-height: 1.5; color: #333; }

.cover-title { font-size: 36px; margin: 0 0 8px; color: #111; }
.cover-subtitle { font-size: 20px; color: #555; margin-bottom: 6px; }
.cover-date { font-size: 14px; color: #777; }

.section-cover-title { font-size: 28px; color: #111; font-weight: 600; }
.section-cover-subtitle { font-size: 16px; color: #555; margin-top: 8px; }

/* ================================================================
   CARD PRODOTTO / APPLICATORE – layout a tabella (no flex)
================================================================ */
.product-card {
  display: table;
  width: 100%;
  table-layout: fixed;
  border: 0;
  padding: 0;
  border-radius: 10px;
  margin-bottom: 20px;
  page-break-inside: avoid;
  background: #fff;
}

.product-image {
  display: table-cell;
  width: 200px;                 /* colonna immagine fissa */
  vertical-align: top;
  padding-right: 20px;
}
.product-image-inner {
  width: 200px;
  height: 200px;
  border: 1px solid #ddd;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}
.product-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  background: #fff;
}

.product-details {
  display: table-cell;
  vertical-align: top;
}

.product-title {
  font-size: 18px;
  margin: 0 0 10px;
  color: #222;
  line-height: 1.3;
}
.product-categories {
  font-size: 14px;
  margin: 0 0 10px;
  color: #222;
  line-height: 1.3;
}
.product-description {
  font-size: 14px;
  color: #333;
  margin: 8px 0;
}

/* product-acf senza flex: elementi inline-block */
.product-acf {
  list-style: none;
  padding: 0;
  margin: 10px 0;
  font-size: 14px;
}
.product-acf li {
  display: inline-block;
  margin: 0 24px 8px 0;
}

/* ================================================================
   TASSONOMIE (Capsule compatibili) – no flex
================================================================ */
.taxonomy-block {
  margin-top: 16px;
  border-top: 1px solid #eee;
  padding-top: 12px;
}
.taxonomy-title {
  font-size: 16px;
  margin: 0 0 8px;
  color: #222;
}

/* griglia semplice con inline-block invece di flex */
.taxonomy-items { font-size: 0; } /* fix spazi tra inline-block */
.taxonomy-item {
  display: inline-block;
  vertical-align: top;
  width: 100px;
  text-align: center;
  margin: 0 10px 10px 0;
  font-size: 13px; /* ripristina font-size */
}
.taxonomy-image {
  width: 50px; height: 50px;
  border-radius: 50%;
  overflow: hidden;
  border: 1px solid #ddd;
  margin: 0 auto;
  background: #fff;
}
.taxonomy-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
}
.taxonomy-name {
  font-weight: 600;
  margin-top: 6px;
  font-size: 13px;
  color: #111;
}
.taxonomy-desc {
  font-size: 12px;
  color: #555;
  margin-top: 2px;
}

/* ================================================================
   CHIUSURA – no flex
================================================================ */
.closing-content{
  text-align: center;
  padding: 40px 20px;
}
.closing-div{
  /* due colonne: logo + contatti con inline-block */
  font-size: 0; /* elimina gap tra inline-block */
}
.closing-div .logo-img,
.closing-div .contact-list {
  display: inline-block;
  vertical-align: top;
  font-size: 14px; /* ripristina */
}
.closing-div .contact-list { text-align:start; margin:40px 0px; padding-left: 16px; }
.qr-img{
  width: 256px; height: auto; object-fit: contain; margin: 40px 0px; display: block;
}