/* REFRM v166 — layout for the generated SEO landing pages (/features/*, /use-cases/*). Builds on tokens.css + landing.css. */
.page-hero{position:relative;padding:clamp(36px,7vw,84px) 0 clamp(28px,5vw,60px);overflow:hidden}
.page-hero .hero-in{align-items:flex-start;text-align:left}
.page-hero .hero-in>*:not(nav){max-width:860px}
.page-hero h1{max-width:18ch;margin:18px 0 0;font-size:clamp(36px,5.6vw,64px);line-height:1.05;letter-spacing:-.03em;font-weight:700}
.page-hero .lede{margin:22px 0 0;max-width:62ch;font-size:clamp(16px,1.6vw,19px);color:var(--rf-muted);line-height:1.6}
.page-hero .hero-actions{justify-content:flex-start;margin-top:30px}
.page-hero .fineprint{margin:14px 0 0;color:var(--rf-faint);font-size:13px}
.crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 6px;padding:0;list-style:none;font-size:13px;color:var(--rf-faint)}
.crumbs li+li::before{content:"/";margin-right:8px;opacity:.5}
.crumbs a{color:var(--rf-muted)}
.crumbs [aria-current]{color:var(--rf-text)}
.three.hl{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.hl .rf-card{padding:26px}
.hl .rf-card h3{margin:0 0 8px;font-size:18px;letter-spacing:-.015em}
.hl .rf-card p{margin:0;color:var(--rf-muted);font-size:15px;line-height:1.6}
.hl .num{display:inline-grid;place-items:center;width:34px;height:34px;margin-bottom:14px;border-radius:11px;border:1px solid var(--rf-line-strong);background:var(--rf-surface-2);font-size:13px;font-weight:700;color:var(--rf-text)}
.prose{max-width:760px;margin:0 auto}
.prose h2{margin:0 0 16px;font-size:clamp(26px,3.4vw,38px);line-height:1.12;letter-spacing:-.025em;font-weight:700}
.prose p{margin:0 0 16px;color:var(--rf-muted);font-size:17px;line-height:1.7}
.prose a:not(.rf-btn){color:var(--rf-text)}
.checks{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:12px}
.checks li{position:relative;padding:14px 16px 14px 48px;border:1px solid var(--rf-line);border-radius:16px;background:var(--rf-surface);color:var(--rf-text);font-size:15.5px;line-height:1.55;transition:border-color .25s ease,translate .35s var(--rf-spring,ease)}
.checks li::before{content:"";position:absolute;left:16px;top:17px;width:18px;height:18px;border-radius:50%;background:var(--rf-text) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230a0a0b' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat}
@media (hover:hover){.checks li:hover{border-color:var(--rf-line-strong);translate:4px 0}}
.steps-list{list-style:none;counter-reset:s;margin:0 auto;padding:0;max-width:760px;display:grid;gap:14px;position:relative}
.steps-list li{counter-increment:s;position:relative;display:grid;grid-template-columns:48px 1fr;gap:16px;align-items:start;padding:20px 22px;border:1px solid var(--rf-line);border-radius:20px;background:var(--rf-surface)}
.steps-list li::before{content:counter(s);display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:linear-gradient(145deg,#f6f6f6,#8d8d8d);color:#111;font-weight:800;font-size:18px}
.steps-list h3{margin:2px 0 4px;font-size:18px;letter-spacing:-.015em}
.steps-list p{margin:0;color:var(--rf-muted);font-size:15px;line-height:1.6}
.sec.tight{padding-top:clamp(36px,5vw,72px)}
.cta-panel{text-align:center;padding:clamp(32px,6vw,64px) clamp(20px,4vw,48px)}
.cta-panel h2{margin:0;font-size:var(--rf-fs-h2);letter-spacing:-.025em;line-height:1.1}
.cta-panel p{margin:14px auto 26px;max-width:46ch;color:var(--rf-muted);font-size:17px}
.cta-panel .rf-pill-input{margin:0 auto}
.seo-nav .dd-menu{min-width:300px}
@media (max-width:860px){.three.hl{grid-template-columns:1fr}.page-hero h1{max-width:none}}
@media (max-width:560px){.steps-list li{grid-template-columns:40px 1fr;padding:16px}.steps-list li::before{width:40px;height:40px;border-radius:12px;font-size:16px}}