@layer components{.hero{padding-block:clamp(2rem,6vw,4rem) clamp(1.5rem,4vw,3rem);text-align:center}.hero h1{font-family:var(--font-display);font-size:var(--step-4);color:var(--accent-ink-display);margin:0 0 0.5rem;text-wrap:balance}.hero .lead{font-size:var(--step-1);color:var(--ink-muted);max-width:40ch;margin-inline:auto;text-wrap:pretty}.hero .actions{margin-top:1.5rem}.hero .actions .btn-primary{display:inline-block;padding:0.75rem 1.5rem;min-height:var(--tap,44px);border-radius:var(--radius-md);background:var(--accent);color:var(--accent-ink);font-weight:600;text-decoration:none;box-shadow:var(--shadow-sm);transition:background 150ms var(--pop-ease),transform 150ms var(--pop-ease)}.hero .actions .btn-primary:hover,.hero .actions .btn-primary:focus-visible{background:var(--accent-hover);transform:translateY(-1px)}.client-settings{margin-inline:auto;max-width:44rem;padding:clamp(1rem,3vw,2rem);background:var(--bg-2);border:var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-xs)}.client-settings h2{font-family:var(--font-display);font-size:var(--step-2);margin:0 0 0.5rem}.client-settings>p{color:var(--ink-muted);margin:0 0 1rem}.client-settings table{width:100%;border-collapse:collapse;font-size:var(--step-0);display:block;overflow-x:auto}.client-settings thead th{text-align:left;font-size:var(--step--1);text-transform:uppercase;letter-spacing:0.04em;color:var(--ink-dim);padding:0.5rem 0.75rem;border-bottom:var(--border)}.client-settings tbody td{padding:0.6rem 0.75rem;border-bottom:var(--border);white-space:nowrap}.client-settings tbody tr:last-child td{border-bottom:0}.client-settings code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:0.95em;background:var(--bg-3);padding:0.1em 0.4em;border-radius:var(--radius-sm)}}