/* Semantic theme palette shared by public pages. The concept website remains a light artwork. */
:root {
  --background: #f8f8f4;
  --surface: #ffffff;
  --surface-secondary: #eaf0f2;
  --foreground: #232d31;
  --muted-foreground: #626a6e;
  --border-color: #dce0da;
  --accent-color: #355d73;
  --accent-hover-color: #24485d;
  --accent-foreground: #ffffff;
  --showcase-surface: #e6e9df;
  --showcase-caption: #555d50;
  --section-surface: #dfe8eb;
  --section-border: #cbd6d9;
  --field-border: #a9b5ba;
  --positive: #38684a;
  --negative: #a13f37;
  color-scheme: light;
}
:root[data-theme="dark"] {
  --background: #1c2225;
  --surface: #252d31;
  --surface-secondary: #29363d;
  --foreground: #edece5;
  --muted-foreground: #b4bfc1;
  --border-color: #414c50;
  --accent-color: #a5c5d3;
  --accent-hover-color: #c0dae5;
  --accent-foreground: #192c36;
  --showcase-surface: #343b34;
  --showcase-caption: #c3cabc;
  --section-surface: #2e3d44;
  --section-border: #475d66;
  --field-border: #657980;
  --positive: #a4c6a8;
  --negative: #f2ada5;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    --background: #1c2225;
    --surface: #252d31;
    --surface-secondary: #29363d;
    --foreground: #edece5;
    --muted-foreground: #b4bfc1;
    --border-color: #414c50;
    --accent-color: #a5c5d3;
    --accent-hover-color: #c0dae5;
    --accent-foreground: #192c36;
    --showcase-surface: #343b34;
    --showcase-caption: #c3cabc;
    --section-surface: #2e3d44;
    --section-border: #475d66;
    --field-border: #657980;
    --positive: #a4c6a8;
    --negative: #f2ada5;
    color-scheme: dark;
  }
}
:root,
body.marketing-subpage,
body.marketing-auth,
body.legal-theme {
  --paper: var(--background);
  --white: var(--surface);
  --ink: var(--foreground);
  --muted: var(--muted-foreground);
  --blue: var(--accent-color);
  --blue-dark: var(--accent-hover-color);
  --blue-tint: var(--surface-secondary);
  --line: var(--border-color);
  --sage: var(--showcase-surface);
  --bg-primary: var(--background);
  --bg-secondary: var(--surface-secondary);
  --bg-tertiary: var(--surface);
  --text-primary: var(--foreground);
  --text-secondary: var(--muted-foreground);
  --text-muted: var(--muted-foreground);
  --text-accent: var(--accent-color);
  --accent: var(--accent-color);
  --accent-hover: var(--accent-hover-color);
  --glass-bg: var(--surface);
  --glass-border: var(--border-color);
  --border: var(--border-color);
  --border-hover: var(--field-border);
  --success: var(--positive);
  --error: var(--negative);
  --gradient: var(--accent-color);
  --accent-glow: transparent;
}
::selection {
  background: var(--accent-color);
  color: var(--accent-foreground);
}
.button,
.button:hover,
.auth-btn,
.auth-btn:hover,
.marketing-subpage .checkout-btn,
.marketing-subpage .duration-tab.active,
.marketing-subpage .toast {
  color: var(--accent-foreground);
}
.showcase-heading,
.showcase figcaption {
  color: var(--showcase-caption);
}
.benefits,
.benefits article,
.benefits article:first-child {
  border-color: var(--section-border);
}
.closing-section {
  background: var(--section-surface);
}
.marketing-subpage .glass-card,
.marketing-subpage select,
.marketing-subpage .client-logo,
.client-wheel-card,
.client-wheel-logo-box,
.form-group input,
.code-digit {
  background: var(--surface);
}
.client-wheel-card,
.form-group input,
.code-digit {
  border-color: var(--field-border);
}
.form-group input::placeholder {
  color: var(--muted-foreground);
}
.marketing-subpage .ts-dropdown .active,
.marketing-subpage .ts-dropdown .active :is(.currency-name, .currency-code) {
  color: var(--accent-foreground) !important;
}
.code-digit:focus {
  box-shadow: none;
}
.auth-card .verification-title {
  font-size: 34px;
  letter-spacing: -1.2px;
  line-height: 1.2;
  margin: 18px 0 12px;
}
.site-icon {
  width: 20px;
  height: 20px;
  display: inline-block;
  vertical-align: middle;
  flex-shrink: 0;
  color: inherit;
  transition: translate 0.18s ease;
  overflow: visible;
}
.icon-down {
  rotate: 90deg;
}
.icon-left {
  rotate: 180deg;
}
a:hover > .site-icon,
a:hover > span > .site-icon {
  translate: 2px 0;
}
.faq-indicator {
  color: var(--muted-foreground);
  transition: transform 0.2s ease;
  flex: none;
}
details[open] .faq-indicator,
.faq-item.active .faq-indicator {
  transform: rotate(180deg);
}
summary .faq-indicator {
  margin-left: auto;
}
.benefit-symbol .site-icon {
  width: 25px;
  height: 25px;
}
.concept-site .site-icon {
  width: 11px;
  height: 11px;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.theme-control {
  display: flex;
  justify-content: flex-end;
  padding: 0 0 20px;
  gap: 8px;
  color: var(--muted-foreground);
  font:
    12px Inter,
    Arial,
    sans-serif;
}
.theme-control select {
  font: inherit;
  color: var(--muted-foreground);
  background: var(--surface);
  border: 1px solid var(--border-color);
  border-radius: 4px;
  min-height: 44px;
  padding: 8px 28px 8px 12px;
  width: auto;
}
.theme-control select:focus-visible {
  outline: 2px solid var(--accent-color);
  outline-offset: 3px;
}
.auth-footer .theme-control {
  padding: 0;
}
.auth-footer {
  flex-wrap: wrap;
}
.legal-theme {
  font-family: Inter, Arial, sans-serif;
}
.legal-theme :is(.bg-noise, .bg-grid, .bg-glow) {
  display: none;
}
.legal-theme .text-gradient {
  background: none;
  color: var(--foreground);
  -webkit-text-fill-color: currentColor;
}
.legal-theme .nav,
.legal-theme .nav-mobile-menu {
  background: var(--background);
  backdrop-filter: none;
}
.legal-theme .glass-card {
  background: var(--surface);
  box-shadow: none;
}
.legal-theme .btn-primary,
.legal-theme .btn-signup {
  color: var(--accent-foreground);
  background: var(--accent-color);
  box-shadow: none;
}
.legal-theme .theme-control {
  padding-inline: 32px;
}
.legal-theme :is(.terms-hero, .privacy-hero)::before {
  display: none;
}
@media (max-width: 600px) {
  .auth-card .verification-title {
    font-size: 30px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .site-icon,
  .faq-indicator {
    transition: none;
  }
  a:hover > .site-icon,
  a:hover > span > .site-icon {
    translate: none;
  }
}
.legal-theme .legal-footer-heading {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--foreground);
  margin-bottom: 20px;
}
.legal-theme :is(.terms-layout, .privacy-layout) > * {
  min-width: 0;
}
.legal-theme :is(.terms-body, .privacy-body) {
  overflow-wrap: anywhere;
}
.legal-theme
  :is(.terms-sidebar, .privacy-sidebar, .terms-section, .privacy-section) {
  background: var(--surface);
  box-shadow: none;
  backdrop-filter: none;
}
.legal-theme :is(.terms-search-input, .privacy-search-input) {
  background: var(--background);
  border-color: var(--field-border);
}
.legal-theme
  :is(
    .terms-hero-badge,
    .privacy-hero-badge,
    .terms-badge-num,
    .privacy-badge-num,
    .terms-toc-link.active,
    .privacy-toc-link.active
  ) {
  background: var(--surface-secondary);
  border-color: var(--border-color);
  color: var(--accent-color);
}
.legal-theme a:focus-visible,
.legal-theme button:focus-visible,
.legal-theme input:focus-visible {
  outline: 2px solid var(--accent-color);
  outline-offset: 3px;
}
