body:has(.shop-home) header .col-md-5 { display: none; }
body:has(.shop-home) header #logo { margin-bottom: 0; }
body:has(.shop-home) header .row { align-items: center; justify-content: space-between; }
body:has(.shop-home) header #cart { margin-left: auto; }
body:has(.shop-home) footer { position: static; }
.shop-home { color: #17343a; }
.shop-hero { background: radial-gradient(circle at 83% 22%, #d1eee8 0, transparent 36%), linear-gradient(130deg, #f5fbf9 0%, #e8f5f2 100%); padding: 72px 20px 86px; }
.shop-hero-inner, .shop-results-inner { max-width: 1050px; margin: auto; }
.shop-hero-inner { text-align: center; }
.shop-eyebrow { color: #007e72; font-size: .76rem; font-weight: 800; letter-spacing: .18em; }
.shop-hero .shop-eyebrow { font-size: clamp(2.3rem, 5vw, 4.1rem); font-weight: 760; line-height: 1.08; letter-spacing: -.04em; }
.shop-hero h1 { font-size: clamp(2.3rem, 5vw, 4.1rem); font-weight: 760; line-height: 1.08; margin: 14px 0; letter-spacing: -.04em; }
.shop-hero p { color: #507078; font-size: 1.12rem; margin: 0 0 34px; }
.shop-search-panel { text-align: left; max-width: 850px; margin: auto; padding: 32px; background: #fff; border: 1px solid #deebe7; border-radius: 22px; box-shadow: 0 17px 48px rgba(21, 78, 73, .11); }
.shop-search-panel label { display: block; font-weight: 700; font-size: .92rem; margin: 0 0 9px; }
.shop-input-wrap { position: relative; }
.shop-input-wrap input, .shop-field select { width: 100%; min-height: 54px; border: 1px solid #bfd5d0; border-radius: 11px; background: #fff; color: #17343a; padding: 12px 15px; font-size: 1rem; }
.shop-input-wrap input { padding-left: 48px; }
.shop-input-wrap input:focus, .shop-field select:focus { outline: 3px solid #b0e5db; border-color: #008f80; }
.shop-input-wrap input::placeholder { color: #849b9b; }
.shop-search-icon { position: absolute; left: 16px; top: 7px; font-size: 2rem; line-height: 1; color: #008779; }
.shop-divider { display: flex; align-items: center; gap: 15px; color: #788d8c; font-size: .83rem; margin: 24px 0; }
.shop-divider:before, .shop-divider:after { content: ""; flex: 1; height: 1px; background: #e0eae7; }
.shop-select-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.shop-field select:disabled { background: #eef3f2; color: #879a99; cursor: not-allowed; }
.shop-hint { color: #68817f; font-size: .85rem; margin-top: 16px; }
.shop-results-section { padding: 52px 20px 75px; background: #fff; }
.shop-results-section[hidden], #shop-more[hidden] { display: none !important; }
.shop-results-heading { display: flex; justify-content: space-between; align-items: end; gap: 12px; }
.shop-results-heading h2 { font-size: 2rem; margin: 7px 0 0; }
#shop-clear, #shop-more { color: #007e72; background: none; border: 1px solid #8ecbc0; border-radius: 9px; padding: 9px 16px; font-weight: 700; }
#shop-results-status { color: #5e7978; margin: 10px 0 25px; }
.shop-results-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 19px; }
.shop-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #e0eae7; border-radius: 15px; overflow: hidden; box-shadow: 0 5px 18px rgba(15, 57, 53, .05); transition: transform .15s, box-shadow .15s; color: inherit; text-decoration: none; }
.shop-card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(15, 57, 53, .12); color: inherit; }
.shop-card-media { height: 190px; display: flex; align-items: center; justify-content: center; background: #f6faf9; padding: 15px; }
.shop-card-media img { max-height: 100%; max-width: 100%; object-fit: contain; }
.shop-card-placeholder { color: #a5c4bd; font-size: 3.8rem; line-height: 1; }
.shop-card-body { padding: 17px 18px 20px; display: flex; flex-direction: column; flex: 1; }
.shop-card-code { color: #007e72; font-size: .75rem; font-weight: 800; letter-spacing: .06em; }
.shop-card-name { font-size: 1rem; font-weight: 700; line-height: 1.4; margin: 8px 0 15px; flex: 1; }
.shop-card-price { font-weight: 800; font-size: 1.15rem; }
#shop-more { display: block; margin: 27px auto 0; }
@media (max-width: 750px) { .shop-hero { padding: 48px 16px 62px; } .shop-search-panel { padding: 23px; } .shop-select-row { grid-template-columns: 1fr; } .shop-results-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .shop-results-grid { grid-template-columns: 1fr; } .shop-results-heading { align-items: center; } .shop-results-heading h2 { font-size: 1.55rem; } .shop-card { flex-direction: row; } .shop-card-media { width: 115px; height: auto; min-height: 130px; flex: none; } }

/* CMYK storefront */
.shop-home { color: var(--tb-black); }
.shop-hero {
  position: relative;
  background:
    radial-gradient(circle at 13% 38%, rgba(0, 174, 239, .14), transparent 32%),
    radial-gradient(circle at 89% 21%, rgba(208, 0, 120, .10), transparent 31%),
    linear-gradient(155deg, #fffdf8 0%, #fff9df 100%);
  border-bottom: 1px solid #efdf9d;
}
.shop-hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 8px;
  background: linear-gradient(90deg, var(--tb-cyan) 0 33.33%, var(--tb-magenta) 33.33% 66.66%, var(--tb-yellow) 66.66% 100%);
}
.shop-eyebrow { color: var(--tb-magenta); }
.shop-hero .shop-eyebrow {
  color: var(--tb-magenta);
  display: inline-block;
  border-bottom: .11em solid var(--tb-yellow);
  padding: 0 .08em .02em;
}
.shop-hero h1 { color: var(--tb-black); }
.shop-hero p { color: #4f4f55; }
.shop-search-panel {
  border: 2px solid var(--tb-black);
  border-top: 7px solid var(--tb-magenta);
  border-radius: 15px;
  box-shadow: 11px 11px 0 var(--tb-cyan);
}
.shop-search-panel label { color: var(--tb-black); }
.shop-input-wrap input, .shop-field select {
  border-color: #a9a9af;
  border-radius: 8px;
  color: var(--tb-black);
}
.shop-input-wrap input:focus, .shop-field select:focus {
  outline: 3px solid rgba(0, 174, 239, .24);
  border-color: var(--tb-cyan-dark);
}
.shop-search-icon { color: var(--tb-magenta); }
.shop-divider { color: #5c5c62; }
.shop-divider:before, .shop-divider:after { background: var(--tb-yellow); height: 2px; }
.shop-field select:disabled { background: #f1f1f1; color: #77777e; }
.shop-hint { color: #55555c; }

.shop-results-section { background: var(--tb-paper); }
.shop-results-heading h2 { color: var(--tb-black); }
#shop-results-status { color: #52525a; }
#shop-clear, #shop-more { border-color: var(--tb-black); color: var(--tb-black); }
#shop-clear:hover, #shop-more:hover { background: var(--tb-yellow); }
#shop-more { background: var(--tb-yellow); }
.shop-card { border-color: #d5d5d9; box-shadow: 0 5px 18px rgba(23, 23, 27, .07); }
.shop-card:hover { border-color: var(--tb-magenta); box-shadow: 0 12px 28px rgba(23, 23, 27, .14); }
.shop-card-media { background: #ecfaff; }
.shop-card-placeholder { color: var(--tb-cyan-dark); }
.shop-card-code { color: var(--tb-cyan-dark); }
.shop-card-name { color: var(--tb-black); }
.shop-card-price { color: var(--tb-magenta); }

@media (max-width: 750px) {
  .shop-search-panel { box-shadow: 7px 7px 0 var(--tb-cyan); }
}
