.cwv-problem{background:var(--color-white);padding:80px 24px}.cwv-problem-inner{text-align:center;max-width:900px;margin:0 auto}.cwv-problem h2,.cwv-metric-header h2,.cwv-how h2{color:var(--text-primary);letter-spacing:-.01em;font-size:clamp(1.5rem,3vw,2rem);font-weight:700}.cwv-problem h2{margin-bottom:40px}.cwv-problem-grid{text-align:left;grid-template-columns:1fr 1fr;gap:40px;margin-bottom:40px;display:grid}.cwv-problem-col p{color:var(--text-secondary);font-size:.95rem;line-height:1.7}.cwv-problem-callout{background:var(--color-stone-50);border:1px solid var(--color-stone-150);border-radius:12px;max-width:680px;margin:0 auto;padding:28px 36px}.cwv-problem-callout p{color:var(--text-secondary);text-align:center;font-size:.95rem;font-style:italic;line-height:1.65}@media (width<=680px){.cwv-problem-grid{grid-template-columns:1fr;gap:24px}}.cwv-metric{background:var(--color-stone-100);padding:80px 24px}.cwv-metric--alt{background:var(--color-white)}.cwv-metric-inner{max-width:900px;margin:0 auto}.cwv-metric-header{text-align:center;margin-bottom:48px}.cwv-metric-badge{letter-spacing:.08em;border-radius:6px;margin-bottom:16px;padding:6px 16px;font-family:DM Mono,monospace;font-size:.82rem;font-weight:600;display:inline-block}.cwv-metric-badge--lcp{color:#147739;background:#22c55e1a;border:1px solid #22c55e40}.cwv-metric-badge--inp{color:#2563eb;background:#3b82f61a;border:1px solid #3b82f640}.cwv-metric-badge--cls{color:#7a39e9;background:#a855f71a;border:1px solid #a855f740}.cwv-metric-header h2{margin-bottom:8px}.cwv-metric-target{color:var(--text-muted);font-size:.88rem;font-style:italic}.cwv-metric-grid{grid-template-columns:1fr 1fr;gap:32px;display:grid}.cwv-metric-problem,.cwv-metric-solution{background:var(--color-white);border:1px solid var(--color-stone-150);border-radius:14px;padding:28px}.cwv-metric .cwv-metric-problem{border-color:var(--color-error-pale)}.cwv-metric .cwv-metric-solution{border-color:var(--color-gold-muted)}.cwv-metric-problem h3,.cwv-metric-solution h3{color:var(--text-primary);text-transform:uppercase;letter-spacing:.04em;margin-bottom:12px;font-size:.92rem;font-weight:700}.cwv-metric-problem p{color:var(--text-secondary);font-size:.88rem;line-height:1.7}.cwv-metric-solution ul{flex-direction:column;gap:10px;list-style:none;display:flex}.cwv-metric-solution li{color:var(--text-secondary);padding-left:22px;font-size:.88rem;line-height:1.6;position:relative}.cwv-metric-solution li:before{content:"✓";color:var(--color-gold-text);font-weight:700;position:absolute;left:0}.cwv-metric-solution code,.cwv-how-card code{background:var(--color-stone-100);border-radius:4px;padding:2px 6px;font-family:DM Mono,monospace;font-size:.82rem}@media (width<=680px){.cwv-metric-grid{grid-template-columns:1fr;gap:20px}}.cwv-how{background:var(--color-white);padding:80px 24px}.cwv-how-inner{max-width:900px;margin:0 auto}.cwv-how h2{text-align:center;margin-bottom:48px}.cwv-how-grid{grid-template-columns:repeat(2,1fr);gap:24px;margin-bottom:36px;display:grid}.cwv-how-card{background:var(--color-stone-25);border:1px solid var(--color-stone-150);border-radius:14px;padding:28px 24px;transition:transform .2s,box-shadow .2s}@media (hover:hover){.cwv-how-card:hover{transform:translateY(-3px);box-shadow:0 6px 24px #1c19170f}}.cwv-how-number{background:linear-gradient(135deg, var(--color-gold-wash), var(--color-gold-pale));width:36px;height:36px;color:var(--color-gold-dark);border-radius:10px;justify-content:center;align-items:center;margin-bottom:16px;font-size:.92rem;font-weight:700;display:flex}.cwv-how-card h3{color:var(--text-primary);margin-bottom:8px;font-size:1rem;font-weight:700;line-height:1.3}.cwv-how-card p{color:var(--text-secondary);font-size:.88rem;line-height:1.65}.cwv-how-note{background:var(--color-stone-50);border:1px solid var(--color-stone-150);text-align:center;border-radius:12px;max-width:680px;margin:0 auto;padding:24px 32px}.cwv-how-note p{color:var(--text-secondary);font-size:.92rem;font-style:italic;line-height:1.6}@media (width<=640px){.cwv-how-grid{grid-template-columns:1fr}}[data-theme=dark] .cwv-problem{background:var(--color-stone-950)}[data-theme=dark] .cwv-problem-callout,[data-theme=dark] .cwv-how-note{background:var(--color-stone-900);border-color:var(--color-stone-750)}[data-theme=dark] .cwv-metric{background:var(--color-stone-850)}[data-theme=dark] .cwv-metric--alt{background:var(--color-stone-950)}[data-theme=dark] .cwv-metric-badge--lcp{color:#4ade80;background:#22c55e1f;border-color:#22c55e4d}[data-theme=dark] .cwv-metric-badge--inp{color:#60a5fa;background:#3b82f61f;border-color:#3b82f64d}[data-theme=dark] .cwv-metric-badge--cls{color:#c084fc;background:#a855f71f;border-color:#a855f74d}[data-theme=dark] .cwv-metric-problem,[data-theme=dark] .cwv-metric-solution{background:var(--color-stone-900);border-color:var(--color-stone-750)}[data-theme=dark] .cwv-metric .cwv-metric-problem{border-color:var(--color-frame-error)}[data-theme=dark] .cwv-metric .cwv-metric-solution{border-color:var(--color-frame-gold)}[data-theme=dark] .cwv-metric-solution code,[data-theme=dark] .cwv-how-card code{background:var(--color-stone-750)}[data-theme=dark] .cwv-how{background:var(--color-stone-950)}[data-theme=dark] .cwv-how-card{background:var(--color-stone-900);border-color:var(--color-stone-750)}[data-theme=dark] .cwv-how-card:hover{box-shadow:0 6px 24px #0000004d}[data-theme=dark] .cwv-how-number{color:var(--color-gold-light);background:linear-gradient(135deg,#fefce814,#fef3c70d)}@media (prefers-reduced-motion:reduce){.cwv-how-card{transition:none}}