/* how-we-pick.html only. Shared tokens and components come from site.css, article.css and listing.css. */
.hwp-meta{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.1rem}
.hwp-jump{position:relative;z-index:1;display:grid;gap:.5rem;margin-top:1.75rem;padding:.9rem 1rem;border-radius:var(--r-l);background:rgb(255 255 255/.7);border:1px solid var(--line)}
.hwp-jump__title{display:flex;align-items:center;gap:.4rem;font:700 .95rem var(--display);color:var(--ink)}
.hwp-jump__title .rp-ic{color:var(--moon-text)}
.hwp-jump .rp-subtopics{margin-top:0}

/* six steps as numbered tiles, one line each */
.hwp-tiles{display:grid;gap:.85rem;counter-reset:hwp}
@media (min-width:640px){.hwp-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}}
@media (min-width:1024px){.hwp-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
.hwp-tiles li{position:relative;display:grid;grid-template-columns:2.75rem minmax(0,1fr);column-gap:.85rem;row-gap:.2rem;align-content:start;padding:1rem 1.05rem;border-radius:var(--r-l);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1);scroll-margin-top:6rem}
.hwp-tiles li::before{counter-increment:hwp;content:counter(hwp);position:absolute;top:-.5rem;left:-.35rem;display:grid;place-items:center;width:1.65rem;height:1.65rem;border-radius:999px;background:var(--night);color:var(--moon);font:800 .85rem/1 var(--display);box-shadow:0 0 0 3px var(--ground)}
.hwp-tiles__ico{grid-row:span 2;display:grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:14px;background:var(--lav);color:var(--act)}
.hwp-tiles h3{font-size:1.06rem;line-height:1.3;align-self:center}
.hwp-tiles p{font-size:.94rem;color:var(--muted)}
.hwp-tiles li:target{border-color:var(--lilac)}
.hwp-full__body{display:grid;gap:.85rem}
@media (min-width:900px){.hwp-full__body{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}}
.hwp-full__body>div{display:grid;gap:.35rem;align-content:start;padding:1rem 1.1rem;border-radius:var(--r-m);background:#fff;border:1px solid var(--line)}
.hwp-full__body h3{font-size:1.02rem}
.hwp-full__body p{font-size:.95rem}
.hwp-full__body small{font-size:.85rem;color:var(--muted)}

.hwp-two{display:grid;gap:1rem}
@media (min-width:768px){.hwp-two{grid-template-columns:1fr 1fr;gap:1.5rem}}
.hwp-col{padding:clamp(1.1rem,.9rem + 1vw,1.6rem);border-radius:var(--r-xl);border:1px solid var(--line)}
.hwp-col h3{display:flex;align-items:center;gap:.55rem;margin-bottom:.9rem;font-size:1.2rem}
.hwp-col h3 .rp-ic{width:2.2rem;height:2.2rem;padding:.45rem;border-radius:999px}
.hwp-col--yes{background:var(--ok-tint);border-color:#c7e8d3}
.hwp-col--yes h3 .rp-ic{background:#fff;color:var(--ok)}
.hwp-col--no{background:var(--bad-tint);border-color:#f6c9d1}
.hwp-col--no h3 .rp-ic{background:#fff;color:var(--bad)}
.hwp-tablehead{font-size:clamp(1.15rem,1.05rem + .4vw,1.35rem)}
.hwp-callouts{display:grid;gap:1rem;margin-top:1.25rem}
@media (min-width:900px){.hwp-callouts{grid-template-columns:1fr 1fr}}
.hwp-verdicts{display:flex;flex-wrap:wrap;gap:.45rem;padding-top:.1rem}
.hwp-h2{font-size:clamp(1.65rem,1.2rem + 1.6vw,2.45rem)}
.hwp-recheck{display:grid;gap:1.75rem;align-items:start}
@media (min-width:1024px){.hwp-recheck{grid-template-columns:1.15fr .85fr;gap:3rem}}
.hwp-list{margin-top:1.25rem}

/* one closed row for secondary detail */
.hwp-more{margin-top:1.1rem;border-radius:var(--r-m);background:#fff;border:1px solid var(--line)}
.hwp-more>summary{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:2.9rem;padding:.6rem 1rem;cursor:pointer;list-style:none;font:700 1rem/1.3 var(--display);color:var(--ink)}
.hwp-more>summary::-webkit-details-marker{display:none}
.hwp-more>summary .rp-ic{flex:none;color:var(--act);transition:transform .2s}
.hwp-more[open]>summary .rp-ic{transform:rotate(180deg)}
.hwp-more[open]{border-color:var(--lilac)}
.hwp-more__body{display:grid;gap:.6rem;padding:0 1rem 1rem;font-size:.95rem}

.hwp-badge{display:grid;gap:1rem;padding:clamp(1.1rem,.9rem + 1vw,1.6rem);border-radius:var(--r-xl);background:#fff;border:1px solid var(--line);box-shadow:var(--sh-1)}
.hwp-badge__title{font:700 1.15rem var(--display);color:var(--ink)}
.hwp-badge__chip{justify-self:start}
.hwp-badge__steps{display:grid;gap:.6rem;counter-reset:bd}
.hwp-badge__steps li{position:relative;display:grid;gap:.1rem;padding:.7rem .85rem .7rem 3rem;border-radius:var(--r-m);background:var(--ground)}
.hwp-badge__steps li::before{counter-increment:bd;content:counter(bd);position:absolute;left:.75rem;top:.75rem;display:grid;place-items:center;width:1.6rem;height:1.6rem;border-radius:999px;background:var(--night);color:var(--moon);font:800 .85rem/1 var(--display)}
.hwp-badge__steps b{color:var(--ink)}
.hwp-badge__steps span{font-size:.92rem;color:var(--muted)}
.hwp-never{display:grid;gap:.85rem}
@media (min-width:768px){.hwp-never{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.hwp-never{grid-template-columns:repeat(3,minmax(0,1fr))}}
.hwp-never li{display:grid;grid-template-columns:2.6rem minmax(0,1fr);gap:.85rem;align-items:start;padding:1.05rem 1.1rem;border-radius:var(--r-m);background:var(--night-2);border:1px solid rgb(205 200 244/.18)}
.hwp-never__ico{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:12px;background:rgb(255 255 255/.1);color:var(--moon)}
.hwp-never h3{color:#fff;font-size:1.06rem}
.hwp-never p{margin-top:.25rem;font-size:.93rem;color:var(--night-muted)}
@media (min-width:1024px){.rp-faqside{position:sticky;top:6rem;align-self:start}}
@media (max-width:899px){.rp-split__media img{aspect-ratio:16/9}}
/* phones: no hero photo (the steps start sooner); icon cards as rows */
@media (max-width:639px){
  .rp-phero__art{display:none}
  #ranking .rp-icard{display:grid;grid-template-columns:2.75rem minmax(0,1fr);column-gap:.85rem;row-gap:.25rem;padding:1rem 1.05rem}
  #ranking .rp-icard__ico{grid-row:span 2;width:2.75rem;height:2.75rem;border-radius:14px}
  #ranking .rp-icard h3{font-size:1.04rem;line-height:1.3}
  .hwp-tiles li{padding:.85rem .95rem}
}
.rp-split__text .rp-how3 h3{font-size:1.06rem}
.rp-split__text .rp-how3{margin-top:1.25rem}