html, body {
  background: var(--bg, var(--aj-bg, #FBF7F1));
  color: var(--text, var(--aj-text, #241F26));
}
html[data-theme="dark"], html[data-theme="dark"] body {
  background: var(--bg, #1B1720);
  color: var(--text, #F7F1EA);
}
[data-theme="dark"] .brand-text,
[data-theme="dark"] .brand { color: var(--text, #F7F1EA); }

.kf { padding-top: calc(var(--nav-h) + 1.25rem); padding-bottom: 3rem; }

.kf-tanitim { margin-top: 0; }
.kf-tanitim .hero {
  padding: 2rem 0 2.4rem;
}
.kf-tanitim .display {
  margin: 0;
  font: 800 clamp(2.15rem, 5.2vw, 3.5rem)/1 var(--font-display);
  letter-spacing: -.03em;
}
.kf-tanitim .section { padding: clamp(2.4rem, 6vw, 4rem) 0; }
.kf-tanitim .section.how { padding-top: 1.6rem; }
.kf-tanitim .section-head { margin-bottom: 2rem; }
.kf-tanitim .section-head h2,
.kf-tanitim .final-card h2,
.kf-tanitim .comm-card h2 {
  margin: 0;
  font: 700 clamp(1.85rem, 4.2vw, 2.9rem)/1.15 var(--font-display);
}
.kf-tanitim .card,
.kf-tanitim .chat,
.kf-tanitim .compare,
.kf-tanitim .comm-card,
.kf-tanitim .final-card,
.kf-tanitim .diagram,
.kf-tanitim .code {
  border-radius: 22px;
}
.kf-tanitim .step h3,
.kf-tanitim .card h3,
.kf-tanitim .setup-steps h3 {
  font: 700 1.05rem/1.25 var(--font-display);
}
.kf-tanitim .final { padding-bottom: .4rem; }
@media (max-width: 900px) {
  .kf-tanitim .hero-grid,
  .kf-tanitim .how-grid,
  .kf-tanitim .setup-grid,
  .kf-tanitim .faq-grid,
  .kf-tanitim .comm-card { grid-template-columns: 1fr; }
}
