/* ZIESHINE — Catalogue Edition (/new) — ZS_CATALOGUE_EDITION_V2 */
[data-page="new"]{
  --cat-paper: var(--paper, #F1F0EC);
  --cat-onyx: var(--onyx, #12131A);
  --cat-gold: var(--gold, #7A6340);
  --cat-line: rgba(18,19,26,.1);
  --cat-ease: cubic-bezier(.22,1,.36,1);
  background: var(--cat-paper);
}

/* —— Hero —— */
[data-page="new"] .cat-hero{
  background: var(--cat-onyx);
  color: #fff;
  padding: clamp(56px, 8vw, 88px) 0 clamp(48px, 6vw, 72px);
  position: relative;
  overflow: hidden;
  min-height: min(88vh, 760px);
  display: flex;
  align-items: flex-end;
}
[data-page="new"] .cat-hero::before{
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 55% 60% at 92% 12%, rgba(122,99,64,.28), transparent 58%),
    radial-gradient(ellipse 40% 45% at 8% 90%, rgba(196,181,154,.08), transparent 50%);
  pointer-events: none;
  z-index: 1;
}
[data-page="new"] .cat-hero::after{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, rgba(18,19,26,.94) 38%, rgba(18,19,26,.55) 68%, rgba(18,19,26,.28) 100%);
  pointer-events: none;
  z-index: 1;
}
[data-page="new"] .cat-hero .wrap{
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  gap: clamp(28px, 4vw, 56px);
  align-items: end;
  width: 100%;
}
[data-page="new"] .cat-hero-rule{
  width: 48px;
  height: 1px;
  margin: 0 0 22px;
  background: linear-gradient(90deg, var(--cat-gold), transparent);
  opacity: .9;
}
[data-page="new"] .cat-hero .crumb{
  color: rgba(255,255,255,.5);
  font-size: 11.5px;
  letter-spacing: .06em;
  margin-bottom: 20px;
}
[data-page="new"] .cat-hero .crumb a{ color: rgba(255,255,255,.72); text-decoration: none; }
[data-page="new"] .cat-hero .crumb a:hover{ color: #fff; }
[data-page="new"] .cat-hero .eyebrow{
  color: rgba(196,181,154,.92);
  margin: 0 0 14px;
  letter-spacing: .2em;
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 500;
}
[data-page="new"] .cat-hero h1{
  font-family: var(--display);
  font-weight: 600;
  letter-spacing: -.038em;
  font-size: clamp(2.15rem, 4.6vw, 3.55rem);
  line-height: 1.02;
  max-width: 14ch;
  text-wrap: balance;
  margin: 0;
}
[data-page="new"] .cat-hero h1 em{
  font-style: italic;
  font-weight: 500;
  color: rgba(196,181,154,.95);
}
[data-page="new"] .cat-hero .psub{
  margin-top: 20px;
  max-width: 40ch;
  color: rgba(255,255,255,.66);
  font-size: clamp(15px, 1.35vw, 17px);
  line-height: 1.65;
}
[data-page="new"] .cat-hero-cta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}
[data-page="new"] .cat-hero-cta .btn{
  border-radius: 0;
  min-height: 46px;
  padding: 0 20px;
  font-size: 10.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 500;
}
[data-page="new"] .cat-hero-cta .btn.solid{
  background: #fff;
  color: var(--cat-onyx);
  border-color: #fff;
}
[data-page="new"] .cat-hero-cta .btn.ghost{
  border-color: rgba(255,255,255,.4);
  color: #fff;
  background: transparent;
}
[data-page="new"] .cat-hero-cta .btn.ghost:hover{
  border-color: #fff;
  background: rgba(255,255,255,.06);
}
[data-page="new"] .cat-hero-cover{
  aspect-ratio: 4/5;
  max-height: min(62vh, 560px);
  background: #1a1b22;
  overflow: hidden;
  position: relative;
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
}
[data-page="new"] .cat-hero-cover img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.01);
  transition: transform 1.2s var(--cat-ease);
}
[data-page="new"] .cat-hero.is-ready .cat-hero-cover img{ transform: scale(1); }
[data-page="new"] .cat-hero-cover .cat-code{
  position: absolute;
  left: 14px;
  bottom: 14px;
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 10.5px;
  letter-spacing: .1em;
  padding: 7px 11px;
  background: rgba(18,19,26,.78);
  color: rgba(255,255,255,.9);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.08);
}

/* —— Facts + hands —— */
[data-page="new"] .cat-facts{
  background: var(--cat-paper);
  border-bottom: 1px solid var(--cat-line);
}
[data-page="new"] .cat-facts .wrap > .cat-facts-row,
[data-page="new"] .cat-facts-row{
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
}
[data-page="new"] .cat-facts-row > div{
  padding: 22px 18px 24px 0;
  border-right: 1px solid var(--cat-line);
}
[data-page="new"] .cat-facts-row > div:last-child{ border-right: 0; }
[data-page="new"] .cat-facts b{
  display: block;
  font-family: var(--mono, ui-monospace, monospace);
  font-weight: 600;
  font-size: 18px;
  letter-spacing: -.01em;
  color: var(--cat-onyx);
}
[data-page="new"] .cat-facts span{
  display: block;
  margin-top: 5px;
  font-size: 11.5px;
  color: var(--ash, #6b6e76);
  line-height: 1.35;
}
[data-page="new"] .cat-hands{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 16px 0 0;
  border-top: 1px solid var(--cat-line);
  margin-top: 0;
}
[data-page="new"] .cat-hands-wrap{
  padding-bottom: 18px;
}
[data-page="new"] .cat-hand{
  appearance: none;
  border: 1px solid var(--cat-line);
  background: transparent;
  color: var(--cat-onyx);
  font-size: 11.5px;
  letter-spacing: .04em;
  padding: 8px 14px;
  cursor: pointer;
  transition: background .25s var(--cat-ease), color .25s, border-color .25s;
}
[data-page="new"] .cat-hand:hover{
  border-color: rgba(122,99,64,.45);
}
[data-page="new"] .cat-hand.is-on{
  background: var(--cat-onyx);
  color: #fff;
  border-color: var(--cat-onyx);
}
[data-page="new"] .cat-hand b{
  font-weight: 600;
  font-family: inherit;
  font-size: inherit;
}
[data-page="new"] .cat-hand i{
  font-style: normal;
  opacity: .55;
  margin-left: 6px;
}

/* —— Edition section —— */
[data-page="new"] .cat-section{
  padding: 40px 0 80px;
  background: var(--cat-paper);
}
[data-page="new"] .cat-toolbar-sticky{
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(241,240,236,.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid transparent;
  margin: 0 -4px 18px;
  padding: 10px 4px 12px;
  transition: border-color .25s, box-shadow .25s;
}
[data-page="new"] .cat-toolbar-sticky.is-stuck{
  border-bottom-color: var(--cat-line);
  box-shadow: 0 8px 24px rgba(18,19,26,.04);
}
[data-page="new"] .cat-toolbar{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
}
[data-page="new"] .cat-chapters{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  flex: 1;
  min-width: 0;
}
[data-page="new"] .cat-chapters .cf{
  border-radius: 0;
  border: 1px solid var(--cat-line);
  background: transparent;
  color: var(--cat-onyx);
  font-size: 11.5px;
  letter-spacing: .03em;
  padding: 8px 12px;
  cursor: pointer;
}
[data-page="new"] .cat-chapters .cf.active,
[data-page="new"] .cat-chapters .cf[aria-selected="true"]{
  background: var(--cat-onyx);
  color: #fff;
  border-color: var(--cat-onyx);
}
[data-page="new"] .cat-summary{
  margin: 0;
  font-size: 12px;
  color: var(--ash, #6b6e76);
  font-family: var(--mono, ui-monospace, monospace);
  letter-spacing: .02em;
}
[data-page="new"] .cat-toolbar .btn{
  border-radius: 0;
  font-size: 11px;
  padding: 9px 14px;
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}

[data-page="new"] .cat-chapter-head{
  margin: 8px 0 20px;
}
[data-page="new"] .cat-chapter-head h2{
  font-family: var(--display);
  font-size: clamp(1.4rem, 2.4vw, 1.85rem);
  letter-spacing: -.025em;
  margin: 0 0 6px;
  font-weight: 600;
}
[data-page="new"] .cat-chapter-head p{
  margin: 0;
  font-size: 13.5px;
  color: var(--ash, #6b6e76);
  max-width: 48ch;
  line-height: 1.55;
}

/* —— Grid / cards —— */
[data-page="new"] .cat-grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 32px 20px;
}
[data-page="new"] .cat-grid.cat-grid--magazine .cat-card:first-child{
  grid-column: span 2;
}
[data-page="new"] .cat-grid.cat-grid--magazine .cat-card:first-child h3{
  font-size: clamp(1.15rem, 1.8vw, 1.45rem);
}
[data-page="new"] .cat-card{
  background: transparent;
  border: 0;
  display: flex;
  flex-direction: column;
  min-width: 0;
  opacity: 0;
  transform: translateY(12px);
  animation: catCardIn .55s var(--cat-ease) forwards;
}
[data-page="new"] .cat-card:nth-child(1){ animation-delay: .02s; }
[data-page="new"] .cat-card:nth-child(2){ animation-delay: .06s; }
[data-page="new"] .cat-card:nth-child(3){ animation-delay: .1s; }
[data-page="new"] .cat-card:nth-child(4){ animation-delay: .14s; }
[data-page="new"] .cat-card:nth-child(n+5){ animation-delay: .18s; }
@keyframes catCardIn{
  to{ opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce){
  [data-page="new"] .cat-card{ opacity: 1; transform: none; animation: none; }
  [data-page="new"] .cat-hero-cover img{ transition: none; }
}
[data-page="new"] .cat-card .pc-img{
  position: relative;
  aspect-ratio: 3/4;
  overflow: hidden;
  background: #e4e2dc;
  border-radius: 0;
  box-shadow: none;
}
[data-page="new"] .cat-card .pc-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .7s var(--cat-ease);
}
[data-page="new"] .cat-card:hover .pc-img img{ transform: scale(1.035); }
[data-page="new"] .cat-card .pc-badge{
  border-radius: 0;
  font-size: 9.5px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
[data-page="new"] .cat-card .pc-new{
  background: var(--cat-onyx);
  color: #fff;
}
[data-page="new"] .cat-card .pc-body{ padding: 14px 2px 0; }
[data-page="new"] .cat-card .pc-code{
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 10.5px;
  letter-spacing: .08em;
  color: var(--cat-gold);
  margin: 0 0 6px;
  cursor: pointer;
  display: inline-block;
  border-bottom: 1px solid transparent;
  transition: border-color .2s;
}
[data-page="new"] .cat-card .pc-code:hover{ border-bottom-color: rgba(122,99,64,.45); }
[data-page="new"] .cat-card h3{
  font-family: var(--display);
  font-size: 1.02rem;
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.25;
  margin: 0 0 6px;
  color: var(--cat-onyx);
}
[data-page="new"] .cat-card .pc-fab{ font-size: 12px; margin: 0 0 8px; }
[data-page="new"] .cat-card .pc-fab-link{ color: inherit; text-decoration: none; border-bottom: 1px solid rgba(18,19,26,.12); }
[data-page="new"] .cat-card .pc-fab-link:hover{ border-bottom-color: var(--cat-gold); }
[data-page="new"] .cat-card .pc-trust{
  font-size: 11px;
  color: var(--ash, #6b6e76);
  margin: 0 0 10px;
}
[data-page="new"] .cat-card .na-blurb{ display: none; }
[data-page="new"] .cat-card .pc-colours{ margin-bottom: 12px; }
[data-page="new"] .cat-card .pc-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
[data-page="new"] .cat-card .pc-cta,
[data-page="new"] .cat-card .pc-sample,
[data-page="new"] .cat-card .pc-inq{
  border-radius: 0;
  font-size: 11px;
  letter-spacing: .04em;
}

[data-page="new"] .na-skel{
  aspect-ratio: 3/4;
  background: linear-gradient(90deg, #e8e7e2 0%, #f4f3ef 50%, #e8e7e2 100%);
  background-size: 200% 100%;
  animation: catSkel 1.2s ease infinite;
}
@keyframes catSkel{
  0%{ background-position: 100% 0; }
  100%{ background-position: -100% 0; }
}

[data-page="new"] .cat-empty{
  padding: 48px 0;
  text-align: center;
  color: var(--ash, #6b6e76);
}

[data-page="new"] .na-cta{
  margin-top: 48px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
[data-page="new"] .na-cta .btn{ border-radius: 0; }

[data-page="new"] .na-archive-sec{
  padding: 56px 0 64px;
  border-top: 1px solid var(--cat-line);
  background: #f7f6f2;
}
[data-page="new"] .na-archive-sec .eyebrow{
  letter-spacing: .18em;
  font-size: 10px;
  color: rgba(18,19,26,.4);
}
[data-page="new"] .homecert,
[data-page="new"] .zs-flow-block{
  background: var(--cat-paper);
}

@media (max-width: 1100px){
  [data-page="new"] .cat-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
  [data-page="new"] .cat-grid.cat-grid--magazine .cat-card:first-child{ grid-column: span 1; }
  [data-page="new"] .cat-facts .wrap > .cat-facts-row,
  [data-page="new"] .cat-facts-row{ grid-template-columns: repeat(3, 1fr); }
  [data-page="new"] .cat-facts-row > div:nth-child(3){ border-right: 0; }
}
@media (max-width: 800px){
  [data-page="new"] .cat-hero{
    min-height: 0;
    padding: 48px 0 40px;
    align-items: stretch;
  }
  [data-page="new"] .cat-hero .wrap{ grid-template-columns: 1fr; gap: 28px; }
  [data-page="new"] .cat-hero-cover{ max-height: 48vh; order: -1; }
  [data-page="new"] .cat-hero h1{ max-width: 16ch; }
  [data-page="new"] .cat-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 12px; }
  [data-page="new"] .cat-facts .wrap > .cat-facts-row,
  [data-page="new"] .cat-facts-row{ grid-template-columns: repeat(2, 1fr); }
  [data-page="new"] .cat-facts-row > div{ border-right: 0; border-bottom: 1px solid var(--cat-line); }
  [data-page="new"] .cat-toolbar-sticky{ top: 0; }
  [data-page="new"] .cat-summary{ width: 100%; order: 3; }
}

/* —— Shortlist dock + card action —— */
[data-page="new"] .cat-toolbar-sticky{ top: 72px; }
[data-page="new"] .pc-short{
  border: 1px solid rgba(18,19,26,.18);
  background: transparent;
  color: var(--cat-onyx);
  font-size: 11px;
  letter-spacing: .04em;
  padding: 7px 10px;
  cursor: pointer;
  border-radius: 0;
}
[data-page="new"] .pc-short.on{
  background: var(--cat-onyx);
  color: #fff;
  border-color: var(--cat-onyx);
}
[data-page="new"] .cat-forward{
  font-size: 11px !important;
  letter-spacing: .08em !important;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 12px;
}
[data-page="new"] .cat-shortlist-dock{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 80;
  padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
  background: rgba(18,19,26,.94);
  color: #fff;
  backdrop-filter: blur(12px);
  border-top: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 -12px 40px rgba(0,0,0,.25);
}
[data-page="new"] .cat-shortlist-inner{
  max-width: var(--zs-measure, 1180px);
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
}
[data-page="new"] .cat-shortlist-label{
  margin: 0;
  font-size: 13px;
  letter-spacing: .02em;
}
[data-page="new"] .cat-shortlist-label b{
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 16px;
  margin-right: 4px;
}
[data-page="new"] .cat-shortlist-tip{
  font-size: 12px;
  color: rgba(196,181,154,.95);
}
[data-page="new"] .cat-shortlist-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
}
[data-page="new"] .cat-shortlist-dock .btn{
  border-radius: 0;
  min-height: 40px;
  font-size: 10.5px;
  letter-spacing: .1em;
  text-transform: uppercase;
}
[data-page="new"] .cat-shortlist-dock .btn.ghost{
  border-color: rgba(255,255,255,.35);
  color: #fff;
  background: transparent;
}
[data-page="new"] .cat-shortlist-dock .btn.solid{
  background: #fff;
  color: #12131A;
  border-color: #fff;
}
[data-page="new"] .na-archive-sec .mrow{
  display: grid;
  grid-template-columns: 120px 1fr auto;
  gap: 16px;
  align-items: center;
  padding: 16px 0;
  border-bottom: 1px solid rgba(18,19,26,.08);
}
[data-page="new"] .na-archive-sec .mmonth{
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 12px;
  letter-spacing: .04em;
  color: rgba(18,19,26,.5);
}
[data-page="new"] .na-archive-sec .mtitle b{ display:block; margin-bottom: 4px; }
[data-page="new"] .na-archive-sec .mtitle span{ font-size: 12.5px; color: rgba(18,19,26,.55); }
[data-page="new"] .na-archive-sec .mcat a{
  font-size: 12px;
  letter-spacing: .04em;
  color: var(--cat-gold);
  text-decoration: none;
  border-bottom: 1px solid rgba(122,99,64,.35);
}
@media (max-width: 800px){
  [data-page="new"] .cat-toolbar-sticky{ top: 56px; }
  [data-page="new"] .na-archive-sec .mrow{ grid-template-columns: 1fr; gap: 6px; }
  [data-page="new"] .cat-shortlist-actions{ margin-left: 0; width: 100%; }
  [data-page="new"] body, [data-page="new"]{ padding-bottom: 0; }
  [data-page="new"] .cat-section{ padding-bottom: 110px; }
}
