.catalog-page { min-height: 100vh; background: #f7f8fd; }
.catalog-header { position: absolute; }
.catalog-nav { display: flex; align-items: center; gap: 9px; }
.catalog-nav a { min-height: 42px; padding: 0 14px; display: inline-flex; align-items: center; border-radius: 11px; color: #404a69; font-size: 12px; font-weight: 850; }
.catalog-nav a:hover, .catalog-nav a:focus-visible { outline: 0; background: #f1f3fa; }
.catalog-nav a.active { color: white; background: #101a4a; }
.catalog-hero { position: relative; padding: 158px max(6vw,36px) 72px; overflow: hidden; background: linear-gradient(rgba(255,255,255,.72) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.72) 1px,transparent 1px),radial-gradient(circle at 90% 10%,#e7e5ff 0,transparent 30%),linear-gradient(145deg,#fbfcff,#f3f2ff); background-size: 44px 44px,44px 44px,auto,auto; }
.catalog-hero.image-catalog-hero { background: linear-gradient(rgba(255,255,255,.72) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.72) 1px,transparent 1px),radial-gradient(circle at 88% 7%,#ffe2e8 0,transparent 32%),linear-gradient(145deg,#fbfcff,#fff4f7); background-size: 44px 44px,44px 44px,auto,auto; }
.catalog-hero-inner { position: relative; z-index: 1; max-width: 1240px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 45px; }
.catalog-hero h1 { max-width: 850px; margin: 20px 0 17px; font-size: clamp(52px,6vw,86px); line-height: .95; letter-spacing: -.065em; }
.catalog-hero h1 span { display: block; color: transparent; background: linear-gradient(100deg,#ff4b65,#6b38cb 56%,#008fd6); -webkit-background-clip: text; background-clip: text; }
.catalog-hero p { max-width: 700px; margin: 0; color: #596482; font-size: 17px; line-height: 1.75; }
.catalog-stat { min-width: 160px; padding: 23px; border: 1px solid rgba(255,255,255,.95); border-radius: 20px; background: rgba(255,255,255,.76); box-shadow: 0 18px 45px rgba(33,42,97,.09); backdrop-filter: blur(14px); }
.catalog-stat b, .catalog-stat span { display: block; }
.catalog-stat b { font-size: 38px; letter-spacing: -.04em; }
.catalog-stat span { margin-top: 5px; color: #6e7895; font-size: 11px; line-height: 1.45; }
.catalog-main { max-width: 1290px; margin: 0 auto; padding: 42px 24px 100px; }
.catalog-toolbar { padding: 14px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; border: 1px solid #dee2ef; border-radius: 20px; background: white; box-shadow: 0 14px 35px rgba(30,39,88,.05); }
.catalog-search { min-height: 52px; padding: 0 15px; display: flex; align-items: center; gap: 11px; border: 1px solid #e0e3ee; border-radius: 13px; background: #f8f9fc; }
.catalog-search span { color: #6d7794; font-size: 20px; }
.catalog-search input { width: 100%; min-width: 0; border: 0; outline: 0; color: #172147; background: transparent; font-size: 14px; }
.collection-switch { display: flex; gap: 7px; }
.collection-switch a { min-height: 52px; padding: 0 17px; display: inline-flex; align-items: center; border: 1px solid #dfe2ed; border-radius: 13px; color: #4e5877; background: #fff; font-size: 11px; font-weight: 900; }
.collection-switch a.active { border-color: #17214c; color: white; background: #17214c; }
.catalog-summary { margin: 34px 0 16px; display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.catalog-summary h2 { margin: 0; font-size: 26px; letter-spacing: -.035em; }
.catalog-summary p { margin: 5px 0 0; color: #747e9a; font-size: 12px; }
.catalog-summary span { color: #6d7692; font-size: 11px; font-weight: 850; }
.catalog-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.catalog-card { position: relative; min-height: 328px; padding: 25px; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #dde1ed; border-radius: 23px; background: white; transition: transform .22s ease,box-shadow .22s ease,border-color .22s ease; }
a.catalog-card:hover { transform: translateY(-5px); border-color: #c6cbea; box-shadow: 0 20px 45px rgba(28,37,86,.09); }
.catalog-card.live { border-color: rgba(24,170,116,.35); background: linear-gradient(145deg,#fff 48%,#effbf6); }
.catalog-card.live::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg,#13aa74,#00b9d0); }
.catalog-card-top { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.catalog-card-icon { width: 56px; height: 56px; display: grid; place-items: center; border-radius: 16px; color: white; background: linear-gradient(135deg,#ff4b65,#743aca); font-size: 11px; font-weight: 950; letter-spacing: .02em; }
.pdf-catalog .catalog-card-icon { background: linear-gradient(135deg,#29216f,#1689e2); }
.catalog-status { padding: 6px 8px; border-radius: 999px; color: #6650b5; background: #f0edff; font-size: 9px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.catalog-status.live-label { color: #087b55; background: #e8f9f2; }
.catalog-status.next-label { color: #9a5e14; background: #fff3dd; }
.catalog-card h3 { margin: 25px 0 9px; font-size: 22px; letter-spacing: -.035em; }
.catalog-card > p { margin: 0; color: #626c89; font-size: 13px; line-height: 1.65; }
.format-line { margin-top: 14px; color: #7a839e; font-size: 10px; font-weight: 750; line-height: 1.5; }
.catalog-card-action { margin-top: auto; padding-top: 24px; display: flex; align-items: center; justify-content: space-between; color: #6d7692; font-size: 11px; font-weight: 850; }
a.catalog-card .catalog-card-action { color: #253052; }
.catalog-card-action b { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #dce0eb; border-radius: 50%; color: #17214b; background: white; font-size: 15px; }
.catalog-card[hidden] { display: none; }
.catalog-empty { margin-top: 17px; padding: 40px; border: 1px dashed #cad0e2; border-radius: 20px; color: #69738f; text-align: center; }
.catalog-notice { margin-top: 36px; padding: 25px; display: grid; grid-template-columns: auto minmax(0,1fr); gap: 16px; border: 1px solid #f0d8a7; border-radius: 20px; color: #5f4a22; background: #fff9ec; }
.catalog-notice > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; color: white; background: #e2932f; font-weight: 950; }
.catalog-notice h3 { margin: 1px 0 7px; font-size: 15px; }
.catalog-notice p { margin: 0; color: #786439; font-size: 11px; line-height: 1.65; }
@media (max-width: 980px) { .catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .catalog-hero-inner { grid-template-columns: 1fr; } .catalog-stat { width: 100%; } }
@media (max-width: 760px) { .catalog-nav { position: absolute; top: 72px; left: 0; right: 0; padding: 12px; display: none; flex-direction: column; align-items: stretch; border: 1px solid #e0e3ef; border-radius: 18px; background: white; box-shadow: 0 18px 50px rgba(25,33,79,.14); } .catalog-nav.open { display: flex; } .catalog-menu { display: flex; } .catalog-hero { padding: 132px 20px 55px; } .catalog-hero h1 { font-size: 50px; } .catalog-hero p { font-size: 15px; } .catalog-main { padding: 25px 13px 70px; } .catalog-toolbar { grid-template-columns: 1fr; } .collection-switch { display: grid; grid-template-columns: repeat(3,1fr); } .collection-switch a { padding-inline:8px; justify-content: center; } .catalog-summary { align-items: flex-start; flex-direction: column; } .catalog-grid { grid-template-columns: 1fr; } }
