/* The Good Cold — General Store, curated edition (2026-10-26).
   Pieces are sized by importance; every image is shown whole (no cropping). */
:root { --gs2-ink: #0e243a; --gs2-cream: #f8f6f0; --gs2-paper: #efe9dc; --gs2-red: #c8202f; --gs2-rule: #d9d0bf; }

.gs2-aisles { max-width: 1240px; margin: 40px auto 0; padding: 0 28px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; border-top: 2px solid var(--gs2-ink); border-bottom: 1px solid var(--gs2-rule); }
.gs2-aisles a { padding: 16px 14px 18px; color: var(--gs2-ink); text-decoration: none; font: 600 19px/1.15 'Barlow Condensed', 'Barlow Semi Condensed', sans-serif; border-right: 1px solid var(--gs2-rule); }
.gs2-aisles a:last-child { border-right: 0; }
.gs2-aisles a span { display: block; margin-bottom: 6px; font: 700 10.5px/1.2 'Public Sans', sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--gs2-red); }
.gs2-aisles a:hover { background: var(--gs2-paper); }

.gs2-letter { max-width: 860px; margin: 96px auto 40px; padding: 0 28px; text-align: center; }
.gs2-letter .eyebrow { color: var(--gs2-red); }
.gs2-letter .gs2-lede { margin: 18px 0 22px; font: 600 clamp(28px, 3.4vw, 44px)/1.12 'Barlow Condensed', sans-serif; color: var(--gs2-ink); text-wrap: balance; }
.gs2-letter p { font-size: 19px; line-height: 1.65; color: #26394c; text-wrap: pretty; }

.gs2-aisle { max-width: 1240px; margin: 0 auto; padding: 88px 28px 24px; scroll-margin-top: 110px; }
.gs2-aisle + .gs2-aisle { border-top: 1px solid var(--gs2-rule); }
.gs2-aisle-head { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 8px 56px; align-items: end; margin-bottom: 44px; }
.gs2-aisle-head .eyebrow { grid-column: 1 / -1; color: var(--gs2-red); }
.gs2-aisle-head h2 { margin: 0; font: 700 clamp(44px, 5.6vw, 84px)/.92 'Barlow Condensed', sans-serif; letter-spacing: -.01em; color: var(--gs2-ink); }
.gs2-aisle-head p { margin: 0; font-size: 18px; line-height: 1.6; color: #34475a; max-width: 52ch; }

.gs2-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 48px 28px; align-items: start; }
.gs2-card { position: relative; display: flex; flex-direction: column; min-width: 0; }
.gs2-card figure { margin: 0 0 18px; border-radius: 12px; overflow: hidden; background: var(--gs2-paper); }
.gs2-card figure img { display: block; width: 100%; height: auto; } /* whole image, never cropped */
.gs2-s2 { grid-column: span 2; } .gs2-s3 { grid-column: span 3; } .gs2-s4 { grid-column: span 4; }
.gs2-s5 { grid-column: span 5; } .gs2-s6 { grid-column: span 6; } .gs2-s7 { grid-column: span 7; }

.gs2-kind { margin: 0 0 6px; font: 700 11px/1.3 'Public Sans', sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #5a6b7c; }
.gs2-card h3 { margin: 0; font: 700 26px/1.02 'Barlow Condensed', sans-serif; color: var(--gs2-ink); text-wrap: balance; }
.gs2-price { margin: 8px 0 0; font: 600 20px/1 'Barlow Condensed', sans-serif; color: var(--gs2-red); }
.gs2-story { margin: 12px 0 0; font-size: 15.5px; line-height: 1.55; color: #2c3f52; text-wrap: pretty; }
.gs2-from { display: inline-block; margin-top: 12px; font: 600 13.5px/1.35 'Public Sans', sans-serif; color: var(--gs2-ink); text-decoration: underline; text-decoration-color: #c9bfa9; text-underline-offset: 4px; }
.gs2-from:hover { text-decoration-color: var(--gs2-red); }
.gs2-card .sample-add { align-self: flex-start; margin-top: 16px; }

/* smallest pieces: accessories read as accessories */
.gs2-s2 h3 { font-size: 21px; } .gs2-s2 .gs2-story { font-size: 14.5px; } .gs2-s2 .gs2-price { font-size: 18px; }
.gs2-s2 .sample-add, .gs2-s3 .sample-add { font-size: 13px; padding: 9px 12px; min-height: 0; }

/* the big pieces: a full magazine spread */
.gs2-spread { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: 0 56px; align-items: center; }
.gs2-spread figure { grid-row: 1 / span 2; margin: 0; }
.gs2-spread .gs2-copy { align-self: end; }
.gs2-spread .sample-add { align-self: start; grid-column: 2; }
.gs2-spread h3 { font-size: clamp(48px, 5vw, 76px); line-height: .92; }
.gs2-spread .gs2-kind { font-size: 12px; }
.gs2-spread .gs2-price { font-size: 30px; margin-top: 16px; }
.gs2-spread .gs2-story { font-size: 19px; line-height: 1.6; margin-top: 18px; }
#aisle-home .gs2-spread, #aisle-wall .gs2-spread { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); }
#aisle-home .gs2-spread figure, #aisle-wall .gs2-spread figure { grid-column: 2; }
#aisle-home .gs2-spread .gs2-copy, #aisle-home .gs2-spread .sample-add,
#aisle-wall .gs2-spread .gs2-copy, #aisle-wall .gs2-spread .sample-add { grid-column: 1; grid-row: auto; }
#aisle-home .gs2-spread .gs2-copy, #aisle-wall .gs2-spread .gs2-copy { grid-row: 1; }
#aisle-home .gs2-spread .sample-add, #aisle-wall .gs2-spread .sample-add { grid-row: 2; }
.gs2-spread figure img { max-height: 860px; width: auto; max-width: 100%; margin: 0 auto; }

/* the register: small things on a counter */
.gs2-register { padding-bottom: 64px; }
.gs2-register .gs2-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; padding: 28px; border-radius: 12px; background: var(--gs2-paper); }
.gs2-counter { padding: 16px; border-radius: 12px; background: var(--gs2-cream); }
.gs2-counter figure { margin-bottom: 12px; background: #fff; }
.gs2-counter figure img { max-height: 220px; width: auto; max-width: 100%; margin: 0 auto; }
.gs2-counter h3 { font-size: 20px; } .gs2-counter .gs2-price { font-size: 17px; }
.gs2-counter .gs2-story { font-size: 14px; margin-top: 8px; }
.gs2-counter .gs2-from { font-size: 12.5px; }
.gs2-counter .sample-add { font-size: 12.5px; padding: 8px 11px; min-height: 0; }

@media (max-width: 1000px) {
  .gs2-aisles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gs2-aisles a:nth-child(3) { border-right: 0; }
  .gs2-aisles a:nth-child(-n+3) { border-bottom: 1px solid var(--gs2-rule); }
  .gs2-s2, .gs2-s3 { grid-column: span 4; } .gs2-s4, .gs2-s5, .gs2-s6, .gs2-s7 { grid-column: span 6; }
  .gs2-register .gs2-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .gs2-aisles { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 16px; }
  .gs2-aisles a { border-right: 1px solid var(--gs2-rule) !important; border-bottom: 1px solid var(--gs2-rule); font-size: 17px; }
  .gs2-aisles a:nth-child(2n) { border-right: 0 !important; }
  .gs2-aisle { padding: 64px 16px 16px; }
  .gs2-aisle-head { grid-template-columns: 1fr; }
  .gs2-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 16px; }
  .gs2-s4, .gs2-s5, .gs2-s6, .gs2-s7 { grid-column: 1 / -1; }
  .gs2-s2, .gs2-s3 { grid-column: span 1; }
  .gs2-spread, #aisle-home .gs2-spread, #aisle-wall .gs2-spread { display: flex; flex-direction: column; }
  .gs2-spread figure { margin-bottom: 18px; }
  .gs2-spread h3 { font-size: 44px; }
  .gs2-register .gs2-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 14px; gap: 12px; }
  .gs2-letter { margin-top: 64px; padding: 0 16px; }
}
.gs2-card .sample-add { width: auto !important; align-self: flex-start; padding: 10px 16px; border: 1px solid var(--gs2-ink) !important; border-radius: 12px; background: transparent !important; color: var(--gs2-ink) !important; font: 600 13.5px/1 'Public Sans', sans-serif; cursor: pointer; }
.gs2-card .sample-add:hover { background: var(--gs2-ink) !important; color: var(--gs2-cream) !important; }
.gs2-spread .sample-add { padding: 14px 22px; font-size: 15px; background: var(--gs2-ink) !important; color: var(--gs2-cream) !important; }
.gs2-spread .sample-add:hover { background: var(--gs2-red) !important; border-color: var(--gs2-red) !important; }