/* The policy ladder (_ladder.html), on the home page and the policy guide (stage 3 spec 5, 8). */
.ladder { display: grid; gap: var(--space-4); }
@media (min-width: 560px) { .ladder { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .ladder { grid-template-columns: repeat(4, 1fr); } }
.ladder .when { font-size: var(--text-sm); padding-block-start: var(--space-2); border-block-start: 1px solid var(--line); }
/* The rings: the share of failing mail each policy acts on (phase E spec 12.2). */
.ring { inline-size: 4.5rem; block-size: 4.5rem; fill: none; stroke: var(--line); stroke-width: 6; }
.ring__fill { stroke: var(--blue); }
.ring text { fill: var(--blue); stroke: none; font-size: 1.1rem; font-weight: 700; }