:root {
  --ink: #111111;
  --ink-muted: #626260;
  --ink-subtle: #7b7b78;
  --canvas: #f5f1ec;
  --surface-1: #ffffff;
  --surface-2: #ebe7e1;
  --hairline: #d3cec6;
  --accent: #ff5600;
}

body {
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;
  color: var(--ink);
  background: var(--canvas);
}

a { color: var(--ink); }
a:hover { color: var(--accent); }

h1, h2, h3, h4 { font-weight: 600; letter-spacing: -0.4px; }
h1 { font-size: clamp(30px, 5vw, 44px); }

.navbar { background: var(--canvas) !important; border-bottom: 1px solid var(--hairline); }
.navbar-brand { font-weight: 600; color: var(--ink) !important; }
.nav-link { color: var(--ink-muted) !important; font-weight: 500; font-size: 14px; }
.nav-link.active, .nav-link:hover { color: var(--ink) !important; }

.hero { padding: 56px 0 32px; }
.hero-eyebrow { display: inline-block; font-size: 13px; font-weight: 600; color: var(--accent); margin-bottom: 10px; }
.hero-lead { font-size: 18px; color: var(--ink-muted); max-width: 680px; }

.card-flat { background: var(--surface-1); border: 1px solid var(--hairline); border-radius: 12px; }
.card-flat img { border-radius: 12px 12px 0 0; }

.breadcrumb-nav { font-size: 13px; color: var(--ink-subtle); }
.breadcrumb-nav a { color: var(--ink-subtle); text-decoration: none; }
.breadcrumb-nav a:hover { color: var(--accent); }

.toc-box { background: var(--surface-2); border-radius: 12px; padding: 24px; }
.toc-box h3 { font-size: 13px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink-subtle); }
.toc-box a { color: var(--ink); text-decoration: none; font-size: 14px; }
.toc-box a:hover { color: var(--accent); }

.related-tile { display: block; border: 1px solid var(--hairline); border-radius: 8px; padding: 16px; color: var(--ink); font-size: 14px; font-weight: 600; text-decoration: none; background: var(--surface-1); }
.related-tile:hover { border-color: var(--accent); color: var(--ink); }

.faq-item { background: var(--surface-2); border-radius: 8px; padding: 20px; margin-bottom: 12px; }
.faq-item summary { cursor: pointer; font-weight: 600; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; float: right; color: var(--ink-subtle); }
.faq-item[open] summary::after { content: "\2212"; }
.faq-item p { margin-top: 10px; color: var(--ink-muted); }

.btn-brand { background: var(--ink); color: #fff; border: none; }
.btn-brand:hover { background: #313130; color: #fff; }

.form-control:focus { border-color: var(--accent); box-shadow: 0 0 0 0.2rem rgba(255,86,0,0.15); }
.field-error { color: #c41c1c; font-size: 13px; display: none; }
.form-success { display: none; background: var(--surface-2); border-radius: 8px; padding: 14px; margin-top: 12px; font-weight: 500; }

.cookie-banner { position: fixed; left: 20px; right: 20px; bottom: 20px; max-width: 640px; margin: 0 auto; background: var(--ink); color: #fff; border-radius: 12px; padding: 20px; display: none; z-index: 100; }
.cookie-banner p { font-size: 14px; color: #ddd; }
.cookie-actions button { border: none; border-radius: 8px; padding: 8px 16px; font-size: 14px; margin-right: 8px; }
.btn-accept { background: #fff; color: var(--ink); }
.btn-reject { background: transparent; color: #fff; border: 1px solid #555 !important; }

footer.site-footer { background: var(--canvas); border-top: 1px solid var(--hairline); padding: 48px 0 24px; }
footer.site-footer h4 { font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-subtle); }
footer.site-footer a { color: var(--ink-muted); text-decoration: none; font-size: 14px; }
footer.site-footer a:hover { color: var(--accent); }
.disclaimers { font-size: 12px; color: var(--ink-subtle); border-top: 1px solid var(--hairline); padding-top: 16px; margin-top: 16px; }
