/* PPM icons: rounded tile + stroke icon. Matches the existing .ico style on ppm-site.
   Markup:  <span class="ico"><svg class="i" aria-hidden="true"><use href="#i-camera"/></svg></span>
   Requires the sprite (ppm-icons.svg) inlined once per page, just after <body>. */
.ico{width:54px;height:54px;border-radius:14px;background:var(--cream-2,#EAE5DD);display:grid;place-items:center;flex:none}
.ico .i,.ico svg{width:28px;height:28px;fill:none;stroke:var(--red,#142C46);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ico.sm{width:44px;height:44px;border-radius:12px}.ico.sm svg{width:24px;height:24px}
/* on dark panels */
.on-dark .ico{background:rgba(255,255,255,.08)}.on-dark .ico svg{stroke:#EAE5DD}
/* "How it works" steps: icon + small step label instead of the numbered circle */
.steps.icon-steps .step::before{display:none}
.step .step-n{display:block;font-size:.74rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--red,#142C46);margin:14px 0 4px}
.step .ico{margin-bottom:0}
/* "Who it's for" cards: icon above the title */
.card .ico,.who-card .ico{margin-bottom:6px}