.hero { padding: 5rem 1.5rem 3rem; text-align: center; background: radial-gradient(ellipse at 50% 0%, rgba(79,142,247,0.08) 0%, transparent 65%); }
.hero__inner { max-width: var(--max-width); margin: 0 auto; }
.hero__badge { display: inline-block; padding: 4px 12px; border-radius: 20px; font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; background: var(--card); border: 1px solid var(--border); color: var(--accent); margin-bottom: 1.25rem; }
.hero__title { font-size: 3rem; font-weight: 700; letter-spacing: -0.03em; line-height: 1.1; margin-bottom: 1rem; }
.hero__sub { color: var(--muted); font-size: 1.1rem; max-width: 560px; margin: 0 auto 2rem; line-height: 1.6; }
.hero__cta { display: flex; gap: 0.75rem; justify-content: center; flex-wrap: wrap; }

.stats { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--mid); }
.stats__inner { display: grid; grid-template-columns: repeat(4, 1fr); max-width: var(--max-width); margin: 0 auto; }
.stat-item { padding: 1.5rem; text-align: center; border-right: 1px solid var(--border); }
.stat-item:last-child { border-right: none; }
.stat-item__value { display: block; font-size: 1.75rem; font-weight: 700; color: var(--accent); letter-spacing: -0.02em; }
.stat-item__label { display: block; font-size: 0.8rem; color: var(--muted); margin-top: 0.25rem; }

.section-title { font-size: 1.5rem; font-weight: 700; letter-spacing: -0.02em; margin-bottom: 0.5rem; }
.section-sub { color: var(--muted); font-size: 0.95rem; margin-bottom: 2rem; }

.features { padding: 4rem 1.5rem; }
.features__inner { max-width: var(--max-width); margin: 0 auto; }
.features__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 2rem; }
.feature-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.5rem; }
.feature-card__icon { font-size: 1.25rem; margin-bottom: 0.75rem; }
.feature-card__title { font-size: 0.95rem; font-weight: 600; margin-bottom: 0.5rem; }
.feature-card__body { color: var(--muted); font-size: 0.875rem; line-height: 1.6; }
.feature-card__body code { background: var(--mid); padding: 1px 5px; border-radius: 3px; font-size: 0.8rem; color: var(--accent); }

.pricing { padding: 4rem 1.5rem; background: var(--mid); border-top: 1px solid var(--border); }
.pricing__inner { max-width: var(--max-width); margin: 0 auto; }
.pricing__cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-top: 2rem; margin-bottom: 3rem; }
.pricing-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 2rem; position: relative; }
.pricing-card--enterprise { border-color: var(--accent); }
.pricing-card__badge { position: absolute; top: -1px; right: 1.5rem; background: var(--accent); color: #fff; font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 3px 10px; border-radius: 0 0 6px 6px; }
.pricing-card__tier { font-size: 0.85rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); margin-bottom: 0.75rem; }
.pricing-card__price { margin-bottom: 1.5rem; }
.pricing-card__amount { font-size: 2.25rem; font-weight: 700; letter-spacing: -0.02em; }
.pricing-card__period { color: var(--muted); font-size: 0.95rem; margin-left: 0.25rem; }
.pricing-card__features { list-style: none; margin-bottom: 2rem; display: flex; flex-direction: column; gap: 0.6rem; }
.pricing-card__features li { font-size: 0.9rem; color: var(--muted); }
.pricing-card__features li::first-letter { color: var(--green); }
.btn--full { width: 100%; justify-content: center; }

.per-request { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.75rem; }
.per-request__title { font-size: 1rem; font-weight: 600; margin-bottom: 0.25rem; }
.per-request__sub { color: var(--muted); font-size: 0.875rem; margin-bottom: 1.25rem; }
.pr-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.pr-table th { text-align: left; color: var(--muted); font-weight: 500; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.04em; padding: 0.5rem 0.75rem; border-bottom: 1px solid var(--border); }
.pr-table td { padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--border); color: var(--text); }
.pr-table tr:last-child td { border-bottom: none; }
.pr-table code { background: var(--mid); padding: 2px 6px; border-radius: 4px; color: var(--accent); font-size: 0.8rem; }
.pr-cost { font-weight: 600; color: var(--green); font-variant-numeric: tabular-nums; }

.endpoints { padding: 4rem 1.5rem; }
.endpoints__inner { max-width: var(--max-width); margin: 0 auto; }
.ep-groups { display: flex; flex-direction: column; gap: 1rem; margin-top: 2rem; }
.ep-group { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.25rem; }
.ep-group__label { font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted); margin-bottom: 0.75rem; font-weight: 600; }
.ep-group__label code { background: var(--mid); padding: 2px 6px; border-radius: 4px; font-size: 0.75rem; color: var(--accent); }
.ep-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.4rem 0; }
.ep-row + .ep-row { border-top: 1px solid var(--border); }
.ep-method { font-size: 0.75rem; font-weight: 700; width: 2.5rem; text-align: center; flex-shrink: 0; }
.ep-method--get { color: var(--green); }
.ep-path { background: var(--mid); padding: 2px 8px; border-radius: 4px; font-size: 0.85rem; white-space: nowrap; }
.ep-path a { color: var(--accent); text-decoration: none; }
.ep-path a:hover { text-decoration: underline; }
.ep-desc { color: var(--muted); font-size: 0.85rem; }
.ep-desc code { background: var(--mid); padding: 1px 5px; border-radius: 3px; font-size: 0.78rem; color: var(--accent); }

@media (max-width: 768px) {
    .hero__title { font-size: 2rem; }
    .stats__inner { grid-template-columns: repeat(2, 1fr); }
    .stat-item:nth-child(2) { border-right: none; }
    .features__grid { grid-template-columns: 1fr; }
    .pricing__cards { grid-template-columns: 1fr; }
    .ep-row { flex-wrap: wrap; }
}
