/* Layer 4 — Shortcodes */
.cat-hero { background: var(--chalk); padding: 32px 0 56px; }
.cat-hero .grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: 56px; align-items: end; }
@media (max-width: 900px) { .cat-hero .grid { grid-template-columns: 1fr; gap: 28px; } }
.cat-hero .eyebrow { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--grey); margin-bottom: 14px; display: flex; align-items: center; gap: 10px; }
.cat-hero .eyebrow::before { content: ""; width: 8px; height: 8px; background: var(--clay); border-radius: 50%; }
.cat-hero h1 { font-family: var(--f-head); font-weight: 900; font-size: clamp(48px, 7vw, 96px); line-height: 0.95; letter-spacing: -0.03em; margin-bottom: 20px; }
.cat-hero h1 .accent { color: var(--lime); }
.cat-hero .lead { font-size: 18px; color: var(--ink-soft); line-height: 1.55; max-width: 56ch; }
.cat-hero .stats { display: flex; gap: 32px; margin-top: 28px; }
.cat-hero .stat { border-left: 2px solid var(--lime); padding-left: 14px; }
.cat-hero .stat .n { font-family: var(--f-head); font-weight: 800; font-size: 28px; line-height: 1; letter-spacing: -0.02em; }
.cat-hero .stat .l { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--grey); margin-top: 4px; }

.quick-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border-radius: 999px; background: var(--paper); border: 1px solid var(--line); font-family: var(--f-body); font-size: 13px; font-weight: 500; color: var(--ink); cursor: pointer; transition: all .15s var(--ease); text-decoration: none; }
.chip:hover { border-color: var(--ink); }
.chip.active { background: var(--ink); color: var(--chalk); border-color: var(--ink); }
.chip .count { font-family: var(--f-mono); font-size: 11px; color: var(--grey); background: var(--chalk); padding: 1px 6px; border-radius: 999px; }
.chip.active .count { background: rgba(255,255,255,0.15); color: rgba(247,245,240,0.8); }

.toolbar { background: var(--paper); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); position: sticky; top: 67px; z-index: 40; }
.toolbar .row { display: flex; justify-content: space-between; align-items: center; padding: 14px 0; gap: 20px; }
.toolbar .left { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--grey); }
.toolbar .left strong { color: var(--ink); font-weight: 600; }
.toolbar .right { display: flex; align-items: center; gap: 16px; }
.toolbar .sort, .ps-sort-form .sort { display: flex; align-items: center; gap: 8px; font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--grey); }
.toolbar select, .ps-sort-form select { border: 1px solid var(--line); background: var(--paper); padding: 8px 32px 8px 12px; border-radius: var(--radius); font-family: var(--f-body); font-size: 13px; font-weight: 500; color: var(--ink); appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2210%22%20height%3D%226%22%20viewBox%3D%220%200%2010%206%22%3E%3Cpath%20fill%3D%22%230D0D0D%22%20d%3D%22M0%200l5%206%205-6z%22%2F%3E%3C%2Fsvg%3E"); background-repeat: no-repeat; background-position: right 12px center; cursor: pointer; }

.pagination, .ps-pagination, nav.woocommerce-pagination ul { display: flex; justify-content: center; align-items: center; gap: 6px; margin-top: 56px; list-style: none; padding: 0; }
.pagination a, .pagination span, .ps-pagination a, .ps-pagination span, nav.woocommerce-pagination ul li a, nav.woocommerce-pagination ul li span { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--line); background: var(--paper); border-radius: var(--radius); font-family: var(--f-mono); font-size: 13px; font-weight: 500; color: var(--ink); transition: all .15s var(--ease); text-decoration: none; }
.pagination a:hover, .ps-pagination a:hover, nav.woocommerce-pagination ul li a:hover { border-color: var(--ink); }
.pagination .current, nav.woocommerce-pagination ul li span.current { background: var(--ink); color: var(--chalk); border-color: var(--ink); }
.pagination .prev, .pagination .next { width: auto; padding: 0 16px; font-family: var(--f-head); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.pagination .ellipsis, .pagination .dots { border: 0; background: transparent; }

.product-section { padding: 32px 0 96px; }
.product-grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: 64px; }
@media (max-width: 1000px) { .product-grid { grid-template-columns: 1fr; gap: 40px; } }

.gallery { display: grid; grid-template-columns: 90px 1fr; gap: 16px; }
@media (max-width: 600px) { .gallery { grid-template-columns: 1fr; } }
.thumbs { display: flex; flex-direction: column; gap: 10px; }
@media (max-width: 600px) { .thumbs { flex-direction: row; overflow-x: auto; } }
.thumb { width: 90px; aspect-ratio: 1 / 1; background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; cursor: pointer; transition: border-color .15s var(--ease); flex-shrink: 0; }
.thumb.active { border-color: var(--ink); border-width: 2px; }
.thumb:hover { border-color: var(--ink); }
.thumb img { width: 100%; height: 100%; object-fit: cover; }
.main-image { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; aspect-ratio: 1 / 1.1; position: relative; }
.main-image img { width: 100%; height: 100%; object-fit: cover; }
.main-image .badge { position: absolute; top: 16px; left: 16px; background: var(--lime); color: var(--chalk); font-family: var(--f-mono); font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; padding: 5px 10px; border-radius: 3px; }
.main-image .zoom { position: absolute; bottom: 16px; right: 16px; background: var(--paper); border: 1px solid var(--line); width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 18px; color: var(--grey); cursor: pointer; }

.details .brand-line { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--grey); margin-bottom: 12px; display: flex; align-items: center; gap: 10px; }
.details .brand-line .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); }
.details h1 { font-family: var(--f-head); font-weight: 900; font-size: clamp(32px, 4vw, 44px); line-height: 1.02; letter-spacing: -0.025em; margin-bottom: 16px; }
.details .meta-row { display: flex; align-items: center; gap: 18px; margin-bottom: 24px; font-size: 14px; flex-wrap: wrap; }
.details .stars { color: var(--clay); letter-spacing: 0.12em; font-size: 14px; }
.details .stars span { color: var(--line); }
.details .stock { display: inline-flex; align-items: center; gap: 6px; font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--grass); font-weight: 500; }
.details .stock .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--grass); animation: pulse-grass 2s infinite; box-shadow: 0 0 0 0 var(--grass); }

.price-block { display: flex; align-items: baseline; gap: 12px; margin-bottom: 28px; padding-bottom: 28px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.price-now { font-family: var(--f-head); font-weight: 800; font-size: 36px; letter-spacing: -0.02em; }
.price-old { color: var(--grey); text-decoration: line-through; font-size: 18px; font-family: var(--f-mono); }
.price-save { background: var(--lime); color: var(--chalk); padding: 4px 10px; border-radius: 3px; font-family: var(--f-mono); font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
.price-tax { margin-left: auto; font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--grey); }

.quick-specs { margin-top: 24px; }
.quick-specs .row { display: flex; justify-content: space-between; align-items: baseline; padding: 12px 0; border-bottom: 1px dashed var(--line); font-size: 14px; }
.quick-specs .row .k { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--grey); font-weight: 500; }
.quick-specs .row .v { font-weight: 500; color: var(--ink); }

.usps-mini { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 20px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 24px; margin-top: 24px; }
.usps-mini .usp-item { display: flex; align-items: flex-start; gap: 12px; font-size: 13px; line-height: 1.4; }
.usps-mini .check { color: var(--grass); font-weight: 800; margin-top: 1px; }
.usps-mini .lbl { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink); font-weight: 600; display: block; margin-bottom: 2px; }
.usps-mini .sub { color: var(--grey); font-size: 12px; }

.info-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 64px; align-items: start; }
@media (max-width: 900px) { .info-grid { grid-template-columns: 1fr; gap: 32px; } }
.info-body p { font-size: 16px; line-height: 1.65; color: var(--ink-soft); margin-bottom: 16px; max-width: 56ch; }
.info-body p:first-of-type { font-size: 18px; font-weight: 500; color: var(--ink); }
.specs-table { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 24px 28px; }
.specs-table h4 { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--grey); margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.specs-table .row { display: flex; justify-content: space-between; align-items: baseline; padding: 12px 0; border-bottom: 1px dashed var(--line); font-size: 14px; }
.specs-table .row:last-child { border-bottom: 0; }
.specs-table .k { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--grey); font-weight: 500; }
.specs-table .v { font-weight: 500; }

.how-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 900px) { .how-row { grid-template-columns: 1fr; } }
.how-card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; position: relative; }
.how-card .step { font-family: var(--f-head); font-weight: 900; font-size: 64px; line-height: 1; letter-spacing: -0.05em; color: var(--lime); margin-bottom: 16px; opacity: 0.9; }
.how-card h3 { font-family: var(--f-head); font-weight: 800; font-size: 22px; line-height: 1.15; letter-spacing: -0.01em; margin-bottom: 10px; }
.how-card p { color: var(--grey); font-size: 14px; line-height: 1.55; }

.reviews-summary { display: grid; grid-template-columns: 280px 1fr; gap: 56px; align-items: start; margin-bottom: 40px; }
@media (max-width: 700px) { .reviews-summary { grid-template-columns: 1fr; gap: 24px; } }
.reviews-summary .score { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; text-align: center; }
.reviews-summary .num { font-family: var(--f-head); font-weight: 900; font-size: 64px; line-height: 1; letter-spacing: -0.03em; margin-bottom: 8px; }
.reviews-summary .stars { color: var(--clay); letter-spacing: 0.15em; font-size: 18px; margin-bottom: 8px; }
.reviews-summary .count { font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--grey); }
.bars { display: flex; flex-direction: column; gap: 10px; }
.bar-row { display: grid; grid-template-columns: 60px 1fr 50px; gap: 12px; align-items: center; font-size: 13px; }
.bar-row .lbl { font-family: var(--f-mono); font-size: 11px; color: var(--grey); letter-spacing: 0.06em; text-transform: uppercase; }
.bar-track { background: var(--line); height: 6px; border-radius: 999px; overflow: hidden; }
.bar-fill { height: 100%; background: var(--clay); }
.bar-num { font-family: var(--f-mono); font-size: 12px; color: var(--grey); text-align: right; }

.reviews-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media (max-width: 900px) { .reviews-grid { grid-template-columns: 1fr; } }
.review .top { display: flex; justify-content: space-between; align-items: center; }
.review .date { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--grey); }
.review .body-txt { color: var(--ink-soft); font-size: 14px; line-height: 1.55; }
.review .author .verified { color: var(--grass); font-weight: 600; }

.grid-banner { grid-column: span 2; background: var(--ink); color: var(--chalk); border-radius: var(--radius); padding: 32px; display: flex; flex-direction: column; justify-content: space-between; background-image: radial-gradient(circle at 80% 20%, rgba(27,107,63,0.4) 0%, transparent 60%); min-height: 320px; }
.grid-banner .eyebrow { font-family: var(--f-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--lime); margin-bottom: 14px; }
.grid-banner h3 { font-family: var(--f-head); font-weight: 900; font-size: clamp(28px, 3.5vw, 40px); line-height: 1; letter-spacing: -0.025em; margin-bottom: 12px; color: var(--chalk); }
.grid-banner h3 em { font-style: normal; color: var(--lime); }
.grid-banner p { color: rgba(247,245,240,0.75); font-size: 14px; max-width: 38ch; margin-bottom: 20px; }
.grid-banner a.btn, .grid-banner .btn { align-self: flex-start; background: var(--lime); color: var(--chalk); padding: 12px 18px; border-radius: var(--radius); font-family: var(--f-head); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; }
.grid-banner a.btn:hover { background: var(--chalk); color: var(--ink); }

.ps-empty { padding: 48px 0; text-align: center; color: var(--grey); font-size: 15px; }