.premium-site .web-references {
  padding-block: clamp(44px, 5vw, 76px);
  scroll-margin-top: 150px;
  background: #f5f6f7;
  color: #181c22;
  border-top: 1px solid #e3e6e9;
}
.premium-site .wr-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 30px; }
.premium-site .wr-kicker { margin: 0 0 12px; color: #0755ff; font-size: 13px; font-weight: 600; letter-spacing: .12em; }
.premium-site .wr-heading h2 { max-width: 800px; margin: 0; }
.premium-site .wr-project-link { display: inline-flex; flex-shrink: 0; gap: 14px; align-items: center; padding-bottom: 6px; border-bottom: 1px solid #afb7bf; color: #181c22; font-size: 14px; font-weight: 600; text-decoration: none; }
.premium-site .wr-project-link:hover { color: #0755ff; border-color: #0755ff; }
.premium-site .wr-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.premium-site .wr-count { margin: 0; padding-block: 12px; color: #545d66; font-size: 14px; }
.premium-site .wr-search { display: grid; gap: 7px; width: 310px; max-width: 100%; }
.premium-site .wr-search label { color: #343b43; font-size: 13px; font-weight: 600; }
.premium-site .wr-search__field { display: flex; align-items: center; gap: 10px; min-width: 0; padding-inline: 12px; border: 1px solid #cbd1d7; background: #fff; border-radius: 2px; }
.premium-site .wr-search__field:focus-within { outline: 2px solid #0755ff; outline-offset: 2px; }
.premium-site .wr-search__field svg { flex-shrink: 0; width: 19px; height: 19px; color: #59636e; }
.premium-site .wr-search input { width: 100%; min-width: 0; height: 44px; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; color: #181c22; font-size: 16px; line-height: 1.4; outline: none; }
.premium-site .wr-search input::placeholder { color: #737d87; opacity: 1; }
.premium-site .wr-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.premium-site .wr-card { display: flex; flex-direction: column; min-width: 0; border: 1px solid #e0e4e8; border-radius: 2px; background: #fff; transition: border-color .18s, box-shadow .18s; }
.premium-site .wr-card:hover, .premium-site .wr-card:focus-within { border-color: #0755ff; box-shadow: 0 3px 14px #0b0f1408; }
.premium-site .wr-brand { display: grid; flex: 1; grid-template-columns: minmax(0, 1fr) 18px; align-content: center; gap: 7px 9px; min-height: 100px; padding: 19px 17px; color: #181c22; text-decoration: none; }
.premium-site .wr-brand__name { align-self: center; font-size: 17px; font-weight: 600; line-height: 1.35; letter-spacing: -.025em; overflow-wrap: anywhere; }
.premium-site .wr-brand > svg { align-self: center; width: 18px; height: 18px; color: #88929c; transition: color .18s; }
.premium-site .wr-brand__domain { grid-column: 1 / -1; color: #66717c; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }
.premium-site .wr-brand:hover { color: #0755ff; }
.premium-site .wr-brand:hover > svg { color: #0755ff; }
.premium-site .wr-alias { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 17px; border-top: 1px solid #edf0f2; color: #596570; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; text-decoration: none; }
.premium-site .wr-alias:hover { color: #0755ff; background: #f4f7ff; }
.premium-site .wr-note { margin: 22px 0 0; color: #626c76; font-size: 13px; line-height: 1.5; }
.premium-site .wr-empty { margin: 0; padding: 36px 20px; border: 1px solid #e0e4e8; background: #fff; color: #545d66; font-size: 16px; text-align: center; }
.premium-site .web-references [hidden] { display: none !important; }
@media (max-width: 1180px) { .premium-site .wr-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .premium-site .wr-heading { align-items: flex-start; flex-direction: column; } }
@media (max-width: 900px) { .premium-site .wr-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 620px) {
  .premium-site .web-references { scroll-margin-top: 90px; }
  .premium-site .wr-heading { gap: 18px; margin-bottom: 24px; }
  .premium-site .wr-heading h2 { font-size: 32px; }
  .premium-site .wr-toolbar { align-items: stretch; flex-direction: column-reverse; gap: 10px; margin-bottom: 14px; }
  .premium-site .wr-search { width: 100%; }
  .premium-site .wr-count { padding-block: 0; }
  .premium-site .wr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .premium-site .wr-brand { min-height: 100px; padding: 15px 12px; gap: 8px 5px; }
  .premium-site .wr-brand__name { font-size: 16px; }
  .premium-site .wr-alias { padding: 9px 12px; }
}
@media (max-width: 380px) { .premium-site .wr-grid { grid-template-columns: minmax(0, 1fr); } .premium-site .wr-brand { min-height: 84px; } }
@media (prefers-reduced-motion: reduce) { .premium-site .web-references * { transition: none; } }
