.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-45 .elementor-element.elementor-element-2bd4d8d3{margin:120px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 45px;}.elementor-45 .elementor-element.elementor-element-2bd4d8d3 .elementor-heading-title{font-family:"Arial", Sans-serif;font-size:14px;font-weight:700;letter-spacing:4px;color:#FFFFFF;}.elementor-45 .elementor-element.elementor-element-4871d2ef{margin:30px 40px calc(var(--kit-widget-spacing, 0px) + 20px) 45px;}.elementor-45 .elementor-element.elementor-element-4871d2ef .elementor-heading-title{font-family:"Arial", Sans-serif;font-size:35px;font-weight:700;color:#FFFFFF;}.elementor-widget-icon-list .elementor-icon-list-item:not(:last-child):after{border-color:var( --e-global-color-text );}.elementor-widget-icon-list .elementor-icon-list-icon i{color:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-icon svg{fill:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-item > .elementor-icon-list-text, .elementor-widget-icon-list .elementor-icon-list-item > a{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-icon-list .elementor-icon-list-text{color:var( --e-global-color-secondary );}.elementor-45 .elementor-element.elementor-element-380f681{margin:0px 20px calc(var(--kit-widget-spacing, 0px) + 20px) 10px;--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-45 .elementor-element.elementor-element-380f681 .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-45 .elementor-element.elementor-element-380f681 .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-45 .elementor-element.elementor-element-380f681 .elementor-icon-list-item > .elementor-icon-list-text, .elementor-45 .elementor-element.elementor-element-380f681 .elementor-icon-list-item > a{font-family:"Arial", Sans-serif;font-size:15px;font-weight:600;}.elementor-45 .elementor-element.elementor-element-380f681 .elementor-icon-list-text{text-shadow:0px 0px 0px rgba(0,0,0,0.3);color:#000000;transition:color 0.3s;}.elementor-45 .elementor-element.elementor-element-4a9eb77{border-style:none;}.elementor-45 .elementor-element.elementor-element-4a9eb77 .elementor-heading-title{font-family:"Arial", Sans-serif;font-size:20px;font-weight:700;color:#FFFFFF;}.elementor-45 .elementor-element.elementor-element-15d29f3{--e-filter-direction:column;--e-filter-white-space:initial;--e-filter-align-items:flex-start;--e-filter-item-width:initial;--e-filter-item-max-width:calc(100% - calc(var( --e-filter-item-padding )*3 ) );--e-filter-item-flex-grow:initial;--e-filter-item-box-sizing:initial;--e-filter-item-align-text:start;--e-filter-space-between:10px;--e-filter-normal-text-color:#555555;--e-filter-active-text-color:#233DE2;}.elementor-45 .elementor-element.elementor-element-15d29f3 .e-filter-item{font-family:"Arial", Sans-serif;font-size:15px;font-weight:500;}.elementor-45 .elementor-element.elementor-element-15d29f3 .e-filter-item[aria-pressed="true"]{box-shadow:0px 0px 0px 0px rgba(0,0,0,0.5);}.elementor-45 .elementor-element.elementor-element-7b3c596{margin:160px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 25px;}.elementor-45 .elementor-element.elementor-element-7b3c596 .elementor-heading-title{font-family:"Arial", Sans-serif;font-size:20px;font-weight:700;color:#FFFFFF;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-45 .elementor-element.elementor-element-a0b71b9{margin:30px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 25px;color:#FFFFFF;}.elementor-45 .elementor-element.elementor-element-a0b71b9 a{color:#FFFFFF;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-45 .elementor-element.elementor-element-a434149 .elementor-button{background-color:#FFFFFF;font-family:"Arial", Sans-serif;font-weight:700;fill:#172DE2;color:#172DE2;}.elementor-45 .elementor-element.elementor-element-a434149{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 25px;padding:0px 0px 0px 0px;}.elementor-45 .elementor-element.elementor-element-a434149 .elementor-button-content-wrapper{flex-direction:row-reverse;}.elementor-widget-loop-grid .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-loop-grid .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-loop-grid .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-45 .elementor-element.elementor-element-c73894a{--grid-columns:3;}.elementor-45 .elementor-element.elementor-element-c73894a .elementor-loop-container{grid-auto-rows:1fr;}.elementor-45 .elementor-element.elementor-element-c73894a .e-loop-item > .elementor-section, .elementor-45 .elementor-element.elementor-element-c73894a .e-loop-item > .elementor-section > .elementor-container, .elementor-45 .elementor-element.elementor-element-c73894a .e-loop-item > .e-con, .elementor-45 .elementor-element.elementor-element-c73894a .e-loop-item .elementor-section-wrap  > .e-con{height:100%;}body.elementor-page-45{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}@media(max-width:1024px){.elementor-45 .elementor-element.elementor-element-c73894a{--grid-columns:2;}}@media(max-width:767px){.elementor-45 .elementor-element.elementor-element-c73894a{--grid-columns:1;}}/* Start custom CSS for taxonomy-filter, class: .elementor-element-15d29f3 */<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Catálogo de Productos</title>
  <style>
    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    }

    body {
      background-color: #f8f9fa;
      padding: 24px;
    }

    /* Contenedor que llena todo el espacio disponible */
    .catalogo-grid {
      display: grid;
      /* Se adapta automáticamente: crea tantas columnas como quepan */
      grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
      gap: 24px;
      width: 100%;
      max-width: 1400px;
      margin: 0 auto;
    }

    /* Estilo de la tarjeta */
    .producto-card {
      background: #ffffff;
      border-radius: 12px;
      border: 1px solid #e2e8f0;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    .producto-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
    }

    /* Imagen superior */
    .producto-imagen {
      width: 100%;
      height: 200px;
      object-fit: cover;
      display: block;
    }

    /* Contenido interior */
    .producto-contenido {
      padding: 20px;
      display: flex;
      flex-direction: column;
      flex-grow: 1;
    }

    .producto-titulo {
      color: #1a4fcf;
      font-size: 1.1rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.5px;
      margin-bottom: 12px;
    }

    .producto-descripcion {
      color: #334155;
      font-size: 0.88rem;
      line-height: 1.5;
      margin-bottom: 24px;
      flex-grow: 1;
    }

    /* Botón de acción */
    .producto-boton {
      align-self: center;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      background-color: #1a4fcf;
      color: #ffffff;
      text-decoration: none;
      font-size: 0.9rem;
      font-weight: 600;
      padding: 10px 22px;
      border-radius: 8px;
      transition: background-color 0.2s ease;
      cursor: pointer;
    }

    .producto-boton:hover {
      background-color: #133ea8;
    }

    .producto-boton svg {
      width: 18px;
      height: 18px;
      fill: currentColor;
    }
  </style>
</head>
<body>

  <!-- Contenedor principal que llena todo el espacio disponible -->
  <main class="catalogo-grid">

    <!-- Tarjeta 1 -->
    <article class="producto-card">
      <img class="producto-imagen" src="https://images.unsplash.com/photo-1589939705384-5185137a7f0f?w=600&auto=format&fit=crop" alt="Corcho enjebado">
      <div class="producto-contenido">
        <h2 class="producto-titulo">CORCHO ENJEBADO</h2>
        <p class="producto-descripcion">
          Corcho enjebado compuesto de corcho con inserciones de caucho, con buena compresibilidad, flexibilidad y resistencia a aceites, combustibles, ácidos y condiciones meteorológicas. Ideal para juntas automotrices e industriales.
        </p>
        <a href="#" class="producto-boton">
          <svg viewBox="0 0 24 24">
            <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 14h-2v-4H8l4-4 4 4h-3v4z" transform="rotate(90 12 12)"/>
          </svg>
          Ver producto
        </a>
      </div>
    </article>

    <!-- Tarjeta 2 -->
    <article class="producto-card">
      <img class="producto-imagen" src="https://images.unsplash.com/photo-1589939705384-5185137a7f0f?w=600&auto=format&fit=crop" alt="Corcho enjebado">
      <div class="producto-contenido">
        <h2 class="producto-titulo">CORCHO ENJEBADO</h2>
        <p class="producto-descripcion">
          Corcho enjebado compuesto de corcho con inserciones de caucho, con buena compresibilidad, flexibilidad y resistencia a aceites, combustibles, ácidos y condiciones meteorológicas. Ideal para juntas automotrices e industriales.
        </p>
        <a href="#" class="producto-boton">
          <svg viewBox="0 0 24 24">
            <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 14h-2v-4H8l4-4 4 4h-3v4z" transform="rotate(90 12 12)"/>
          </svg>
          Ver producto
        </a>
      </div>
    </article>

    <!-- Tarjeta 3 -->
    <article class="producto-card">
      <img class="producto-imagen" src="https://images.unsplash.com/photo-1589939705384-5185137a7f0f?w=600&auto=format&fit=crop" alt="Corcho enjebado">
      <div class="producto-contenido">
        <h2 class="producto-titulo">CORCHO ENJEBADO</h2>
        <p class="producto-descripcion">
          Corcho enjebado compuesto de corcho con inserciones de caucho, con buena compresibilidad, flexibilidad y resistencia a aceites, combustibles, ácidos y condiciones meteorológicas. Ideal para juntas automotrices e industriales.
        </p>
        <a href="#" class="producto-boton">
          <svg viewBox="0 0 24 24">
            <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 14h-2v-4H8l4-4 4 4h-3v4z" transform="rotate(90 12 12)"/>
          </svg>
          Ver producto
        </a>
      </div>
    </article>

    <!-- Tarjeta 4 -->
    <article class="producto-card">
      <img class="producto-imagen" src="https://images.unsplash.com/photo-1589939705384-5185137a7f0f?w=600&auto=format&fit=crop" alt="Corcho enjebado">
      <div class="producto-contenido">
        <h2 class="producto-titulo">CORCHO ENJEBADO</h2>
        <p class="producto-descripcion">
          Corcho enjebado compuesto de corcho con inserciones de caucho, con buena compresibilidad, flexibilidad y resistencia a aceites, combustibles, ácidos y condiciones meteorológicas. Ideal para juntas automotrices e industriales.
        </p>
        <a href="#" class="producto-boton">
          <svg viewBox="0 0 24 24">
            <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 14h-2v-4H8l4-4 4 4h-3v4z" transform="rotate(90 12 12)"/>
          </svg>
          Ver producto
        </a>
      </div>
    </article>

  </main>

</body>
</html>/* End custom CSS */