/* PU anti-fatigue floor mat: source photography, material facts and colors. */
.mat-section {scroll-margin-top:110px}
.mat-layout {display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:start}
.mat-scene {margin:0}
.mat-scene img {display:block;width:100%;height:auto}
.mat-scene figcaption {margin-top:12px;font-size:.9rem;color:var(--muted)}
.mat-copy h3 {font-size:1.2rem;margin-bottom:16px}
.mat-features {list-style:none;margin:0 0 30px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:18px 28px}
.mat-features li {margin:0;padding-bottom:14px;border-bottom:1px solid var(--line-strong)}
.mat-features strong {font-size:1rem}
.mat-features p {font-size:.94rem;line-height:1.7;margin:5px 0 0;color:var(--muted)}
.mat-colors {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.mat-colors figure {margin:0;text-align:center}
.mat-colors button {display:flex;align-items:center;justify-content:center;width:100%;min-height:76px;padding:8px;background:#fff;border:1px solid var(--line-strong);border-radius:var(--radius);cursor:zoom-in}
.mat-colors img {width:100%;height:72px;object-fit:contain}
.mat-colors figcaption {margin-top:8px;font-size:.94rem;color:var(--ink)}
.mat-colors button:hover {border-color:var(--green-deep)}
.mat-colors button:focus-visible,.mat-product-link:focus-visible {outline:3px solid var(--purple);outline-offset:3px}
.mat-copy .mat-uses-title {margin-top:30px}
.mat-copy .mat-spec-note {color:var(--muted);font-size:.92rem;margin-top:18px;margin-bottom:16px}
.mat-product-link {display:inline-flex;align-items:center;min-height:44px;margin-top:6px}
.mat-section ::selection {background:var(--purple);color:#fff}
@media(max-width:900px) {
  .mat-layout {grid-template-columns:.8fr 1.2fr;gap:28px}
  .mat-features {column-gap:18px}
}
@media(max-width:700px) {
  .mat-layout {grid-template-columns:1fr;gap:28px}
  .mat-scene {max-width:440px;width:100%;margin-inline:auto}
  .mat-features {gap:16px 18px}
  .mat-colors {gap:10px}
  .mat-colors button {padding:6px}
  .mat-colors img {height:60px}
}
@media(max-width:360px) {.mat-features {grid-template-columns:1fr}}
