.filament-page{background:var(--paper)}
.filament-hero{height:800px;position:relative;overflow:hidden;color:var(--paper);background:#aab9cd}
.filament-hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.filament-hero-copy{position:relative;text-align:center;padding-top:109px}
.filament-hero h1{font-size:34px;line-height:1}
.filament-hero-copy p{font-size:16px;line-height:15.62px;margin-top:30px}
.filament-mobile-break{display:none}
.filament-hero-action{position:absolute;bottom:67px;left:50%;transform:translateX(-50%);padding-inline:55px;white-space:nowrap}
.material-catalog{padding:50px 0}
.material-catalog h2{font-size:34px;line-height:1;text-align:center}
.material-filters{display:flex;justify-content:center;gap:32px;margin-top:50px}
.material-filters button{border:1px solid #222;border-radius:100px;background:transparent;padding:5px 30px;font-size:20px;line-height:1;font-weight:500;cursor:pointer;min-width:128px}
.material-filters button:hover{border-color:var(--blue);color:var(--blue)}
.material-filters button[aria-pressed=true]{background:var(--blue);border-color:var(--blue);color:#fff}
.material-filters button:active{background:#0029b3;border-color:#0029b3;color:#fff}
.material-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;margin-top:51px;align-items:start}
.catalog-material{display:flex;flex-direction:column;gap:20px;min-width:0}
.catalog-material[hidden]{display:none}
.catalog-material-placeholder{width:100%;aspect-ratio:291/375;background:#d9d9d9;border-radius:9px}
.catalog-material-placeholder{overflow:hidden}
.catalog-material-photo{width:100%;height:100%;object-fit:contain}
.catalog-material-photo[hidden]{display:none}
.catalog-material h3{font-size:20px;line-height:1;font-weight:500;min-height:40px;overflow-wrap:break-word}
.catalog-material-subtitle{display:block}
.catalog-material-specs{display:flex;flex-direction:column;gap:10px;font-size:16px;line-height:1}
.catalog-specs-primary,.catalog-specs-secondary{display:flex;align-items:center;gap:12px;min-width:0}
.catalog-dot{width:5px;height:5px;border-radius:50%;background:var(--ink);flex-shrink:0}
.catalog-mobile-spec{display:none}
.catalog-swatches{display:flex;flex-wrap:wrap;gap:12px 16px;min-height:22px}
.catalog-swatch{display:grid;place-items:center;width:22px;height:22px;padding:0;border:0;border-radius:50%;background:var(--swatch-color);cursor:pointer;position:relative;flex-shrink:0}
.catalog-swatch img{width:22px;height:22px;max-width:none;border-radius:50%}
.catalog-swatch:hover{box-shadow:none}
.catalog-swatch[aria-pressed=true]{outline:1px solid var(--blue);outline-offset:0}
.catalog-swatch:active{box-shadow:none}
.catalog-all-colors{margin-top:10px;align-self:flex-start;background:none;border:0;padding:0;color:var(--blue);font-size:16px;line-height:15.62px;text-align:left;cursor:pointer}
.material-catalog :is(button,a):focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.catalog-empty{text-align:center;padding:40px 0}
.filament-production{background:var(--ink);color:var(--paper)}
.filament-custom{padding:50px 0}
.filament-custom-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:80px}
.filament-custom-intro{padding-top:13px}
.filament-custom h2{font-size:34px;line-height:1.2}
.filament-custom-intro>p{font-size:16px;line-height:1.15;opacity:.8;margin-top:20px;max-width:560px}
.filament-custom .button{font-size:16px;border-radius:5px;width:299px;margin-top:28px}
.filament-custom small{display:block;font-size:13px;line-height:1;opacity:.8;margin-top:16px}
.filament-custom-options{display:flex;flex-direction:column;gap:28px}
.filament-custom h3{font-size:28px;line-height:1.2}
.filament-custom-options p{font-size:14px;line-height:1.15;opacity:.8;margin-top:12px}
@media(max-width:1100px){
 .filament-page{padding-top:59px}
 .filament-hero{height:560px}
 .filament-hero-copy{padding-top:40px}
 .filament-hero h1{font-size:28px}
 .filament-hero-copy p{margin-top:20px}
 .filament-hero-action{bottom:32px;width:290px;min-height:40px;padding-inline:16px}
 .material-catalog{padding-block:40px}
 .material-catalog h2{font-size:28px}
 .material-filters{gap:24px;margin-top:32px}
 .material-filters button{font-size:16px;width:128px;min-width:0;height:36px;padding:5px 16px}
 .material-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px;margin-top:32px}
 .catalog-material{gap:16px}
 .catalog-material h3{font-size:16px;min-height:32px}
 .catalog-material-specs{font-size:13px;gap:8px}
 .catalog-all-colors{font-size:14px}
 .filament-production .production{padding:40px 0;margin:0}
 .filament-production .production-media{height:400px;min-height:0}
 .filament-custom{padding-block:40px}
 .filament-custom-grid{gap:24px}
 .filament-custom-intro{padding:0}
 .filament-custom h2{font-size:28px}
 .filament-custom h3{font-size:20px}
 .filament-custom-options p{font-size:16px}
 .filament-custom .button{width:290px;min-height:40px;margin-top:20px}
}
@media(max-width:599px){
 .filament-hero-copy{padding-top:32px}
 .filament-hero h1{font-size:24px;line-height:.9}
 .filament-mobile-break{display:initial}
 .filament-hero-copy p{font-size:14px;margin-top:24px}
 .filament-hero-action{bottom:24px;min-height:44px;font-size:16px}
 .material-catalog{padding-block:32px}
 .material-catalog h2{font-size:24px}
 .material-filters{gap:10px;margin-top:24px}
 .material-filters button{flex:1;max-width:82px;height:36px;font-size:13px;padding:5px 8px}
 .material-grid{gap:28px 16px;margin-top:24px}
 .catalog-material{gap:12px}
 .catalog-material h3{font-size:14px;line-height:1;min-height:28px}
 .catalog-material-subtitle{display:none}
 .catalog-material-specs{font-size:11px;gap:6px}
 .catalog-specs-primary,.catalog-specs-secondary{gap:8px}
 .catalog-wide-spec{display:none}
 .catalog-mobile-spec{display:initial}
 .catalog-dot.catalog-mobile-spec{display:block}
 .catalog-swatches{gap:8px;min-height:18px}
 .catalog-swatch{width:18px;height:18px}
 .catalog-swatch img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.8181818)}
 .catalog-all-colors{font-size:13px}
 .filament-production .production{padding:32px 0}
 .filament-production .production-media{height:260px}
 .filament-custom{padding-block:32px}
 .filament-custom-grid{grid-template-columns:1fr;gap:32px}
 .filament-custom h2{font-size:24px}
 .filament-custom-options{gap:24px}
 .filament-custom .button{min-height:44px}
}

.material-filters{display:grid;grid-template-columns:repeat(4,minmax(0,128px));align-items:center;justify-content:center}
.material-filters button:not(.material-filter-reset){width:100%;min-width:0;max-width:none}
.material-filters .material-filter-reset{min-width:32px;width:32px;max-width:32px;height:32px;padding:0;flex:0 0 32px;font-size:24px;font-weight:400;display:grid;place-items:center}
.material-catalog .catalog-swatch:focus-visible{outline:1px solid var(--blue);outline-offset:0;box-shadow:none}
@media(min-width:600px) and (max-width:1100px){.material-filters button:not(.material-filter-reset){flex:1;max-width:128px}}

.catalog-swatch.is-preview{outline:1px solid var(--blue);outline-offset:0}
.catalog-swatches:has(.is-preview) .catalog-swatch[aria-pressed=true]:not(.is-preview){outline:none}
@media(max-width:1100px){
 .filament-custom-intro{text-align:center}
 .filament-custom-intro>p{margin-inline:auto}
 .filament-custom-intro>.button{margin-inline:auto}
}
