/* Placements */

/* ---------- Stats ---------- */
.pl-stats { padding-block: clamp(2rem, 1.5rem + 2vw, 3.5rem); border-bottom: 1px solid var(--line); }
.pl-stats__row { display: grid; grid-template-columns: repeat(2, minmax(0, max-content)); gap: clamp(2rem, 1rem + 6vw, 8rem); }
.pl-stats .stat:first-child .stat__value { color: var(--accent); }

/* ---------- Companies: editorial list, logos glow only on hover/focus ---------- */
.pl-companies__title {
  font-family: var(--font-mono); font-weight: 500; font-size: var(--step-1); letter-spacing: 0.04em;
  text-transform: uppercase; color: var(--text-2); max-width: 46ch; line-height: 1.5;
  margin-bottom: clamp(1.75rem, 1rem + 2vw, 3rem);
}
.pl-companies__list { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35em 0; font-family: var(--font-display); font-weight: 800; font-size: clamp(1.6rem, 0.9rem + 2.8vw, 3.6rem); line-height: 1.1; letter-spacing: -0.04em; }
.pl-co { display: inline-flex; align-items: center; gap: 0.32em; color: var(--text); outline: none; cursor: default; transition: color 0.3s; }
.pl-co:nth-child(3n + 2) { color: var(--text-2); }
.pl-co:not(:last-child)::after { content: "/"; margin-inline: 0.32em 0.36em; color: var(--text-3); font-weight: 500; }

.pl-co__logo {
  --glow: 0 0 0 1px rgb(245 197 24 / 0.9), 0 0 28px 4px rgb(245 197 24 / 0.45), 0 0 70px 10px rgb(245 197 24 / 0.18);
  display: inline-flex; align-items: center; justify-content: center; flex: none; overflow: hidden;
  height: 1.05em; width: 2.6em; padding: 0.08em 0.16em; border-radius: 10px;
  background: transparent;
  transition: background-color 0.35s, box-shadow 0.45s var(--ease-out), transform 0.45s var(--ease-out);
}
.pl-co__logo picture { display: contents; }
.pl-co__logo img { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; object-fit: contain; }
.pl-co__logo img {
  /* Resting state: monochrome, the white logo background blended into the page. */
  filter: grayscale(1) invert(1) contrast(1.1);
  mix-blend-mode: screen; opacity: 0.55;
  transition: filter 0.35s, opacity 0.35s;
}
.pl-co__logo--cover { width: 1.05em; padding: 0; overflow: hidden; }
.pl-co__logo--cover img { object-fit: cover; filter: grayscale(1); mix-blend-mode: normal; opacity: 0.45; }

.pl-co:hover, .pl-co:focus { color: var(--accent); }
.pl-co:hover .pl-co__logo, .pl-co:focus .pl-co__logo { background: var(--tile); box-shadow: var(--glow); transform: translateY(-2px) scale(1.06); }
.pl-co:hover .pl-co__logo img, .pl-co:focus-visible .pl-co__logo img { filter: none; mix-blend-mode: normal; opacity: 1; }
.pl-co:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; border-radius: 6px; }

/* Light theme: white logo backgrounds multiply away instead. */
:root[data-theme="light"] .pl-co__logo img:not(.pl-co__logo--cover img) { filter: grayscale(1) contrast(1.1); mix-blend-mode: multiply; opacity: 0.6; }
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) .pl-co__logo img:not(.pl-co__logo--cover img) { filter: grayscale(1) contrast(1.1); mix-blend-mode: multiply; opacity: 0.6; }
}
/* Hover/focus always wins over the resting state in every theme. */
.pl-co:is(:hover, :focus) .pl-co__logo img { filter: none !important; mix-blend-mode: normal !important; opacity: 1 !important; }

/* Touch screens have no hover: tapping a company focuses it and lights its logo. */

/* ---------- Alumni working abroad ---------- */
.pl-abroad h2 { margin-bottom: clamp(1.5rem, 1rem + 2vw, 2.5rem); }
.pl-abroad__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--line); }
.pl-abroad__item { display: grid; grid-template-columns: 112px 1fr; gap: 1.25rem; align-items: center; padding: 1.4rem 0; border-bottom: 1px solid var(--line); }
.pl-abroad__item:nth-child(odd) { padding-right: clamp(1rem, 2vw, 2.5rem); }
.pl-abroad__item:nth-child(even) { padding-left: clamp(1rem, 2vw, 2.5rem); border-left: 1px solid var(--line); }
.pl-abroad__photo { width: 112px; aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 2px solid var(--brand); }
.pl-abroad__photo picture, .pl-abroad__photo img { width: 100%; height: 100%; object-fit: cover; }
.pl-abroad__studio { font-family: var(--font-display); font-weight: 800; font-size: var(--step-3); line-height: 1; letter-spacing: -0.035em; }
.pl-abroad__meta { margin-top: 0.45rem; display: flex; flex-wrap: wrap; gap: 0.2rem 0.6rem; color: var(--text-2); }
.pl-abroad__meta strong { color: var(--text); }
.pl-abroad__place { margin-top: 0.3rem; display: inline-flex; align-items: center; gap: 0.4rem; font-family: var(--font-mono); font-size: 0.8rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--accent); }
.pl-abroad__place .icon { width: 1em; height: 1em; }
@media (max-width: 767px) {
  .pl-abroad__list { grid-template-columns: minmax(0, 1fr); }
  .pl-abroad__item:nth-child(n) { padding-inline: 0; border-left: 0; grid-template-columns: 84px 1fr; }
  .pl-abroad__photo { width: 84px; }
}

/* ---------- Alumni grid ---------- */
.pl-alumni h2 { margin-bottom: clamp(1.75rem, 1rem + 2vw, 3rem); }
.pl-alumni__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: clamp(1.25rem, 0.8rem + 1.4vw, 2rem) clamp(0.9rem, 0.6rem + 1vw, 1.5rem); }
.alum { display: grid; gap: 0.2rem; align-content: start; }
.alum__photo { aspect-ratio: 4 / 5; border-radius: var(--radius); overflow: hidden; background: var(--ink-3); margin-bottom: 0.65rem; }
.alum__photo picture, .alum__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; transition: transform 0.9s var(--ease-out); }
.alum:hover .alum__photo img { transform: scale(1.04); }
.alum__name { font-size: var(--step-1); letter-spacing: -0.02em; }
.alum__company { color: var(--accent); font-weight: 700; }
.alum__role { color: var(--text-2); font-size: 0.92rem; display: grid; }
.alum__role span { font-family: var(--font-mono); font-size: 0.74rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-3); margin-top: 0.2rem; }
@media (max-width: 640px) {
  .pl-companies__list { font-size: clamp(1.5rem, 1rem + 3vw, 2rem); }
  .pl-co__logo { height: 1.3em; width: 3em; }
  .pl-co__logo--cover { width: 1.3em; }
}
@media (max-width: 520px) { .pl-alumni__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }