/* Prioriza la ficha técnica: producto e información quedan en zonas separadas. */
@media (min-width: 861px) {
  .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .product-card { display: grid; grid-template-columns: 42% 58%; min-height: 330px; }
  .product-image { height: 100%; min-height: 330px; padding: 28px; border-right: 1px solid #e6e6e3; }
  .product-card > div:last-child { display: flex; flex-direction: column; justify-content: center; padding: 34px; }
  .product-type { margin-bottom: 10px; font-size: .72rem; }
  .product-card h3 { margin-bottom: 15px; font-size: 1.8rem; line-height: 1.02; }
  .product-card p:last-child { font-size: .92rem; line-height: 1.6; }
}

@media (max-width: 860px) {
  .product-card { background: #fff; border: 1px solid #dedfe2; }
  .product-image { height: auto; padding: 28px 24px; overflow: visible; border-bottom: 1px solid #dedfe2; }
  .product-image img { display: block; width: auto; height: auto; max-width: 100%; max-height: none; margin: 0 auto; object-fit: initial; }
  .product-card > div:last-child { padding: 24px 22px 26px; border-top: 4px solid var(--orange); }
  .product-type { margin-bottom: 9px; font-size: .72rem; }
  .product-card h3 { font-size: 1.65rem; line-height: 1.04; margin-bottom: 12px; }
  .product-card p:last-child { font-size: .92rem; line-height: 1.6; }
}

/* Logotipo de encabezado construido en HTML/CSS a partir de la identidad de LTP. */
.brand-mark { display: flex; width: 285px; flex-direction: column; color: #fff; font-family: "Barlow Condensed", Arial, sans-serif; line-height: 1; }
.brand-mark .brand-top { display: flex; height: 31px; align-items: center; white-space: nowrap; }
.brand-mark strong { margin-right: 7px; font-size: 2.22rem; font-style: italic; font-weight: 700; letter-spacing: -.08em; transform: skew(-8deg); }
.brand-slashes { display: flex; gap: 3px; align-items: center; margin-right: 5px; }
.brand-slashes i { display: block; width: 10px; height: 23px; background: var(--orange); transform: skew(-20deg); }
.brand-company { align-self: end; margin-bottom: 2px; font-size: 1.43rem; font-weight: 700; letter-spacing: -.04em; }
.brand-tagline { margin: 2px 0 0 3px; font-size: .88rem; font-style: italic; font-weight: 600; letter-spacing: .02em; }
@media (max-width: 520px) { .brand-mark { width: 215px; }.brand-mark .brand-top { height: 25px; }.brand-mark strong { margin-right: 5px; font-size: 1.82rem; }.brand-slashes { gap: 2px; margin-right: 4px; }.brand-slashes i { width: 7px; height: 18px; }.brand-company { font-size: 1.15rem; }.brand-tagline { font-size: .69rem; } }