/* FirmBaza visual system: Apple-inspired restraint without changing page behavior. */
:root {
  --fb-surface: #ffffff;
  --fb-surface-muted: #f5f5f7;
  --fb-text: #1d1d1f;
  --fb-text-secondary: #6e6e73;
  --fb-line: #d2d2d7;
  --fb-accent: #059669;
  --fb-accent-dark: #047857;
  --fb-radius: 18px;
  --fb-shadow: 0 8px 30px rgb(0 0 0 / 0.07);
}

html { background: var(--fb-surface-muted); }
body {
  color: var(--fb-text);
  background: var(--fb-surface-muted);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
  font-weight: 400;
  letter-spacing: -0.01em;
}

body h1,
body h2,
body h3,
body h4 {
  font-family: inherit !important;
  color: var(--fb-text);
  letter-spacing: -0.025em;
}
body h1 {
  font-size: clamp(2.25rem, 5vw, 4rem) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
}
body h2 {
  font-size: clamp(1.8rem, 3.5vw, 2.75rem) !important;
  font-weight: 700 !important;
  line-height: 1.12 !important;
}
body h3,
body h4 {
  font-weight: 600 !important;
  line-height: 1.2 !important;
}
body p,
body li,
body label {
  letter-spacing: -0.005em;
}
.hero-bg h1,
.hero-bg h2,
.hero-bg h3,
.hero-bg h4,
.hero-bg p,
.jq-hero h1.text-white,
.jq-hero h2.text-white,
.jq-hero h3.text-white,
.jq-hero p.text-white {
  color: #ffffff !important;
}

header {
  background: rgb(255 255 255 / 0.92) !important;
  border-bottom: 1px solid var(--fb-line) !important;
  -webkit-backdrop-filter: saturate(180%) blur(16px);
  backdrop-filter: saturate(180%) blur(16px);
}

main > section:not(.hero-bg):not(.jq-hero) { border-color: var(--fb-line); }

.jq-card,
.product-card,
.catalog-card,
.card {
  border: 1px solid var(--fb-line) !important;
  border-radius: var(--fb-radius) !important;
  box-shadow: var(--fb-shadow) !important;
  transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}
.jq-card:hover,
.product-card:hover,
.catalog-card:hover,
.card:hover {
  border-color: #a7a7ad !important;
  box-shadow: 0 14px 36px rgb(0 0 0 / 0.11) !important;
  transform: translateY(-3px);
}

/* Keep bundle offers readable when the global light theme meets a dark card. */
a.jq-card[style*="background:#0f172a"] h1,
a.jq-card[style*="background:#0f172a"] h2,
a.jq-card[style*="background:#0f172a"] h3,
a.jq-card[style*="background:#0f172a"] h4,
a.jq-card[style*="background:#0f172a"] p,
a.jq-card[style*="background:#0f172a"] .text-slate-400,
a.jq-card[style*="background:#0f172a"] .text-slate-500,
a.jq-card[style*="background:#0f172a"] .text-slate-300 {
  color: #ffffff !important;
}
a.jq-card[style*="background:#0f172a"] .badge {
  color: #0f172a !important;
}
section[style*="background:#0f172a"] h1,
section[style*="background:#0f172a"] h2,
section[style*="background:#0f172a"] h3,
section[style*="background:#0f172a"] h4,
section[style*="background:#0f172a"] p,
section[style*="background:#0f172a"] .text-slate-300,
section[style*="background:#0f172a"] .text-slate-400,
section[style*="background:#0f172a"] .text-slate-500 {
  color: #ffffff !important;
}
section.bg-slate-900 h1,
section.bg-slate-900 h2,
section.bg-slate-900 h3,
section.bg-slate-900 h4,
section.bg-slate-900 p,
section.bg-slate-900 .text-slate-200,
section.bg-slate-900 .text-slate-300,
section.bg-slate-900 .text-slate-400,
section.bg-slate-900 .text-slate-500 {
  color: #ffffff !important;
}
a.jq-hero .jq-btn[style*="background:transparent"][href*="marketplaces-bundle"] {
  background: var(--fb-text) !important;
  border-color: var(--fb-text) !important;
  color: #ffffff !important;
}
a.jq-hero .jq-btn[style*="background:transparent"][href*="marketplaces-bundle"] span {
  color: #ffffff !important;
}

.jq-btn,
.btn {
  border-radius: 999px !important;
  font-family: inherit !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  text-transform: none !important;
  box-shadow: 0 3px 10px rgb(0 0 0 / 0.08) !important;
  transition: transform 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.jq-btn:hover,
.btn:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgb(0 0 0 / 0.12) !important;
}
.jq-btn-primary,
.btn-primary {
  background: var(--fb-accent) !important;
}
.jq-btn-primary:hover,
.btn-primary:hover:not(:disabled) {
  background: var(--fb-accent-dark) !important;
}
.jq-btn-light,
.btn-secondary {
  background: var(--fb-surface) !important;
  border-color: var(--fb-line) !important;
  color: var(--fb-text) !important;
}
.jq-btn-light:hover,
.btn-secondary:hover:not(:disabled) {
  background: var(--fb-surface-muted) !important;
  border-color: #a7a7ad !important;
}

input,
textarea,
select,
.input {
  font-family: inherit !important;
  font-size: 1rem !important;
  letter-spacing: -0.01em;
  border-color: var(--fb-line) !important;
  border-radius: 12px !important;
  background: var(--fb-surface) !important;
  color: var(--fb-text) !important;
  transition: border-color 180ms ease, box-shadow 180ms ease;
}
input:focus,
textarea:focus,
select:focus,
.input:focus {
  border-color: var(--fb-accent) !important;
  box-shadow: 0 0 0 4px rgb(5 150 105 / 0.12) !important;
  outline: 0;
}

.jq-hero {
  background: var(--fb-surface-muted) !important;
  color: var(--fb-text) !important;
}
.jq-hero .flex a.jq-btn:not(.jq-btn-light),
.jq-hero .flex button.jq-btn:not(.jq-btn-light) {
  background: var(--fb-text) !important;
  border-color: var(--fb-text) !important;
  color: #ffffff !important;
}
.jq-hero .flex a.jq-btn:not(.jq-btn-light):hover,
.jq-hero .flex button.jq-btn:not(.jq-btn-light):hover {
  background: var(--fb-accent) !important;
  border-color: var(--fb-accent) !important;
}
.jq-hero h1,
.jq-hero h2,
.jq-hero p { color: inherit; }
.jq-hero .jq-blob { opacity: .08 !important; }
.hero-bg {
  background: linear-gradient(180deg, #1d1d1f 0%, #303033 100%) !important;
}

.jq-marker,
.jq-marker-coral,
.jq-marker-violet {
  background: transparent !important;
  color: inherit !important;
  padding: 0 !important;
  box-decoration-break: initial;
  -webkit-box-decoration-break: initial;
  border-bottom: 3px solid var(--fb-accent);
}

.breadcrumb-nav,
nav[aria-label="Хлебные крошки"] {
  background: var(--fb-surface-muted) !important;
  border-color: var(--fb-line) !important;
}

a { text-underline-offset: 3px; }
a:focus-visible,
button:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--fb-accent) !important;
  outline-offset: 3px;
}

@media (max-width: 767px) {
  body { overflow-x: hidden; }
  body h1 {
    font-size: clamp(2rem, 10vw, 2.75rem) !important;
  }
  body h2 {
    font-size: clamp(1.7rem, 8vw, 2.25rem) !important;
  }
  .jq-btn,
  .btn { min-height: 44px; }
  .jq-hero { padding-top: 4.5rem !important; padding-bottom: 4.5rem !important; }
  .jq-hero .jq-blob { display: none; }
  main > section:not(.hero-bg):not(.jq-hero) { padding-top: 4rem; padding-bottom: 4rem; }
  .jq-card:hover,
  .product-card:hover,
  .catalog-card:hover,
  .card:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}
