/* Shop / size results design — page-only rules (on top of site.css and pages/shop-ui.css), scoped to
   <main class="pg pg-shop">: dark page head, two-column body (filters + results), results bar. */
.pg .bg-dark{background-color:#0D0E10;background-image:linear-gradient(90deg,#0D0E10 38%,rgba(13,14,16,0.55) 100%),url("../../img/hp/banner-tire.webp");background-size:cover;background-position:right center}

/* page head */
.pg .sh-head{color:#fff;padding:36px 0 40px}
.pg .sh-head-in{display:flex;flex-direction:column;gap:22px}
.pg .sh-head-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:end}
.pg .sh-head-t{display:flex;flex-direction:column;gap:14px;min-width:0}
.pg .sh-h1{margin:0;font-size:clamp(44px,5.4vw,72px);font-weight:800;overflow-wrap:anywhere}
.pg .sh-red{color:#D7261E}
.pg .sh-count{margin:0;font-size:16px;line-height:1.5;color:#B8BCC3}

/* body */
.pg .sh-body{display:grid;grid-template-columns:280px minmax(0,1fr);gap:40px;padding-top:40px;padding-bottom:80px;align-items:start}
.pg .sh-results{display:flex;flex-direction:column;gap:18px;min-width:0}
.pg .sh-bar{display:flex;justify-content:space-between;align-items:center;gap:12px 16px;flex-wrap:wrap}
.pg .sh-showing{font-size:14px;color:#5F636B}
.pg .sh-showing strong,.pg .sh-showing .mono{color:#111214}
.pg .sh-bar-r{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pg .sh-results .woocommerce-notices-wrapper:empty{display:none}

@media (max-width:1180px){.pg .sh-head-row{grid-template-columns:minmax(0,1fr)}}
@media (max-width:1080px){
.pg .sh-body{grid-template-columns:minmax(0,1fr);gap:0;padding-top:28px;padding-bottom:64px}
}
@media (max-width:760px){
.pg .sh-head{padding:24px 0 28px}
.pg .sh-head-in{gap:16px}
.pg .sh-h1{font-size:clamp(36px,10vw,48px)}
.pg .sh-count{font-size:14px}
.pg .sh-bar{align-items:center}
.pg .sh-showing{flex-basis:100%}
.pg .sh-bar-r{width:100%;justify-content:space-between;flex-wrap:nowrap}
.pg .sh-bar-r .sh-sort{min-width:0}
}

/* staggered fit: Front | Rear switch (template-parts/shop/stagger.php) */
.pg .stg{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:20px;background:#fff;border:1px solid rgba(17,18,20,0.08);margin-bottom:16px}
.pg .stg-l{font-size:11px;letter-spacing:0.14em;color:#D7261E;text-transform:uppercase}
.pg .stg-intro{margin:-4px 0 2px;font-size:14px;color:#3E4148}
.pg .stg-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pg .stg-t{display:flex;flex-direction:column;gap:3px;padding:12px 16px;border-radius:14px;border:1.5px solid rgba(17,18,20,0.12);color:#111214;transition:border-color .2s ease,background .2s ease}
.pg .stg-t:hover{border-color:#111214}
.pg .stg-t.on{background:#111214;border-color:#111214;color:#fff}
.pg .stg-ax{font-size:11px;letter-spacing:0.12em;color:#8D9199;text-transform:uppercase}
.pg .stg-t.on .stg-ax{color:#FF8A84}
.pg .stg-t b{font-size:20px;font-weight:600}
.pg .stg-t small{font-size:12px;color:#5F636B}
.pg .stg-t.on small{color:#C9CCD1}
.pg .stg-note{margin:0;font-size:13px;color:#5F636B}

/* staggered fit: matching sets (template-parts/shop/pairs.php) */
.pg .pr{display:flex;flex-direction:column;gap:16px;margin-bottom:28px}
.pg .pr-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.pg .pr-eb{font-size:11px;letter-spacing:0.14em;color:#D7261E;text-transform:uppercase}
.pg .pr-h{margin:6px 0 6px;font-size:clamp(28px,3vw,40px)}
.pg .pr-sub{margin:0;font-size:14px;color:#5F636B;max-width:640px;line-height:1.6}
.pg .pr-count{font-size:12px;letter-spacing:0.1em;color:#5F636B;padding:8px 14px;border-radius:999px;background:#fff;border:1px solid rgba(17,18,20,0.1)}
.pg .pr-none{margin:0;padding:18px;border-radius:16px;background:#fff;border:1px solid rgba(17,18,20,0.08);font-size:15px;color:#3E4148}
.pg .pr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,500px),1fr));gap:16px}
.pg .pr-card{display:flex;flex-direction:column;background:#fff;border-radius:22px;border:1px solid rgba(17,18,20,0.08);overflow:hidden}
.pg .pr-card-h{display:flex;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid rgba(17,18,20,0.08)}
.pg .pr-logo{display:flex;align-items:center;justify-content:center;width:112px;height:40px;flex:none}
.pg .pr-logo img{max-width:100%;max-height:100%;object-fit:contain}
.pg .pr-card-h > span:last-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.pg .pr-brand{font-size:11px;letter-spacing:0.14em;color:#8D9199;text-transform:uppercase}
.pg .pr-name{font-size:19px;font-weight:700;color:#111214;line-height:1.25}
.pg .pr-sides{display:grid;grid-template-columns:1fr 1fr}
.pg .pr-side{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:16px 14px 18px}
.pg .pr-side + .pr-side{border-left:1px solid rgba(17,18,20,0.08)}
.pg .pr-img{display:block;width:100%;max-width:150px;aspect-ratio:1/1;border-radius:14px;background:#F2F2F0;overflow:hidden}
.pg .pr-img img{width:100%;height:100%;object-fit:contain}
.pg .pr-ax{margin-top:4px;font-size:13px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:#D7261E}
.pg .pr-size{font-size:18px;font-weight:600;color:#111214}
.pg .pr-specs{font-size:12px;color:#5F636B;line-height:1.5}
.pg .pr-price{display:flex;align-items:baseline;justify-content:center;gap:6px;flex-wrap:wrap}
.pg .pr-price b{font-size:20px;font-weight:600;color:#111214}
.pg .pr-price del{font-size:12px;color:#8D9199}
.pg .pr-price small{flex-basis:100%;font-size:11px;color:#8D9199}
.pg .pr-qty{margin-top:4px}
.pg .pr-foot{display:flex;align-items:center;justify-content:space-between;gap:12px 16px;flex-wrap:wrap;padding:16px 20px;background:#F6F6F4;border-top:1px solid rgba(17,18,20,0.08)}
.pg .pr-total{display:flex;flex-direction:column;gap:2px;font-size:13px;color:#5F636B}
.pg .pr-total b{font-size:26px;font-weight:700;color:#111214}
.pg .pr-act{display:flex;align-items:center;gap:10px}
.pg .pr-add{min-height:50px;padding:0 24px}
.pg .pr-add.loading{opacity:.6;pointer-events:none}
.pg .pr-msg{flex-basis:100%;font-size:14px;font-weight:600;color:#11703a}
.pg .pr-msg.err{color:#D7261E}
.pg .pr-msg a{margin-left:8px;color:#D7261E;text-decoration:underline}
@media (max-width:520px){.pg .pr-card-h{padding:14px 16px}.pg .pr-logo{width:84px;height:32px}.pg .pr-name{font-size:17px}.pg .pr-side{padding:14px 8px 16px}.pg .pr-size{font-size:15px}.pg .pr-price b{font-size:17px}.pg .pr-foot{padding:14px 16px}.pg .pr-total,.pg .pr-act{flex-basis:100%}.pg .pr-add{flex:1;white-space:nowrap}.pg .pr-total b{font-size:22px}}