/* Keyword solution pages (parts/solution-keyword.php), on top of product.css.
   Namespaced kw-. Light only, no dark sections. */

/* Keyword headlines run longer than product ones */
.kw .pp-hero h1{font-size:clamp(2.1rem,4vw,3.4rem);line-height:1.04;max-width:18ch}

/* Why: the page's own copy beside the fit points */
.kw-why{padding-top:clamp(40px,5vw,72px)}
.kw-why-in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,5vw,72px);align-items:start}
.kw-prose{max-width:62ch}
.kw-prose h2{font-size:clamp(1.7rem,3vw,2.4rem);letter-spacing:-.035em;line-height:1.1;margin:0 0 16px}
.kw-prose h2:not(:first-child){margin-top:36px}
.kw-prose h3{font-size:1.2rem;margin:26px 0 8px}
.kw-prose p{color:var(--ink-2);font-size:1.08rem;line-height:1.7;margin:0 0 14px}
.kw-prose ul,.kw-prose ol{margin:0 0 16px;padding-left:1.2em;color:var(--ink-2);line-height:1.7}
.kw-prose li{margin:4px 0}
.kw-prose a{color:var(--royal);text-decoration:underline;text-underline-offset:3px}
.kw-prose strong{color:var(--ink)}
.kw-points{list-style:none;margin:0;padding:clamp(20px,3vw,28px);display:grid;gap:18px;border-radius:24px;background:var(--bg-alt);border:1px solid var(--line)}
.kw-points li{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}
.kw-points .pp-tile{width:32px;height:32px;border-radius:50%;background:color-mix(in srgb,var(--c) 14%,#fff);color:var(--c)}
.kw-points b{display:block;font-size:1.02rem;line-height:1.35}
.kw-points span:not(.pp-tile){display:block;color:var(--ink-2);font-size:.95rem;line-height:1.55;margin-top:3px}

/* "More about …" under each feature */
.kw-more{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px;font-weight:600;color:var(--ink);text-decoration:none;border-bottom:1.5px solid color-mix(in srgb,var(--c) 45%,transparent);padding-bottom:2px;justify-self:start;min-width:0;max-width:100%}
.kw-more:hover{border-color:var(--c)}

/* Plans with the price book's amounts */
.kw-plan-list li{grid-template-columns:auto 1fr auto}
.kw-plan-list .pp-plan-i{grid-row:span 2}
.kw-price{grid-column:3;grid-row:1 / span 2;text-align:right;font-family:var(--fd);font-weight:700;font-size:1.05rem;color:var(--ink);line-height:1.2}
.kw-price em{font-style:normal;font-weight:500;font-size:.8rem;color:var(--muted)}
.kw-price i{display:block;font-style:normal;font-family:var(--fb, inherit);font-weight:500;font-size:.78rem;color:var(--muted);margin-top:2px}

/* Keep reading */
.kw-links{padding-top:0}
.kw-link-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.kw-link-grid a{position:relative;display:grid;gap:4px;padding:16px 44px 16px 18px;border-radius:18px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);text-decoration:none;transition:border-color .25s,transform .25s}
.kw-link-grid a:hover{border-color:var(--c);transform:translateY(-2px)}
.kw-link-grid small{color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em}
.kw-link-grid b{font-size:15.5px;line-height:1.35}
.kw-link-grid svg{position:absolute;top:18px;right:16px;color:var(--muted)}

.kw-final{padding-bottom:clamp(40px,5vw,72px)}

@media (prefers-reduced-motion:reduce){.kw-link-grid a{transition:none}.kw-link-grid a:hover{transform:none}}
@media (max-width:1000px){.kw-why-in{grid-template-columns:minmax(0,1fr)}.kw-link-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.kw-link-grid{grid-template-columns:minmax(0,1fr)}.kw-plan-list li{grid-template-columns:auto 1fr}.kw-price{grid-column:2;grid-row:auto;text-align:left}.kw-plan-list .pp-plan-i{grid-row:span 3}}