/* Calcuera collection page */
.cx.coll{background:var(--cx-paper);padding-block:0 clamp(3rem,7vw,5rem)}
.cx .coll-top{display:flex;justify-content:space-between;align-items:center;gap:1rem;min-height:68px;padding-block:.6rem;margin-bottom:1.5rem;border-bottom:1px solid var(--cx-line)}
.cx .coll-top h1{font-family:"Inter Tight","Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400;font-size:clamp(1.15rem,1.4vw,1.4rem);letter-spacing:-.015em;text-transform:none;line-height:1;margin:0;display:flex;align-items:baseline;gap:.5rem;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cx .coll-titles{display:grid;gap:.3rem;min-width:0}
.cx .coll-crumbs{display:flex;gap:.4rem;align-items:center;font-family:"Inter Tight","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:.78rem;color:var(--cx-mute);letter-spacing:-.005em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cx .coll-crumbs a:hover{color:var(--cx-ink);text-decoration:underline;text-underline-offset:3px}
.cx .coll-crumbs [aria-current]{color:var(--cx-ink)}
.cx .coll-count{font-size:.8em;color:var(--cx-mute);font-variant-numeric:tabular-nums}
.cx .coll-head{display:grid;gap:.9rem;margin-bottom:2rem;max-width:60ch}
.cx .crumbs{display:flex;gap:.6rem;flex-wrap:wrap}
.cx .crumbs a:hover{color:var(--cx-ink)}
.cx .coll-head h1{font-size:clamp(2.4rem,6vw,4.6rem);font-weight:800;text-transform:uppercase;line-height:.95}
.cx .coll-desc{color:var(--cx-mute);font-size:1.02rem}
.cx .coll-desc p{margin:0}
.cx .coll-bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding-block:1rem;border-block:1px solid var(--cx-line);margin-bottom:1.5rem}
.cx .coll-sort{display:flex;align-items:center;gap:.7rem}
.cx .coll-sort select{font:inherit;font-family:"Inter Tight","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:.9rem;color:var(--cx-ink);background:transparent;border:0;border-radius:0;padding:.4rem 1.6rem .4rem .4rem;appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--cx-ink) 50%),linear-gradient(135deg,var(--cx-ink) 50%,transparent 50%);background-position:calc(100% - 15px) 52%,calc(100% - 10px) 52%;background-size:5px 5px;background-repeat:no-repeat;cursor:pointer}

/* Grid: 4 across on desktop, every row = 3 products + 1 image tile */
.cx .cgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem .75rem;align-items:stretch}
@media(min-width:1000px){.cx .cgrid{grid-template-columns:repeat(4,minmax(0,1fr));gap:2.5rem 1rem}}
.cx .cgrid .card{display:grid;gap:.75rem;align-content:start;min-width:0}
.cx .card-media{aspect-ratio:4/5}
.cx .card-link{position:absolute;inset:0;display:block}
.cx .card-link .card-img,.cx .card-link>svg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cx .card-link>svg{background:var(--cx-tile);fill:#9AA8A2}
.cx .card-link .alt{position:absolute;inset:0;opacity:0;transition:opacity .35s}
.cx .card:hover .card-link .alt,.cx .card:focus-within .card-link .alt{opacity:1}
.cx .card-colours{font-size:.82rem;color:var(--cx-mute);margin-top:-.4rem}

.cx .ctile{display:block;min-height:100%;aspect-ratio:auto}
@media(max-width:999px){.cx .ctile{aspect-ratio:4/5;min-height:0}}
.cx .ctile>svg{background:var(--cx-tile-2)}
.cx .ctile-copy{position:absolute;left:0;right:0;bottom:0;z-index:1;display:grid;gap:.35rem;padding:1rem;color:var(--cx-chalk);background:linear-gradient(transparent,rgba(18,30,29,.65))}
.cx .ctile-copy .eyebrow{color:#C7D4D0}
.cx .ctile-copy strong{font-family:var(--cx-display);font-weight:800;font-size:clamp(1.15rem,2vw,1.6rem);text-transform:uppercase;line-height:1}
.cx .ctile-copy .go{font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;text-decoration:underline;text-underline-offset:4px}
.cx .ctile>img{transition:transform .6s ease}
.cx a.ctile:hover>img{transform:scale(1.03)}

.cx .cpages{display:flex;justify-content:center;align-items:center;gap:1.2rem;margin-top:3rem;flex-wrap:wrap}
.cx .cempty{display:grid;gap:1rem;justify-items:start;padding-block:3rem;max-width:46ch}
.cx .cempty h2{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:800;text-transform:uppercase}
.cx .cempty p{color:var(--cx-mute)}
