/*
 * DekhoBiz UI System v1.3.12
 * Presentation-only design layer.
 * Mobile-first, SEO-safe: no content hiding, semantic markup changes, or route behavior.
 */

:root {
  /* Typography */
  --db-font-heading: "Poppins", "Hind", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --db-font-body: "Hind", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --db-font: var(--db-font-body);

  /* Neutral hierarchy */
  --db-text-strong: #182033;
  --db-text: #344054;
  --db-text-muted: #667085;
  --db-text-faint: #8a94a6;
  --db-surface: #ffffff;
  --db-surface-soft: #f8f9fb;
  --db-surface-subtle: #f3f5f8;
  --db-line: #e4e7ec;
  --db-line-strong: #d0d5dd;

  /* Brand */
  --db-brand: #d71920;
  --db-brand-hover: #b9151b;
  --db-brand-soft: #fff1f2;
  --db-accent: var(--db-brand);
  --db-deep: var(--db-text-strong);
  --db-ink: var(--db-text);
  --db-muted: var(--db-text-muted);

  /* Shape / elevation */
  --db-radius-xs: 6px;
  --db-radius-sm: 9px;
  --db-radius: 12px;
  --db-radius-lg: 16px;
  --db-radius-xl: 20px;
  --db-shadow-xs: 0 1px 2px rgba(16, 24, 40, 0.04);
  --db-shadow-sm: 0 4px 14px rgba(16, 24, 40, 0.055);
  --db-shadow: 0 8px 24px rgba(16, 24, 40, 0.065);

  /* Spacing */
  --db-space-1: 4px;
  --db-space-2: 8px;
  --db-space-3: 12px;
  --db-space-4: 16px;
  --db-space-5: 20px;
  --db-space-6: 24px;
  --db-space-8: 32px;
  --db-space-10: 40px;
  --db-space-12: 48px;
  --db-space-16: 64px;
  --db-space-20: 80px;

  --db-container: 1240px;
}

/* -------------------------------------------------------------------------
   1. Global typography and readable rhythm
   ------------------------------------------------------------------------- */

html {
  font-family: var(--db-font-body);
}

body,
button,
input,
select,
textarea,
optgroup {
  font-family: var(--db-font-body);
}

body {
  color: var(--db-text);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6,
.db-page-title,
.db-section-title,
.db-dashboard-head h1,
.db-dashboard-section-head h2,
.db-business-detail-heading h1,
.db-profile-intro h1,
.db-auth-form-wrap h1,
.db-form-intro h1 {
  font-family: var(--db-font-heading);
  color: var(--db-text-strong);
  font-weight: 600;
  letter-spacing: -0.025em;
  text-wrap: balance;
}

h1,
.db-page-title,
.db-business-detail-heading h1,
.db-profile-intro h1,
.db-auth-form-wrap h1,
.db-form-intro h1 {
  font-weight: 700;
  line-height: 1.12;
}

h2 {
  line-height: 1.18;
}

h3,
h4,
h5,
h6 {
  line-height: 1.28;
}

p,
li,
dd,
dt,
label,
input,
select,
textarea,
button,
small {
  font-family: var(--db-font-body);
}

p {
  color: var(--db-text-muted);
}

strong,
b {
  font-weight: 600;
}

small,
.db-help-text,
.db-field-help,
.db-card-meta,
.db-business-meta,
.db-listing-source-note {
  color: var(--db-text-muted);
  font-weight: 400;
  line-height: 1.45;
}

/* Use Poppins only for actual title-like UI, not every bold label. */
.db-business-card h2,
.db-business-card h3,
.db-business-card__title,
.db-card-title,
.db-home-link-card__text strong,
.db-category-card strong,
.db-area-card strong,
.db-deal-card h2,
.db-deal-card h3,
.db-blog-card h2,
.db-blog-card h3,
.db-related-business-card h3,
.db-dashboard-stat-card strong,
.db-dashboard-listing__business strong,
.db-builder-card__body strong {
  font-family: var(--db-font-heading);
  font-weight: 600;
  letter-spacing: -0.015em;
}

/* -------------------------------------------------------------------------
   2. Container, sections and hierarchy
   ------------------------------------------------------------------------- */

.db-container {
  width: min(100% - 32px, var(--db-container));
  margin-inline: auto;
}

.db-section,
.db-home-section {
  position: relative;
}

.db-home-section,
.db-section {
  padding-block: 48px;
}

.db-home-section.is-alt,
.db-section.is-alt {
  background: var(--db-surface-soft);
}

.db-section-head,
.db-home-section__head,
.db-center-head {
  margin-bottom: 24px;
}

.db-section-head h2,
.db-home-section__head h2,
.db-center-head h2 {
  font-size: clamp(1.55rem, 4.8vw, 2rem);
  font-weight: 600;
  color: var(--db-text-strong);
}

.db-section-head p,
.db-home-section__head p,
.db-center-head p {
  margin-top: 8px;
  color: var(--db-text-muted);
  font-size: 16px;
  line-height: 1.55;
  max-width: 720px;
}

.db-eyebrow,
.db-home-eyebrow,
.db-kicker {
  font-family: var(--db-font-body);
  color: var(--db-brand);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.db-eyebrow::before,
.db-home-eyebrow::before {
  width: 22px;
  height: 2px;
}

.db-section-head > a,
.db-home-section__head > a,
.db-center-link {
  font-family: var(--db-font-body);
  font-size: 14px;
  font-weight: 500;
  border-radius: var(--db-radius-sm);
  box-shadow: none;
}

/* -------------------------------------------------------------------------
   3. Header / navigation / footer
   ------------------------------------------------------------------------- */

.db-site-header {
  background: rgba(255, 255, 255, 0.96);
  border-bottom: 1px solid rgba(228, 231, 236, 0.9);
  box-shadow: 0 1px 0 rgba(16, 24, 40, 0.02);
}

.db-logo strong {
  font-family: var(--db-font-heading);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.db-logo em,
.db-logo small {
  font-family: var(--db-font-body);
  font-weight: 400;
}

.db-main-nav a,
.db-main-nav .nav-link,
.db-header-actions a,
.db-header-actions button {
  font-family: var(--db-font-body);
  font-size: 15px;
  font-weight: 500;
}

.db-site-footer,
.db-footer {
  font-family: var(--db-font-body);
}

.db-footer h2,
.db-footer h3,
.db-footer h4,
.db-site-footer h2,
.db-site-footer h3,
.db-site-footer h4,
.db-footer-brand strong {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-footer a,
.db-site-footer a,
.db-footer li,
.db-footer p {
  font-weight: 400;
}

/* -------------------------------------------------------------------------
   4. Buttons, fields and controls
   ------------------------------------------------------------------------- */

.db-btn,
.db-bootstrap-theme .btn,
.db-site-main button:not(.db-menu-toggle):not(.db-modal-close):not(.db-builder-modal__close),
.db-site-main input[type="submit"] {
  font-family: var(--db-font-body);
  font-weight: 600;
  letter-spacing: 0;
}

.db-btn,
.db-bootstrap-theme .btn {
  min-height: 42px;
  padding: 10px 16px;
  border-radius: 10px;
  box-shadow: none;
}

.db-btn-primary,
.db-bootstrap-theme .btn-primary {
  box-shadow: 0 3px 9px rgba(215, 25, 32, 0.14);
}

.db-btn-primary:hover,
.db-btn-primary:focus-visible,
.db-bootstrap-theme .btn-primary:hover,
.db-bootstrap-theme .btn-primary:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 5px 12px rgba(215, 25, 32, 0.17);
}

.db-btn-outline,
.db-btn-soft,
.db-bootstrap-theme .btn-outline-secondary {
  border-color: var(--db-line-strong);
  background: #fff;
}

.db-site-main :is(
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="url"],
  input[type="number"],
  input[type="password"],
  input[type="search"],
  input[type="date"],
  input[type="time"],
  select,
  textarea,
  .form-control,
  .form-select
) {
  color: var(--db-text-strong);
  font-family: var(--db-font-body);
  font-size: 16px;
  font-weight: 400;
  border: 1px solid var(--db-line-strong);
  border-radius: 10px;
  background: #fff;
  box-shadow: none;
}

.db-site-main :is(
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="url"],
  input[type="number"],
  input[type="password"],
  input[type="search"],
  input[type="date"],
  input[type="time"],
  select,
  .form-control,
  .form-select
) {
  min-height: 46px;
}

.db-site-main textarea {
  min-height: 112px;
  line-height: 1.55;
}

.db-site-main :is(input, select, textarea, .form-control, .form-select):focus {
  border-color: rgba(215, 25, 32, 0.52);
  box-shadow: 0 0 0 3px rgba(215, 25, 32, 0.09);
  outline: none;
}

.db-site-main label,
.db-field > label,
.db-admin-field > label {
  color: var(--db-text);
  font-size: 14px;
  font-weight: 500;
}

::placeholder {
  color: #98a2b3;
  opacity: 1;
}

/* -------------------------------------------------------------------------
   5. Card language: restrained borders, subtle elevation
   ------------------------------------------------------------------------- */

.db-site-main :is(
  .db-card,
  .db-content-card,
  .db-sidebar-card,
  .db-profile-card,
  .db-claim-card,
  .db-dashboard-card,
  .db-dashboard-panel,
  .db-dashboard-stat-card,
  .db-dashboard-action-tile,
  .db-dashboard-listing-card,
  .db-business-card,
  .db-category-card,
  .db-area-card,
  .db-deal-card,
  .db-blog-card,
  .db-related-business-card,
  .db-builder-card,
  .db-builder-guidance,
  .db-form-panel,
  .db-referral-card,
  .db-referral-panel__card,
  .db-credit-dashboard,
  .db-ad-scoreboard,
  .db-ad-zone-card,
  .db-campaign-row,
  .db-faq-item,
  .db-home-benefit,
  .db-home-listing-card,
  .db-home-link-card
) {
  border-color: var(--db-line);
  border-radius: var(--db-radius-lg);
  background: var(--db-surface);
  box-shadow: var(--db-shadow-xs);
}

.db-site-main :is(
  .db-business-card,
  .db-category-card,
  .db-area-card,
  .db-deal-card,
  .db-blog-card,
  .db-related-business-card,
  .db-dashboard-action-tile,
  .db-home-benefit,
  .db-home-link-card
):hover {
  border-color: #d8dde6;
  box-shadow: var(--db-shadow-sm);
  transform: translateY(-1px);
}

/* Pills are reserved for status, tags and compact metadata only. */
.db-site-main :is(
  .db-badge,
  .db-card-badges span,
  .db-feature-chip,
  .db-dashboard-listing__status,
  .db-admin-badge,
  .db-home-listing-card__badges span
) {
  font-family: var(--db-font-body);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.2;
}

/* -------------------------------------------------------------------------
   6. Homepage polish
   ------------------------------------------------------------------------- */

.db-homepage-v2 {
  color: var(--db-text);
  background: #fff;
}

.db-homepage-v2 .db-home-hero h1 {
  font-family: var(--db-font-heading);
  font-weight: 700;
  letter-spacing: -0.035em;
}

.db-homepage-v2 .db-home-hero__text {
  font-family: var(--db-font-body);
  font-weight: 400;
  line-height: 1.55;
}

.db-homepage-v2 .db-home-trust strong {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-homepage-v2 .db-home-trust span,
.db-homepage-v2 .db-home-trustline {
  font-family: var(--db-font-body);
  font-weight: 400;
}

.db-homepage-v2 .db-home-link-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}

.db-homepage-v2 .db-home-link-card {
  min-height: 78px;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--db-line);
  border-radius: 14px;
  box-shadow: var(--db-shadow-xs);
}

.db-homepage-v2 .db-home-link-card:hover,
.db-homepage-v2 .db-home-link-card:focus-visible {
  border-color: rgba(215, 25, 32, 0.24);
  box-shadow: var(--db-shadow-sm);
  transform: translateY(-1px);
}

.db-homepage-v2 .db-home-link-card__icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--db-brand-soft);
  color: var(--db-brand);
}

.db-homepage-v2 .db-home-link-card__icon .db-icon,
.db-homepage-v2 .db-home-link-card__icon .db-svg-icon {
  width: 20px;
  height: 20px;
}

.db-homepage-v2 .db-home-link-card__text {
  gap: 2px;
}

.db-homepage-v2 .db-home-link-card__text strong {
  color: var(--db-text-strong);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.db-homepage-v2 .db-home-link-card__text small {
  color: var(--db-text-muted);
  font-size: 13px;
  font-weight: 400;
}

.db-homepage-v2 .db-category-card,
.db-homepage-v2 .db-home-benefit,
.db-homepage-v2 .db-home-state-card {
  border-radius: 14px;
  box-shadow: var(--db-shadow-xs);
}

.db-homepage-v2 .db-category-card strong,
.db-homepage-v2 .db-home-state-card strong,
.db-homepage-v2 .db-home-benefit h3 {
  font-weight: 600;
}

.db-homepage-v2 .db-home-listing-card {
  padding: 14px 16px;
  border-radius: 14px;
  box-shadow: var(--db-shadow-xs);
}

.db-homepage-v2 .db-home-listing-card__content strong {
  font-family: var(--db-font-heading);
  color: var(--db-text-strong);
  font-size: clamp(16px, 2vw, 19px);
  font-weight: 600;
  letter-spacing: -0.015em;
}

.db-homepage-v2 .db-home-listing-card__meta,
.db-homepage-v2 .db-home-listing-card__text {
  font-size: 14px;
  font-weight: 400;
}

.db-homepage-v2 .db-home-listing-card__action {
  min-height: 38px;
  padding: 0 13px;
  border-radius: 9px;
  font-size: 13px;
  font-weight: 600;
}

.db-homepage-v2 .db-home-service-chip {
  min-height: 38px;
  padding: 8px 12px;
  border-radius: 9px;
  font-size: 14px;
  font-weight: 500;
  box-shadow: none;
}

/* -------------------------------------------------------------------------
   7. Directory, listing and business detail pages
   ------------------------------------------------------------------------- */

.db-business-card :is(h2, h3, .db-business-card__title),
.db-related-business-card :is(h2, h3),
.db-profile-intro h1,
.db-business-detail-heading h1 {
  color: var(--db-text-strong);
}

.db-business-card :is(.db-card-meta, .db-card-excerpt, p),
.db-related-business-card :is(.db-card-meta, p),
.db-profile-intro :is(p, .db-profile-address) {
  font-weight: 400;
}

.db-profile-card,
.db-content-card,
.db-sidebar-card {
  padding: clamp(16px, 3vw, 24px);
}

.db-profile-section h2,
.db-content-card h2,
.db-sidebar-card h2,
.db-review-section h2 {
  font-family: var(--db-font-heading);
  font-size: clamp(1.2rem, 3vw, 1.5rem);
  font-weight: 600;
}

.db-service-grid :is(strong, h3),
.db-contact-row strong {
  font-weight: 600;
}

.db-breadcrumb,
.db-breadcrumb a {
  font-family: var(--db-font-body);
  font-size: 13px;
  font-weight: 400;
  color: var(--db-text-muted);
}

/* -------------------------------------------------------------------------
   8. Authentication and forms
   ------------------------------------------------------------------------- */

.db-auth-app__form-side,
.db-auth-form-wrap,
.db-form-panel,
.db-public-form-wrap {
  font-family: var(--db-font-body);
}

.db-auth-form-wrap h1,
.db-form-intro h1 {
  font-size: clamp(1.8rem, 7vw, 2.45rem);
}

.db-auth-form-wrap p,
.db-form-intro p,
.db-auth-helper,
.db-auth-note,
.db-field-help {
  font-weight: 400;
}

.db-auth-tabs button,
.db-signup-step-chip {
  font-family: var(--db-font-body);
  font-weight: 500;
}

.db-public-form :is(label, legend),
.db-dashboard-form :is(label, legend),
.db-builder-form :is(label, legend) {
  font-weight: 500;
}

.db-form-panel,
.db-auth-form-wrap {
  border-radius: var(--db-radius-lg);
}

/* -------------------------------------------------------------------------
   9. Frontend user/business dashboard
   ------------------------------------------------------------------------- */

.db-dashboard-app,
.db-dashboard-page,
.db-owner-dashboard,
.db-account-dashboard-shell-page {
  font-family: var(--db-font-body);
  color: var(--db-text);
}

.db-dashboard-head h1,
.db-dashboard-section-head h2,
.db-builder-hero h1,
.db-builder-hero h2 {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-dashboard-head h1 {
  font-weight: 700;
}

.db-dashboard-head p,
.db-dashboard-helper,
.db-dashboard-shellbar__date,
.db-dashboard-shellbar__eyebrow,
.db-dashboard-sidebar__kicker {
  font-weight: 400;
}

.db-dashboard-tabs a,
.db-dashboard-tab-group__toggle,
.db-dashboard-sidebar a,
.db-dashboard-shellbar__action,
.db-dashboard-profile-menu__name {
  font-family: var(--db-font-body);
  font-weight: 500;
}

.db-dashboard-stat-card,
.db-dashboard-action-tile,
.db-dashboard-panel,
.db-dashboard-listing,
.db-dashboard-request-row,
.db-credit-dashboard,
.db-referral-panel__card {
  border-radius: 14px;
  box-shadow: var(--db-shadow-xs);
}

.db-dashboard-stat-card strong,
.db-credit-balance strong,
.db-referral-panel__stats strong {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-dashboard-stat-card span,
.db-dashboard-stat-card small,
.db-dashboard-listings-toolbar__count,
.db-dashboard-listing__cell,
.db-credit-txn,
.db-campaign-row {
  font-weight: 400;
}

.db-dashboard-listings-tablehead,
.db-dashboard-listing__status,
.db-dashboard-listings-toolbar__filter,
.db-dashboard-listings-toolbar__search {
  font-family: var(--db-font-body);
}

.db-dashboard-listings-tablehead {
  color: var(--db-text-muted);
  font-size: 13px;
  font-weight: 600;
}

.db-dashboard-listing__business strong {
  font-size: 15px;
}

.db-dashboard-listing__status {
  font-size: 12px;
  font-weight: 500;
}

.db-builder-card,
.db-builder-guidance,
.db-builder-modal__panel {
  border-radius: 14px;
  box-shadow: var(--db-shadow-xs);
}

.db-builder-card__body strong,
.db-builder-modal__head h2,
.db-builder-scoreboard strong {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-builder-card__hint,
.db-builder-hint,
.db-builder-guidance p,
.db-repeater-empty {
  font-weight: 400;
}

/* -------------------------------------------------------------------------
   10. Blog / FAQ / deals / utility pages
   ------------------------------------------------------------------------- */

.db-blog-card h2,
.db-blog-card h3,
.db-deal-card h2,
.db-deal-card h3,
.db-faq-item h3,
.db-faq-item summary {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-blog-meta,
.db-deal-meta,
.db-faq-item p {
  font-family: var(--db-font-body);
  font-weight: 400;
}

.db-faq-item summary {
  color: var(--db-text-strong);
}

/* -------------------------------------------------------------------------
   11. Tables and dense data
   ------------------------------------------------------------------------- */

.db-site-main table {
  font-family: var(--db-font-body);
}

.db-site-main table th {
  color: var(--db-text);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
}

.db-site-main table td {
  color: var(--db-text);
  font-size: 14px;
  font-weight: 400;
}

.db-site-main table :is(th, td) {
  border-color: var(--db-line);
}

/* -------------------------------------------------------------------------
   12. Mobile-first responsive rules
   ------------------------------------------------------------------------- */

@media (max-width: 767.98px) {
  body {
    font-size: 16px;
  }

  .db-container {
    width: min(100% - 28px, var(--db-container));
  }

  .db-home-section,
  .db-section {
    padding-block: 42px;
  }

  .db-section-head,
  .db-home-section__head {
    display: grid;
    align-items: start;
    gap: 14px;
    margin-bottom: 20px;
  }

  .db-section-head > a,
  .db-home-section__head > a {
    justify-self: start;
  }

  .db-homepage-v2 .db-home-link-card {
    min-height: 74px;
    padding: 13px 14px;
  }

  .db-homepage-v2 .db-home-link-card__text strong {
    font-size: 15px;
  }

  .db-site-main :is(.db-card, .db-content-card, .db-sidebar-card, .db-profile-card, .db-dashboard-panel, .db-form-panel) {
    border-radius: 12px;
  }

  .db-dashboard-stat-card,
  .db-dashboard-action-tile {
    padding: 14px;
  }

  .db-dashboard-listings,
  .db-credit-history,
  .db-campaign-list {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .db-site-main table {
    min-width: 640px;
  }

  .db-btn,
  .db-bootstrap-theme .btn,
  .db-site-main button,
  .db-site-main input[type="submit"] {
    min-height: 44px;
  }
}

@media (min-width: 640px) {
  .db-homepage-v2 .db-home-link-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }
}

@media (min-width: 768px) {
  .db-container {
    width: min(100% - 48px, var(--db-container));
  }

  .db-home-section,
  .db-section {
    padding-block: 64px;
  }

  .db-section-head h2,
  .db-home-section__head h2,
  .db-center-head h2 {
    font-size: clamp(1.75rem, 3vw, 2.1rem);
  }
}

@media (min-width: 1024px) {
  .db-homepage-v2 .db-home-link-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
  }

  .db-homepage-v2 .db-home-link-card {
    min-height: 80px;
    padding: 15px 16px;
  }

  .db-home-section,
  .db-section {
    padding-block: 72px;
  }
}

@media (min-width: 1440px) {
  .db-container {
    width: min(100% - 64px, var(--db-container));
  }
}

/* -------------------------------------------------------------------------
   13. Reduced motion / accessibility
   ------------------------------------------------------------------------- */

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

@media (forced-colors: active) {
  .db-btn,
  .db-home-link-card,
  .db-business-card,
  .db-dashboard-panel,
  .db-form-panel {
    border: 1px solid CanvasText;
  }
}

/* -------------------------------------------------------------------------
   14. Legacy weight normalization
   Older page styles intentionally used 750-900 in many compact UI labels.
   Normalize those visible surfaces without altering markup/content semantics.
   ------------------------------------------------------------------------- */

.db-page-content h1,
.db-static-page__content h1 {
  font-family: var(--db-font-heading);
  font-weight: 700;
  letter-spacing: -0.025em;
}

.db-page-content h2,
.db-static-page__content h2,
.db-static-page__section h2 {
  font-family: var(--db-font-heading);
  font-weight: 600;
  letter-spacing: -0.02em;
}

.db-page-content h3,
.db-static-page__content h3 {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-static-page__section {
  border-radius: 14px;
  box-shadow: var(--db-shadow-xs);
}

.db-header-profile-menu__avatar,
.db-dashboard-profile-menu__avatar {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-contact-modal__eyebrow,
.db-contact-row span,
.db-location-option small {
  font-weight: 600;
}

.db-contact-modal h2 {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-home-search .db-search-keyword label span,
.db-home-service-chip small {
  font-weight: 500;
}

.db-home-state-card__title {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

/* Blog reading typography: readable, editorial, not over-bold. */
.db-blog-content strong {
  font-weight: 600;
}

.db-blog-content a {
  font-weight: 500;
}

.db-blog-content h2,
.db-blog-content h3,
.db-blog-takeaways h2,
.db-blog-faq h2,
.db-blog-related-posts h2,
.db-blog-sidebar-card h2,
.db-blog-author-box h2,
.db-blog-faq__question {
  font-family: var(--db-font-heading);
  font-weight: 600;
  letter-spacing: -0.015em;
}

.db-blog-sidebar-ad-link,
.db-blog-sidebar-share a,
.db-blog-sidebar-share button,
.db-blog-author-box__eyebrow,
.db-blog-related-card a {
  font-family: var(--db-font-body);
  font-weight: 500;
}

.db-blog-takeaways,
.db-blog-faq,
.db-blog-author-box,
.db-blog-cta,
.db-blog-related-posts,
.db-blog-sidebar-card {
  border-color: var(--db-line);
  border-radius: 14px;
  box-shadow: var(--db-shadow-xs);
}

/* Generated SEO/AEO/GEO route presentation only; content and links remain intact. */
.db-generated-route-page {
  font-family: var(--db-font-body);
  color: var(--db-text);
}

.db-generated-hero h1,
.db-generated-section-head h2,
.db-generated-guide-card h3,
.db-generated-link-group-card h3,
.db-generated-side-card h2,
.db-generated-faq h2 {
  font-family: var(--db-font-heading);
  font-weight: 600;
  letter-spacing: -0.02em;
}

.db-generated-hero h1 {
  font-weight: 700;
}

.db-generated-pill,
.db-generated-selection span,
.db-generated-add-link,
.db-generated-guide-card__eyebrow,
.db-generated-quality-strip span {
  font-family: var(--db-font-body);
  font-weight: 500;
}

.db-generated-selection strong,
.db-generated-quality-strip strong,
.db-generated-guide-card li,
.db-generated-link-list a {
  font-family: var(--db-font-body);
  font-weight: 500;
}

.db-generated-hero__panel,
.db-generated-selection > div,
.db-generated-add-link,
.db-generated-guide-card,
.db-generated-link-group-card,
.db-generated-side-card,
.db-generated-quality-strip {
  border-color: var(--db-line);
  box-shadow: var(--db-shadow-xs);
}

/* Dashboard legacy rules contain !important locks; override only typography. */
body.db-account-builder-shell-page .db-builder-back-link,
.db-builder-shell-back,
body.db-account-builder-shell-page .db-builder-modal__foot .db-btn,
body.db-account-dashboard-shell-page .db-builder-modal__foot .db-btn,
body.db-account-builder-shell-page .db-repeater-row [data-db-form-repeater-remove],
body.db-account-dashboard-shell-page .db-repeater-row [data-db-form-repeater-remove] {
  font-family: var(--db-font-body) !important;
  font-weight: 600 !important;
}

body.db-account-builder-shell-page .db-builder label > span,
body.db-account-builder-shell-page .db-builder label span,
body.db-account-dashboard-shell-page .db-builder label > span,
body.db-account-dashboard-shell-page .db-builder label span,
body.db-account-builder-shell-page .db-hour-day,
body.db-account-dashboard-shell-page .db-hour-day,
body.db-account-dashboard-shell-page .db-leads-summary__item span,
body.page-template-page-dashboard .db-leads-summary__item span,
body.db-account-dashboard-shell-page .db-credit-contact-link,
body.page-template-page-dashboard .db-credit-contact-link {
  font-family: var(--db-font-body) !important;
  font-weight: 500 !important;
}

body.db-account-dashboard-shell-page .db-dashboard-profile-menu__name,
body.page-template-page-dashboard .db-dashboard-profile-menu__name,
.db-dashboard-profile-menu__panel a,
.db-dashboard-request-row span,
.db-dashboard-request-row em {
  font-family: var(--db-font-body);
  font-weight: 500 !important;
}

.db-dashboard-request-list h4,
.db-dashboard-request-row strong {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-dashboard-profile-menu__toggle,
.db-dashboard-profile-menu__panel,
.db-dashboard-request-row {
  border-radius: 12px;
  box-shadow: var(--db-shadow-xs);
}

/* Quick action pages (Add Business / Report Bug): same product typography. */
.db-quick-page,
.db-quick-card,
.db-quick-form,
.db-quick-field,
.db-quick-submit,
.db-quick-alert {
  font-family: var(--db-font-body);
}

.db-quick-card {
  border-color: var(--db-line);
  border-radius: 16px;
  box-shadow: var(--db-shadow);
}

.db-quick-card__title {
  font-family: var(--db-font-heading);
  font-weight: 700;
  color: var(--db-text-strong);
}

.db-quick-field span {
  font-weight: 500;
}

.db-quick-field :is(input, select, textarea) {
  font-family: var(--db-font-body);
  font-size: 16px;
  border-radius: 10px;
}

.db-quick-submit {
  min-height: 44px;
  border-radius: 10px;
  font-family: var(--db-font-body);
  font-size: 15px;
  font-weight: 600;
}

.db-quick-alert {
  border-radius: 10px;
  font-weight: 500;
}

/* Final typography guardrails for legacy components. */
.db-site-main strong,
.db-site-main b {
  font-weight: 600;
}

.db-site-main :is(.db-eyebrow, .db-home-eyebrow, [class*="__eyebrow"]) {
  font-weight: 600;
}

/* Mobile layout safety net: preserve content, prevent squeezed multi-column UI. */
@media (max-width: 767.98px) {
  .db-site-main :is(
    .db-business-grid,
    .db-category-grid,
    .db-area-grid,
    .db-deals-grid,
    .db-benefit-grid,
    .db-dashboard-grid,
    .db-detail-grid,
    .db-form-grid,
    .db-builder-field-grid,
    .db-payment-grid,
    .db-review-submit,
    .db-generated-guide__grid,
    .db-generated-link-group-grid,
    .db-blog-related-grid
  ) {
    grid-template-columns: 1fr !important;
  }

  .db-site-main :is(.db-profile-actions, .db-card-actions, .db-bottom-cta-actions, .db-blog-cta-actions) {
    flex-wrap: wrap;
  }

  .db-site-main :is(.db-profile-actions, .db-bottom-cta-actions) .db-btn {
    min-width: 0;
  }

  .db-generated-selection,
  .db-generated-quality-strip {
    grid-template-columns: 1fr !important;
  }

  .db-generated-selection strong {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }
}

/* ==========================================================================
   15. v1.3.12 Relaxed Product Polish
   Polished · clean · minimalist · readable · relaxed.
   Presentation only: no content, link, heading semantics, SEO or route changes.
   ========================================================================== */

:root {
  --db-text-strong: #161d2b;
  --db-text-title: #2d3645;
  --db-text: #4b5668;
  --db-text-muted: #68758a;
  --db-text-faint: #8d98aa;
  --db-surface: #ffffff;
  --db-surface-soft: #f8fafc;
  --db-surface-subtle: #f4f6f9;
  --db-line: #e5e9f0;
  --db-line-strong: #d8dee8;
  --db-brand: #e21d2b;
  --db-brand-hover: #c91825;
  --db-brand-soft: #fff3f4;
  --db-focus: rgba(226, 29, 43, 0.14);
  --db-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.025);
  --db-shadow-sm: 0 8px 24px rgba(15, 23, 42, 0.055);
  --db-shadow: 0 14px 36px rgba(15, 23, 42, 0.07);
  --db-radius-xs: 6px;
  --db-radius-sm: 8px;
  --db-radius: 10px;
  --db-radius-lg: 14px;
  --db-radius-xl: 18px;
  --db-container: 1280px;

  /* Keep Bootstrap-driven surfaces aligned with the product system. */
  --bs-body-font-family: var(--db-font-body);
  --bs-body-color: var(--db-text);
  --bs-border-color: var(--db-line);
  --bs-border-radius: 10px;
  --bs-border-radius-sm: 8px;
  --bs-border-radius-lg: 14px;
}

html {
  text-rendering: optimizeLegibility;
}

body {
  color: var(--db-text);
  background: #fff;
  line-height: 1.65;
}

/* Major headings can be bold; supporting UI should remain quiet. */
.db-site-main :is(h1, .db-page-title, .db-business-detail-heading h1, .db-profile-intro h1, .db-auth-form-wrap h1, .db-form-intro h1, .db-blog-single-title, .db-generated-hero h1) {
  color: var(--db-text-strong);
  font-family: var(--db-font-heading);
  font-weight: 700;
  letter-spacing: -0.035em;
}

.db-site-main :is(h2, .db-section-title, .db-section-head h2, .db-home-section__head h2, .db-center-head h2, .db-dashboard-section-head h2) {
  color: var(--db-text-strong);
  font-family: var(--db-font-heading);
  font-weight: 700;
  letter-spacing: -0.025em;
}

.db-site-main :is(h3, h4, h5, h6, .db-card-title, .db-business-card h2, .db-business-card h3, .db-business-card__title, .db-related-business-card h3, .db-blog-card h2, .db-blog-card h3, .db-deal-card h2, .db-deal-card h3) {
  color: var(--db-text-title);
  font-family: var(--db-font-heading);
  font-weight: 600;
  letter-spacing: -0.015em;
}

.db-site-main :is(p, .db-card-excerpt, .db-muted-note, .db-help-text, .db-field-help, .db-profile-address, .db-home-hero__text, .db-blog-single-intro) {
  color: var(--db-text-muted);
  font-family: var(--db-font-body);
  font-weight: 400;
}

.db-site-main strong,
.db-site-main b {
  font-weight: 600;
}

/* Eyebrows are navigational cues, not competing headings. */
.db-site-main :is(.db-eyebrow, .db-home-eyebrow, .db-kicker, [class*="__eyebrow"]) {
  color: var(--db-brand);
  font-family: var(--db-font-body);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.11em;
}

/* Keep existing wording/case for SEO-facing content; only normalize visual labels. */
.db-site-main :is(.db-category-card small, .db-area-card small, .db-home-link-card small, .db-card-meta, .db-business-meta) {
  color: var(--db-text-faint);
  font-family: var(--db-font-body);
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none !important;
}

/* --------------------------------------------------------------------------
   Section rhythm
   -------------------------------------------------------------------------- */

.db-home-section,
.db-section {
  padding-block: 56px;
}

.db-home-section.is-alt,
.db-section.is-alt,
.db-section-soft {
  background: var(--db-surface-soft);
}

.db-section-head,
.db-home-section__head,
.db-center-head,
.db-city-section-head {
  margin-bottom: 28px;
}

.db-section-head h2,
.db-home-section__head h2,
.db-center-head h2,
.db-city-section-head h2 {
  margin-top: 8px;
  margin-bottom: 0;
  font-size: clamp(1.75rem, 5vw, 2.2rem) !important;
  line-height: 1.2;
}

.db-section-head p,
.db-home-section__head p,
.db-center-head p,
.db-city-section-head p {
  max-width: 760px;
  margin-top: 10px;
  margin-bottom: 0;
  color: var(--db-text-muted);
  font-size: 16px !important;
  font-weight: 400;
  line-height: 1.65 !important;
}

.db-section-head > a,
.db-home-section__head > a,
.db-center-link {
  min-height: 40px;
  padding: 8px 14px;
  border: 1px solid var(--db-line-strong);
  border-radius: 9px !important;
  background: #fff;
  color: var(--db-brand);
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.2;
  box-shadow: none !important;
  text-decoration: none;
}

.db-section-head > a:hover,
.db-home-section__head > a:hover,
.db-center-link:hover {
  border-color: rgba(226, 29, 43, 0.28);
  background: var(--db-brand-soft);
  color: var(--db-brand-hover);
}

/* --------------------------------------------------------------------------
   Surface language — open, light, minimal
   -------------------------------------------------------------------------- */

.db-site-main :is(
  .db-card,
  .db-content-card,
  .db-sidebar-card,
  .db-profile-card,
  .db-claim-card,
  .db-dashboard-card,
  .db-dashboard-panel,
  .db-dashboard-stat-card,
  .db-dashboard-action-tile,
  .db-dashboard-listing-card,
  .db-business-card,
  .db-category-card,
  .db-area-card,
  .db-deal-card,
  .db-blog-card,
  .db-related-business-card,
  .db-builder-card,
  .db-builder-guidance,
  .db-form-panel,
  .db-referral-card,
  .db-referral-panel__card,
  .db-credit-dashboard,
  .db-ad-scoreboard,
  .db-ad-zone-card,
  .db-campaign-row,
  .db-faq-item,
  .db-home-benefit,
  .db-home-listing-card,
  .db-home-link-card,
  .db-static-page__section,
  .db-generated-hero__panel,
  .db-generated-guide-card,
  .db-generated-link-group-card,
  .db-generated-side-card
) {
  border: 1px solid var(--db-line);
  border-radius: var(--db-radius-lg);
  background: var(--db-surface);
  box-shadow: none;
}

.db-site-main :is(
  .db-business-card,
  .db-category-card,
  .db-area-card,
  .db-deal-card,
  .db-blog-card,
  .db-related-business-card,
  .db-dashboard-action-tile,
  .db-home-benefit,
  .db-home-link-card
) {
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, background-color 160ms ease;
}

.db-site-main :is(
  .db-business-card,
  .db-category-card,
  .db-area-card,
  .db-deal-card,
  .db-blog-card,
  .db-related-business-card,
  .db-dashboard-action-tile,
  .db-home-benefit,
  .db-home-link-card
):hover {
  border-color: #d7dde7;
  box-shadow: var(--db-shadow-sm);
  transform: translateY(-2px);
}

/* --------------------------------------------------------------------------
   Homepage category / local-link cards
   -------------------------------------------------------------------------- */

.db-homepage-v2 .db-category-grid.db-category-grid-large {
  gap: 14px !important;
}

.db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-card {
  min-height: 132px !important;
  padding: 18px 14px !important;
  gap: 8px !important;
  border: 1px solid var(--db-line) !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: none !important;
}

.db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-card:hover,
.db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-card:focus-visible {
  border-color: rgba(226, 29, 43, 0.22) !important;
  background: #fff !important;
  box-shadow: var(--db-shadow-sm) !important;
  transform: translateY(-2px);
}

.db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-icon {
  width: 46px !important;
  height: 46px !important;
  margin-bottom: 4px !important;
  border: 1px solid #fde0e3;
  border-radius: 12px !important;
  background: var(--db-brand-soft);
  color: var(--db-brand);
}

.db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-icon :is(.db-icon, .db-svg-icon) {
  width: 20px !important;
  height: 20px !important;
  font-size: 20px !important;
}

.db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-card strong {
  color: var(--db-text-title) !important;
  font-family: var(--db-font-heading) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.012em !important;
}

.db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-card small {
  color: var(--db-text-faint) !important;
  font-family: var(--db-font-body) !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.db-homepage-v2 .db-home-link-grid {
  gap: 14px;
}

.db-homepage-v2 .db-home-link-card {
  min-height: 82px;
  padding: 15px 16px;
  border: 1px solid var(--db-line) !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}

.db-homepage-v2 .db-home-link-card__icon {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border: 1px solid #fde0e3;
  border-radius: 11px;
  background: var(--db-brand-soft);
}

.db-homepage-v2 .db-home-link-card__text strong {
  color: var(--db-text-title);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
}

.db-homepage-v2 .db-home-link-card__text small {
  margin-top: 2px;
  color: var(--db-text-faint);
  font-size: 13px;
  font-weight: 400;
}

/* City, area and simple navigation cards should share the same restraint. */
.db-site-main :is(.db-home-city-card, .db-area-card) {
  border: 1px solid var(--db-line) !important;
  border-radius: 13px !important;
  background: #fff !important;
  box-shadow: none !important;
}

.db-site-main :is(.db-home-city-card, .db-area-card) strong {
  color: var(--db-text-title);
  font-family: var(--db-font-heading);
  font-weight: 600 !important;
}

.db-site-main :is(.db-home-city-card, .db-area-card) small {
  color: var(--db-text-faint);
  font-weight: 400 !important;
  text-transform: none !important;
}

/* --------------------------------------------------------------------------
   Business, offer and editorial cards
   -------------------------------------------------------------------------- */

.db-site-main :is(.db-business-card, .db-related-business-card, .db-deal-card, .db-blog-card, .db-home-listing-card) {
  overflow: hidden;
  border-radius: 14px !important;
  box-shadow: none !important;
}

.db-site-main :is(.db-business-body, .db-blog-card__body, .db-deal-card__body, .db-related-business-card__body) {
  padding: clamp(16px, 2.2vw, 20px);
}

.db-site-main :is(.db-business-body h2, .db-business-body h3, .db-blog-card h2, .db-blog-card h3, .db-deal-card h2, .db-deal-card h3, .db-related-business-card strong) {
  color: var(--db-text-title) !important;
  font-family: var(--db-font-heading) !important;
  font-weight: 600 !important;
  line-height: 1.35;
}

.db-site-main :is(.db-meta, .db-rating, .db-card-excerpt, .db-blog-meta, .db-deal-meta, .db-related-business-card__main span, .db-related-business-card__main em) {
  color: var(--db-text-muted);
  font-family: var(--db-font-body);
  font-weight: 400;
  line-height: 1.55;
}

.db-site-main :is(.db-card-actions, .db-deal-actions, .db-profile-actions, .db-related-business-card__actions) {
  gap: 8px;
}

/* --------------------------------------------------------------------------
   Buttons, links, fields and focus states
   -------------------------------------------------------------------------- */

.db-btn,
.db-bootstrap-theme .btn,
.db-site-main button:not(.db-menu-toggle):not(.db-modal-close):not(.db-builder-modal__close),
.db-site-main input[type="submit"] {
  min-height: 42px;
  padding: 9px 15px;
  border-radius: 9px !important;
  font-family: var(--db-font-body);
  font-size: 15px;
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: 0;
  box-shadow: none;
}

.db-btn-primary,
.db-bootstrap-theme .btn-primary {
  border-color: var(--db-brand);
  background: var(--db-brand);
  box-shadow: none !important;
}

.db-btn-primary:hover,
.db-btn-primary:focus-visible,
.db-bootstrap-theme .btn-primary:hover,
.db-bootstrap-theme .btn-primary:focus-visible {
  border-color: var(--db-brand-hover);
  background: var(--db-brand-hover);
  box-shadow: 0 6px 16px rgba(226, 29, 43, 0.16) !important;
  transform: translateY(-1px);
}

.db-btn-outline,
.db-btn-soft,
.db-bootstrap-theme .btn-outline-secondary {
  border-color: var(--db-line-strong);
  background: #fff;
  color: var(--db-text-title);
}

.db-site-main :is(
  input[type="text"], input[type="email"], input[type="tel"], input[type="url"],
  input[type="number"], input[type="password"], input[type="search"], input[type="date"],
  input[type="time"], select, textarea, .form-control, .form-select
) {
  border-color: var(--db-line-strong);
  border-radius: 9px !important;
  color: var(--db-text-title);
  background: #fff;
  box-shadow: none !important;
}

.db-site-main :is(input, select, textarea, .form-control, .form-select):focus {
  border-color: rgba(226, 29, 43, 0.48);
  box-shadow: 0 0 0 3px var(--db-focus) !important;
}

.db-site-main label,
.db-field > label,
.db-admin-field > label,
.db-public-form :is(label, legend),
.db-dashboard-form :is(label, legend),
.db-builder-form :is(label, legend) {
  color: var(--db-text-title);
  font-family: var(--db-font-body);
  font-size: 14px;
  font-weight: 500 !important;
}

.db-site-main :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid rgba(226, 29, 43, 0.52);
  outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   Header and footer
   -------------------------------------------------------------------------- */

.db-site-header {
  border-bottom: 1px solid var(--db-line);
  background: rgba(255, 255, 255, 0.97);
  box-shadow: none;
  backdrop-filter: saturate(140%) blur(10px);
}

.db-main-nav :is(a, .nav-link),
.db-header-actions :is(a, button),
.db-mobile-account-link {
  color: var(--db-text-title);
  font-family: var(--db-font-body);
  font-size: 15px;
  font-weight: 500;
}

.db-main-nav :is(a, .nav-link):hover,
.db-header-actions a:hover {
  color: var(--db-brand);
}

.db-site-footer,
.db-footer {
  font-family: var(--db-font-body);
}

.db-site-footer :is(p, li, a),
.db-footer :is(p, li, a) {
  font-weight: 400;
  line-height: 1.65;
}

.db-site-footer :is(h2, h3, h4),
.db-footer :is(h2, h3, h4) {
  font-family: var(--db-font-heading);
  font-weight: 600;
  letter-spacing: -0.015em;
}

/* --------------------------------------------------------------------------
   Detail pages and sidebars
   -------------------------------------------------------------------------- */

.db-inner-hero,
.db-tax-hero,
.db-blog-hero {
  background-color: var(--db-surface-soft);
}

.db-inner-hero h1,
.db-tax-hero h1,
.db-blog-hero h1 {
  color: var(--db-text-strong);
  font-family: var(--db-font-heading);
  font-weight: 700;
}

.db-profile-card,
.db-content-card,
.db-sidebar-card,
.db-claim-card {
  padding: clamp(18px, 2.6vw, 26px);
  border-radius: 14px !important;
  box-shadow: none !important;
}

.db-profile-section h2,
.db-content-card h2,
.db-sidebar-card h2,
.db-review-section h2 {
  color: var(--db-text-strong);
  font-family: var(--db-font-heading);
  font-size: clamp(1.18rem, 3vw, 1.5rem);
  font-weight: 600;
}

.db-breadcrumb,
.db-breadcrumb a,
.db-blog-breadcrumb,
.db-blog-breadcrumb a {
  color: var(--db-text-faint);
  font-size: 13px;
  font-weight: 400;
}

/* --------------------------------------------------------------------------
   Auth, listing forms and workspace UI
   -------------------------------------------------------------------------- */

.db-auth-form-wrap,
.db-form-panel,
.db-public-form-wrap,
.db-builder-card,
.db-builder-guidance,
.db-builder-modal__panel {
  border-radius: 14px !important;
  box-shadow: none !important;
}

.db-auth-form-wrap h1,
.db-form-intro h1 {
  font-size: clamp(1.85rem, 7vw, 2.55rem);
  line-height: 1.18;
}

.db-auth-form-wrap :is(p, .db-auth-helper, .db-auth-note),
.db-form-intro p,
.db-builder-card__hint,
.db-builder-hint,
.db-builder-guidance p {
  color: var(--db-text-muted);
  font-weight: 400;
  line-height: 1.6;
}

.db-auth-tabs button,
.db-signup-step-chip,
.db-builder label span {
  font-family: var(--db-font-body) !important;
  font-weight: 500 !important;
}

/* --------------------------------------------------------------------------
   Frontend dashboard — quiet data surfaces, clear hierarchy
   -------------------------------------------------------------------------- */

.db-dashboard-panel,
.db-dashboard-card,
.db-dashboard-stat-card,
.db-dashboard-action-tile,
.db-dashboard-listing-card,
.db-credit-dashboard,
.db-referral-panel__card,
.db-ad-scoreboard,
.db-campaign-row {
  border: 1px solid var(--db-line) !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}

.db-dashboard-head h1,
.db-dashboard-section-head h2 {
  color: var(--db-text-strong);
}

.db-dashboard-stat-card strong,
.db-credit-balance strong,
.db-referral-panel__stats strong {
  color: var(--db-text-title);
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-dashboard-stat-card :is(span, small),
.db-dashboard-listings-toolbar__count,
.db-dashboard-listing__cell,
.db-credit-txn,
.db-campaign-row {
  color: var(--db-text-muted);
  font-family: var(--db-font-body);
  font-weight: 400;
}

.db-dashboard-listings-tablehead,
.db-site-main table th {
  color: var(--db-text-muted);
  font-family: var(--db-font-body);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

.db-site-main table td {
  color: var(--db-text);
  font-family: var(--db-font-body);
  font-size: 14px;
  font-weight: 400;
}

/* --------------------------------------------------------------------------
   Badges, notices, pagination and small utility UI
   -------------------------------------------------------------------------- */

.db-site-main :is(.db-badge, .db-card-badges span, .db-feature-chip, .db-dashboard-listing__status, .db-home-listing-card__badges span) {
  border-radius: 7px;
  font-family: var(--db-font-body);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

.db-notice,
.db-empty-state,
.db-placeholder-box {
  border-radius: 12px;
  box-shadow: none;
}

.db-pagination :is(a, span) {
  min-width: 38px;
  min-height: 38px;
  border-radius: 8px;
  font-family: var(--db-font-body);
  font-size: 14px;
  font-weight: 500;
}

/* --------------------------------------------------------------------------
   Blog, static pages and generated SEO routes — visual only
   -------------------------------------------------------------------------- */

.db-blog-content {
  color: var(--db-text);
  font-family: var(--db-font-body);
  font-size: 17px;
  line-height: 1.75;
}

.db-blog-content :is(p, li) {
  color: var(--db-text);
}

.db-blog-content :is(h2, h3),
.db-static-page__content :is(h2, h3),
.db-generated-section-head h2,
.db-generated-guide-card h3,
.db-generated-link-group-card h3,
.db-generated-side-card h2,
.db-generated-faq h2 {
  font-family: var(--db-font-heading);
  font-weight: 600;
}

.db-blog-takeaways,
.db-blog-faq,
.db-blog-author-box,
.db-blog-cta,
.db-blog-related-posts,
.db-blog-sidebar-card,
.db-generated-hero__panel,
.db-generated-selection > div,
.db-generated-add-link,
.db-generated-guide-card,
.db-generated-link-group-card,
.db-generated-side-card,
.db-generated-quality-strip {
  border-color: var(--db-line) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Responsive composition — design mobile intentionally, don't shrink desktop
   -------------------------------------------------------------------------- */

@media (max-width: 767.98px) {
  .db-container {
    width: min(100% - 32px, var(--db-container));
  }

  .db-home-section,
  .db-section {
    padding-block: 46px;
  }

  .db-section-head,
  .db-home-section__head,
  .db-center-head,
  .db-city-section-head {
    display: grid;
    align-items: start;
    gap: 12px;
    margin-bottom: 22px;
  }

  .db-section-head h2,
  .db-home-section__head h2,
  .db-center-head h2,
  .db-city-section-head h2 {
    font-size: clamp(1.6rem, 7vw, 1.9rem) !important;
    line-height: 1.22;
  }

  .db-section-head p,
  .db-home-section__head p,
  .db-center-head p,
  .db-city-section-head p {
    font-size: 15.5px !important;
    line-height: 1.6 !important;
  }

  .db-section-head > a,
  .db-home-section__head > a,
  .db-center-link {
    justify-self: start;
  }

  /* Cards remain compact but touch-friendly. */
  .db-homepage-v2 .db-category-grid.db-category-grid-large {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  .db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-card {
    min-height: 118px !important;
    padding: 15px 10px !important;
    gap: 6px !important;
  }

  .db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-icon {
    width: 40px !important;
    height: 40px !important;
    border-radius: 11px !important;
  }

  .db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-card strong {
    font-size: 14px !important;
    line-height: 1.32 !important;
  }

  .db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-card small {
    font-size: 12px !important;
  }

  /* Do not collapse simple card grids to one column when two cards fit well. */
  .db-site-main .db-category-grid,
  .db-site-main .db-area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* Content-heavy lists remain one column. */
  .db-site-main :is(
    .db-business-grid,
    .db-deals-grid,
    .db-benefit-grid,
    .db-detail-grid,
    .db-form-grid,
    .db-builder-field-grid,
    .db-payment-grid,
    .db-review-submit,
    .db-generated-guide__grid,
    .db-generated-link-group-grid,
    .db-blog-related-grid
  ) {
    grid-template-columns: 1fr !important;
  }

  .db-btn,
  .db-bootstrap-theme .btn,
  .db-site-main button,
  .db-site-main input[type="submit"] {
    min-height: 44px;
  }

  .db-profile-card,
  .db-content-card,
  .db-sidebar-card,
  .db-form-panel,
  .db-dashboard-panel {
    padding: 16px;
  }
}

@media (max-width: 379.98px) {
  .db-container {
    width: min(100% - 24px, var(--db-container));
  }

  .db-homepage-v2 .db-category-grid.db-category-grid-large,
  .db-site-main .db-category-grid,
  .db-site-main .db-area-grid {
    grid-template-columns: 1fr !important;
  }

  .db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-card {
    min-height: 96px !important;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 12px !important;
    row-gap: 2px !important;
    align-content: center;
    text-align: left;
  }

  .db-homepage-v2 .db-category-grid.db-category-grid-large .db-category-icon {
    grid-row: 1 / span 2;
    margin: 0 !important;
  }
}

@media (min-width: 768px) {
  .db-container {
    width: min(100% - 48px, var(--db-container));
  }

  .db-home-section,
  .db-section {
    padding-block: 68px;
  }

  .db-section-head,
  .db-home-section__head,
  .db-city-section-head {
    align-items: end;
  }
}

@media (min-width: 1024px) {
  .db-home-section,
  .db-section {
    padding-block: 76px;
  }

  .db-section-head h2,
  .db-home-section__head h2,
  .db-center-head h2,
  .db-city-section-head h2 {
    font-size: clamp(2rem, 2.4vw, 2.35rem) !important;
  }

  .db-section-head p,
  .db-home-section__head p,
  .db-center-head p,
  .db-city-section-head p {
    font-size: 17px !important;
  }
}

@media (hover: none) {
  .db-site-main :is(
    .db-business-card,
    .db-category-card,
    .db-area-card,
    .db-deal-card,
    .db-blog-card,
    .db-related-business-card,
    .db-dashboard-action-tile,
    .db-home-benefit,
    .db-home-link-card
  ):hover {
    transform: none;
    box-shadow: none;
  }
}
