.collections-page { position: relative; overflow: hidden; padding-bottom: 58px; background: radial-gradient(circle at 74% 3%, rgb(255 220 226 / 56%), transparent 24%), radial-gradient(circle at 90% 2%, rgb(255 225 232 / 55%), transparent 25%), linear-gradient(180deg, #fdfcff 0, #fff 390px); color: #101638; }
.collections-layout { gap: 0; padding: 0; }
.collections-layout > .home-sidebar { align-self: stretch; margin: 0; padding: 0; }
.collections-layout > .home-sidebar > .catalog-sidebar__inner { padding: 24px 16px 40px; }
.collections-layout > .collections-page { min-width: 0; }
.collections-layout .collections-page > .container { width: 100%; box-sizing: border-box; padding-right: clamp(20px, 2.2vw, 36px); padding-left: clamp(20px, 2.2vw, 36px); }
.collections-icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.collections-page > .container { width: min(calc(100% - 64px), 1420px); }
.collections-hero { position: relative; }
.collections-breadcrumb { display: flex; min-height: 52px; align-items: center; gap: 11px; color: #66708f; font-size: 12px; }.collections-breadcrumb a:hover { color: #da2543; }.collections-breadcrumb span { color: #9aa1b5; font-size: 20px; line-height: 1; }.collections-breadcrumb strong { color: #df304d; font-weight: 760; }
.collections-hero-grid { display: grid; min-height: 158px; grid-template-columns: minmax(0, .92fr) minmax(520px, 1.08fr); align-items: center; gap: 30px; }
.collections-hero-copy { position: relative; z-index: 2; align-self: center; padding-bottom: 18px; }.collections-hero-copy h1 { margin: 0 0 14px; color: #0c1234; font-size: clamp(42px, 4vw, 55px); font-weight: 850; letter-spacing: -.052em; line-height: 1; }.collections-hero-copy p { max-width: 485px; margin: 0; color: #4d5879; font-size: 14px; line-height: 1.62; }
.collections-hero-art { width: min(100%, 680px); justify-self: end; }
.collections-hero-art img { display: block; width: 100%; height: auto; }

.collections-main { position: relative; z-index: 3; }
.collections-featured { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; }
.collections-feature-card { position: relative; display: grid; min-height: 140px; grid-template-columns: 58px minmax(0, 1fr); grid-template-rows: 1fr auto; align-items: center; gap: 13px 14px; overflow: hidden; border: 1px solid #dfe2ec; border-radius: 14px; padding: 22px 17px 15px; background: rgb(255 255 255 / 90%); box-shadow: 0 8px 22px rgb(36 32 82 / 4%); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }.collections-feature-card:hover { border-color: #ecacb7; box-shadow: 0 13px 28px rgb(122 45 58 / 10%); transform: translateY(-2px); }
.collections-feature-icon { display: grid; width: 58px; height: 58px; place-items: center; border-radius: 13px; }.collections-feature-icon svg { width: 34px; height: 34px; fill: currentColor; stroke: none; }
.collections-feature-card > span:nth-child(2) { min-width: 0; align-self: center; }.collections-feature-card strong { display: block; overflow: hidden; margin-bottom: 6px; color: #151b3c; font-size: 14px; font-weight: 820; letter-spacing: -.025em; text-overflow: ellipsis; white-space: nowrap; }.collections-feature-card small { display: -webkit-box; overflow: hidden; color: #596381; font-size: 11px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.collections-feature-card em { color: #485271; font-size: 11px; font-style: normal; font-weight: 650; }.collections-feature-card > b { display: grid; width: 24px; height: 24px; place-items: center; justify-self: end; color: #20294e; }.collections-feature-card > b svg { width: 20px; height: 20px; fill: currentColor; stroke: none; }
.collections-feature-card--violet .collections-feature-icon { background: #ffe8ec; color: #e5405c; }
.collections-feature-card--orange .collections-feature-icon { background: #fff0e6; color: #f47313; }
.collections-feature-card--green .collections-feature-icon { background: #e4f8ef; color: #18b970; }
.collections-feature-card--blue .collections-feature-icon { background: #e9f2ff; color: #357de4; }
.collections-feature-card--gold .collections-feature-icon { background: #fff5da; color: #e39a0b; }
@media (hover: hover) and (min-width: 721px) {
  .collections-feature-card .ui-app-card__secondary { max-height: 0; opacity: 0; transform: translateY(-3px); }
  .collections-feature-card:is(:hover, :focus-visible) .ui-app-card__secondary { max-height: 3.5rem; opacity: 1; transform: none; }
}

.collections-recent { padding-top: 31px; scroll-margin-top: 82px; }.collections-recent > header { display: flex; min-height: 42px; align-items: flex-start; justify-content: space-between; gap: 20px; }.collections-recent > header h2 { margin: 0; color: #111739; font-size: 20px; font-weight: 830; letter-spacing: -.035em; }.collections-recent > header > a { display: inline-flex; min-height: 34px; align-items: center; gap: 9px; border: 1px solid #dddfea; border-radius: 8px; padding: 0 13px; background: #fff; color: #d92442; font-size: 11px; font-weight: 750; }.collections-recent > header > a:hover { border-color: #eca8b3; }.collections-recent > header svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.collections-recent-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; }
.collections-recent-card { position: relative; display: flex; min-height: 258px; flex-direction: column; overflow: hidden; border: 1px solid #dfe2ec; border-radius: 14px; background: #fff; box-shadow: 0 8px 22px rgb(36 32 82 / 4%); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }.collections-recent-card:hover { border-color: #eab5be; box-shadow: 0 14px 30px rgb(104 42 52 / 10%); transform: translateY(-2px); }
.collections-recent-visual { position: relative; display: flex; min-height: 112px; align-items: center; padding: 29px 17px 18px; }.collections-recent-card--lavender .collections-recent-visual { background: linear-gradient(145deg, #ffeaee, #fff3f5); }.collections-recent-card--sand .collections-recent-visual { background: linear-gradient(145deg, #fff5e7, #fffaf1); }.collections-recent-card--rose .collections-recent-visual { background: linear-gradient(145deg, #ffedf3, #fff6f8); }.collections-recent-card--mint .collections-recent-visual { background: linear-gradient(145deg, #eefbe8, #f7fff1); }.collections-recent-card--sky .collections-recent-visual { background: linear-gradient(145deg, #edf5ff, #f4f9ff); }
.collections-new-badge { position: absolute; top: 12px; left: 17px; border-radius: 999px; padding: 3px 8px; background: #fff; color: #da2644; font-size: 10px; font-weight: 800; box-shadow: 0 3px 9px rgb(133 43 58 / 8%); }
.collections-app-logos { display: flex; width: 100%; align-items: center; justify-content: center; gap: 8px; }.collections-app-logo, .collections-app-more { display: grid; width: 48px; height: 48px; flex: 0 0 48px; overflow: hidden; place-items: center; border: 1px solid rgb(222 222 235 / 90%); border-radius: 12px; background: #fff; color: #fff; box-shadow: 0 6px 13px rgb(96 42 51 / 9%); }.collections-app-logo img { width: 100%; height: 100%; padding: 7px; background: #fff; object-fit: contain; }.collections-app-logo b { font-size: 13px; font-weight: 850; }.collections-app-logo--1 { background: linear-gradient(145deg, #1d244b, #de3955); }.collections-app-logo--2 { background: linear-gradient(145deg, #ff3f85, #ff7542); }.collections-app-logo--3 { background: linear-gradient(145deg, #16bbb9, #3476df); }.collections-app-logo--empty { color: #e8405c; }.collections-app-logo--empty svg { width: 27px; height: 27px; fill: currentColor; stroke: currentColor; stroke-width: 1.5; }.collections-app-more { width: 42px; height: 42px; flex-basis: 42px; color: #46506e; font-size: 11px; font-weight: 760; }
.collections-recent-body { flex: 1; padding: 17px 16px 10px; }.collections-recent-body h3 { margin: 0 0 7px; color: #141a3c; font-size: 16px; font-weight: 820; letter-spacing: -.025em; line-height: 1.2; }.collections-recent-body h3 a:hover { color: #d82442; }.collections-recent-body p { display: -webkit-box; overflow: hidden; margin: 0; color: #606a87; font-size: 11px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.collections-recent-card footer { display: flex; min-height: 45px; align-items: center; padding: 0 16px 12px; color: #68718d; font-size: 10px; }.collections-recent-card footer > span:nth-child(2) { margin-left: 8px; }.collections-recent-card footer > a { display: grid; width: 31px; height: 31px; margin-left: auto; place-items: center; border-radius: 7px; color: #d82543; }.collections-recent-card footer > a:hover { background: #ffeff2; }.collections-recent-card footer > a svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.collections-maker-stack { display: flex; padding-left: 6px; }.collections-maker-stack i { display: grid; width: 23px; height: 23px; overflow: hidden; place-items: center; margin-left: -6px; border: 2px solid #fff; border-radius: 50%; background: linear-gradient(145deg, #252e59, #ff5d74); color: #fff; font-size: 7px; font-style: normal; font-weight: 800; }.collections-maker-stack img { width: 100%; height: 100%; object-fit: cover; }
.collections-empty { display: grid; min-height: 240px; place-items: center; border: 1px dashed #e6d5d8; border-radius: 16px; padding: 35px; background: #fff9fa; text-align: center; }.collections-empty > span { display: grid; width: 54px; height: 54px; place-items: center; border-radius: 14px; background: #ffe8ec; color: #e4405b; }.collections-empty svg { width: 30px; height: 30px; fill: currentColor; stroke: currentColor; }.collections-empty h2 { margin: 10px 0 3px; font-size: 20px; }.collections-empty p { margin: 0; color: #606986; font-size: 12px; }.collections-empty a { margin-top: 10px; color: #d82442; font-size: 12px; font-weight: 750; }

@media (max-width: 1240px) {
  .collections-page > .container { width: min(calc(100% - 40px), 1420px); }.collections-featured, .collections-recent-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }.collections-feature-card:nth-child(4), .collections-feature-card:nth-child(5) { display: none; }.collections-hero-grid { grid-template-columns: minmax(0, 1fr) 500px; }
}
@media (max-width: 840px) {
  .collections-hero-grid { grid-template-columns: 1fr 320px; }.collections-featured, .collections-recent-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.collections-feature-card:nth-child(4) { display: grid; }
}
@media (max-width: 900px) {
  .collections-layout { padding-left: 0; }
  .collections-layout > .home-sidebar > .catalog-sidebar__inner { padding: 20px 16px; }
}
@media (max-width: 620px) {
  .collections-layout .collections-page > .container { padding-right: 12px; padding-left: 12px; }
  .collections-page { padding-bottom: 38px; }.collections-page > .container { width: min(calc(100% - 24px), 1420px); }.collections-breadcrumb { min-height: 45px; }.collections-hero-grid { min-height: auto; grid-template-columns: 1fr; }.collections-hero-copy { padding: 22px 0 31px; }.collections-hero-copy h1 { font-size: 42px; }.collections-hero-copy p { font-size: 13px; }.collections-hero-art { display: none; }
  .collections-featured { display: flex; overflow-x: auto; margin-right: -12px; margin-left: -12px; padding: 0 12px 10px; scroll-snap-type: x mandatory; scrollbar-width: none; }.collections-featured::-webkit-scrollbar { display: none; }.collections-feature-card, .collections-feature-card:nth-child(4), .collections-feature-card:nth-child(5) { display: grid; min-width: 278px; scroll-snap-align: start; }
  .collections-recent { padding-top: 25px; }.collections-recent > header h2 { font-size: 19px; }.collections-recent > header > a { display: none; }.collections-recent-grid { grid-template-columns: 1fr; }.collections-recent-card { min-height: 250px; }.collections-recent-visual { min-height: 108px; }.collections-app-logo { width: 50px; height: 50px; flex-basis: 50px; }
}
@media (prefers-reduced-motion: reduce) { .collections-feature-card, .collections-recent-card { transition: none; } }
