/* CONCEPT C — catalogue, product, cart, checkout */

/* Collection: filters are a drawer at every width, freeing the photography. */
.shop {
  position: relative;
  display: block;
  padding-top: 0;
  padding-bottom: var(--cc-section);
}
.shop > div { min-width: 0; }
.shop-aside {
  position: fixed;
  z-index: var(--z-drawer);
  inset: 0 auto 0 0;
  width: min(460px,100vw);
  height: 100dvh;
  padding: 0 30px 38px;
  color: var(--cc-ink);
  background: var(--cc-paper);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow-y: auto;
  transform: translateX(-102%);
  transition: transform var(--cc-drawer) var(--cc-ease);
}
html[dir="rtl"] .shop-aside { inset: 0 0 0 auto; transform: translateX(102%); }
.shop-aside[data-open="true"],
html[dir="rtl"] .shop-aside[data-open="true"] { transform: translateX(0); }
.shop-aside__handle {
  position: sticky;
  z-index: 2;
  top: 0;
  min-height: 74px;
  margin: 0 -30px 28px;
  padding: 0 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--cc-paper);
  border-bottom: 1px solid var(--cc-line);
}
.shop-filter-group { padding: 24px 0; border-bottom: 1px solid var(--cc-line); }
.shop-filter-group > h2,
.shop-filter-group > h3 { margin-bottom: 16px; font: 600 10px/1 var(--cc-ui); letter-spacing: .13em; text-transform: uppercase; }
.shop-filter-link { min-height: 42px; padding: 0; border: 0; }
.shop-filter-link[aria-current="true"] { color: var(--cc-burgundy); background: transparent; }
.shop-size { border-radius: var(--cc-r-1); }
.shop-swatch { border-radius: 50%; }

/* Sub-category rail: a centered row of round portraits, one per sub-category,
   sitting above the sticky count/sort bar. Kept small and quiet on purpose —
   it is a way in to the collection, not a second hero. */
.subcat-rail-wrap { padding: 8px 0 36px; }
.subcat-rail {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(20px, 3.6vw, 40px);
}
.subcat-chip {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  width: 84px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--cc-ink);
  cursor: pointer;
}
.subcat-chip__img {
  display: block;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--cc-bone);
  border: 1px solid var(--cc-line);
  transition: border-color var(--cc-state) var(--cc-ease), box-shadow var(--cc-state) var(--cc-ease);
}
.subcat-chip__img img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; display: block; }
.subcat-chip:hover .subcat-chip__img { border-color: var(--cc-ink); }
.subcat-chip.is-on .subcat-chip__img,
.subcat-chip[aria-pressed="true"] .subcat-chip__img {
  border-color: var(--cc-burgundy);
  box-shadow: 0 0 0 3px var(--cc-paper), 0 0 0 4px var(--cc-burgundy);
}
.subcat-chip__label {
  font: 600 10px/1.35 var(--cc-ui);
  letter-spacing: .06em;
  text-transform: uppercase;
  text-align: center;
}
.subcat-chip__count {
  display: block;
  margin-top: 1px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: var(--cc-muted);
  font-variant-numeric: tabular-nums;
}
.subcat-chip.is-on .subcat-chip__label,
.subcat-chip[aria-pressed="true"] .subcat-chip__label { color: var(--cc-burgundy); }

.shop-bar {
  position: sticky;
  z-index: var(--z-sticky);
  top: 69px;
  min-height: 68px;
  margin: 0 calc(var(--cc-gutter) * -1) 36px;
  padding: 0 var(--cc-gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: color-mix(in srgb,var(--cc-paper) 96%,transparent);
  border-bottom: 1px solid var(--cc-line);
  backdrop-filter: blur(10px);
}
.shop-filter-toggle { display: inline-flex !important; }
.shop-sort .m-select { min-height: 44px; padding-inline: 12px 32px; border: 0; }
.shop-count { font-size: 11px; letter-spacing: .04em; }
.shop-count strong { font: 500 24px/1 var(--cc-display); }
.cc-density {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  border-inline: 1px solid var(--cc-line);
}
.cc-density button {
  width: 42px; height: 42px;
  border: 0; border-radius: 0;
  color: var(--cc-muted); background: transparent;
  font: 600 10px/1 var(--cc-ui);
  cursor: pointer;
}
.cc-density button[aria-pressed="true"] { color: #fff; background: var(--cc-ink); }

#productsGrid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(34px,4vw,72px) clamp(14px,2.2vw,34px); }
#productsGrid[data-density="2"] { grid-template-columns: repeat(2,minmax(0,1fr)); }
#productsGrid[data-density="4"] { grid-template-columns: repeat(4,minmax(0,1fr)); }
#productsGrid .at-card:nth-child(3n+2) { margin-top: 46px; }
#productsGrid[data-density="2"] .at-card:nth-child(3n+2),
#productsGrid[data-density="4"] .at-card:nth-child(3n+2) { margin-top: 0; }
.shop-applied { padding-bottom: 26px; border-bottom: 1px solid var(--cc-line); }
.pagination { padding-top: 72px; }

/* Product detail: vertical editorial contact sheet + minimal sticky buy column. */
.pdp {
  grid-template-columns: minmax(0,1.35fr) minmax(340px,.65fr);
  gap: clamp(36px,6vw,110px);
  padding-top: 28px;
  padding-bottom: var(--cc-section);
}
.pdp__gallery { min-width: 0; }
.pdp__rail { grid-template-columns: 1fr 1fr; gap: 10px; }
.pdp__frame {
  border-radius: 0;
  background: var(--cc-bone);
  overflow: hidden;
}
.pdp__frame:first-child { grid-column: 1 / -1; }
.pdp__frame img { transition: transform 700ms var(--cc-ease); }
.pdp__panel {
  top: 110px;
  padding-top: 8px;
  border-top: 1px solid var(--cc-ink);
}
.pdp__eyebrow { margin-top: 18px; color: var(--cc-muted); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }
.pdp__title {
  margin-top: 18px;
  font: 500 clamp(40px,4.8vw,74px)/.95 var(--cc-display);
  letter-spacing: -.03em;
}
.pdp__price { margin-top: 20px; font-variant-numeric: tabular-nums; }
.pdp__price b { font: 500 22px/1 var(--cc-ui); }
.pdp__price em { border-radius: var(--cc-r-1); background: var(--cc-burgundy); }
.pdp__blurb { color: var(--cc-muted); }
.pdp__opt { padding-block: 20px; border-top: 1px solid var(--cc-line); }
.pdp__tile { border-radius: var(--cc-r-1); }
.pdp__swatch { border-radius: 50%; }
.qty { border-radius: var(--cc-r-1); }
.pdp__save { border-radius: var(--cc-r-1); }
.pdp__service { border-top: 1px solid var(--cc-line); border-bottom: 1px solid var(--cc-line); }
.pdp__accordion { border-bottom-color: var(--cc-line); }
.at-also .at-sec-head h2,
[data-seen-section] .at-sec-head h2 { font: 500 clamp(42px,6vw,84px)/.9 var(--cc-display); letter-spacing: -.03em; }
.at-also .at-grid,
.at-recent { grid-template-columns: repeat(4,minmax(0,1fr)); }
.at-modal { border-radius: var(--cc-r-2); background: var(--cc-paper); }
.at-buybar { border-radius: 0; background: var(--cc-paper); border-top: 1px solid var(--cc-line); box-shadow: none; }

/* Cart and checkout keep the same reliable forms with a stricter material language. */
.cart-layout,
.checkout { gap: clamp(28px,5vw,80px); }
.cart-line,
.summary__line { border-bottom-color: var(--cc-line); }
.cart-line__media,
.summary__thumb { border-radius: 0; background: var(--cc-bone); }
.summary,
.form-block {
  background: transparent;
  border: 1px solid var(--cc-line);
  border-radius: var(--cc-r-2);
}
.summary { box-shadow: none; }
.steps li[aria-current="step"] { color: var(--cc-burgundy); }
.choice { border-radius: var(--cc-r-1); }
.choice:has(input:checked) { border-color: var(--cc-burgundy); background: rgba(101,30,42,.04); }
.done-facts,
.hairline-facts { border-color: var(--cc-line); border-radius: var(--cc-r-2); }

@media (max-width: 1023px) {
  .shop-bar { top: 59px; }
  #productsGrid,
  #productsGrid[data-density="4"] { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .pdp { grid-template-columns: minmax(0,1.1fr) minmax(310px,.9fr); gap: 30px; }
  .pdp__rail { grid-template-columns: 1fr; }
  .pdp__frame:first-child { grid-column: auto; }
}

@media (max-width: 719px) {
  .page-head { padding-block: 42px 50px; }
  .page-head h1 { font-size: clamp(48px,17vw,72px); }
  .page-head-inner { display: block; }
  .page-head-inner > .m-link { margin-top: 20px; }
  .shop { padding-inline: 18px; }
  .shop-bar { margin-inline: -18px; padding-inline: 18px; }
  .subcat-rail { gap: 18px 22px; }
  .subcat-chip { width: 68px; }
  .subcat-chip__img { width: 52px; height: 52px; }
  .shop-count span { display: none; }
  .cc-density { display: none; }
  #productsGrid,
  #productsGrid[data-density="2"],
  #productsGrid[data-density="3"],
  #productsGrid[data-density="4"] { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 36px 10px; }
  #productsGrid .at-card:nth-child(3n+2) { margin-top: 0; }
  #productsGrid .at-card:nth-child(even) { margin-top: 34px; }
  #productsGrid .at-card__name { font-size: 12px; }
  #productsGrid .at-card__cat { display: none; }
  .shop-aside { padding-inline: 20px; }
  .shop-aside__handle { margin-inline: -20px; padding-inline: 20px; }

  .pdp { display: block; padding-inline: 0; padding-top: 10px; }
  .pdp__gallery { padding-inline: 0; }
  .pdp__rail { display:flex;gap:2px;overflow-x:auto;scroll-snap-type:x mandatory; }
  .pdp__frame { flex:0 0 92vw; scroll-snap-align:center; aspect-ratio:4/5; }
  .pdp__panel { position:static; padding:38px 18px 120px; border-top:0; }
  .pdp__title { font-size:48px; }
  .pdp__buy-row { grid-template-columns: 96px 1fr 44px; }
  .at-also,
  [data-seen-section] { padding-inline:18px; }
  .at-also .at-grid,
  .at-recent { grid-template-columns:repeat(2,minmax(0,1fr));gap:34px 10px; }
}