/**
 * Mythiq landing — colors & surfaces on shared product-page-layout.css typography.
 */

body.ak-brand .wrap.mq-shell.mq-surface {
  --mq-surface-ink: var(--ak-ink, #2c2824);
  --mq-surface-ink-soft: var(--ak-ink-soft, #5c564e);
  --mq-surface-ink-muted: var(--ak-ink-muted, #8a8378);
  --mq-surface-accent: var(--ak-accent, #9a7348);
  --mq-surface-accent-deep: #7a5c38;
  --mq-surface-accent-light: var(--ak-accent-light, #c4a574);
  --mq-surface-paper: #fff;
  --mq-surface-line: rgba(154, 115, 72, 0.22);
  --product-hero-accent: var(--mq-surface-accent);
  --product-hero-accent-deep: var(--mq-surface-accent-deep);
  --pp-accent-deep: var(--mq-surface-accent-deep);
  --pp-accent: var(--mq-surface-accent);
  --pp-accent-soft-custom: rgba(154, 115, 72, 0.18);
  --pp-ink-muted: var(--mq-surface-ink-muted);

  color: var(--mq-surface-ink);
}

body.ak-brand .wrap.mq-shell.mq-surface .hero-block {
  text-align: center;
  padding: 2rem 0 1.5rem;
}

body.ak-brand .wrap.mq-shell.mq-surface .hero-block-compact {
  padding: 2rem 0 1.25rem;
}

body.ak-brand .wrap.mq-shell.mq-surface .ak-product-hero-sub,
body.ak-brand .wrap.mq-shell.mq-surface .ak-product-hero .sub {
  text-align: center;
  max-width: 36em;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

body.ak-brand .wrap.mq-shell.mq-surface .pp-section-title {
  color: var(--mq-surface-accent-deep);
}

body.ak-brand .wrap.mq-shell.mq-surface .form-card {
  background: var(--mq-surface-paper);
  border: 1px solid var(--mq-surface-line);
  box-shadow: 0 8px 32px rgba(154, 115, 72, 0.07);
}

body.ak-brand .wrap.mq-shell.mq-surface .form-card::before {
  opacity: 0.35;
}

body.ak-brand .wrap.mq-shell.mq-surface .pp-form-card label,
body.ak-brand .wrap.mq-shell.mq-surface form label {
  color: var(--mq-surface-accent);
}

body.ak-brand .wrap.mq-shell.mq-surface form input,
body.ak-brand .wrap.mq-shell.mq-surface form select {
  background: #fff;
  border: 1px solid var(--ak-line, rgba(44, 40, 36, 0.1));
  color: var(--mq-surface-ink);
  font-size: 1rem;
}

body.ak-brand .wrap.mq-shell.mq-surface form input:focus,
body.ak-brand .wrap.mq-shell.mq-surface form select:focus {
  border-color: var(--mq-surface-accent-light);
  box-shadow: 0 0 0 2px rgba(154, 115, 72, 0.15);
}

body.ak-brand .wrap.mq-shell.mq-surface button[type="submit"] {
  background: var(--mq-surface-ink);
  color: var(--ak-paper, #f6f3ec);
  font-size: 1rem;
  font-weight: 600;
  padding: 0.9rem 1.25rem;
  border-radius: var(--pp-radius, 14px);
}

body.ak-brand .wrap.mq-shell.mq-surface button[type="submit"]:hover:not(:disabled) {
  background: var(--mq-surface-accent);
}

body.ak-brand .wrap.mq-shell.mq-surface .pp-form-legal a,
body.ak-brand .wrap.mq-shell.mq-surface .mq-form-legal a {
  color: var(--mq-surface-accent);
}

body.ak-brand .wrap.mq-shell.mq-surface .err,
body.ak-brand .wrap.mq-shell.mq-surface .pp-err {
  color: #9b3060;
}

body.ak-brand .wrap.mq-shell.mq-surface .mq-how-prominent {
  border-top: none;
  padding-top: 0;
  margin-top: 0;
}

body.ak-brand .wrap.mq-shell.mq-surface .pp-step-num {
  background: rgba(154, 115, 72, 0.18);
  color: var(--mq-surface-accent-deep);
}

body.ak-brand .wrap.mq-shell.mq-surface .pp-step-body strong {
  color: var(--mq-surface-ink);
}

body.ak-brand .wrap.mq-shell.mq-surface .pp-step-body p,
body.ak-brand .wrap.mq-shell.mq-surface .pp-hint {
  color: var(--mq-surface-ink-soft);
}

body.ak-brand .wrap.mq-shell.mq-surface .how-slip-preview-wrap {
  border-color: var(--mq-surface-line);
  background: rgba(255, 255, 255, 0.45);
}

body.ak-brand .wrap.mq-shell.mq-surface .how-celestial-mock {
  border-color: var(--mq-surface-line);
  color: var(--mq-surface-ink-soft);
}

body.ak-brand .wrap.mq-shell.mq-surface .ak-chrome-footer {
  border-top-color: var(--ak-line, rgba(44, 40, 36, 0.1));
}

body.ak-brand .wrap.mq-shell.mq-surface .ak-footer-tagline,
body.ak-brand .wrap.mq-shell.mq-surface .ak-footer-links a,
body.ak-brand .wrap.mq-shell.mq-surface .ak-footer-links span,
body.ak-brand .wrap.mq-shell.mq-surface .ak-footer-bottom {
  color: var(--mq-surface-ink-muted);
}

body.ak-brand .wrap.mq-shell.mq-surface .ak-footer-brand .ak-nav-brand-en {
  color: var(--mq-surface-ink);
}

body.ak-brand .wrap.mq-shell.mq-surface .ak-footer-brand .ak-nav-brand-zh {
  color: var(--mq-surface-ink-muted);
}

body.ak-brand .wrap.mq-shell.mq-surface .ak-footer-links a:hover {
  color: var(--mq-surface-accent);
}