/* u4 HIGH PERFORMANCE CENTER: the extras for /highperformance and its guides. Load after u4-podcast.css. */
.hp-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:34px}
.hp-chips a{padding:10px 20px;border:1px solid var(--line-2);border-radius:999px;font-family:var(--display);font-weight:700;text-decoration:none;transition:border-color .2s}
.hp-chips a:hover{border-color:rgba(255,220,19,.55)}
.hp-chips i{margin-left:6px;font-family:var(--body);font-style:normal;font-weight:500;font-size:.8125rem;color:rgba(255,255,255,.6)}
.hp-sec{padding-block:clamp(40px,5vw,64px)}
.hp-shelf{border-top:1px solid var(--line)}
.hp-k{margin:0 0 16px;font-size:.8125rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.hp-shelf-head{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:20px;align-items:end}
.hp-shelf-head b{grid-row:span 2;align-self:start;margin-top:14px;padding:6px 10px;border-radius:10px;background:var(--grad);color:var(--ink);font-family:var(--display);font-weight:800;font-size:.9375rem}
.hp-shelf-head p{margin:10px 0 0;max-width:60ch;color:rgba(255,255,255,.72)}
.hp-row{margin:36px 0 14px;font-size:.8125rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.hp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.hp-card{display:flex;flex-direction:column;gap:8px;min-height:168px;padding:22px 22px 20px;text-decoration:none;background:radial-gradient(120% 90% at 0% 0%,rgba(255,176,32,.07),rgba(17,17,19,0) 55%),var(--card);transition:transform .3s var(--ease),border-color .2s}
.hp-card:hover{transform:translateY(-3px);border-color:rgba(255,220,19,.45)}
.hp-card-k{display:flex;justify-content:space-between;align-items:center;font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.hp-card-k i{padding:3px 9px;border:1px solid var(--line-2);border-radius:999px;font-style:normal;font-size:.6875rem;letter-spacing:.06em;color:rgba(255,255,255,.7)}
.hp-card h3{margin:0;font-weight:800;font-size:1.3125rem;line-height:1.15;letter-spacing:-.02em}
.hp-card p{margin:0;padding-right:28px;font-size:.9688rem;line-height:1.45;color:rgba(255,255,255,.72)}
.hp-card span.hp-arr{position:absolute;right:20px;bottom:16px;color:var(--gold);font-weight:700}
.hp-card--big{min-height:210px;border:1.5px solid transparent;background:radial-gradient(90% 70% at 100% 0%,rgba(255,176,32,.16),rgba(12,12,14,0) 60%) padding-box,linear-gradient(180deg,#141416,#0C0C0E) padding-box,var(--grad) border-box}
.hp-card--big h3{font-size:1.625rem}
.hp-deeper{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:center;padding:clamp(24px,3vw,34px)}
.hp-deeper h3{margin:0;font-weight:800;font-size:1.75rem;letter-spacing:-.02em}
.hp-deeper p{margin:6px 0 0;color:rgba(255,255,255,.72)}
.hp-deeper ul{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.hp-deeper a{color:var(--gold);font-weight:600;text-decoration:none}
.u4-post-body .hp-follow{font-size:.9375rem;color:rgba(255,255,255,.7)}
@media (max-width:860px){.hp-grid,.hp-deeper{grid-template-columns:minmax(0,1fr)}}
