/* Warm Spark tokens. React adapter: apps/web/src/styles/warm-spark.css. */
.spark-site {
  --spark-canvas: #fff8f2;
  --spark-surface: #ffffff;
  --spark-ink: #302033;
  --spark-muted: #655568;
  --spark-primary: #613c68;
  --spark-on-primary: #ffffff;
  --spark-lilac: #e9ddf5;
  --spark-apricot: #ffd8c2;
  --spark-line: #d8c6d8;
  --spark-control: #8a758b;
  --spark-focus: #4d2d79;
  margin: 0;
  background: var(--spark-canvas);
  color: var(--spark-ink);
  font: 16px/1.65 Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color-scheme: light;
}
.spark-site *, .spark-site *::before, .spark-site *::after { box-sizing: border-box; }
.spark-site :is(h1,h2,h3,h4,p,figure) { margin: 0; }
.spark-site :is(h1,h2) { font-family: Georgia, "Times New Roman", serif; font-weight: 400; letter-spacing: -.045em; line-height: 1.07; text-wrap: balance; }
.spark-site h1 { font-size: clamp(3.1rem, 5.6vw, 5.25rem); }
.spark-site h1 em { font-weight: 400; color: var(--spark-primary); }
.spark-site h2 { font-size: clamp(2.3rem, 3.4vw, 3.5rem); }
.spark-site h3 { font-size: 1.3rem; line-height: 1.4; letter-spacing: -.025em; }
.spark-site h4 { font-size: 1rem; font-weight: 650; }
.spark-site a { color: inherit; text-underline-offset: 5px; }
.spark-site a:hover { text-decoration-thickness: 2px; }
.spark-site :is(a,summary,button):focus-visible { outline: 3px solid var(--spark-focus); outline-offset: 5px; border-radius: 4px; }
.spark-site summary { cursor: pointer; min-height: 44px; }
.spark-site img { display: block; max-width: 100%; height: auto; }
.spark-shell { width: min(1200px, calc(100% - 96px)); margin-inline: auto; }
.spark-skip { position: absolute; z-index: 10; left: 24px; top: -200px; padding: 12px 20px; background: white; }
.spark-skip:focus { top: 12px; }
.spark-header { border-bottom: 1px solid var(--spark-line); }
.spark-nav { min-height: 100px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.spark-brand { display: inline-flex; gap: 10px; align-items: center; text-decoration: none; min-height: 44px; }
.spark-brand .brand-wordmark { font-size: 1.42rem; font-weight: 800; letter-spacing: -.03em; }
.spark-desktop-nav { display: flex; gap: 36px; }
.spark-desktop-nav a, .spark-login { display: inline-flex; align-items: center; min-height: 44px; text-decoration: none; }
.spark-login { gap: 18px; font-weight: 600; }
.spark-nav-actions { display: flex; gap: 18px; align-items: center; }
.spark-mobile-menu { display: none; }
.spark-hero { padding: 72px 0 78px; }
.spark-hero-grid { display: grid; grid-template-columns: 1.12fr 1fr; gap: 48px; align-items: center; }
.spark-eyebrow { font-size: 1rem; color: var(--spark-primary); font-weight: 600; letter-spacing: .025em; }
.spark-hero h1 { margin-top: 22px; }
.spark-lead { color: var(--spark-muted); max-width: 490px; font-size: 1.125rem; line-height: 1.7; margin-top: 24px !important; }
.spark-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 32px; }
.spark-site .spark-button { min-height: 56px; padding: 14px 26px; border: 1px solid var(--spark-primary); border-radius: 999px; background: var(--spark-primary); color: var(--spark-on-primary); display: inline-flex; align-items: center; justify-content: center; gap: 30px; text-decoration: none; font-weight: 600; transition: background-color 150ms; }
.spark-site .spark-button:hover { background: #4b2b52; }
.spark-text-link { min-height: 44px; display: inline-flex; align-items: center; gap: 12px; font-weight: 500; }
.spark-availability { margin-top: 24px !important; color: var(--spark-muted); }
.spark-availability a { display: inline-block; padding-top: 5px; }
.spark-hero-art { position: relative; }
.spark-hero-art img { width: 100%; }
.spark-hero-art figcaption { color: var(--spark-primary); text-align: center; font: italic 1.35rem/1.5 Georgia, serif; margin-top: 8px; }
html[data-direction="lilac"] .spark-hero { background: #f2ebfa; }
html[data-direction="lilac"] .spark-hero-art { background: #fff8f2; border-radius: 50% 50% 8px 8px; padding: 14px 14px 24px; }
html[data-direction="lilac"] .spark-hero h1 em { color: #59427c; }
.spark-section { padding-block: 92px; }
.spark-how { border-top: 1px solid var(--spark-line); }
.spark-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.spark-section-heading .spark-eyebrow { padding-top: 8px; }
.spark-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 64px; margin-top: 56px; }
.spark-step-number { display: block; font: italic 1.65rem Georgia, serif; color: var(--spark-primary); margin-bottom: 26px; }
.spark-steps p { color: var(--spark-muted); margin-top: 14px; }
.spark-experience { background: #eee5f0; }
.spark-experience-grid, .spark-trust-grid, .spark-faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; align-items: center; }
.spark-experience h2, .spark-trust-grid h2, .spark-faq-grid h2 { margin-top: 20px; }
.spark-section-copy { color: var(--spark-muted); font-size: 1.125rem; margin-top: 24px !important; max-width: 420px; }
.spark-fine { color: var(--spark-muted); margin-top: 24px !important; max-width: 440px; }
.spark-example { border: 1px solid var(--spark-line); border-radius: 24px 24px 24px 4px; padding: 32px; background: var(--spark-surface); box-shadow: 10px 12px 0 #d8c6d84d; }
.spark-example-label { color: var(--spark-muted); border-bottom: 1px solid var(--spark-line); padding-bottom: 18px; margin-bottom: 22px !important; }
.spark-example h3 { font: 400 2rem/1.15 Georgia, serif; letter-spacing: -.03em; margin-bottom: 8px; }
.spark-common-ground { padding-top: 24px; }
.spark-common-ground ul { padding-left: 22px; margin: 8px 0 0; color: var(--spark-muted); }
.spark-common-ground li + li { margin-top: 8px; }
.spark-opener { background: var(--spark-canvas); border-radius: 12px; padding: 18px; margin-top: 24px; }
.spark-opener p { font: italic 1.4rem/1.5 Georgia, serif; margin-top: 8px; }
.spark-example-note { color: var(--spark-muted); margin-top: 20px !important; }
.spark-trust-grid { align-items: start; }
.spark-facts article + article { border-top: 1px solid var(--spark-line); padding-top: 28px; margin-top: 28px; }
.spark-facts p { color: var(--spark-muted); margin-top: 10px; }
.spark-facts a { min-height: 44px; display: inline-flex; align-items: center; gap: 12px; margin-top: 8px; font-weight: 500; }
.spark-questions { border-block: 1px solid var(--spark-line); }
.spark-faq-grid { align-items: start; }
.spark-faq-grid .spark-text-link { margin-top: 24px; }
.spark-faq details { border-bottom: 1px solid var(--spark-line); padding: 0 0 20px; }
.spark-faq details + details { margin-top: 20px; }
.spark-faq summary { padding-block: 8px; font-weight: 600; }
.spark-faq p { padding-top: 12px; color: var(--spark-muted); }
.spark-faq details > a { display: inline-flex; align-items: center; min-height: 44px; margin-top: 8px; }
.spark-closing { text-align: center; background: #f8e6db; }
.spark-flower { color: var(--spark-primary); font-size: 3rem; line-height: 1; }
.spark-closing h2 { margin-top: 20px; font-size: clamp(2.75rem, 4.5vw, 4.5rem); }
.spark-closing p { margin-top: 20px; color: var(--spark-muted); }
.spark-closing .spark-button { margin-top: 28px; }
.spark-footer { padding: 44px 0 24px; }
.spark-footer-top { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.spark-footer-top p { color: var(--spark-muted); }
.spark-footer-links { display: flex; flex-wrap: wrap; gap: 4px 28px; margin-top: 28px; }
.spark-footer-links a, .spark-explore a { display: inline-flex; align-items: center; min-height: 44px; }
.spark-explore { margin-top: 16px; }
.spark-explore summary { padding-block: 8px; color: var(--spark-muted); }
.spark-explore a { margin-right: 24px; }
.spark-copyright { color: var(--spark-muted); border-top: 1px solid var(--spark-line); margin-top: 24px !important; padding-top: 24px; }
@media (max-width: 1000px) {
  .spark-shell { width: calc(100% - 64px); }
  .spark-hero-grid { gap: 24px; grid-template-columns: 1.1fr 1fr; }
  .spark-experience-grid, .spark-trust-grid, .spark-faq-grid { gap: 40px; }
  .spark-steps { gap: 32px; }
}
@media (max-width: 700px) {
  .spark-shell { width: calc(100% - 40px); }
  .spark-nav { min-height: 80px; gap: 12px; }
  .spark-desktop-nav { display: none; }
  .spark-login { gap: 8px; }
  .spark-nav-actions { gap: 14px; }
  .spark-mobile-menu { display: block; position: relative; }
  .spark-mobile-menu summary { padding-block: 10px; }
  .spark-mobile-menu nav { position: absolute; top: 52px; right: 0; z-index: 2; width: 220px; padding: 12px; background: white; border: 1px solid var(--spark-control); border-radius: 12px; box-shadow: 0 10px 30px #30203314; }
  .spark-mobile-menu a { display: block; padding: 10px 14px; min-height: 44px; }
  .spark-hero { padding: 40px 0 48px; }
  .spark-hero-grid, .spark-experience-grid, .spark-trust-grid, .spark-faq-grid { grid-template-columns: 1fr; gap: 36px; }
  .spark-hero h1 { margin-top: 20px; font-size: clamp(2.7rem, 12.4vw, 4rem); }
  .spark-lead { margin-top: 22px !important; font-size: 1.0625rem; }
  .spark-actions { gap: 10px 22px; margin-top: 24px; }
  .spark-availability { margin-top: 18px !important; }
  .spark-hero-art { max-width: 420px; width: 100%; margin: auto !important; }
  .spark-section { padding-block: 56px; }
  .spark-section-heading { display: block; }
  .spark-section-heading h2 { margin-top: 18px; }
  .spark-steps { grid-template-columns: 1fr; gap: 28px; margin-top: 36px; }
  .spark-steps article { padding-left: 56px; position: relative; }
  .spark-step-number { position: absolute; left: 0; top: 3px; }
  .spark-example { padding: 24px; box-shadow: 6px 8px 0 #d8c6d84d; }
  .spark-footer-top { align-items: flex-start; flex-direction: column; gap: 14px; }
  .spark-footer-links { gap: 0 24px; }
}
@media (prefers-reduced-motion: reduce) { .spark-site *, .spark-site *::before, .spark-site *::after { transition: none !important; scroll-behavior: auto !important; } }