/* Generated from the supplied Epinpro archive. See tests/Browser/import-epinpro-home.cjs. */
.home-epin .epin-group{margin-top:32px;margin-bottom:32px}.home-epin .section-title{display:flex;align-items:center;gap:12px;font-family:var(--font-heading);font-size:20px;font-weight:700;text-transform:uppercase;letter-spacing:0;color:var(--ep-text-prim)}.home-epin .section-banner-overlay{position:absolute;inset:0;background:linear-gradient(90deg,#11172a,#11172a 38%,rgba(17,23,42,.85) 50%,rgba(17,23,42,.4) 62%,rgba(17,23,42,0) 75%)}
        .home-epin .cat-product-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
        @media (max-width: 1024px){
          .home-epin .cat-product-grid { grid-template-columns: repeat(5, 1fr); }}
        @media (max-width: 768px){
          .home-epin .cat-product-grid { grid-template-columns: repeat(4, 1fr); }}
        @media (max-width: 560px){
          .home-epin .cat-product-grid { grid-template-columns: repeat(3, 1fr); }}
        @media (max-width: 480px){
          .home-epin .cat-product-grid { grid-template-columns: repeat(2, 1fr); }}
        .home-epin .epin-header{position: relative; height: 72px; border-radius: 8px; overflow: hidden; margin-bottom: 16px; background-color: var(--ep-bg-surface)}
        .home-epin .epin-banner{position: absolute; inset: 0px; background-size: cover; background-position: center center; background-repeat: no-repeat}
        .home-epin .epin-inner{position: relative; z-index: 2; height: 100%; display: flex; align-items: center; padding: 0px 20px}
        .home-epin .epin-logo{width: 26px; height: 26px; object-fit: contain; flex-shrink: 0}
        .home-epin .epin-card{background: var(--ep-bg-surface); border: 1px solid var(--ep-border); border-radius: 10px; overflow: hidden; transition: border-color 0.2s, transform 0.2s, box-shadow 0.2s; cursor: pointer; display: flex; flex-direction: column; height: 100%}
        .home-epin .epin-media{position: relative; padding-top: 122%; background: rgb(13, 17, 23); overflow: hidden; flex-shrink: 0}
        .home-epin .epin-image{position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover}
        .home-epin .epin-body{padding: 10px; display: flex; flex-direction: column; gap: 8px; flex: 1 1 0%}
        .home-epin .epin-name{margin: 0px; font-size: 12px; font-weight: 600; color: var(--ep-text-primary); line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 34px}
        .home-epin .epin-bottom{margin-top: auto; display: flex; flex-direction: column; gap: 8px}
        .home-epin .epin-price{margin: 0px; font-size: 15px; font-weight: 700; color: var(--ep-primary, #1FB6F0); line-height: 1.2}
        .home-epin .epin-button{width: 100%; background: linear-gradient(135deg, rgb(31, 182, 240) 0%, rgb(107, 47, 181) 100%); color: rgb(255, 255, 255); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; border-radius: 8px; padding: 9px 0px; font-size: 12px; font-weight: 700; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 6px; letter-spacing: 0; transition: opacity 0.15s; box-shadow: rgba(31, 182, 240, 0.25) 0px 2px 8px}
        .home-epin .epin-original{margin: 0px; font-size: 11px; color: var(--ep-text-muted); text-decoration: line-through; line-height: 1.2}
        .home-epin .epin-discount{position: absolute; top: 8px; right: 8px; background: rgb(229, 62, 62); color: rgb(255, 255, 255); font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 6px; line-height: 1}
