/* Approved R8 composition, scoped to the catalogue so shared Home/Header remain unchanged. */
.uip-catalog {
  --paper:#F6F7F4;
  --surface:#fff;
  --ink:#171A16;
  --ink-2:#5D655A;
  --line:#E2E6DE;
  --accent:#57AC2E;
  --accent-deep:#4a8f26;
  --accent-text:#3E7A1E;
  --radius:14px;
  --shadow:0 18px 45px #1720150b;
  --preview-h:42px;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans CJK SC",Arial,sans-serif;
  color:var(--ink);
  background:var(--paper);
  font-size:15px;
  line-height:1.55
}

.uip-catalog * {
  box-sizing:border-box
}

.uip-catalog {
  margin:0
}

.uip-catalog a {
  color:inherit;
  text-decoration:none
}

.uip-catalog button,.uip-catalog input,.uip-catalog select,.uip-catalog textarea {
  font:inherit
}

.uip-catalog button,.uip-catalog a,.uip-catalog input,.uip-catalog select,.uip-catalog textarea {
  touch-action:manipulation
}

.uip-catalog button {
  cursor:pointer
}

.uip-catalog button:disabled {
  cursor:not-allowed;
  opacity:.5
}

.uip-catalog a:focus-visible,.uip-catalog button:focus-visible,.uip-catalog input:focus-visible,.uip-catalog select:focus-visible,.uip-catalog textarea:focus-visible,.uip-catalog summary:focus-visible {
  outline:3px solid var(--accent-text);
  outline-offset:4px
}

.uip-catalog button,.uip-catalog input,.uip-catalog select,.uip-catalog textarea {
  color:var(--ink)
}

.uip-catalog input,.uip-catalog select,.uip-catalog textarea {
  background:white;
  border:1px solid #cbd2c5;
  border-radius:8px;
  min-height:44px;
  padding:9px 12px;
  width:100%;
  max-width:100%
}

.uip-catalog input[type=checkbox] {
  width:18px;
  min-height:18px;
  accent-color:var(--accent-text)
}

.uip-catalog input[type=file] {
  padding:8px
}

.uip-catalog textarea {
  resize:vertical;
  min-height:120px
}

.uip-catalog label {
  font-size:13px;
  font-weight:550;
  display:block
}

.uip-catalog label>input,.uip-catalog label>select,.uip-catalog label>textarea {
  margin-top:7px
}

.uip-catalog h1,.uip-catalog h2,.uip-catalog h3,.uip-catalog p {
  margin:0
}

.uip-catalog h1 {
  font-size:clamp(32px,3.2vw,46px);
  line-height:1.12;
  font-weight:600;
  letter-spacing:-1.6px
}

.uip-catalog h2 {
  font-size:24px;
  line-height:1.3;
  letter-spacing:-.7px;
  font-weight:600
}

.uip-catalog h3 {
  font-size:17px;
  line-height:1.4;
  font-weight:600
}

.uip-catalog p+p {
  margin-top:12px
}

.uip-catalog hr {
  border:0;
  border-top:1px solid var(--line);
  margin:24px 0
}

.uip-catalog .muted {
  color:var(--ink-2)
}

.uip-catalog .small {
  font-size:12px
}

.uip-catalog .mono {
  font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  font-size:12px
}

.uip-catalog .eyebrow {
  font-size:11px;
  letter-spacing:.18em;
  font-family:Consolas,monospace;
  text-transform:uppercase;
  color:var(--accent-text);
  margin-bottom:18px
}

.uip-catalog .icon {
  width:19px;
  height:19px;
  display:inline-block;
  flex:none;
  vertical-align:middle;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round
}

.uip-catalog .btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:44px;
  padding:10px 18px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface);
  font-size:13px;
  font-weight:600;
  white-space:nowrap;
  line-height:1.3
}

.uip-catalog .btn:hover {
  border-color:#a9b4a0;
  background:#f0f3ec
}

.uip-catalog .btn.primary {
  background:var(--accent);
  color:#0F1115;
  border-color:var(--accent)
}

.uip-catalog .btn.primary:hover {
  background:#69bb42
}

.uip-catalog .btn.dark {
  background:var(--ink);
  color:white;
  border-color:var(--ink)
}

.uip-catalog .btn.danger {
  background:#fff5f2;
  border-color:#eccac0;
  color:#9c3525
}

.uip-catalog .btn.small-btn {
  min-height:36px;
  padding:7px 12px;
  font-size:12px
}

.uip-catalog .btn.text {
  border:0;
  background:transparent;
  padding-left:0;
  padding-right:0
}

.uip-catalog .btn.icon-btn {
  padding:9px;
  min-width:42px
}

.uip-catalog .flex {
  display:flex;
  align-items:center;
  gap:12px
}

.uip-catalog .between {
  justify-content:space-between
}

.uip-catalog .wrap {
  flex-wrap:wrap
}

.uip-catalog .stack {
  display:flex;
  flex-direction:column;
  gap:20px
}

.uip-catalog .gap8 {
  gap:8px
}

.uip-catalog .spacer {
  flex:1
}

.uip-catalog .container {
  width:100%;
  max-width:1280px;
  padding:0 32px;
  margin:0 auto
}

.uip-catalog .skip {
  position:fixed;
  left:10px;
  top:-100px;
  background:white;
  padding:12px;
  z-index:100
}

.uip-catalog .skip:focus {
  top:10px
}

.uip-catalog .previewbar {
  min-height:42px;
  background:#222920;
  color:#edf1e9;
  display:flex;
  align-items:center;
  gap:18px;
  padding:4px 24px;
  position:relative;
  z-index:30;
  font-size:11px;
  flex-wrap:wrap
}

.uip-catalog .previewbar strong {
  letter-spacing:.08em
}

.uip-catalog .previewbar .tag {
  border-color:#717d68;
  color:#dce7d5
}

.uip-catalog .previewbar nav {
  display:flex;
  gap:6px;
  align-items:center;
  margin-left:auto
}

.uip-catalog .previewbar a,.uip-catalog .previewbar button {
  border:0;
  background:transparent;
  color:inherit;
  padding:6px 10px;
  border-radius:6px;
  font-size:11px;
  min-height:30px
}

.uip-catalog .previewbar nav .current {
  background:#465440
}

.uip-catalog .previewbar .separator {
  opacity:.3
}

.uip-catalog .site-header {
  height:82px;
  border-bottom:1px solid var(--line);
  background:var(--surface)
}

.uip-catalog .site-header .container {
  display:flex;
  align-items:center;
  height:100%;
  gap:38px
}

.uip-catalog .brand {
  font-weight:760;
  letter-spacing:-.7px;
  font-size:21px;
  line-height:1.1;
  display:flex;
  align-items:center;
  gap:9px
}

.uip-catalog .brand .mark {
  width:27px;
  height:32px;
  color:var(--accent)
}

.uip-catalog .brand small {
  display:block;
  font-weight:450;
  letter-spacing:.22em;
  font-size:8px;
  margin-top:5px;
  color:var(--ink-2)
}

.uip-catalog .site-nav {
  display:flex;
  gap:30px;
  margin-left:auto;
  font-size:13px
}

.uip-catalog .site-nav .active {
  color:var(--accent-text)
}

.uip-catalog .header-note {
  font-size:11px;
  color:var(--ink-2)
}

.uip-catalog .public-main {
  padding-bottom:50px
}

.uip-catalog .catalog-hero {
  display:grid;
  grid-template-columns:1.55fr 1fr;
  gap:60px;
  align-items:center;
  padding:36px 0 30px
}

.uip-catalog .catalog-hero p {
  max-width:480px;
  margin-top:16px;
  font-size:14px;
  color:var(--ink-2)
}

.uip-catalog .hero-materials {
  height:178px;
  border-radius:16px;
  overflow:hidden;
  position:relative;
  background:#e7e9df
}

.uip-catalog .hero-materials svg {
  width:100%;
  height:100%;
  display:block
}

.uip-catalog .hero-materials .material-caption {
  position:absolute;
  bottom:10px;
  left:15px;
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#525b49
}

.uip-catalog .catalog-tools {
  background:white;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:20px 22px;
  box-shadow:0 5px 20px #17201503
}

.uip-catalog .filter-grid {
  display:grid;
  grid-template-columns:minmax(210px,1.6fr) minmax(180px,1.1fr) auto auto;
  gap:18px;
  align-items:end
}

.uip-catalog .search-wrap {
  position:relative
}

.uip-catalog .search-wrap input {
  padding-left:38px
}

.uip-catalog .search-wrap .icon {
  position:absolute;
  left:12px;
  bottom:13px;
  color:var(--ink-2)
}

.uip-catalog .check {
  display:flex;
  align-items:center;
  gap:9px;
  min-height:44px;
  font-weight:450
}

.uip-catalog .check input {
  margin:0;
  flex:none
}

.uip-catalog .chips {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:16px
}

.uip-catalog .chip {
  display:inline-flex;
  align-items:center;
  gap:12px;
  border:1px solid var(--line);
  border-radius:7px;
  padding:5px 10px;
  font-size:12px;
  background:#f6f8f2
}

.uip-catalog .chip .icon {
  width:12px;
  height:12px
}

.uip-catalog .resultbar {
  padding:28px 0 20px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px
}

.uip-catalog .resultbar h2 {
  font-size:16px;
  letter-spacing:0
}

.uip-catalog .resultbar .sort {
  display:flex;
  align-items:center;
  gap:10px;
  font-size:12px;
  color:var(--ink-2)
}

.uip-catalog .sort select {
  width:auto;
  min-height:37px;
  padding:7px 30px 7px 10px;
  font-size:12px;
  border-color:var(--line);
  background:transparent
}

.uip-catalog .product-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px
}

.uip-catalog .product-card {
  background:white;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  position:relative;
  transition:box-shadow .18s,border-color .18s,transform .18s;
  min-width:0
}

.uip-catalog .product-card:hover {
  border-color:#bdc8b4;
  box-shadow:var(--shadow);
  transform:translateY(-2px)
}

.uip-catalog .product-card .media {
  height:205px;
  position:relative;
  background:#eceee7;
  display:block;
  overflow:hidden
}

.uip-catalog .media svg {
  width:100%;
  height:100%;
  display:block
}

.uip-catalog .media .sale-pill {
  position:absolute;
  top:14px;
  left:14px;
  background:white;
  border-radius:5px;
  padding:4px 9px;
  color:var(--accent-text);
  font-size:11px;
  font-weight:650
}

.uip-catalog .product-card .card-body {
  padding:18px 22px 18px
}

.uip-catalog .category-label {
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--ink-2);
  margin-bottom:8px
}

.uip-catalog .product-card h3 {
  font-size:17px;
  min-height:48px;
  letter-spacing:-.3px
}

.uip-catalog .sku {
  margin:7px 0 18px;
  color:#687061;
  font-size:11px
}

.uip-catalog .card-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  border-top:1px solid #edf0e8;
  padding-top:17px
}

.uip-catalog .price {
  display:flex;
  align-items:baseline;
  gap:6px;
  flex-wrap:wrap;
  font-size:18px;
  font-weight:600;
  letter-spacing:-.35px
}

.uip-catalog .price del {
  font-size:12px;
  color:#697261;
  font-weight:400
}

.uip-catalog .price.on-sale strong {
  color:var(--accent-text)
}

.uip-catalog .price .unit {
  font-size:11px;
  color:#4f5949;
  font-weight:400;
  letter-spacing:0
}

.uip-catalog .price .tax {
  font-size:10px;
  color:#647059;
  font-weight:400;
  letter-spacing:0
}

.uip-catalog .price.missing {
  font-size:14px;
  letter-spacing:0
}

.uip-catalog .card-arrow {
  width:32px;
  height:32px;
  border-radius:50%;
  border:1px solid var(--line);
  display:grid;
  place-items:center;
  flex:none
}

.uip-catalog .pagination {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  margin:34px 0 5px
}

.uip-catalog .pagination a,.uip-catalog .pagination span {
  display:flex;
  justify-content:center;
  align-items:center;
  min-width:40px;
  height:40px;
  border:1px solid var(--line);
  background:#fff;
  border-radius:8px;
  padding:0 12px;
  font-size:13px
}

.uip-catalog .pagination .current {
  background:var(--ink);
  border-color:var(--ink);
  color:white
}

.uip-catalog .bottom-note {
  margin-top:44px;
  border-top:1px solid var(--line);
  padding-top:28px;
  display:flex;
  align-items:center;
  gap:20px;
  justify-content:space-between
}

.uip-catalog .bottom-note p {
  font-size:13px;
  color:var(--ink-2);
  margin-top:7px
}

.uip-catalog .footer {
  border-top:1px solid var(--line);
  padding:25px 0;
  font-size:11px;
  color:var(--ink-2)
}

.uip-catalog .alert {
  padding:15px 18px;
  border:1px solid #ead6a3;
  background:#fffaf0;
  border-radius:10px;
  font-size:13px;
  margin:16px 0;
  color:#6d5020
}

.uip-catalog .alert.error {
  background:#fff5f2;
  border-color:#e8c7bc;
  color:#953c2d
}

.uip-catalog .alert.success {
  background:#f1f8e9;
  border-color:#c9dfb8;
  color:#376026
}

.uip-catalog .alert .btn {
  margin-top:10px
}

.uip-catalog .empty {
  min-height:250px;
  text-align:center;
  padding:56px 25px;
  background:white;
  border:1px solid var(--line);
  border-radius:14px
}

.uip-catalog .empty>.icon {
  width:34px;
  height:34px;
  color:#84917a;
  margin-bottom:20px
}

.uip-catalog .empty p {
  font-size:14px;
  color:var(--ink-2);
  margin:12px auto 22px;
  max-width:430px
}

.uip-catalog .breadcrumb {
  padding:25px 0;
  font-size:12px;
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--ink-2)
}

.uip-catalog .detail-grid {
  display:grid;
  grid-template-columns:1.12fr 1fr;
  gap:62px;
  align-items:start
}

.uip-catalog .main-gallery {
  width:100%;
  aspect-ratio:1.15;
  border:1px solid var(--line);
  background:#eaece4;
  padding:0;
  border-radius:16px;
  overflow:hidden;
  position:relative;
  display:block
}

.uip-catalog .main-gallery > svg {
  width:100%;
  height:100%;
  display:block
}

.uip-catalog .zoom-label {
  position:absolute;
  right:16px;
  bottom:16px;
  background:white;
  border-radius:8px;
  padding:9px;
  display:flex;
  align-items:center;
  font-size:11px;
  gap:8px
}

.uip-catalog .thumbnails {
  display:flex;
  gap:12px;
  margin-top:14px
}

.uip-catalog .thumb {
  border:1px solid var(--line);
  padding:0;
  border-radius:8px;
  overflow:hidden;
  aspect-ratio:1.25;
  width:92px;
  background:#eceee7
}

.uip-catalog .thumb.active {
  outline:2px solid var(--accent-text);
  outline-offset:2px
}

.uip-catalog .thumb > svg {
  width:100%;
  height:100%
}

.uip-catalog .detail-copy {
  padding-top:12px
}

.uip-catalog .detail-copy h1 {
  font-size:40px;
  line-height:1.15;
  margin:14px 0
}

.uip-catalog .detail-copy .price {
  font-size:32px;
  margin:25px 0 5px
}

.uip-catalog .detail-copy .price .unit {
  font-size:16px
}

.uip-catalog .detail-copy .price .tax {
  font-size:13px
}

.uip-catalog .detail-copy .price del {
  font-size:17px
}

.uip-catalog .detail-copy .price.missing {
  font-size:23px
}

.uip-catalog .detail-copy .desc {
  margin:22px 0;
  color:var(--ink-2);
  font-size:14px;
  line-height:1.8
}

.uip-catalog .detail-copy .btn {
  margin-top:20px;
  min-height:48px
}

.uip-catalog .detail-lower {
  margin-top:42px;
  padding-top:35px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:62px;
  border-top:1px solid var(--line)
}

.uip-catalog .spec-table {
  width:100%;
  border-collapse:collapse;
  margin-top:18px;
  font-size:13px
}

.uip-catalog .spec-table th,.uip-catalog .spec-table td {
  border-bottom:1px solid var(--line);
  padding:13px 0;
  vertical-align:top;
  text-align:left;
  font-weight:400
}

.uip-catalog .spec-table th {
  color:var(--ink-2);
  width:35%;
  padding-right:20px
}

.uip-catalog .spec-table td {
  overflow-wrap:anywhere
}

.uip-catalog .file-link {
  display:flex;
  align-items:center;
  gap:14px;
  border:1px solid var(--line);
  border-radius:10px;
  padding:16px;
  margin:18px 0;
  font-size:13px
}

.uip-catalog .tag {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:3px 8px;
  font-size:10px;
  white-space:nowrap;
  border-radius:5px;
  border:1px solid var(--line);
  color:#55634a;
  background:transparent;
  font-weight:500
}

.uip-catalog .tag.green {
  background:#eef7e7;
  border-color:#cfe4c2;
  color:#376427
}

.uip-catalog .tag.amber {
  background:#fff7e8;
  border-color:#edd8b1;
  color:#8a591d
}

.uip-catalog .tag.grey {
  background:#f1f3ef
}

.uip-catalog .tag.red {
  background:#fff0eb;
  border-color:#eccabc;
  color:#953c2d
}

.uip-catalog .tag.dot:before {
  content:"";
  width:5px;
  height:5px;
  background:currentColor;
  border-radius:50%
}

.uip-catalog .table-wrap {
  background:white;
  border:1px solid var(--line);
  border-radius:12px;
  overflow:hidden
}

.uip-catalog .mini-art svg {
  width:100%;
  height:100%
}

.uip-catalog .edit-link {
  font-size:12px;
  font-weight:600;
  color:var(--accent-text);
  display:flex;
  gap:5px;
  align-items:center
}

.uip-catalog .panel {
  background:white;
  border:1px solid var(--line);
  border-radius:12px;
  padding:24px
}

.uip-catalog .panel h2 {
  font-size:17px;
  margin-bottom:22px;
  letter-spacing:-.25px
}

.uip-catalog .panel .subhead {
  color:var(--ink-2);
  font-size:12px;
  margin-top:-13px;
  margin-bottom:22px
}

.uip-catalog .fields {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px
}

.uip-catalog .full {
  grid-column:1/-1
}

.uip-catalog .field-error {
  color:#9c3525;
  font-size:11px;
  margin-top:6px;
  display:block
}

.uip-catalog .invalid {
  border-color:#b44830
}

.uip-catalog .input-affix {
  display:flex;
  align-items:center;
  margin-top:7px;
  border:1px solid #cbd2c5;
  border-radius:8px;
  overflow:hidden
}

.uip-catalog .input-affix span {
  padding:10px 12px;
  color:var(--ink-2);
  font-size:12px;
  border-right:1px solid var(--line)
}

.uip-catalog .input-affix input {
  border:0;
  border-radius:0;
  min-width:0
}

.uip-catalog .section-rule {
  border-top:1px solid var(--line);
  padding-top:20px;
  margin-top:22px
}

.uip-catalog .inline-note {
  font-size:11px;
  color:var(--ink-2);
  margin-top:8px;
  line-height:1.65
}

.uip-catalog .public-price-preview {
  padding:18px 16px;
  border:1px solid var(--line);
  background:#f8faf4;
  border-radius:8px;
  margin:18px 0
}

.uip-catalog .public-price-preview .price {
  font-size:20px
}

.uip-catalog .public-price-preview h3 {
  font-size:13px;
  margin-bottom:13px
}

.uip-catalog .picture svg,.uip-catalog .picture img {
  width:100%;
  height:100%;
  object-fit:cover
}

.uip-catalog .quote-layout {
  max-width:900px;
  margin:44px auto
}

.uip-catalog .quote-layout h1 {
  font-size:40px;
  margin-bottom:17px
}

.uip-catalog .quote-layout>.muted {
  font-size:14px;
  margin-bottom:32px
}

.uip-catalog .quote-layout form {
  margin-top:30px
}

.uip-catalog .request-message {
  font-size:14px;
  line-height:1.85;
  padding:23px 0;
  white-space:pre-wrap
}

.uip-catalog .readonly {
  background:#f6f8f2;
  color:#57624c
}

.uip-catalog .dialog {
  border:1px solid #d7dfcf;
  border-radius:16px;
  padding:30px;
  max-width:550px;
  width:calc(100% - 32px);
  color:var(--ink);
  box-shadow:0 30px 100px #0003
}

.uip-catalog .dialog::backdrop {
  background:#171b1688;
  backdrop-filter:blur(3px)
}

.uip-catalog .dialog h2 {
  margin:0 0 15px
}

.uip-catalog .dialog p {
  font-size:13px;
  color:var(--ink-2);
  margin-bottom:18px
}

.uip-catalog .dialog .actions {
  display:flex;
  gap:10px;
  justify-content:flex-end;
  flex-wrap:wrap;
  margin-top:24px
}

.uip-catalog .gallery-dialog {
  max-width:920px;
  padding:20px
}

.uip-catalog .gallery-dialog .zoomed {
  height:min(65vh,660px);
  background:#e9ece3;
  border-radius:10px;
  overflow:hidden
}

.uip-catalog .zoomed svg {
  width:100%;
  height:100%
}

.uip-catalog .scenario-panel {
  max-width:660px;
  max-height:88vh
}

.uip-catalog .scenario-list {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px
}

.uip-catalog .scenario-list a {
  border:1px solid var(--line);
  border-radius:8px;
  padding:12px;
  font-size:12px
}

.uip-catalog .scenario-list a:hover {
  background:#f1f6eb
}

.uip-catalog .scenario-list a strong {
  display:block;
  margin-bottom:4px
}

.uip-catalog .scenario-section {
  margin-top:25px
}

.uip-catalog .scenario-section h3 {
  font-size:14px;
  margin-bottom:12px
}

.uip-catalog .review-badge {
  border:1px solid #a9b69d;
  background:#f5f8f0;
  padding:11px 14px;
  border-radius:8px;
  font-size:11px;
  margin-bottom:20px
}

.uip-catalog .toast {
  position:fixed;
  right:24px;
  bottom:24px;
  max-width:420px;
  padding:15px 19px;
  background:#202b1a;
  color:white;
  border-radius:12px;
  box-shadow:0 12px 35px #0002;
  font-size:13px;
  z-index:100
}

.uip-catalog .toast:empty {
  display:none
}

.uip-catalog .skeleton {
  border-radius:7px;
  background:linear-gradient(90deg,#eff1ea,#e5e8df,#eff1ea);
  background-size:200% 100%;
  height:16px;
  animation:shimmer 1.4s infinite
}

.uip-catalog .skeleton.big {
  height:225px;
  border-radius:14px
}

.uip-catalog .skeleton-row {
  height:70px;
  margin-bottom:12px
}

.uip-catalog .noimage {
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  width:100%;
  height:100%;
  gap:12px;
  color:#747f6a;
  font-size:12px
}

.uip-catalog .noimage .icon {
  width:35px;
  height:35px
}

.uip-catalog .mobile-only {
  display:none
}

.uip-catalog .hidden {
  display:none!important
}

.uip-catalog .notes-review {
  min-height:140px
}

.uip-catalog .review-guide {
  padding:30px;
  background:white;
  border:1px solid var(--line);
  border-radius:14px
}

.uip-catalog .review-guide h2 {
  margin-bottom:18px
}

.uip-catalog .review-guide ol {
  padding-left:22px;
  font-size:14px
}

.uip-catalog .review-guide li {
  padding:8px
}

.uip-catalog .harness-note {
  font-size:11px;
  color:#7e6c4b;
  padding:12px 20px;
  border-bottom:1px solid #e3d8bd;
  background:#fffaf0
}

.uip-catalog .price-clock-tabs {
  display:flex;
  gap:5px;
  margin:10px 0;
  flex-wrap:wrap
}

.uip-catalog .price-clock-tabs button {
  border:1px solid var(--line);
  border-radius:5px;
  background:white;
  font-size:10px;
  padding:5px 8px;
  min-height:30px
}

.uip-catalog .price-clock-tabs button.selected {
  background:#e7f1de;
  border-color:#92b977
}

@keyframes shimmer {
  to {
  background-position:-200% 0
}

}

@media(max-width:850px) {
  .uip-catalog .container {
  padding:0 22px
}

.uip-catalog .header-note {
  display:none
}

.uip-catalog .catalog-hero {
  gap:25px
}

.uip-catalog .filter-grid {
  grid-template-columns:1.4fr 1fr
}

.uip-catalog .filter-grid .check {
  grid-column:auto
}

.uip-catalog .product-grid {
  gap:16px;
  grid-template-columns:repeat(2,minmax(0,1fr))
}

.uip-catalog .detail-grid {
  gap:28px
}

.uip-catalog .detail-copy h1 {
  font-size:30px
}

.uip-catalog .detail-lower {
  gap:28px
}

.uip-catalog .mobile-only {
  display:initial
}

.uip-catalog .previewbar {
  padding:6px 12px;
  gap:8px
}

.uip-catalog .previewbar .desktop-label {
  display:none
}

.uip-catalog .previewbar nav {
  margin-left:auto;
  gap:0
}

.uip-catalog .previewbar nav a,.uip-catalog .previewbar nav button {
  padding:6px 7px
}

.uip-catalog .site-header .container {
  gap:16px
}

.uip-catalog .site-nav {
  gap:20px
}


}

@media(max-width:620px) {
  .uip-catalog {
  font-size:15px
}

.uip-catalog .previewbar {
  font-size:9px;
  min-height:42px
}

.uip-catalog .previewbar nav {
  width:100%;
  justify-content:space-between;
  margin:0
}

.uip-catalog .previewbar strong {
  font-size:10px
}

.uip-catalog .previewbar .tag {
  font-size:8px
}

.uip-catalog .previewbar nav a,.uip-catalog .previewbar nav button {
  font-size:10px;
  padding:4px 7px;
  min-height:26px
}

.uip-catalog .site-header {
  height:70px
}

.uip-catalog .container {
  padding:0 18px
}

.uip-catalog .brand {
  font-size:17px;
  letter-spacing:-.5px
}

.uip-catalog .brand .mark {
  width:22px
}

.uip-catalog .brand small {
  font-size:6px
}

.uip-catalog .site-nav {
  gap:12px;
  font-size:12px
}

.uip-catalog .site-nav .btn {
  font-size:10px;
  min-height:37px;
  padding:8px 10px
}

.uip-catalog .site-nav .nav-products {
  display:none
}

.uip-catalog .catalog-hero {
  grid-template-columns:1fr;
  padding:30px 0 27px;
  gap:0
}

.uip-catalog .catalog-hero h1 {
  font-size:35px;
  max-width:320px
}

.uip-catalog .catalog-hero p {
  font-size:13px;
  margin-top:14px
}

.uip-catalog .catalog-hero .eyebrow {
  margin-bottom:12px
}

.uip-catalog .hero-materials {
  display:none
}

.uip-catalog .catalog-tools {
  padding:16px
}

.uip-catalog .filter-grid {
  grid-template-columns:1fr 1fr;
  gap:12px
}

.uip-catalog .filter-grid .search-wrap {
  grid-column:1/-1
}

.uip-catalog .filter-grid .category-field {
  grid-column:1/-1
}

.uip-catalog .filter-grid label {
  font-size:11px
}

.uip-catalog .filter-grid input,.uip-catalog .filter-grid select {
  font-size:16px
}

.uip-catalog .filter-grid .check {
  font-size:12px
}

.uip-catalog .filter-grid .btn {
  align-self:end
}

.uip-catalog .resultbar {
  padding:22px 0 16px;
  gap:10px
}

.uip-catalog .resultbar h2 {
  font-size:13px
}

.uip-catalog .resultbar .sort>span {
  display:none
}

.uip-catalog .sort select {
  font-size:11px;
  max-width:165px
}

.uip-catalog .product-grid {
  gap:12px
}

.uip-catalog .product-card .media {
  height:147px
}

.uip-catalog .product-card .card-body {
  padding:13px 12px
}

.uip-catalog .category-label {
  font-size:8px;
  letter-spacing:.05em
}

.uip-catalog .product-card h3 {
  font-size:13px;
  min-height:40px
}

.uip-catalog .sku {
  font-size:9px;
  margin-bottom:11px
}

.uip-catalog .card-bottom {
  padding-top:10px;
  align-items:flex-end;
  gap:4px
}

.uip-catalog .price {
  font-size:16px;
  gap:4px
}

.uip-catalog .price del {
  font-size:10px
}

.uip-catalog .price .unit {
  font-size:10px
}

.uip-catalog .price .tax {
  font-size:9px
}

.uip-catalog .price.missing {
  font-size:12px
}

.uip-catalog .card-arrow {
  height:24px;
  width:24px
}

.uip-catalog .card-arrow .icon {
  width:14px;
  height:14px
}

.uip-catalog .media .sale-pill {
  top:9px;
  left:9px;
  font-size:9px;
  padding:3px 7px
}

.uip-catalog .bottom-note {
  display:block;
  margin-top:30px
}

.uip-catalog .bottom-note .btn {
  margin-top:17px
}

.uip-catalog .footer .flex {
  display:block
}

.uip-catalog .footer .small {
  margin-top:8px
}

.uip-catalog .detail-grid,.uip-catalog .detail-lower {
  grid-template-columns:1fr;
  gap:28px
}

.uip-catalog .detail-copy {
  padding:0
}

.uip-catalog .detail-copy h1 {
  font-size:34px
}

.uip-catalog .detail-copy .price {
  font-size:29px
}

.uip-catalog .detail-lower {
  margin-top:30px
}

.uip-catalog .breadcrumb {
  padding:20px 0;
  font-size:11px
}

.uip-catalog .fields {
  gap:17px;
  grid-template-columns:1fr
}

.uip-catalog .fields input,.uip-catalog .fields textarea,.uip-catalog .fields select {
  font-size:16px
}

.uip-catalog .panel {
  padding:20px 17px
}

.uip-catalog .panel h2 {
  font-size:16px
}

.uip-catalog .quote-layout {
  margin:30px 18px
}

.uip-catalog .quote-layout h1 {
  font-size:35px
}

.uip-catalog .scenario-list {
  grid-template-columns:1fr
}

.uip-catalog .scenario-panel {
  padding:24px 20px
}

.uip-catalog .dialog {
  padding:24px 20px
}

.uip-catalog .dialog .actions {
  flex-direction:column
}

.uip-catalog .dialog .actions>* {
  width:100%
}

.uip-catalog .toast {
  right:16px;
  left:16px;
  bottom:16px;
  max-width:none
}

.uip-catalog .previewbar .clock-indicator {
  margin-left:auto
}


}

@media(prefers-reduced-motion:reduce) {
  .uip-catalog * {
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important
}


}

.uip-catalog .screen-reader-text {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}

.uip-catalog .dialog {
  max-height:90vh;
  overflow:auto
}

.uip-catalog .dialog h2 {
  line-height:1.4;
  padding-right:12px
}

.uip-catalog .dialog .actions:empty {
  display:none
}

.uip-catalog .sample-upload {
  width:100%;
  height:100%;
  object-fit:contain;
  display:block
}

.uip-catalog .main-gallery .sample-upload,.uip-catalog .thumb .sample-upload {
  object-fit:contain
}

.uip-catalog .zoom-label .icon {
  width:16px;
  height:16px;
  flex:none
}

.uip-catalog .input-affix > span {
  white-space:nowrap;
  flex:none
}