/* 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;
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" on, "cv11" on;
}

body h1,
body h2,
body h3,
body h4 {
  font-family: inherit !important;
  color: var(--fb-text);
  letter-spacing: -0.02em;
  text-wrap: balance;
  overflow-wrap: break-word;
}
body h1 {
  font-size: clamp(2rem, 1.3rem + 3.4vw, 4rem) !important;
  font-weight: 700 !important;
  line-height: 1.06 !important;
}
body h2 {
  font-size: clamp(1.55rem, 1.2rem + 1.9vw, 2.6rem) !important;
  font-weight: 700 !important;
  line-height: 1.12 !important;
}
body h3,
body h4 {
  font-weight: 600 !important;
  line-height: 1.25 !important;
}
body p,
body li,
body label {
  letter-spacing: -0.005em;
  text-wrap: pretty;
}
.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;
}
.jq-hero h1, .jq-hero h2, .jq-hero h3, .jq-hero h4,
.jq-hero p, .jq-hero span, .jq-hero a,
.jq-hero .text-slate-200, .jq-hero .text-slate-300,
.jq-hero .text-slate-400, .jq-hero .text-slate-500 {
  color: #ffffff !important;
}
.jq-hero .jq-chip,
.jq-hero .jq-chip span {
  color: #0f172a !important;
}
.jq-hero .jq-btn-light,
.jq-hero .jq-btn-light span,
.jq-hero .jq-btn-light i {
  color: #0f172a !important;
}
/* Hero статей блога: тёмная секция bg-slate-950 — заголовок и подзаголовок белые */
section.bg-slate-950 h1,
section.bg-slate-950 h2,
section.bg-slate-950 h3,
section.bg-slate-950 h4,
section.bg-slate-950 p {
  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;
}
.jq-btn-light.in-cart,
.jq-btn-light.in-cart:hover {
  background: #ecfdf5 !important;
  border-color: #059669 !important;
  color: #047857 !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: linear-gradient(135deg, #0f172a 0%, #1e293b 60%, #334155 100%) !important;
  color: #ffffff !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 h3,
.jq-hero p { color: #ffffff !important; }
.jq-hero .jq-blob { opacity: .35 !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;
}

/* Полностью кликабельные карточки */
/* Паттерн 1: stretched-link — заголовок-ссылка растягивается на всю карточку */
.jq-clickable { position: relative; }
.jq-clickable .stretched-link::after {
  content: ''; position: absolute; inset: 0; z-index: 1; border-radius: inherit;
}
.jq-clickable .stretched-link { color: inherit; text-decoration: none; }
.jq-clickable .stretched-link:hover h3 {
  text-decoration: underline;
  text-decoration-thickness: 3px;
  text-decoration-color: var(--jq-coral, #ff5b2e);
  text-underline-offset: 4px;
}
/* Кнопки/ссылки внутри карточки кликабельны поверх растянутой ссылки */
.jq-clickable .jq-btn,
.jq-clickable .btn { position: relative; z-index: 2; }
/* Паттерн 2: overlay-ссылка, invisibly покрывающая карточку (каталожные карточки) */
a.jq-card-overlay {
  position: absolute; inset: 0; z-index: 1; border-radius: inherit;
  color: inherit; text-decoration: none;
}

@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-btn {
    white-space: normal !important;
    text-align: center;
    max-width: calc(100vw - 3rem);
    padding-left: 1.1rem;
    padding-right: 1.1rem;
    font-size: .85rem !important;
  }
  .jq-btn > span,
  .jq-btn > i {
    flex-shrink: 0;
  }
  .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 (max-width: 639px) {
  .jq-btn {
    margin-left: auto;
    margin-right: auto;
  }
}

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