/*
 * Pricing page layout.
 *
 * This lived in an inline <style> block until the hosting Content-Security-Policy
 * arrived with `style-src 'self'` and no 'unsafe-inline'. The browser then dropped
 * the whole block, so the plan cards and the feature panel rendered as unstyled
 * text with default bullets. A same-origin stylesheet satisfies the policy without
 * weakening it.
 */

.planGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:26px 0 8px}
.plan{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:24px;display:flex;flex-direction:column}
.plan.featured{border-color:var(--brand);box-shadow:0 14px 34px rgba(8,126,120,.13)}
.plan .tag{display:inline-block;align-self:flex-start;font-size:10px;font-weight:900;letter-spacing:1.3px;text-transform:uppercase;color:var(--brand2);background:var(--soft);border-radius:20px;padding:5px 11px;margin-bottom:13px}
.plan h2{margin:0;font-size:20px;color:var(--navy)}
.plan .price{font-size:36px;font-weight:950;letter-spacing:-1.6px;color:var(--navy);margin:9px 0 2px}
.plan .price small{font-size:14px;font-weight:800;letter-spacing:0;color:var(--muted)}
.plan .who{color:var(--muted);font-size:13px;line-height:1.6;margin:6px 0 16px;min-height:44px}
.plan ul{list-style:none;margin:0;padding:0}
.plan li{position:relative;padding:7px 0 7px 25px;font-size:14px;line-height:1.55;border-top:1px solid var(--line)}
.plan li:first-child{border-top:0}
.plan li:before{content:"";position:absolute;left:2px;top:14px;width:12px;height:7px;border-left:2.2px solid var(--brand);border-bottom:2.2px solid var(--brand);transform:rotate(-45deg)}
.plan li b{color:var(--navy)}
.everything{background:var(--navy);color:#fff;border-radius:22px;padding:30px 32px;margin:30px 0}
.everything h2{color:#fff;margin:0 0 8px;font-size:22px}
.everything p{color:#c9d4df;font-size:15px;line-height:1.7;margin:0 0 18px;max-width:70ch}
.featureCols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.featureCols h3{color:var(--soft);font-size:12px;letter-spacing:1.2px;text-transform:uppercase;margin:0 0 9px}
.featureCols ul{list-style:none;margin:0;padding:0}
.featureCols li{color:#dbe4ec;font-size:13.5px;line-height:1.62;padding:2px 0}
.cmp{width:100%;border-collapse:collapse;margin-top:14px;font-size:14px}
.cmp th,.cmp td{border-bottom:1px solid var(--line);padding:11px 10px;text-align:left}
.cmp th{font-size:11px;letter-spacing:1.1px;text-transform:uppercase;color:var(--muted)}
.cmp td:not(:first-child),.cmp th:not(:first-child){text-align:center;width:19%}
.cmp tbody td:first-child{font-weight:700;color:var(--navy)}
.cmp .num{font-weight:900;color:var(--navy)}
.steps{counter-reset:step;list-style:none;margin:14px 0 0;padding:0}
.steps li{position:relative;padding:0 0 20px 46px;border-left:2px solid var(--line);margin-left:14px}
.steps li:last-child{border-left-color:transparent;padding-bottom:0}
.steps li:before{counter-increment:step;content:counter(step);position:absolute;left:-16px;top:-2px;width:30px;height:30px;border-radius:50%;background:var(--brand);color:#fff;font-weight:900;font-size:13px;display:grid;place-items:center}
.steps h3{margin:2px 0 5px;font-size:15.5px;color:var(--navy)}
.steps p{margin:0;color:var(--muted);font-size:14px;line-height:1.68}
@media(max-width:900px){.planGrid,.featureCols{grid-template-columns:1fr}.cmp{font-size:13px}.cmp th,.cmp td{padding:9px 6px}}