@page { margin: 130px 30px 130px 30px; }
header { position: fixed; top: -110px; left: 0px; right: 0px; height: 85px; background-color: #ffffff; border-bottom: 2px solid #333333; padding-bottom: 10px; }
footer { position: fixed; bottom: -110px; left: 0px; right: 0px; height: 90px; padding-top: 15px; border-top: 2px solid #333333; font-size: 10px; color: #333333; }
.page-number:after { content: counter(page); }
.header-table { width: 100%; border-collapse: collapse; height: 85px; }
.header-table td { vertical-align: middle; color: #2d3748; }
.logo-img { max-height: 60px; max-width: 180px; }
.company-name { font-size: 16px; font-weight: bold; color: #000000; text-align: center; text-transform: uppercase; letter-spacing: 1px; line-height: 1.25; padding: 0 5px; white-space: nowrap; }
.header-contact-table { font-size: 11px; line-height: 1.5; float: right; color: #333333; }
.header-contact-table td { padding: 3px 0; vertical-align: middle; }
.icon-svg { width: 8px; height: 8px; vertical-align: middle; margin-top: 1px; }
.footer-table { width: 100%; border-collapse: collapse; font-size: 10px; }
.footer-table td { vertical-align: top; }
body { font-family: "DejaVu Sans", sans-serif; font-size: 12px; }

.main-title { text-align: center; color: #333333; font-size: 26px; margin-bottom: 20px; margin-top: 0px; text-transform: uppercase; font-weight: bold; letter-spacing: 1.5px; padding-bottom: 10px; display: block; }

/* Modern List Style */
.list-table { width: 100%; border-collapse: collapse; margin-top: 5px; }
.list-table th { background-color: #333333; color: #ffffff; padding: 12px; text-align: left; text-transform: uppercase; font-size: 11px; }
.list-table td { padding: 10px 12px; border-bottom: 1px solid #e2e8f0; vertical-align: middle; }
.list-prod-img { width: 60px; height: 60px; border-radius: 6px; }
.list-prod-title { font-weight: 600; color: #000000; font-size: 13px; }
.list-prod-price { color: #000000; font-weight: bold; font-size: 14px; }

/* Modern Grid Style */
.grid-container { width: 100%; border-collapse: separate; border-spacing: 10px; table-layout: fixed; margin-top: 0px; }
.grid-item { text-align: center; padding: 10px; background: #ffffff; width: 100%; }
.grid-img-td { height: 140px; vertical-align: middle; padding-bottom: 10px; }
.grid-img { width: 140px; height: 140px; border-radius: 6px; }
.grid-title { font-size: 13px; font-weight: 600; color: #000000; margin-bottom: 5px; height: 20px; overflow: hidden; line-height: 20px; }
.grid-price { color: #000000; font-size: 16px; font-weight: 700; margin-bottom: 10px; }

/* Left/Right Style */
.lr-table { width: 100%; border-collapse: separate; border-spacing: 0 12px; }
.lr-item { border: 1px solid #e2e8f0; border-radius: 12px; background: #ffffff; box-shadow: 0 2px 12px rgba(0,0,0,0.06); width: 100%; }
.lr-img-td { width: 35%; padding: 20px; text-align: center; background: #f8f9fa; border-right: 1px solid #e2e8f0; border-radius: 12px 0 0 12px; vertical-align: middle; }
.lr-content-td { width: 65%; padding: 20px 30px; border-radius: 0 12px 12px 0; vertical-align: middle; }
.lr-img { width: 200px; border-radius: 10px; }
.lr-title { font-size: 20px; font-weight: 700; color: #000000; margin-bottom: 10px; }
.lr-desc { font-size: 12px; color: #4a5568; line-height: 1.6; margin-bottom: 15px; text-align: justify; }
.lr-price { font-size: 24px; font-weight: 700; color: #000000; margin-bottom: 15px; }

.btn { display: inline-block; padding: 10px 24px; background-color: #222222; color: #ffffff; text-decoration: none; border-radius: 20px; font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; border: none; }
.btn-green { background-color: #222222; border: none; }
del { color: #a0aec0; font-size: 85%; text-decoration: line-through; margin-right: 4px; }
ins { text-decoration: none; }