.catalog-page { color: #062b35; }
.catalog-page a { color: #006b76; text-underline-offset: .3rem; }
.catalog-page a:focus-visible, .catalog-page input:focus-visible, .catalog-page button:focus-visible { outline: 3px solid #0099a8; outline-offset: 4px; }
.catalog-search { margin-block: 2rem; max-width: 35rem; }
.catalog-search label { display: block; margin-block-end: .4rem; font-weight: 700; }
.catalog-search > div { display: flex; gap: .6rem; }
.catalog-search input { min-width: 0; flex: 1; font: inherit; border: 1px solid #b9cbce; border-radius: .3rem; padding: .7rem; background: #fff; }
.catalog-search button { font: inherit; padding: .7rem 1.4rem; color: #fff; background: #006b76; border: 0; border-radius: .3rem; cursor: pointer; }
.catalog-search button:hover { background: #075b64; }
.catalog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.3rem; }
.catalog-card { min-width: 0; border: 1px solid #dce5e6; border-radius: .5rem; overflow: hidden; background: #fff; }
.catalog-card > div { padding: 1.2rem; }
.catalog-card h2 { margin: 0; font-size: 1.25rem; }
.catalog-card p { margin-block: .75rem 0; color: #53656a; white-space: pre-line; }
.catalog-card h2, .catalog-card p, .catalog-intro, .catalog-empty { overflow-wrap: anywhere; }
.catalog-cover { display: block; width: 100%; height: auto; aspect-ratio: 16/13; object-fit: contain; background: #edf2f2; color: #062b35; }
.catalog-intro { margin-block: 1.5rem 2rem; }
.catalog-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-block: 2rem; }
.catalog-gallery figure { margin: 0; min-width: 0; border: 1px solid #dce5e6; border-radius: .5rem; background: #fff; overflow: hidden; }
.catalog-gallery figure:first-child { grid-column: 1 / -1; }
.catalog-gallery img { display: block; width: 100%; height: auto; max-height: 34rem; object-fit: contain; color: #062b35; }
.catalog-body { margin-block: 2rem; max-width: 60rem; }
.catalog-empty { padding-block: 2rem; }
@media (max-width: 56rem) { .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 36rem) { .catalog-grid, .catalog-gallery { grid-template-columns: minmax(0, 1fr); } .catalog-search button { padding-inline: 1rem; } }
