/* Claude's provider page uses AlliHat's established purple, paper, and type. */
.claude-hero { padding: 150px 24px 32px; background: var(--color-paper-warm); }
.claude-hero h1 { margin-bottom: 24px; }
.claude-hero :where(p:not(.provider-eyebrow)) { font-size: 1.08rem; line-height: 1.65; }
.claude-hero .claude-deck { font-size: 1.4rem; line-height: 1.4; margin-bottom: 18px; }
.claude-install { display: inline-block; margin: 24px 0 14px; }
.claude-hero .claude-fine-print { font-size: .85rem; color: #555c68; }
.claude-demo { margin: 0; }
.claude-demo img { display: block; width: 100%; height: auto; border-radius: 8px; border: 1px solid var(--color-line); }
.claude-demo figcaption { margin-top: 12px; font-size: .8rem; line-height: 1.5; color: #555c68; max-width: 65ch; }
.claude-jump-links { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 36px; padding: 12px 0; font-size: .95rem; }
.claude-reading { max-width: 820px; padding: 72px 24px 16px; margin: auto; font-size: 1.08rem; line-height: 1.8; }
.claude-reading section { margin-bottom: 64px; scroll-margin-top: 120px; }
.claude-reading h2 { font-size: 2rem; line-height: 1.2; letter-spacing: -.05rem; margin-bottom: 24px; }
.claude-reading h3 { font-family: inherit; font-size: 1.1rem; font-weight: 650; letter-spacing: 0; line-height: 1.5; margin: 28px 0 8px; }
.claude-reading p { margin-bottom: 18px; }
.claude-page main a:not(.app-store-badge), .claude-jump-links a { color: var(--brand-dark); text-decoration: underline; text-underline-offset: 3px; }
.claude-example { background: var(--brand-light); border-radius: 8px; padding: 24px 28px; margin: 28px 0; }
.claude-example p { font-size: .85rem; color: #60418e; margin-bottom: 12px; }
.claude-example blockquote { margin: 0 0 14px; }
.claude-example blockquote:last-child { margin-bottom: 0; }
.claude-steps { padding-left: 24px; }
.claude-steps li { margin-bottom: 24px; padding-left: 8px; }
.claude-steps li::marker { color: var(--brand-dark); font-weight: 650; }
.claude-next a { display: block; padding: 8px 0; }
.claude-page a:focus-visible { outline: 2px solid var(--brand-dark); outline-offset: 5px; }
.claude-skip { position: fixed; left: 16px; top: -100px; z-index: 100; background: white; padding: 12px; }
.claude-skip:focus { top: 12px; }
@media (max-width: 768px) {
  .claude-hero { padding-top: 124px; }
  .claude-demo { margin-top: 12px; }
  .claude-jump-links { margin-top: 20px; }
  .claude-reading { padding-top: 48px; font-size: 1rem; }
  .claude-reading h2 { font-size: 1.8rem; }
  .claude-example { padding: 24px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }