@import './ember-tokens.css';
/* Adapter for the existing public pages. Content and metadata stay untouched. */
:root {
  --primary-color: var(--ember-accent);
  --secondary-color: var(--ember-accent);
  --accent-color: var(--ember-accent);
  --background: var(--ember-bg);
  --foreground: var(--ember-text);
  --card: var(--ember-surface);
  --card-foreground: var(--ember-text);
  --muted: var(--ember-raised);
  --muted-foreground: var(--ember-muted);
  --border: var(--ember-border);
  --ring: var(--ember-accent);
  --light-gray: var(--ember-surface);
  --light-bg: var(--ember-bg);
  --gradient: linear-gradient(120deg, var(--ember-accent), var(--ember-accent-hover));
}
html, body { font-family: var(--ember-font-body); color: var(--ember-text); }
body, body.about-page, body.legal-page { background: var(--ember-ambient), var(--ember-bg); }
h1, h2, h3, .brand-name, .brand-suffix { font-family: var(--ember-font-heading); }
body .bg-white, body .bg-gray-50, body .bg-gray-100 { background: transparent; }
body .text-neutral-900, body .text-black, body .testimonial-name,
body .step-title, body .faq-question, body .about-header h1,
body .about-section h2, body .legal-header h1, body .legal-content h2,
body .legal-content h3, body .hero-headline { color: var(--ember-text); }
body .text-neutral-500, body .text-neutral-600, body .text-gray-600,
body .hero-subheadline, body .step-description, body .testimonial-text,
body .testimonial-role, body .faq-answer, body .about-header p,
body .about-section p, body .about-section ul li, body .legal-header p,
body .legal-content p, body .legal-content li { color: var(--ember-muted); }
body .navbar { background: var(--ember-glass); border-bottom: 1px solid var(--ember-glass-border); backdrop-filter: blur(var(--ember-blur)); }
body .brand-name { color: var(--ember-text); }
body .brand-suffix, body .about-section h2 svg, body .about-section ul li svg,
body .legal-content a { color: var(--ember-accent); }
body .hero { background: var(--ember-ambient); }
body .hero-headline, body .about-header h1, body .legal-header h1 {
  font-size: var(--ember-type-title); line-height: 1.12; font-weight: 600; letter-spacing: -1.3px;
}
body .hero-subheadline { font-size: var(--ember-type-body); }
body .gradient-text { background: none; color: var(--ember-accent); -webkit-text-fill-color: var(--ember-accent); }
body .step-card, body .testimonial-card, body .faq-list, body .about-section,
body .legal-content { background: var(--ember-ambient), var(--ember-surface); border: 1px solid var(--ember-glass-border); border-radius: var(--ember-radius-card); box-shadow: var(--ember-shadow); }
body .step-card:hover, body .testimonial-card:hover { border-color: var(--ember-border); background-color: var(--ember-raised); }
body .step-number, body .testimonial-avatar, body .testimonial-badge { background: var(--ember-raised); color: var(--ember-accent); border-color: var(--ember-border); }
/* One shared surface; internal rows have only a single straight separator. */
body .faq-item {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
body .faq-item + .faq-item { border-top: 1px solid var(--ember-glass-border); }
body .faq-question:hover { background: var(--ember-raised); border-radius: 0; }
body .highlight-box, body .cta-section { background: var(--ember-raised); border-color: var(--ember-border); color: var(--ember-text); }
body .highlight-box p { color: var(--ember-text); }
body .action-button, body .cta-button, body .nav-button.primary {
  background: var(--ember-accent); color: var(--ember-on-accent); border-radius: var(--ember-radius-pill); border-color: var(--ember-accent); box-shadow: none; font-family: var(--ember-font-body); font-weight: 500;
}
body .action-button:hover, body .cta-button:hover, body .nav-button.primary:hover { background: var(--ember-accent-hover); color: var(--ember-on-accent); }
body a:focus-visible, body button:focus-visible { outline: 3px solid var(--ember-accent) !important; outline-offset: 4px; }
body .faq-question:focus-visible { outline-offset: -4px; }
body .site-footer { background: var(--ember-bg); border-color: var(--ember-border); }
body .border-neutral-200 { border-color: var(--ember-border); }
body .site-footer a:hover { color: var(--ember-accent); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media (prefers-reduced-transparency: reduce) {
  body .navbar { background: var(--ember-surface); backdrop-filter: none; }
}

body .navbar .brand-image { border-radius: 50%; object-fit: cover; flex-shrink: 0; }
