html.bs .eyebrow {
  position: relative;
}

html.bs .eyebrow::after {
  content: "";
  display: block;
  height: 2px;
  margin-top: 8px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
}

html.bs .hero .eyebrow::after,
html.bs .page-hero .eyebrow::after,
html.bs section.is-seen .eyebrow::after {
  animation: v1Rule 0.42s cubic-bezier(0.23, 1, 0.32, 1) forwards;
}

html.bs .there-panel .panel-topline,
html.bs .there-panel .tile,
html.bs .there-panel .score-strip {
  opacity: 0;
  transform: translateY(8px);
  animation: v1Settle 0.24s cubic-bezier(0.23, 1, 0.32, 1) forwards;
}

html.bs .there-panel .panel-topline { animation-delay: 0.12s; }
html.bs .there-panel .tile:nth-child(1) { animation-delay: 0.17s; }
html.bs .there-panel .tile:nth-child(2) { animation-delay: 0.22s; }
html.bs .there-panel .tile:nth-child(3) { animation-delay: 0.27s; }
html.bs .there-panel .score-strip { animation-delay: 0.32s; }

html.bs section:not(.hero) .manual-card,
html.bs section:not(.hero) .feature-card,
html.bs section:not(.hero) .compact-card,
html.bs section:not(.hero) .loop-step,
html.bs section:not(.hero) .evidence-card,
html.bs section:not(.hero) .about-card,
html.bs .answer-grid article,
html.bs .send-card,
html.bs .diagnostic-snapshot {
  opacity: 0;
  transform: translateY(8px);
}

html.bs section.is-seen .manual-card,
html.bs section.is-seen .feature-card,
html.bs section.is-seen .compact-card,
html.bs section.is-seen .loop-step,
html.bs section.is-seen .evidence-card,
html.bs section.is-seen .about-card,
html.bs section.is-seen .answer-grid article,
html.bs section.is-seen .send-card,
html.bs .page-hero.is-seen .diagnostic-snapshot {
  animation: v1Settle 0.24s cubic-bezier(0.23, 1, 0.32, 1) forwards;
}

html.bs section.is-seen .manual-card:nth-child(2),
html.bs section.is-seen .feature-card:nth-child(2),
html.bs section.is-seen .compact-card:nth-child(2),
html.bs section.is-seen .loop-step:nth-child(2),
html.bs section.is-seen .evidence-card:nth-child(2),
html.bs section.is-seen .answer-grid article:nth-child(2),
html.bs section.is-seen .send-card:nth-child(2) { animation-delay: 0.06s; }

html.bs section.is-seen .manual-card:nth-child(3),
html.bs section.is-seen .compact-card:nth-child(3),
html.bs section.is-seen .loop-step:nth-child(3),
html.bs section.is-seen .evidence-card:nth-child(3),
html.bs section.is-seen .answer-grid article:nth-child(3) { animation-delay: 0.12s; }

html.bs section.is-seen .manual-card:nth-child(4),
html.bs section.is-seen .compact-card:nth-child(4),
html.bs section.is-seen .loop-step:nth-child(4),
html.bs section.is-seen .answer-grid article:nth-child(4) { animation-delay: 0.18s; }

html.bs section.is-seen .answer-grid article:nth-child(5) { animation-delay: 0.24s; }

html.bs .send-grid {
  position: relative;
}

html.bs .send-grid::before {
  content: "";
  position: absolute;
  inset: 50% 0 auto;
  height: 2px;
  background: var(--green-soft);
  transform: scaleX(0);
  transform-origin: left;
}

html.bs section.is-seen .send-grid::before {
  animation: v1Rule 0.42s cubic-bezier(0.23, 1, 0.32, 1) forwards;
}

html.bs body.answers-index .answer-index-section .answer-grid {
  opacity: 0;
  transform: translateY(8px);
}

html.bs body.answers-index .answer-index-section.is-seen .answer-grid {
  animation: v1Settle 0.24s cubic-bezier(0.23, 1, 0.32, 1) forwards;
}

html.bs body.answer-detail section .compact-card,
html.bs body.answer-detail section .human-card,
html.bs body.answer-detail section .example-card,
html.bs body.answer-detail section p,
html.bs body.answer-detail section li {
  opacity: 1;
  transform: none;
  animation: none;
}

html.bs body.answer-detail section h2 {
  position: relative;
}

html.bs body.answer-detail section h2::before {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  margin-bottom: 10px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
}

html.bs body.answer-detail section.is-seen h2::before {
  animation: v1Rule 0.42s cubic-bezier(0.23, 1, 0.32, 1) forwards;
}

body.wp-cream .page-hero {
  background: var(--cream);
}

body.wp-cream .page-hero h1,
body.wp-cream .page-hero strong {
  color: var(--ink);
}

body.wp-cream .page-hero p,
body.wp-cream .page-hero .hero-lede {
  color: var(--muted);
}

body.wp-cream .page-hero .eyebrow {
  color: #9c4722;
}

body.wp-cream .diagnostic-snapshot {
  background: #151915;
  border: 1px solid var(--line);
}

body.wp-cream .diagnostic-snapshot,
body.wp-cream .diagnostic-snapshot strong {
  color: var(--cream);
}

body.wp-cream .diagnostic-snapshot .metric-label,
body.wp-cream .diagnostic-snapshot .score-label,
body.wp-cream .diagnostic-snapshot .case-tag {
  color: #d98b5d;
}

body.wp-cream .page-hero .button.button-light {
  background: var(--green);
  color: var(--cream);
  border-color: var(--green);
}

body.wp-cream .page-hero .button.light-outline {
  background: transparent;
  color: var(--ink);
  border-color: var(--ink);
}

body.wp-cream .page-hero .button:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 2px;
}

@keyframes v1Rule {
  to { transform: scaleX(1); }
}

@keyframes v1Settle {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 700px) {
  html.bs .there-panel .panel-topline,
  html.bs .there-panel .tile,
  html.bs .there-panel .score-strip,
  html.bs section:not(.hero) .manual-card,
  html.bs section:not(.hero) .feature-card,
  html.bs section:not(.hero) .compact-card,
  html.bs section:not(.hero) .loop-step,
  html.bs section:not(.hero) .evidence-card,
  html.bs section:not(.hero) .about-card,
  html.bs .answer-grid article,
  html.bs .send-card,
  html.bs .diagnostic-snapshot,
  html.bs body.answers-index .answer-index-section .answer-grid {
    transform: translateY(6px);
  }
}

@media (prefers-reduced-motion: reduce) {
  html.bs .eyebrow::after,
  html.bs .send-grid::before,
  html.bs body.answer-detail section h2::before {
    transform: scaleX(1);
    animation: none;
  }

  html.bs .there-panel .panel-topline,
  html.bs .there-panel .tile,
  html.bs .there-panel .score-strip,
  html.bs section:not(.hero) .manual-card,
  html.bs section:not(.hero) .feature-card,
  html.bs section:not(.hero) .compact-card,
  html.bs section:not(.hero) .loop-step,
  html.bs section:not(.hero) .evidence-card,
  html.bs section:not(.hero) .about-card,
  html.bs .answer-grid article,
  html.bs .send-card,
  html.bs .diagnostic-snapshot,
  html.bs body.answers-index .answer-index-section .answer-grid {
    opacity: 1;
    transform: none;
    animation: none;
  }
}