@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600;9..144,700;9..144,800&family=Manrope:wght@400;600;700&display=swap");

:root {
  --ink: #3f261e;
  --muted: #75645e;
  --paper: #f4eadb;
  --surface: #fffaf1;
  --line: #d8c2aa;
  --accent: #d76946;
  --accent-ink: #321d17;
  --deep: #482d25;
  --success: #4f6b45;
  --radius: 28px;
  --font-display: "Fraunces", Garamond, serif;
  --font-body: "Manrope", Candara, sans-serif;
}

.site-header { border-bottom: 0; }
.wordmark { font-family: var(--font-display); font-size: 18px; text-transform: none; letter-spacing: .02em; }
.wordmark-mark { color: #fffaf1; background: var(--accent); font-family: var(--font-display); font-style: italic; }
.site-header nav a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--accent); }
.hero { grid-template-columns: 1fr; justify-items: center; text-align: center; margin-top: 56px; }
.hero h1 { max-width: 940px; font-weight: 400; font-size: clamp(58px, 9vw, 120px); line-height: .88; letter-spacing: -.045em; }
.hero h1 em { color: var(--accent); font-style: italic; }
.hero-lede { margin-inline: auto; }
.trust-row { justify-content: center; }
.hero-note { width: min(740px, 100%); grid-template-columns: repeat(3, auto 1fr); align-items: center; padding: 18px 24px; border: 1px solid var(--line); border-radius: 99px; text-align: left; }
.hero-note span { color: var(--accent); }
.channel-banner { background: var(--accent); color: #2d1812; }
.channel-banner .eyebrow { color: #592718; }
.channel-banner a { background: #fffaf1; color: var(--deep); }
.purchase-section { box-shadow: 0 18px 60px rgba(72,45,37,.1); }
.section-heading { justify-content: center; text-align: center; }
.section-heading h2 { font-weight: 400; font-size: clamp(44px, 6vw, 72px); }
.network-option { align-items: center; text-align: center; border-radius: 99px 99px 18px 18px; }
.network-option:has(input:checked) { background: #f8dfd2; border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.network-symbol { color: #fffaf1; background: var(--deep); border: 0; font-family: var(--font-display); font-size: 15px; }
.order-total { background: #ede0ce; color: var(--deep); }
.order-total span, .order-total small { color: var(--muted); }
.primary-action, .button-accent { background: var(--accent); color: #2d1812; }
.primary-action { border-radius: 99px; padding-inline: 24px; }
.whatsapp-trigger { background: var(--success); }
.console-sidebar { background: var(--deep); }
.page-heading h1, .metric-grid strong, .console-card h2 { font-weight: 400; }
.metric-grid article { background: #fffaf1; }

@media (max-width: 680px) {
  .hero-note { grid-template-columns: 30px 1fr; border-radius: 24px; }
  .network-option { border-radius: 70px 70px 18px 18px; }
}
