.phub-cat-stack {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-8) var(--space-7);
  align-items: start;
}

@media (max-width: 1024px) {
  .phub-cat-stack { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); }
}

.phub-cat {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-4);
  align-items: start;
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-ink);
}

.phub-cat__title {
  position: relative;
  padding-bottom: var(--space-3);
  font-family: var(--font-en);
  font-size: var(--fs-h2);
  font-weight: 700;
  letter-spacing: 0.01em;
}

.phub-cat__title::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: var(--grad-keyline);
}

.phub-cat__title a { color: var(--color-ink); transition: color var(--dur) var(--ease); }

.phub-cat__title a:hover { color: var(--color-orange-dark); }

.phub-cat__lead {
  margin-top: var(--space-2);
  color: var(--color-muted);
  font-size: var(--fs-small);
}

.phub-cat__more { margin-top: var(--space-4); }

.phub-cat__list { display: grid; }

.phub-cat__list li { border-bottom: 1px solid var(--color-line); }

.phub-item {
  display: grid;
  grid-template-columns: 168px minmax(0, 1fr) auto;
  grid-template-areas:
    "logo badge badge"
    "logo catch arrow";
  gap: var(--space-2) var(--space-4);
  align-items: center;
  padding: var(--space-4) var(--space-2);
  transition: background-color var(--dur) var(--ease);
}

@media (max-width: 768px) {
  .phub-item {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "logo" "badge" "catch" "arrow";
    gap: var(--space-2);
    padding: var(--space-4) 0;
  }
}

.phub-item:hover { background: var(--color-white); }

.phub-item__catch {
  grid-area: catch;
  color: var(--color-muted);
  font-size: var(--fs-small);
}

.phub-item .plogo { grid-area: logo; justify-self: start; --logo-w: 168px; --logo-h: 84px; }

.phub-item .plogo--word { flex-wrap: wrap; }

.phub-item .plogo__word { font-size: var(--fs-body); }

.phub-item__arrow {
  grid-area: arrow;
  color: var(--color-orange-text);
  transition: transform var(--dur-hover) var(--ease);
}

.phub-item:hover .phub-item__arrow { transform: translateX(5px); }

.phub-brands__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-5);
  align-items: stretch;
}

@media (max-width: 1024px) {
  .phub-brands__list { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .phub-brands__list { grid-template-columns: 1fr; }
}

.phub-brands__item {
  display: flex;
  flex-direction: column;
  padding: var(--space-5);
  background: var(--color-white);
  border-top: 1px solid var(--color-line-card);
}

.phub-brands__item:hover { box-shadow: var(--shadow-card); }

.phub-brands__link {
  position: relative;
  display: grid;
  justify-items: center;
  align-content: start;
  gap: var(--space-2);
  flex: 1 1 auto;
  text-align: center;
}

.plogo-lg__img { margin-left: var(--space-3); }

.plogo-lg {
  --logo-w: 208px;
  --logo-h: 104px;
  display: flex;
  align-items: center;
  gap: var(--space-3);
  min-height: var(--logo-h);
  margin-bottom: var(--space-2);
}

.phub-brands__catch {
  color: var(--color-muted);
  font-size: var(--fs-small);
  line-height: 1.7;
}

.phub-brands__more { margin-top: var(--space-2); font-size: var(--fs-small); }

.phub-brands__link:hover .text-link { color: var(--color-orange-dark); }

.plogo-lg__sub,
.plogo-lg__word {
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: var(--fs-h3);
  letter-spacing: 0.02em;
  color: var(--color-ink-strong);
}

.plogo-lg--todo { flex-wrap: wrap; gap: var(--space-2); }

.phub-brands__link .plogo-lg { justify-content: center; }
.phub-item__badge { grid-area: badge; min-width: 1px; }

.shub-list__items {
  display: grid;
  gap: 1px;
  list-style: none;
  margin: 0;
  padding: 0;
  background: var(--color-line-card);
  border-top: 1px solid var(--color-line-card);
  border-bottom: 1px solid var(--color-line-card);
}

.shub-item {
  position: relative;
  overflow: hidden;
  background: var(--color-white);
}

.shub-item:hover { box-shadow: var(--shadow-card); }

.shub-item__link {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 22rem) minmax(0, 1fr);
  align-items: start;
  gap: var(--space-3) var(--space-7);
  padding: var(--space-6) var(--space-6) var(--space-6) var(--space-7);
}

@media (max-width: 768px) {
  .shub-item__link {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-2);
    padding: var(--space-8) var(--space-5) var(--space-6);
  }
}

.shub-item__head {
  grid-column: 1;
  grid-row: 1 / span 2;
  display: block;
}

@media (max-width: 768px) {
  .shub-item__head { grid-row: auto; }
}

.shub-item__name {
  display: block;
  font-family: var(--font-sans);
  font-size: var(--fs-h3);
  font-weight: var(--fw-heading);
  letter-spacing: var(--ls-heading);
  color: var(--color-heading);
}

.shub-item__pair {
  display: block;
  margin-top: var(--space-2);
  color: var(--color-muted);
  font-size: var(--fs-small);
}

.shub-item__catch {
  grid-column: 2;
  display: block;
  font-family: var(--font-sans);
  font-size: var(--fs-h4);
  font-weight: var(--fw-heading-s);
  line-height: 1.6;
}

.shub-item__text {
  grid-column: 2;
  display: block;
  color: var(--color-muted);
  font-size: var(--fs-small);
  line-height: 1.9;
}

.shub-item__more {
  grid-column: 2;
  display: block;
  margin-top: var(--space-2);
}

@media (max-width: 768px) {
  .shub-item__catch,
  .shub-item__text,
  .shub-item__more { grid-column: 1; }
}

.shub-feature .section-head {
  min-height: 218px;
}

.shub-feature .card__text {
  min-height: calc(var(--fs-small) * 1.9 * 4);
}

.phub-find-sec { padding-bottom: var(--space-9); }

.phub-find {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-5) var(--space-6);
  border: 1px solid var(--color-line-card);
  border-radius: var(--radius-m);
  background: var(--color-white);
}

.phub-find__text {
  margin: 0;
  color: var(--color-muted);
  font-size: var(--fs-lead);
}

@media (max-width: 768px) {
  .phub-find { padding: var(--space-5) var(--space-4); }
}