@font-face {font-family: 'Libre Baskerville'; src: url('assets/a83cbba0fe927abdd9.ttf') format('truetype'); font-weight: 400; font-display: swap;}
@font-face {font-family: 'Open Sans'; src: url('assets/650dac2664ae60a7d4.ttf') format('truetype'); font-weight: 400; font-display: swap;}
@font-face {font-family: 'Open Sans'; src: url('assets/22d43f06832a07ed16.ttf') format('truetype'); font-weight: 700; font-display: swap;}

:root {--uf-ink: #242321; --uf-paper: #f6f3ee; --uf-accent: #a12b35; --uf-line: #e0d9d1; --uf-muted: #625b55; --uf-serif: 'Libre Baskerville', Georgia, serif; --uf-sans: 'Open Sans', Arial, sans-serif;}
.uf-shell, .uf-shell-footer, .uf-modern {color: var(--uf-ink); font-family: var(--uf-sans);}
.uf-modern *, .ufc * {box-sizing: border-box;}
.uf-shell {border-bottom: 1px solid var(--uf-line);}
.uf-shell .uf-utility {background: var(--uf-ink); color: #f9f7f2; font-size: 12px;}
.uf-utility-inner, .uf-shell .uf-header-inner {width: min(100% - 48px, 1320px); padding: 0; margin-inline: auto;}
.uf-utility-inner {display: flex; align-items: center; justify-content: space-between; min-height: 36px; gap: 14px;}
.uf-shell .uf-utility a:hover {color: white; text-decoration: underline;}
.uf-shell .uf-header-inner {min-height: 88px; gap: clamp(24px, 4vw, 54px);}
.uf-shell .uf-logo img {display: block; width: 88px; height: 76px; object-fit: contain;}
.uf-shell .uf-nav {flex: 1; gap: clamp(12px, 2vw, 26px); justify-content: flex-start; color: var(--uf-ink);}
.uf-shell a:hover, .uf-shell a[aria-current=page], .uf-shell .uf-nav-active > a {color: var(--uf-accent);}
.uf-shell .uf-submenu-toggle {display: grid; place-items: center; min-width: 29px; min-height: 40px; cursor: pointer;}
.uf-shell .uf-submenu-toggle[aria-expanded=true] svg {transform: rotate(180deg);}
.uf-shell .uf-submenu {border-top-color: var(--uf-accent); min-width: 255px;}
.uf-shell .uf-dropdown:not(.uf-open) > .uf-submenu {display: none;}
.uf-shell .uf-submenu a:hover, .uf-shell .uf-submenu a[aria-current=page] {background: var(--uf-paper);}
.uf-shell .uf-search-button {margin-left: auto; align-items: center; border: 0; border-radius: 0; color: var(--uf-ink); font: 700 13px var(--uf-sans); padding: 10px 5px;}
.uf-shell .uf-search-button:hover {color: var(--uf-accent);}
.uf-shell .uf-shell-estimate {padding: 13px 16px; color: white; background: var(--uf-accent); line-height: 1.4; text-align: center;}
.uf-shell .uf-shell-estimate:hover {background: #82232a; color: white;}
.uf-shell-estimate span {margin-left: 7px;}
.uf-shell-footer {background: var(--uf-ink); color: #f6f3ee; padding-top: 44px;}
.uf-shell-footer .uf-footer-inner {display: grid; grid-template-columns: 1fr 1.2fr 1fr; align-items: start; gap: clamp(25px, 5vw, 75px);}
.uf-shell-footer h2 {font: 700 14px/1.4 var(--uf-sans); color: #fff; margin: 0 0 15px; text-transform: none;}
.uf-shell-footer nav {display: grid; grid-template-columns: 1fr 1fr; align-items: start; gap: 9px 15px; font: 400 13px/1.5 var(--uf-sans); text-transform: none; margin: 0;}
.uf-shell-footer address {font: 400 13px/1.85 var(--uf-sans); overflow-wrap: anywhere;}
.uf-shell-footer .uf-footer-logo img {width: 100px; height: 86px;}
.uf-shell-footer .uf-footer-bottom span {padding-inline: 8px;}

.ufc {font: 400 15px/1.65 var(--uf-sans); color: var(--uf-ink);}
.ufc-width {width: min(100% - 48px, 1240px); margin-inline: auto;}
.ufc h1, .ufc h2, .ufc h3 {color: inherit; font-family: var(--uf-serif); font-weight: 400; text-transform: none;}
.ufc h1 {font-size: clamp(2.2rem, 4.7vw, 4.5rem); line-height: 1.12; letter-spacing: -.044em; margin: 0 0 18px;}
.ufc h2 {font-size: clamp(1.45rem, 2.7vw, 2.4rem); line-height: 1.22; letter-spacing: -.035em; margin: 0 0 14px;}
.ufc h3 {font-size: clamp(1.15rem, 1.65vw, 1.45rem); line-height: 1.25; letter-spacing: -.022em; margin: 0 0 11px;}
.ufc p {margin: 0;}
.ufc [hidden] {display: none !important;}
.ufc-kicker {font: 700 .72rem/1.5 var(--uf-sans); text-transform: uppercase; letter-spacing: .14em; color: var(--uf-accent); margin: 0 0 11px !important;}
.ufc-banner {background: var(--uf-paper); border-bottom: 1px solid var(--uf-line);}
.ufc-breadcrumb {display: flex; flex-wrap: wrap; align-items: center; gap: 7px 10px; padding-block: 17px; font-size: .78rem; color: var(--uf-muted);}
.ufc-breadcrumb a {color: inherit; text-underline-offset: 3px;}
.ufc-breadcrumb a:hover {color: var(--uf-accent);}
.ufc-banner-copy {max-width: 760px; padding-block: clamp(20px, 5vw, 58px);}
.ufc-banner-copy > p:not(.ufc-kicker) {max-width: 640px; font-size: clamp(.98rem, 1.5vw, 1.14rem); color: var(--uf-muted);}
.ufc-category-hero {display: grid; grid-template-columns: 1.25fr 1fr; align-items: center; gap: clamp(18px, 5vw, 66px); padding: 0 0 clamp(18px, 4vw, 42px);}
.ufc-hero-photo {height: clamp(220px, 28vw, 355px); overflow: hidden;}
.ufc-hero-photo img, .ufc-tile-photo img {display: block; width: 100%; height: 100%; object-fit: cover;}
.ufc-button {display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 11px 18px; background: var(--uf-accent); color: #fff; text-decoration: none; font-weight: 700; font-size: .88rem;}
.ufc-button:hover {background: #82232a; color: #fff;}
.ufc-banner-copy .ufc-button, .ufc-epoxy .ufc-button {margin-top: 22px;}
.ufc-index-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; padding-block: clamp(28px, 5vw, 62px);}
.ufc-tile {display: flex; flex-direction: column; color: var(--uf-ink); text-decoration: none; border: 1px solid var(--uf-line); background: #fff; transition: border-color .2s ease;}
.ufc-tile:hover {color: var(--uf-ink); border-color: var(--uf-accent);}
.ufc-tile-photo {aspect-ratio: 1.74; overflow: hidden;}
.ufc-tile-photo img {transition: transform .35s ease;}
.ufc-tile:hover img {transform: scale(1.045);}
.ufc-tile-copy {padding: 20px 48px 21px 20px; position: relative;}
.ufc-tile h2 {font-size: clamp(1.1rem, 2vw, 1.6rem); margin-bottom: 8px;}
.ufc-tile-copy > p:last-of-type {font-size: .9rem; color: var(--uf-muted);}
.ufc-tile-arrow {position: absolute; right: 17px; top: 50%; transform: translateY(-50%); color: var(--uf-accent); font-size: 22px;}
.ufc-material-mark {height: 100%; background-color: #3d3936; background-size: 19px 19px; background-image: radial-gradient(#e9e2d7a8 1px, transparent 1.7px), radial-gradient(#baaf9f90 1px, transparent 1.5px); background-position: 0 0, 9px 8px;}
.ufc-material-mark--sports-courts {background: repeating-linear-gradient(116deg, transparent 0 32%, #f6efe2 32% 33%, transparent 33% 68%, #f6efe2 68% 69%, transparent 69% 100%), linear-gradient(104deg, #7d2933 40%, #b4584d 40% 65%, #7d2933 65%);}
.ufc-material-mark--epoxy-concrete {background: radial-gradient(ellipse at 34% 90%, #cec4b9, transparent 55%), linear-gradient(140deg, #e9e1d5, #8f8176);}
.ufc-catalog-layout {display: grid; grid-template-columns: minmax(170px, 210px) minmax(0, 1fr); align-items: start; gap: clamp(24px, 4vw, 55px); padding-block: clamp(28px, 5vw, 62px);}
.ufc-sidebar details {border: 1px solid var(--uf-line); background: var(--uf-paper);}
.ufc-sidebar summary {font-weight: 700; padding: 12px 14px; cursor: pointer;}
.ufc-sidebar nav {display: grid; padding: 0 7px 8px;}
.ufc-sidebar nav a {font-size: .86rem; line-height: 1.4; color: var(--uf-ink); padding: 9px; text-decoration: none;}
.ufc-sidebar nav a:hover, .ufc-sidebar nav a[aria-current=page] {background: #fff; color: var(--uf-accent);}
.ufc-sidebar nav a[aria-current=page] {font-weight: 700; box-shadow: inset 3px 0 var(--uf-accent);}
.ufc-product-guide {max-width: 690px; color: var(--uf-muted);}
.ufc-manufacturer-catalogs {margin-top: 16px; border: 1px solid var(--uf-line); padding: 12px 15px; background: #fff;}
.ufc-manufacturer-catalogs summary {font-size: .9rem; font-weight: 700; cursor: pointer;}
.ufc-manufacturer-catalogs ul {display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 7px 15px; list-style: none; margin: 12px 0 0; padding: 0; font-size: .86rem;}
.ufc-filters {display: grid; grid-template-columns: 1.4fr 1fr; gap: 14px; margin-top: 20px;}
.ufc-filters label {font-size: .85rem; font-weight: 700;}
.ufc-filters input, .ufc-filters select {width: 100%; min-height: 44px; display: block; background: #fff; border: 1px solid #aaa19a; border-radius: 0; padding: 7px 10px; margin-top: 5px; color: var(--uf-ink); font: 400 .9rem var(--uf-sans);}
.ufc-selected-catalog {display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin-top: 14px; padding: 10px 13px; border: 1px solid var(--uf-line); background: #fff; font-size: .85rem;}
.ufc-selected-catalog p {margin: 0; color: var(--uf-muted);}
.ufc-result-count {font-size: .85rem; color: var(--uf-muted); padding-block: 14px 9px;}
.ufc-empty {padding: 17px; border: 1px solid var(--uf-line);}
.ufc-product-grid {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px;}
.ufc-product {display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--uf-line); background: #fff;}
.ufc-product-intro, .ufc-product-resources {padding: 17px;}
.ufc-product-intro {flex: 1;}
.ufc-product-photo {margin: -17px -17px 15px; background: var(--uf-paper); border-bottom: 1px solid var(--uf-line);}
.ufc-product-photo img {display: block; width: 100%; height: auto; aspect-ratio: 5 / 3; object-fit: cover; color: var(--uf-muted); font-size: .86rem;}
.ufc-product-photo--contain img {object-fit: contain;}
.ufc-product-photo figcaption {color: var(--uf-muted); font-size: .75rem; line-height: 1.4; padding: 6px 17px;}
.ufc-product-intro > p:not(.ufc-kicker), .ufc-product-resources p {font-size: .86rem; color: var(--uf-muted);}
.ufc-product .ufc-sku {font-size: .75rem; margin-bottom: 8px;}
.ufc-product-colors {margin-top: 9px; color: var(--uf-muted); font-size: .8rem;}
.ufc-product-colors summary {cursor: pointer; font-weight: 700;}
.ufc-product-colors ul {margin: 6px 0 0; padding-left: 19px;}
.ufc-product-colors .ufc-color-list {display: grid; gap: 4px; list-style: none; padding: 0;}
.ufc-color-list li {display: flex; align-items: center; gap: 7px; min-height: 22px;}
.ufc-color-swatch {display: block; width: 32px; height: 32px; object-fit: cover; border: 1px solid var(--uf-line);}
.ufc-style-directory {margin-top: 16px; border: 1px solid var(--uf-line); padding: 12px 15px; background: #fff;}
.ufc-style-directory > summary {font-weight: 700; cursor: pointer;}
.ufc-style-directory > p {font-size: .86rem; color: var(--uf-muted);}
.ufc-style-directory > ul {display: grid; grid-template-columns: repeat(auto-fit, minmax(min(205px, 100%), 1fr)); gap: 10px; list-style: none; padding: 0;}
.ufc-style-directory > ul > li {border: 1px solid var(--uf-line); padding: 10px; font-size: .85rem;}
.ufc-style-directory > ul > li > p {margin: 0 0 5px;}
.ufc-directory-jump {margin: 0 0 12px; font-size: .85rem;}
.ufc-underlink, .ufc-doc a {font-weight: 700; color: var(--uf-accent); text-decoration: underline; text-underline-offset: 3px;}
.ufc-product .ufc-underlink {display: inline-block; margin-top: 11px; font-size: .82rem;}
.ufc-product-resources {background: var(--uf-paper); border-top: 1px solid var(--uf-line);}
.ufc-product-resources dl, .ufc-epoxy dl {margin: 0;}
.ufc-doc {display: grid; grid-template-columns: 1fr 1fr; align-items: baseline; gap: 10px; font-size: .79rem; line-height: 1.45;}
.ufc-doc + .ufc-doc {border-top: 1px solid var(--uf-line); padding-top: 7px; margin-top: 7px;}
.ufc-doc dt, .ufc-epoxy dt {font-weight: 700;}
.ufc-doc dd, .ufc-epoxy dd {margin: 0; color: var(--uf-muted);}
.ufc-product-resources .ufc-scope {font-size: .78rem; margin-top: 13px;}
.ufc-product-resources .ufc-coverage {margin-bottom: 12px; color: var(--uf-ink);}
.ufc-epoxy {padding: clamp(17px, 4vw, 36px); border: 1px solid var(--uf-line); background: var(--uf-paper);}
.ufc-epoxy dl {margin-top: 18px; display: grid; gap: 13px;}
.ufc-help {display: flex; justify-content: space-between; align-items: center; gap: 22px; padding: clamp(30px, 6vw, 65px) max(24px, calc((100% - 1240px) / 2)); background: var(--uf-accent); color: white;}
.ufc-help .ufc-kicker {color: #fff;}
.ufc-help p {max-width: 630px;}
.ufc-help-actions {display: grid; justify-items: start; gap: 12px; flex: 0 0 auto;}
.ufc-button-light {background: white; color: var(--uf-accent);}
.ufc-button-light:hover {background: var(--uf-paper); color: var(--uf-accent);}
.ufc-help .ufc-underlink {color: #fff; font-size: .84rem;}

@media (max-width: 1010px) {
  .uf-shell .uf-search-button span {display: none;}
  .uf-shell .uf-header-inner {gap: 20px;}
  .uf-shell .uf-nav {gap: 12px;}
  .ufc-doc {grid-template-columns: 1fr; gap: 3px;}
}
@media (max-width: 850px) {
  .uf-shell .uf-header-inner {min-height: 74px;}
  .uf-shell .uf-logo img {width: 73px; height: 65px;}
  .uf-shell .uf-nav {gap: 0;}
  .uf-shell .uf-search-button {margin-left: 0; padding: 10px 5px;}
  .uf-shell .uf-search-button span {display: inline;}
  .uf-shell .uf-shell-estimate {margin: 2px 0 10px;}
  .uf-shell .uf-submenu {border-top-color: var(--uf-line);}
  .ufc-index-grid {grid-template-columns: repeat(2, minmax(0, 1fr));}
  .ufc-catalog-layout {grid-template-columns: 1fr;}
  .ufc-sidebar nav {grid-template-columns: repeat(3, minmax(0, 1fr));}
  .ufc-doc {grid-template-columns: 1fr 1fr; gap: 8px;}
}
@media (max-width: 600px) {
  .uf-utility-inner, .uf-shell .uf-header-inner, .ufc-width {width: calc(100% - 32px);}
  .uf-shell .uf-utility {font-size: 11px;}
  .ufc-category-hero {grid-template-columns: 1fr; gap: 8px;}
  .ufc-category-hero .ufc-banner-copy {padding: 14px 0;}
  .ufc-hero-photo {height: 180px;}
  .ufc-index-grid {gap: 12px;}
  .ufc-tile-copy {padding: 13px 12px;}
  .ufc-tile h2 {font-size: 1.05rem;}
  .ufc-tile-copy > p:last-of-type {font-size: .81rem;}
  .ufc-tile-arrow {display: none;}
  .ufc-sidebar nav {grid-template-columns: repeat(2, minmax(0, 1fr));}
  .ufc-product-grid {grid-template-columns: 1fr;}
  .ufc-filters {grid-template-columns: 1fr; gap: 9px;}
  .ufc-help {align-items: start; flex-direction: column; padding-inline: 16px;}
  .uf-shell-footer .uf-footer-inner {grid-template-columns: 1fr; gap: 20px;}
  .uf-shell-footer .uf-footer-logo {margin-bottom: 3px;}
}
@media (prefers-reduced-motion: reduce) {
  .ufc-tile, .ufc-tile-photo img {transition: none;}
}

/* Keep expanded directory entries readable with product photos and resources. */
.ufc-style-directory > ul > li > .ufc-product-photo {margin: -10px -10px 12px;}
.ufc-style-directory > ul > li .ufc-product-resources {padding: 12px 0 0; margin-top: 12px; background: transparent;}
.ufc-style-directory > ul > li .ufc-doc {grid-template-columns: 1fr; gap: 3px;}
.ufc-style-directory > ul > li .ufc-product-colors {overflow-wrap: anywhere;}