#catalog-view{padding:36px 40px 48px;background:var(--bg-primary)}
.catalog-wrap{max-width:1600px;margin:0 auto}
.catalog-heading{margin-bottom:30px}
.catalog-heading h1{font-size:32px;line-height:1.2;font-weight:500;letter-spacing:-.8px;margin:0 0 10px}
.catalog-heading p{font-size:14px;line-height:1.6;color:var(--text-tertiary);margin:0}
.catalog-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.catalog-tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;text-align:left;min-width:0;min-height:260px;padding:20px;border:1px solid var(--surface-border);background:var(--bg-secondary);color:var(--text-primary);transition:background 150ms ease,border-color 150ms ease}
.catalog-icon{display:inline-flex;color:var(--text-secondary);margin-bottom:42px}
.catalog-icon svg{width:30px;height:30px;stroke-width:1.5}
.catalog-copy{display:block;margin-top:auto;padding-right:10px}
.catalog-title{display:block;font-size:20px;font-weight:500;letter-spacing:-.25px;line-height:1.35;margin-bottom:12px;padding-right:16px}
.catalog-description{display:block;font-size:13px;font-weight:400;line-height:1.7;color:var(--text-tertiary)}
.catalog-arrow{position:absolute;top:31px;right:28px;color:var(--text-tertiary);transition:transform 150ms ease,color 150ms ease}
.catalog-arrow svg{width:19px;height:19px}
@media(hover:hover){.catalog-tile:hover{background:var(--surface-hover);border-color:var(--surface-border-strong)}.catalog-tile:hover .catalog-arrow{transform:translateX(3px);color:var(--text-primary)}}
.catalog-tile:focus-visible{outline:2px solid var(--text-secondary);outline-offset:4px}
@media(max-width:1440px){.catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1200px){.catalog-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-tile{padding:20px}.catalog-arrow{right:20px;top:26px}}
@media(max-width:900px){#catalog-view{padding:28px 24px 36px}.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.catalog-title{font-size:19px}}
@media(max-width:600px){#catalog-view{padding:26px 20px 32px}.catalog-heading h1{font-size:28px}.catalog-heading{margin-bottom:24px}.catalog-grid{grid-template-columns:1fr;gap:14px}.catalog-tile{min-height:240px;padding:20px}.catalog-icon{margin-bottom:20px}.catalog-description{font-size:13px;line-height:1.55}}
/* Editorial imagery is decorative; feed names remain the accessible labels. */
.catalog-tile{isolation:isolate;overflow:hidden;min-height:260px;background:#141414;color:#fff;border-color:var(--surface-border-strong)}
.catalog-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 35%;z-index:-2;transition:transform 500ms cubic-bezier(.2,.65,.3,1)}
.catalog-tile::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.22) 0%,rgba(0,0,0,.17) 22%,rgba(0,0,0,.78) 53%,rgba(0,0,0,.94) 100%)}
.catalog-icon{display:flex;align-items:center;justify-content:center;width:34px;height:34px;margin-bottom:20px;background:rgba(0,0,0,.34);border:1px solid rgba(255,255,255,.22);color:#fff}
.catalog-icon svg{width:21px;height:21px}
.catalog-title{color:#fff;font-weight:500;text-wrap:balance}
.catalog-description{color:#dedede;line-height:1.65}
.catalog-arrow{color:#fff;top:27px;right:20px}
@media(hover:hover){.catalog-tile:hover{background:#141414;border-color:var(--text-tertiary)}.catalog-tile:hover .catalog-photo{transform:scale(1.035)}.catalog-tile:hover .catalog-arrow{color:#fff}}
@media(max-width:1200px){.catalog-arrow{top:27px}}
@media(max-width:600px){.catalog-tile{min-height:240px}.catalog-icon{margin-bottom:20px}}
@media(prefers-reduced-motion:reduce){.catalog-tile,.catalog-arrow,.catalog-photo{transition:none}}

/* Align titles and descriptions within each editorial tile. */
.catalog-tile{border-radius:8px}
.catalog-icon{border-radius:4px;margin-bottom:20px}
.catalog-copy{display:grid;grid-template-rows:minmax(48px,auto) minmax(80px,auto);gap:8px;width:100%;padding-right:0}
.catalog-title{font-size:17px;line-height:1.4;margin-bottom:0;text-wrap:pretty;align-self:end}
.catalog-description{font-size:13px;line-height:1.55}
@media(max-width:600px){.catalog-copy{grid-template-rows:auto auto;gap:10px}.catalog-icon{margin-bottom:20px}}
@media(prefers-reduced-motion:reduce){.catalog-tile:hover .catalog-photo,.catalog-tile:hover .catalog-arrow{transform:none}}
