/* Keep every page aligned to the same content width as the homepage. */
:root {
  --container: 1280px !important;
}

/* Keep contact CTA and footer inside narrower desktop viewports. */
@media (min-width: 681px) and (max-width: 1120px) {
  .cta .cta-inner,
  .contacts-hero,
  .contacts-primary-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .cta .cta-inner {
    gap: 32px !important;
  }

  .footer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Keep all service surfaces in one visual family. */
.service-card-family {
  border-radius: 6px !important;
}

.service-card-family::before {
  display: none !important;
}

/* The archive cards show the service scope at a glance, not just a teaser. */
.service-directory-card {
  min-height: 0 !important;
  gap: 10px !important;
  padding: clamp(20px, 2vw, 26px) !important;
  justify-content: flex-start !important;
}

.service-directory-card h2 {
  max-width: 380px !important;
  font-size: clamp(1.42rem, 2vw, 1.78rem) !important;
  line-height: 1.12 !important;
  text-wrap: balance;
}

.service-directory-card-wide h2 {
  grid-column: 1 !important;
}

.service-directory-card-wide > p,
.service-directory-card-wide .service-directory-highlights {
  grid-column: 2 !important;
  max-width: none !important;
}

.service-directory-card-wide .package-link {
  grid-column: 3 !important;
  grid-row: 2 / span 3 !important;
  align-self: end !important;
}

.service-directory-card > p {
  max-width: 430px !important;
  margin: 0 !important;
  font-size: 0.94rem !important;
  line-height: 1.55 !important;
}

.service-directory-highlights {
  display: grid !important;
  gap: 5px !important;
  width: min(100%, 480px) !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.service-directory-highlights li {
  position: relative;
  padding-left: 18px;
  color: var(--text-muted);
  font-size: 0.86rem;
  line-height: 1.35;
}

.service-directory-card-top {
  margin-top: 0 !important;
  margin-bottom: 14px !important;
}

.service-directory-card .package-link {
  padding-top: 10px !important;
}

/* Keep the oversized decorative icon out of the card's content flow. */
.service-directory-card .service-directory-card-logo {
  position: absolute !important;
  z-index: 0 !important;
}

.service-directory-highlights li::before {
  position: absolute;
  top: 0.62em;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--primary);
  content: "";
}

/* Keep the popular cards aligned with the main service-card proportions. */
#popular .service-package-card {
  min-height: 390px !important;
  gap: 14px !important;
  border-radius: 6px !important;
  padding: 22px !important;
  background:
    linear-gradient(145deg, rgba(var(--gold-rgb), 0.075), transparent 48%),
    var(--card-bg) !important;
  background-image: linear-gradient(145deg, rgba(var(--gold-rgb), 0.075), transparent 48%), var(--card-bg) !important;
}

#popular .popular-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

#popular .service-package-card .package-link {
  display: inline-flex !important;
  width: 100% !important;
  min-height: 44px !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: auto !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(var(--gold-rgb), 0.34) !important;
  border-radius: 4px !important;
  background:
    linear-gradient(110deg, rgba(var(--gold-rgb), 0.1), transparent 62%),
    rgba(var(--ink-rgb), 0.16) !important;
  color: var(--primary) !important;
}

#popular .service-package-card .package-link:hover,
#popular .service-package-card .package-link:focus-visible {
  border-color: rgba(var(--gold-rgb), 0.66) !important;
  background:
    linear-gradient(110deg, rgba(var(--gold-rgb), 0.18), transparent 66%),
    rgba(var(--gold-rgb), 0.06) !important;
  color: var(--primary) !important;
}

#popular .service-package-card:hover,
#popular .service-package-card:focus-within {
  background:
    linear-gradient(145deg, rgba(var(--gold-rgb), 0.13), transparent 52%),
    var(--card-bg-hover) !important;
  background-image: linear-gradient(145deg, rgba(var(--gold-rgb), 0.13), transparent 52%), var(--card-bg-hover) !important;
}

#popular .package-heading h3 {
  font-size: clamp(1.2rem, 1.6vw, 1.48rem) !important;
  line-height: 1.18 !important;
}

/* Remove the remaining diagonal corner marks from cards and callouts. */
.area-card::before,
.service-package-card::before,
.reason-item::before,
.service-directory-card::before,
.service-info-card::before,
.service-final-cta::before,
.contacts-panel::before,
.contacts-row::before,
.subscription-plan::before,
.subscription-faq-list details::before,
.list-card::before,
.case-card::before {
  display: none !important;
  content: none !important;
}

/* Keep the service cards compact and consistent across both themes. */
.area-grid {
  align-items: stretch !important;
}

.area-grid > .area-card:not(.area-card-wide) {
  min-height: 320px !important;
  height: 100% !important;
  align-self: stretch !important;
  gap: 14px !important;
  padding: 22px !important;
}

.area-grid > .area-card:not(.area-card-wide) .area-card-link {
  margin-top: 14px !important;
}

.area-grid > .area-card .area-card-logo {
  position: absolute !important;
  z-index: 0 !important;
}

/* Service cards keep their surface clean: no diagonal corner overlays. */
.area-grid > .area-card::before {
  display: none !important;
}

/* Reasons: a clean underline with a small angled finish instead of corner slashes. */
#why-pro-lex,
#reasons {
  scroll-margin-top: 96px;
  content-visibility: visible !important;
  contain: none !important;
}

#reasons .reasons-panel > h2 {
  max-width: 820px;
  font-size: clamp(2rem, 4vw, 3.35rem) !important;
  line-height: 1.08 !important;
}

#reasons .reasons-intro {
  max-width: 760px;
  font-size: 1.02rem;
}

.reasons-panel .reason-grid .reason-item,
.reasons-panel .reason-grid .reason-item:hover,
.reasons-panel .reason-grid .reason-item:focus-within {
  position: relative !important;
  min-height: 0 !important;
  padding: 0 0 clamp(14px, 1.4vw, 20px) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(var(--gold-rgb), 0.34) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}

.reasons-panel .reason-grid .reason-item::before {
  display: none !important;
}

.reasons-panel .reason-grid .reason-item::after {
  position: absolute !important;
  display: block !important;
  inset: auto 0 -2px auto !important;
  z-index: 2 !important;
  width: 22px !important;
  height: 4px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: var(--primary) !important;
  content: "" !important;
  opacity: 1 !important;
  box-shadow: none !important;
  transform: skewX(-42deg) !important;
  transform-origin: right center !important;
  pointer-events: none !important;
  transition: none !important;
}

/* Reasons use a staggered, chessboard-like rhythm on wide screens. */
.reasons-panel .reason-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  column-gap: clamp(48px, 7vw, 104px) !important;
  row-gap: clamp(18px, 2vw, 28px) !important;
  align-items: start !important;
}

.reasons-panel .reason-grid .reason-item {
  margin-top: 0 !important;
}

.reasons-panel .reason-grid .reason-item:nth-child(even) {
  margin-top: clamp(24px, 3.2vw, 42px) !important;
}

.reasons-panel .reason-grid .reason-item div {
  min-width: 0;
}

/* Popular services use quiet, service-specific icon silhouettes instead of a grid. */
#popular .service-package-card,
#popular .service-package-card:hover,
#popular .service-package-card:focus-within {
  background: var(--card-bg) !important;
  background-image: none !important;
}

#popular .service-package-card::before {
  display: none !important;
}

#popular .service-package-card .package-card-logo {
  position: absolute !important;
  right: clamp(18px, 2.4vw, 30px) !important;
  bottom: clamp(72px, 8vw, 112px) !important;
  z-index: 0 !important;
  color: var(--primary) !important;
  font-size: clamp(6.2rem, 10vw, 9.2rem) !important;
  line-height: 1 !important;
  opacity: 0.075 !important;
  pointer-events: none !important;
  transform: rotate(-7deg) !important;
  transition: opacity 260ms ease, transform 360ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}

#popular .service-package-card:hover .package-card-logo,
#popular .service-package-card:focus-within .package-card-logo {
  opacity: 0.12 !important;
  transform: rotate(-4deg) scale(1.035) !important;
}

/* Match the theme override specificity so the old grid layers cannot return. */
html:not([data-theme="light"]) #popular .service-package-card,
html[data-theme="light"] #popular .service-package-card {
  background: var(--card-bg) !important;
  background-image: none !important;
}

html:not([data-theme="light"]) #popular .service-package-card:hover,
html:not([data-theme="light"]) #popular .service-package-card:focus-within,
html[data-theme="light"] #popular .service-package-card:hover,
html[data-theme="light"] #popular .service-package-card:focus-within {
  background: var(--card-bg-hover) !important;
  background-image: none !important;
}

@media (max-width: 980px) {
  #popular .popular-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .service-directory-card {
    min-height: 0 !important;
  }

  .reasons-panel .reason-grid {
    grid-template-columns: 1fr !important;
    row-gap: 22px !important;
  }

  .reasons-panel .reason-grid .reason-item:nth-child(even) {
    margin-top: 0 !important;
  }
}

@media (max-width: 680px) {
  #popular .popular-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Popular cards must use the same graphite/platinum surfaces as #services.
   Keep this final so the older theme-specific card rules cannot reintroduce brown. */
html:not([data-theme="light"]) #popular .service-package-card,
html:not([data-theme="light"]) #popular .service-package-card:hover,
html:not([data-theme="light"]) #popular .service-package-card:focus-within {
  border-color: rgba(var(--gold-rgb), 0.24) !important;
  background-color: var(--graphite-card) !important;
  background-image:
    linear-gradient(145deg, rgba(255, 255, 255, 0.045), transparent 44%),
    linear-gradient(320deg, rgba(255, 255, 255, 0.018), transparent 42%) !important;
}

html:not([data-theme="light"]) #popular .service-package-card:hover,
html:not([data-theme="light"]) #popular .service-package-card:focus-within {
  background-color: var(--graphite-card-hover) !important;
  background-image:
    linear-gradient(145deg, rgba(255, 255, 255, 0.065), transparent 48%) !important;
}

html[data-theme="light"] #popular .service-package-card,
html[data-theme="light"] #popular .service-package-card:hover,
html[data-theme="light"] #popular .service-package-card:focus-within {
  border-color: rgba(216, 204, 187, 0.26) !important;
  background-color: var(--card-bg) !important;
  background-image: none !important;
}

html[data-theme="light"] #popular .service-package-card:hover,
html[data-theme="light"] #popular .service-package-card:focus-within {
  border-color: rgba(var(--gold-rgb), 0.56) !important;
  background-color: var(--card-bg-hover) !important;
  background-image: none !important;
}

/* On service-directory hover, highlight the whole surface without a center gradient. */
html:not([data-theme="light"]) .service-directory-card:hover,
html:not([data-theme="light"]) .service-directory-card:focus-within {
  border-color: rgba(var(--gold-rgb), 0.52) !important;
  background-color: var(--graphite-card-hover) !important;
  background-image: none !important;
  box-shadow:
    0 18px 42px rgba(0, 0, 0, 0.28),
    0 0 0 1px rgba(var(--gold-rgb), 0.12) !important;
}

html[data-theme="light"] .service-directory-card:hover,
html[data-theme="light"] .service-directory-card:focus-within {
  border-color: rgba(var(--gold-rgb), 0.3) !important;
  background-color: var(--card-bg-hover) !important;
  background-image: none !important;
  box-shadow:
    0 14px 30px rgba(var(--ink-rgb), 0.08),
    0 0 0 1px rgba(var(--gold-rgb), 0.1) !important;
}

/* Remove the pointer-following radial gradient layer from directory cards. */
.service-directory-card::after,
.service-directory-card:hover::after,
.service-directory-card:focus-within::after {
  display: none !important;
  opacity: 0 !important;
  background: none !important;
  content: none !important;
}

/* Light theme finish: light platinum cards and a graphite-only accent system. */
html[data-theme="light"] {
  --light-card-surface: #e4e2dc;
  --light-card-hover: #eeece6;
  --light-card-featured: #d9d8d2;
  --light-graphite: #2c3133;
  --light-graphite-deep: #1f2426;
  --light-graphite-muted: #4b5356;
  --light-graphite-rgb: 44, 49, 51;
  --primary: var(--light-graphite) !important;
  --primary-strong: var(--light-graphite-deep) !important;
  --primary-deep: #15191b !important;
  --on-primary: #f7f6f3 !important;
  --primary-rgb: var(--light-graphite-rgb) !important;
  --primary-strong-rgb: 31, 36, 38 !important;
  --primary-deep-rgb: 21, 25, 27 !important;
  --gold-rgb: var(--light-graphite-rgb) !important;
  --dark-line-rgb: var(--light-graphite-rgb) !important;
  --light-chrome-accent-rgb: var(--light-graphite-rgb) !important;
  --corner-accent-rgb: var(--light-graphite-rgb) !important;
  --functional-platinum: #3f484c !important;
  --functional-platinum-strong: #202527 !important;
  --functional-platinum-deep: #5a6468 !important;
  --functional-platinum-rgb: 63, 72, 76 !important;
}

html[data-theme="light"] .area-card,
html[data-theme="light"] .list-card,
html[data-theme="light"] .case-card,
html[data-theme="light"] .service-directory-card,
html[data-theme="light"] .service-info-card,
html[data-theme="light"] .service-final-cta,
html[data-theme="light"] .contacts-panel,
html[data-theme="light"] .contacts-row,
html[data-theme="light"] .subscription-plan,
html[data-theme="light"] .subscription-faq-list details,
html[data-theme="light"] .service-package-card,
html[data-theme="light"] .articles-home-section .article-card {
  background: var(--light-card-surface) !important;
  background-image: none !important;
  border-color: rgba(var(--light-graphite-rgb), 0.24) !important;
  color: var(--light-graphite-deep) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.62),
    0 14px 30px rgba(var(--light-graphite-rgb), 0.12) !important;
}

html[data-theme="light"] .area-card:hover,
html[data-theme="light"] .area-card:focus-within,
html[data-theme="light"] .list-card:hover,
html[data-theme="light"] .list-card:focus-within,
html[data-theme="light"] .case-card:hover,
html[data-theme="light"] .case-card:focus-within,
html[data-theme="light"] .service-directory-card:hover,
html[data-theme="light"] .service-directory-card:focus-within,
html[data-theme="light"] .service-info-card:hover,
html[data-theme="light"] .service-info-card:focus-within,
html[data-theme="light"] .service-final-cta:hover,
html[data-theme="light"] .service-final-cta:focus-within,
html[data-theme="light"] .contacts-panel:hover,
html[data-theme="light"] .contacts-row:hover,
html[data-theme="light"] .subscription-plan:hover,
html[data-theme="light"] .subscription-plan:focus-within,
html[data-theme="light"] .subscription-faq-list details:hover,
html[data-theme="light"] .service-package-card:hover,
html[data-theme="light"] .service-package-card:focus-within,
html[data-theme="light"] .articles-home-section .article-card:hover,
html[data-theme="light"] .articles-home-section .article-card:focus-visible {
  background: var(--light-card-hover) !important;
  background-image: none !important;
  border-color: rgba(var(--light-graphite-rgb), 0.56) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.78),
    0 20px 38px rgba(var(--light-graphite-rgb), 0.17) !important;
}

html[data-theme="light"] .area-card h2,
html[data-theme="light"] .area-card h3,
html[data-theme="light"] .area-card p,
html[data-theme="light"] .area-card li,
html[data-theme="light"] .list-card h3,
html[data-theme="light"] .list-card p,
html[data-theme="light"] .case-card h3,
html[data-theme="light"] .case-card p,
html[data-theme="light"] .service-directory-card h2,
html[data-theme="light"] .service-directory-card h3,
html[data-theme="light"] .service-directory-card p,
html[data-theme="light"] .service-directory-card li,
html[data-theme="light"] .service-info-card h2,
html[data-theme="light"] .service-info-card h3,
html[data-theme="light"] .service-info-card p,
html[data-theme="light"] .service-package-card h2,
html[data-theme="light"] .service-package-card h3,
html[data-theme="light"] .service-package-card p,
html[data-theme="light"] .service-package-card li,
html[data-theme="light"] .service-package-card strong,
html[data-theme="light"] .articles-home-section .article-card h2,
html[data-theme="light"] .articles-home-section .article-card p,
html[data-theme="light"] .articles-home-section .article-card strong,
html[data-theme="light"] .articles-home-section .article-card-description {
  color: var(--light-graphite-deep) !important;
  text-shadow: none !important;
}

html[data-theme="light"] .area-card p,
html[data-theme="light"] .area-card li,
html[data-theme="light"] .list-card p,
html[data-theme="light"] .case-card p,
html[data-theme="light"] .service-directory-card p,
html[data-theme="light"] .service-directory-card li,
html[data-theme="light"] .service-info-card p,
html[data-theme="light"] .service-package-card p,
html[data-theme="light"] .service-package-card li,
html[data-theme="light"] .articles-home-section .article-card p,
html[data-theme="light"] .articles-home-section .article-card-description {
  color: var(--light-graphite-muted) !important;
}

html[data-theme="light"] .area-card .material-symbols-outlined,
html[data-theme="light"] .service-directory-card .material-symbols-outlined,
html[data-theme="light"] .service-package-card .material-symbols-outlined,
html[data-theme="light"] .article-card .material-symbols-outlined,
html[data-theme="light"] .article-card-index,
html[data-theme="light"] .article-card-meta,
html[data-theme="light"] .article-card-category,
html[data-theme="light"] .article-card-link,
html[data-theme="light"] .article-card-link .material-symbols-outlined {
  color: var(--light-graphite) !important;
  text-shadow: none !important;
}

html[data-theme="light"] .button-primary,
html[data-theme="light"] #popular .service-package-card .package-link {
  border-color: var(--light-graphite) !important;
  background: linear-gradient(135deg, #3b4143 0%, #1f2426 100%) !important;
  color: #f7f6f3 !important;
  box-shadow: 0 10px 24px rgba(var(--light-graphite-rgb), 0.2) !important;
}

html[data-theme="light"] .button-primary:hover,
html[data-theme="light"] .button-primary:focus-visible,
html[data-theme="light"] #popular .service-package-card .package-link:hover,
html[data-theme="light"] #popular .service-package-card .package-link:focus-visible {
  border-color: #15191b !important;
  background: linear-gradient(135deg, #4a5255 0%, #15191b 100%) !important;
  color: #ffffff !important;
}

html[data-theme="light"] .button-ghost,
html[data-theme="light"] .pricing-request-link,
html[data-theme="light"] .service-directory-card .package-link,
html[data-theme="light"] .articles-home-link,
html[data-theme="light"] .articles-home-section .articles-home-link {
  border-color: rgba(var(--light-graphite-rgb), 0.42) !important;
  background: rgba(var(--light-graphite-rgb), 0.06) !important;
  color: var(--light-graphite) !important;
}

html[data-theme="light"] .button-ghost:hover,
html[data-theme="light"] .button-ghost:focus-visible,
html[data-theme="light"] .pricing-request-link:hover,
html[data-theme="light"] .pricing-request-link:focus-visible,
html[data-theme="light"] .service-directory-card .package-link:hover,
html[data-theme="light"] .service-directory-card .package-link:focus-visible,
html[data-theme="light"] .articles-home-link:hover,
html[data-theme="light"] .articles-home-link:focus-visible,
html[data-theme="light"] .articles-home-section .articles-home-link:hover,
html[data-theme="light"] .articles-home-section .articles-home-link:focus-visible {
  border-color: var(--light-graphite) !important;
  background: rgba(var(--light-graphite-rgb), 0.12) !important;
  color: var(--light-graphite-deep) !important;
}

html[data-theme="light"] .article-card::after {
  background: linear-gradient(105deg, rgba(255, 255, 255, 0.42), rgba(244, 243, 239, 0.12)) !important;
  opacity: 1 !important;
}

html[data-theme="light"] .article-card:hover::after,
html[data-theme="light"] .article-card:focus-visible::after {
  background: linear-gradient(105deg, rgba(255, 255, 255, 0.5), rgba(244, 243, 239, 0.18)) !important;
}

/* Final light-theme card finish: one warm milk-platinum surface across every card family. */
html[data-theme="light"] {
  --light-card-surface: #f7f5ef;
  --light-card-hover: #fffdf8;
  --light-card-featured: #efede6;
}

html[data-theme="light"] .area-card,
html[data-theme="light"] .list-card,
html[data-theme="light"] .case-card,
html[data-theme="light"] .service-choice-card,
html[data-theme="light"] .service-directory-card,
html[data-theme="light"] .pricing-decision-card,
html[data-theme="light"] .pricing-format-card,
html[data-theme="light"] .pricing-service-item,
html[data-theme="light"] .service-info-card,
html[data-theme="light"] .service-final-cta,
html[data-theme="light"] .contacts-panel,
html[data-theme="light"] .contacts-row,
html[data-theme="light"] .subscription-plan,
html[data-theme="light"] .subscription-faq-list details,
html[data-theme="light"] .subscription-table-wrap,
html[data-theme="light"] .pricing-options,
html[data-theme="light"] .price-list div,
html[data-theme="light"] .trust-note,
html[data-theme="light"] .wide-link,
html[data-theme="light"] .contact-dialog-panel,
html[data-theme="light"] .contact-form,
html[data-theme="light"] .contacts-social-grid .social-link,
html[data-theme="light"] .service-package-card,
html[data-theme="light"] .articles-home-section .article-card,
html[data-theme="light"] .article-directory-card,
html[data-theme="light"] .article-summary-card {
  background: var(--light-card-surface) !important;
  background-image: none !important;
}

html[data-theme="light"] .area-card:hover,
html[data-theme="light"] .area-card:focus-within,
html[data-theme="light"] .list-card:hover,
html[data-theme="light"] .list-card:focus-within,
html[data-theme="light"] .case-card:hover,
html[data-theme="light"] .case-card:focus-within,
html[data-theme="light"] .service-choice-card:hover,
html[data-theme="light"] .service-choice-card:focus-visible,
html[data-theme="light"] .service-directory-card:hover,
html[data-theme="light"] .service-directory-card:focus-within,
html[data-theme="light"] .pricing-decision-card:hover,
html[data-theme="light"] .pricing-format-card:hover,
html[data-theme="light"] .pricing-service-item:hover,
html[data-theme="light"] .service-info-card:hover,
html[data-theme="light"] .service-final-cta:hover,
html[data-theme="light"] .service-final-cta:focus-within,
html[data-theme="light"] .contacts-panel:hover,
html[data-theme="light"] .contacts-row:hover,
html[data-theme="light"] .subscription-plan:hover,
html[data-theme="light"] .subscription-plan:focus-within,
html[data-theme="light"] .subscription-faq-list details:hover,
html[data-theme="light"] .wide-link:hover,
html[data-theme="light"] .service-package-card:hover,
html[data-theme="light"] .service-package-card:focus-within,
html[data-theme="light"] .articles-home-section .article-card:hover,
html[data-theme="light"] .articles-home-section .article-card:focus-visible,
html[data-theme="light"] .article-directory-card:hover,
html[data-theme="light"] .article-directory-card:focus-visible,
html[data-theme="light"] .article-summary-card:hover,
html[data-theme="light"] .article-summary-card:focus-visible {
  background: var(--light-card-hover) !important;
  background-image: none !important;
}

/* Extend the same milk-platinum treatment to the card-like FAQ, doubts and process surfaces. */
html[data-theme="light"] .doubt-item,
html[data-theme="light"] .faq-list details,
html[data-theme="light"] .reason-outcome,
html[data-theme="light"] .workflow-step-surface,
html[data-theme="light"] .subscription-benefit {
  background: var(--light-card-surface) !important;
  background-image: none !important;
  border-color: rgba(var(--light-graphite-rgb), 0.24) !important;
  color: var(--light-graphite-deep) !important;
}

html[data-theme="light"] .doubt-item:hover,
html[data-theme="light"] .doubt-item:focus-within,
html[data-theme="light"] .faq-list details:hover,
html[data-theme="light"] .faq-list details:focus-within,
html[data-theme="light"] .reason-outcome:hover,
html[data-theme="light"] .workflow-step-surface:hover,
html[data-theme="light"] .subscription-benefit:hover {
  background: var(--light-card-hover) !important;
  background-image: none !important;
  border-color: rgba(var(--light-graphite-rgb), 0.5) !important;
}

html[data-theme="light"] .doubt-item h3,
html[data-theme="light"] .doubt-item p,
html[data-theme="light"] .faq-list details summary,
html[data-theme="light"] .faq-list details p,
html[data-theme="light"] .reason-outcome h3,
html[data-theme="light"] .reason-outcome p,
html[data-theme="light"] .workflow-step-surface h3,
html[data-theme="light"] .workflow-step-surface p,
html[data-theme="light"] .subscription-benefit h3,
html[data-theme="light"] .subscription-benefit p {
  color: var(--light-graphite-deep) !important;
  text-shadow: none !important;
}

/* Make the existing graphite decoration visible without reintroducing bronze or gradients. */
html[data-theme="light"] .area-card-logo,
html[data-theme="light"] .package-card-logo,
html[data-theme="light"] .service-directory-card-logo,
html[data-theme="light"] .service-choice-index,
html[data-theme="light"] .article-card::before {
  opacity: 0.22 !important;
  filter: saturate(1.08) contrast(1.08) !important;
}

html[data-theme="light"] .doubt-item::after,
html[data-theme="light"] .doubt-item::before,
html[data-theme="light"] .service-package-card::before {
  opacity: 0.34 !important;
}

/* Keep the card surface white first: decoration stays secondary and never darkens the panel. */
html[data-theme="light"] {
  --light-card-surface: #fffefa;
  --light-card-hover: #ffffff;
  --light-card-featured: #f8f6f1;
  --card-bg: #fffefa !important;
  --card-bg-hover: #ffffff !important;
  --card-bg-featured: #f8f6f1 !important;
}

html[data-theme="light"] .area-card,
html[data-theme="light"] .list-card,
html[data-theme="light"] .case-card,
html[data-theme="light"] .service-choice-card,
html[data-theme="light"] .service-directory-card,
html[data-theme="light"] .pricing-decision-card,
html[data-theme="light"] .pricing-format-card,
html[data-theme="light"] .pricing-service-item,
html[data-theme="light"] .service-info-card,
html[data-theme="light"] .service-final-cta,
html[data-theme="light"] .contacts-panel,
html[data-theme="light"] .contacts-row,
html[data-theme="light"] .subscription-plan,
html[data-theme="light"] .subscription-faq-list details,
html[data-theme="light"] .subscription-table-wrap,
html[data-theme="light"] .pricing-options,
html[data-theme="light"] .price-list div,
html[data-theme="light"] .trust-note,
html[data-theme="light"] .wide-link,
html[data-theme="light"] .contact-dialog-panel,
html[data-theme="light"] .contact-form,
html[data-theme="light"] .contacts-social-grid .social-link,
html[data-theme="light"] .service-package-card,
html[data-theme="light"] .articles-home-section .article-card,
html[data-theme="light"] .article-directory-card,
html[data-theme="light"] .article-summary-card,
html[data-theme="light"] .doubt-item,
html[data-theme="light"] .faq-list details,
html[data-theme="light"] .reason-outcome,
html[data-theme="light"] .workflow-step-surface,
html[data-theme="light"] .subscription-benefit {
  background-color: #fffefa !important;
  background-image: none !important;
}

/* Subscription plans: crisp type with a restrained tint for each package. */
html[data-theme="light"] .subscription-plan {
  --plan-accent: #8a5d3c;
  background-color: #fffaf4 !important;
  background-image: none !important;
  border-top: 3px solid color-mix(in srgb, var(--plan-accent) 62%, transparent) !important;
  color: #252827 !important;
}

html[data-theme="light"] .subscription-plan:nth-child(2) {
  --plan-accent: #587066;
  background-color: #f5faf7 !important;
}

html[data-theme="light"] .subscription-plan:nth-child(3) {
  --plan-accent: #596b72;
  background-color: #f4f8f8 !important;
}

html[data-theme="light"] .subscription-plan:nth-child(4) {
  --plan-accent: #7c6254;
  background-color: #fbf6f1 !important;
}

html[data-theme="light"] .subscription-plan header > p,
html[data-theme="light"] .subscription-plan h3,
html[data-theme="light"] .subscription-plan h4,
html[data-theme="light"] .subscription-plan strong {
  color: #252827 !important;
}

html[data-theme="light"] .subscription-plan header > p,
html[data-theme="light"] .subscription-plan h4,
html[data-theme="light"] .subscription-plan-ribbon,
html[data-theme="light"] .subscription-plan .material-symbols-outlined {
  color: var(--plan-accent) !important;
}

html[data-theme="light"] .subscription-plan h3 {
  font-weight: 700 !important;
  letter-spacing: -0.025em;
}

html[data-theme="light"] .subscription-plan h3 span,
html[data-theme="light"] .subscription-plan small,
html[data-theme="light"] .subscription-plan p,
html[data-theme="light"] .subscription-plan li,
html[data-theme="light"] .subscription-plan em,
html[data-theme="light"] .subscription-plan-audience,
html[data-theme="light"] .subscription-plan-bonus {
  color: #4b5352 !important;
}

html[data-theme="light"] .subscription-plan-ribbon {
  background: color-mix(in srgb, var(--plan-accent) 18%, #fffefa) !important;
  border-color: color-mix(in srgb, var(--plan-accent) 42%, transparent) !important;
  font-weight: 800 !important;
}

/* Use the service-card hover surface as the shared light-theme card base. */
html[data-theme="light"] {
  --light-card-surface: #fffefa;
  --light-card-hover: #fffefa;
  --card-bg: #fffefa !important;
  --card-bg-hover: #fffefa !important;
}

html[data-theme="light"] #services .area-card,
html[data-theme="light"] #services .area-card:hover,
html[data-theme="light"] #services .area-card:focus-within,
html[data-theme="light"] #popular .service-package-card,
html[data-theme="light"] #popular .service-package-card:hover,
html[data-theme="light"] #popular .service-package-card:focus-within,
html[data-theme="light"] .subscription-plan,
html[data-theme="light"] .subscription-plan:hover,
html[data-theme="light"] .subscription-plan:focus-within,
html[data-theme="light"] .subscription-plan:nth-child(n),
html[data-theme="light"] .subscription-plan:nth-child(n):hover,
html[data-theme="light"] .subscription-plan:nth-child(n):focus-within {
  background: #fffefa !important;
  background-image: none !important;
}

/* Restore the service accents on the homepage cards after the shared white-surface reset. */
html[data-theme="light"] #services .area-card,
html[data-theme="light"] #services .area-card:hover,
html[data-theme="light"] #services .area-card:focus-within {
  background-color: #fffefa !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--area-accent-rgb), 0.13),
      rgba(var(--area-accent-rgb), 0.045) 54%,
      rgba(255, 254, 250, 0.95)
    ) !important;
}

html[data-theme="light"] #services .area-card:hover,
html[data-theme="light"] #services .area-card:focus-within {
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--area-accent-rgb), 0.18),
      rgba(var(--area-accent-rgb), 0.065) 58%,
      rgba(255, 254, 250, 0.97)
    ) !important;
}

/* Give the popular-service cards the same per-service color language. */
html[data-theme="light"] #popular .service-package-card {
  --package-accent-rgb: 190, 176, 134;
  background-color: #fffefa !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--package-accent-rgb), 0.13),
      rgba(var(--package-accent-rgb), 0.045) 54%,
      rgba(255, 254, 250, 0.95)
    ) !important;
}

html[data-theme="light"] #popular .service-package-medical_information {
  --package-accent-rgb: 142, 205, 170;
}

html[data-theme="light"] #popular .service-package-cases {
  --package-accent-rgb: 223, 181, 100;
}

html[data-theme="light"] #popular .service-package-badge {
  --package-accent-rgb: 229, 158, 116;
}

html[data-theme="light"] #popular .service-package-handshake {
  --package-accent-rgb: 190, 176, 134;
}

html[data-theme="light"] #popular .service-package-workspace_premium {
  --package-accent-rgb: 201, 163, 232;
}

html[data-theme="light"] #popular .service-package-code,
html[data-theme="light"] #popular .service-package-web {
  --package-accent-rgb: 105, 190, 230;
}

html[data-theme="light"] #popular .service-package-person_search {
  --package-accent-rgb: 166, 196, 229;
}

html[data-theme="light"] #popular .service-package-card:hover,
html[data-theme="light"] #popular .service-package-card:focus-within {
  background-color: #fffefa !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--package-accent-rgb), 0.18),
      rgba(var(--package-accent-rgb), 0.065) 58%,
      rgba(255, 254, 250, 0.97)
    ) !important;
}

html[data-theme="light"] #popular .service-package-card .package-heading > .material-symbols-outlined,
html[data-theme="light"] #popular .service-package-card .package-card-logo {
  color: rgb(var(--package-accent-rgb)) !important;
  filter: none !important;
}

/* Match the quick-pick cards to the same colored service accents. */
html[data-theme="light"] .service-choice-card {
  background-color: #fffefa !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--choice-accent-rgb), 0.13),
      rgba(var(--choice-accent-rgb), 0.045) 54%,
      rgba(255, 254, 250, 0.95)
    ) !important;
}

html[data-theme="light"] .service-choice-card:hover,
html[data-theme="light"] .service-choice-card:focus-visible {
  background-color: #fffefa !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--choice-accent-rgb), 0.18),
      rgba(var(--choice-accent-rgb), 0.065) 58%,
      rgba(255, 254, 250, 0.97)
    ) !important;
}

/* Article cards use the dark-theme surface in both themes so image and copy stay crisp. */
html[data-theme="light"] .articles-home-section .article-card,
html[data-theme="light"] .article-archive-page .article-card {
  border-color: rgba(var(--article-bronze-rgb), 0.3) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.045), transparent 44%),
    linear-gradient(320deg, rgba(255, 255, 255, 0.018), transparent 42%),
    var(--article-graphite) !important;
  color: var(--article-ivory) !important;
  box-shadow:
    inset 0 1px 0 rgba(235, 241, 242, 0.045),
    0 18px 42px rgba(0, 0, 0, 0.22) !important;
}

html[data-theme="light"] .articles-home-section .article-card:hover,
html[data-theme="light"] .articles-home-section .article-card:focus-visible,
html[data-theme="light"] .article-archive-page .article-card:hover,
html[data-theme="light"] .article-archive-page .article-card:focus-visible {
  border-color: rgba(var(--article-bronze-rgb), 0.72) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.07), transparent 48%),
    var(--article-graphite-hover) !important;
  box-shadow:
    inset 0 1px 0 rgba(235, 241, 242, 0.065),
    0 24px 48px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="light"] .articles-home-section .article-card::before,
html[data-theme="light"] .article-archive-page .article-card::before {
  filter: saturate(1.16) contrast(1.14) brightness(0.96) !important;
  opacity: 0.62 !important;
}

html[data-theme="light"] .articles-home-section .article-card:hover::before,
html[data-theme="light"] .articles-home-section .article-card:focus-visible::before,
html[data-theme="light"] .article-archive-page .article-card:hover::before,
html[data-theme="light"] .article-archive-page .article-card:focus-visible::before {
  opacity: 0.72 !important;
}

html[data-theme="light"] .articles-home-section .article-card::after,
html[data-theme="light"] .article-archive-page .article-card::after {
  background:
    radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 0%), rgba(var(--article-bronze-rgb), 0.12), transparent 34%),
    linear-gradient(105deg, rgba(17, 19, 19, 0.86) 0%, rgba(17, 19, 19, 0.68) 52%, rgba(17, 19, 19, 0.44) 100%),
    linear-gradient(118deg, transparent 0 54%, rgba(var(--article-bronze-rgb), 0.16) 54.12% 54.28%, transparent 54.44% 100%) !important;
  opacity: 1 !important;
}

html[data-theme="light"] .articles-home-section .article-card-index,
html[data-theme="light"] .articles-home-section .article-card-icon,
html[data-theme="light"] .articles-home-section .article-card-category,
html[data-theme="light"] .articles-home-section .article-card-meta,
html[data-theme="light"] .articles-home-section .article-card-meta .material-symbols-outlined,
html[data-theme="light"] .articles-home-section .article-card strong,
html[data-theme="light"] .articles-home-section .article-card h2,
html[data-theme="light"] .articles-home-section .article-card-description,
html[data-theme="light"] .articles-home-section .article-card p,
html[data-theme="light"] .articles-home-section .article-card-link,
html[data-theme="light"] .article-archive-page .article-card-index,
html[data-theme="light"] .article-archive-page .article-card-icon,
html[data-theme="light"] .article-archive-page .article-card-category,
html[data-theme="light"] .article-archive-page .article-card-meta,
html[data-theme="light"] .article-archive-page .article-card-meta .material-symbols-outlined,
html[data-theme="light"] .article-archive-page .article-card strong,
html[data-theme="light"] .article-archive-page .article-card h2,
html[data-theme="light"] .article-archive-page .article-card-description,
html[data-theme="light"] .article-archive-page .article-card p,
html[data-theme="light"] .article-archive-page .article-card-link {
  color: var(--article-ivory) !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.8) !important;
}

html[data-theme="light"] .articles-home-section .article-card-description,
html[data-theme="light"] .articles-home-section .article-card p,
html[data-theme="light"] .article-archive-page .article-card-description,
html[data-theme="light"] .article-archive-page .article-card p {
  color: var(--article-muted) !important;
}

html[data-theme="light"] .articles-home-section .article-card-category,
html[data-theme="light"] .articles-home-section .article-card-link,
html[data-theme="light"] .articles-home-section .article-card-link .material-symbols-outlined,
html[data-theme="light"] .article-archive-page .article-card-category,
html[data-theme="light"] .article-archive-page .article-card-link,
html[data-theme="light"] .article-archive-page .article-card-link .material-symbols-outlined {
  color: rgb(var(--article-bronze-rgb)) !important;
}

html[data-theme="light"] .articles-home-section .article-card-icon,
html[data-theme="light"] .article-archive-page .article-card-icon {
  background: rgba(var(--article-bronze-rgb), 0.16) !important;
  color: rgb(var(--article-bronze-rgb)) !important;
}

/* Repair the light contact form after the global card-surface overrides. */
html[data-theme="light"] .contact-form:not(.contact-form-compact) {
  --contact-form-ink: #17242e;
  --contact-form-muted: #526777;
  --contact-form-soft: #647785;
  --contact-form-border: rgba(23, 36, 46, 0.22);
  --contact-form-field: #f6f8f8;
  display: grid !important;
  width: 100% !important;
  gap: 14px !important;
  border: 1px solid var(--contact-form-border) !important;
  border-radius: 4px !important;
  padding: clamp(20px, 3vw, 25px) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.86), transparent 42%),
    linear-gradient(180deg, #fffefa 0%, #f1eee7 100%) !important;
  color: var(--contact-form-ink) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.96),
    0 24px 70px rgba(23, 36, 46, 0.16) !important;
  color-scheme: light !important;
}

html[data-theme="light"] .contact-form.contact-form-compact {
  display: grid !important;
  gap: 14px !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #17120c !important;
}

html[data-theme="light"] .contact-form .form-field > span,
html[data-theme="light"] .contact-form .form-segment-group legend,
html[data-theme="light"] .contact-form .form-brief-summary > span:first-child {
  color: #17242e !important;
}

html[data-theme="light"] .contact-form .form-field input,
html[data-theme="light"] .contact-form .form-field textarea {
  border-color: rgba(23, 36, 46, 0.22) !important;
  background: #f6f8f8 !important;
  color: #17242e !important;
  caret-color: #17242e !important;
}

html[data-theme="light"] .contact-form .form-field input::placeholder,
html[data-theme="light"] .contact-form .form-field textarea::placeholder {
  color: rgba(23, 36, 46, 0.58) !important;
}

html[data-theme="light"] .contact-form .form-field input:focus,
html[data-theme="light"] .contact-form .form-field textarea:focus {
  border-color: rgba(var(--primary-deep-rgb), 0.56) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.14) !important;
}

html[data-theme="light"] .contact-form .form-hint,
html[data-theme="light"] .contact-form .form-status,
html[data-theme="light"] .contact-form .form-trust-list,
html[data-theme="light"] .contact-form .form-brief-summary small {
  color: #526777 !important;
}

html[data-theme="light"] .contact-form .form-context-note,
html[data-theme="light"] .contact-form .form-brief {
  border-color: rgba(var(--primary-rgb), 0.24) !important;
  background: rgba(var(--primary-rgb), 0.07) !important;
  color: #17242e !important;
}

html[data-theme="light"] .contact-form .form-segment-options span {
  border-color: rgba(23, 36, 46, 0.16) !important;
  background: rgba(255, 255, 255, 0.74) !important;
  color: #526777 !important;
}

html[data-theme="light"] .contact-form .form-segment-options input:checked + span {
  border-color: rgba(var(--primary-deep-rgb), 0.42) !important;
  background: rgba(var(--primary-rgb), 0.16) !important;
  color: #17242e !important;
}

html[data-theme="light"] .contact-form .form-footer .button-primary {
  border-color: #1f2426 !important;
  background: linear-gradient(135deg, #3b4143 0%, #1f2426 100%) !important;
  color: #f7f6f3 !important;
  box-shadow: 0 10px 24px rgba(23, 36, 46, 0.2) !important;
}

html[data-theme="light"] .contact-form .form-footer .button-primary:hover,
html[data-theme="light"] .contact-form .form-footer .button-primary:focus-visible {
  border-color: #15191b !important;
  background: linear-gradient(135deg, #4a5255 0%, #15191b 100%) !important;
  color: #ffffff !important;
}

html[data-theme="light"] .contact-form .form-trust-list {
  border-top-color: rgba(23, 36, 46, 0.16) !important;
}

html[data-theme="light"] .contact-dialog .contact-dialog-panel {
  border-color: rgba(23, 36, 46, 0.2) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.9), transparent 44%),
    #fffefa !important;
  color: #17242e !important;
}

/* Absolute final overrides: this block must remain the last layer in the cascade. */
html[data-theme="light"] body #services .service-package-card .package-heading h3,
html:not([data-theme="light"]) body #services .service-package-card .package-heading h3 {
  font-size: clamp(1.2rem, 1.6vw, 1.48rem) !important;
  line-height: 1.18 !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
}

html[data-theme="light"] body #services .service-package-card .package-link,
html:not([data-theme="light"]) body #services .service-package-card .package-link,
html[data-theme="light"] body #popular .service-package-card .package-link,
html:not([data-theme="light"]) body #popular .service-package-card .package-link,
html[data-theme="light"] body .service-directory-card .package-link,
html:not([data-theme="light"]) body .service-directory-card .package-link,
html[data-theme="light"] body .case-card .package-link,
html:not([data-theme="light"]) body .case-card .package-link {
  min-height: 46px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 4px !important;
  background: #30383b !important;
  color: #ffffff !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

html[data-theme="light"] body #services .service-package-card .package-link:hover,
html[data-theme="light"] body #services .service-package-card .package-link:focus-visible,
html:not([data-theme="light"]) body #services .service-package-card .package-link:hover,
html:not([data-theme="light"]) body #services .service-package-card .package-link:focus-visible,
html[data-theme="light"] body #popular .service-package-card .package-link:hover,
html[data-theme="light"] body #popular .service-package-card .package-link:focus-visible,
html:not([data-theme="light"]) body #popular .service-package-card .package-link:hover,
html:not([data-theme="light"]) body #popular .service-package-card .package-link:focus-visible,
html[data-theme="light"] body .service-directory-card .package-link:hover,
html[data-theme="light"] body .service-directory-card .package-link:focus-visible,
html:not([data-theme="light"]) body .service-directory-card .package-link:hover,
html:not([data-theme="light"]) body .service-directory-card .package-link:focus-visible,
html[data-theme="light"] body .case-card .package-link:hover,
html[data-theme="light"] body .case-card .package-link:focus-visible,
html:not([data-theme="light"]) body .case-card .package-link:hover,
html:not([data-theme="light"]) body .case-card .package-link:focus-visible {
  border-color: rgba(255, 255, 255, 0.32) !important;
  background: #424d51 !important;
  color: #ffffff !important;
}

.doubt-item::before {
  top: 12px !important;
  right: 14px !important;
  left: auto !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
  color: rgba(var(--gold-rgb), 0.28) !important;
  content: "“" !important;
  font: 600 2.6rem/0.75 "Noto Serif", serif !important;
}

.doubt-item::after {
  right: 10px !important;
  bottom: -5px !important;
  color: rgba(var(--gold-rgb), 0.15) !important;
  content: "”" !important;
  font-size: 3.6rem !important;
}

.doubt-item h3 {
  padding-inline: 8px 36px !important;
}

/* Final light-theme surface system: no gradients, no transparent washout. */
html[data-theme="light"] body {
  background: #f3f4f2 !important;
  background-image: none !important;
  color: #17242e !important;
}

html[data-theme="light"] body .section,
html[data-theme="light"] body .section-muted,
html[data-theme="light"] body .trust-bar,
html[data-theme="light"] body .doubts-section,
html[data-theme="light"] body .workflow-block,
html[data-theme="light"] body .articles-home-section,
html[data-theme="light"] body .service-archive-page,
html[data-theme="light"] body #services,
html[data-theme="light"] body #popular,
html[data-theme="light"] body #articles,
html[data-theme="light"] body #about,
html[data-theme="light"] body #why-pro-lex,
html[data-theme="light"] body #faq {
  background: #eef1ef !important;
  background-image: none !important;
}

html[data-theme="light"] body .doubts-section,
html[data-theme="light"] body #popular,
html[data-theme="light"] body #about,
html[data-theme="light"] body #faq {
  background: #f1efeb !important;
}

html[data-theme="light"] body .workflow-experience,
html[data-theme="light"] body .reasons-panel,
html[data-theme="light"] body .articles-grid,
html[data-theme="light"] body .services-grid,
html[data-theme="light"] body .service-directory-grid {
  background: transparent !important;
  background-image: none !important;
}

/* Article cards are intentionally excluded: they stay dark with white text. */
html[data-theme="light"] body .service-package-card,
html[data-theme="light"] body .service-directory-card,
html[data-theme="light"] body .service-choice-card,
html[data-theme="light"] body .area-card,
html[data-theme="light"] body .case-card,
html[data-theme="light"] body .doubt-item,
html[data-theme="light"] body .faq-list details,
html[data-theme="light"] body .contact-form,
html[data-theme="light"] body .contacts-panel,
html[data-theme="light"] body .contacts-row,
html[data-theme="light"] body .workflow-step-surface,
html[data-theme="light"] body .reason-item {
  background: #fffcf7 !important;
  background-image: none !important;
  border: 1px solid #cbd3d1 !important;
  color: #17242e !important;
  box-shadow: 0 12px 28px rgba(23, 36, 46, 0.08) !important;
}

html[data-theme="light"] body .service-package-card:hover,
html[data-theme="light"] body .service-package-card:focus-within,
html[data-theme="light"] body .service-directory-card:hover,
html[data-theme="light"] body .service-directory-card:focus-within,
html[data-theme="light"] body .service-choice-card:hover,
html[data-theme="light"] body .service-choice-card:focus-visible,
html[data-theme="light"] body .area-card:hover,
html[data-theme="light"] body .case-card:hover,
html[data-theme="light"] body .doubt-item:hover,
html[data-theme="light"] body .doubt-item:focus-within,
html[data-theme="light"] body .faq-list details:hover,
html[data-theme="light"] body .workflow-step-surface:hover,
html[data-theme="light"] body .workflow-step-surface:focus-visible,
html[data-theme="light"] body .reason-item:hover,
html[data-theme="light"] body .reason-item:focus-within {
  background: #fffcf7 !important;
  background-image: none !important;
  border-color: #aebdbb !important;
  box-shadow: 0 16px 34px rgba(23, 36, 46, 0.12) !important;
}

html[data-theme="light"] body .service-package-card h2,
html[data-theme="light"] body .service-package-card h3,
html[data-theme="light"] body .service-directory-card h2,
html[data-theme="light"] body .service-directory-card h3,
html[data-theme="light"] body .service-choice-card strong,
html[data-theme="light"] body .area-card h2,
html[data-theme="light"] body .area-card h3,
html[data-theme="light"] body .case-card h2,
html[data-theme="light"] body .case-card h3,
html[data-theme="light"] body .doubt-item h3,
html[data-theme="light"] body .workflow-step-surface h2,
html[data-theme="light"] body .workflow-step-surface h3,
html[data-theme="light"] body .reason-item h2,
html[data-theme="light"] body .reason-item h3 {
  color: #17242e !important;
  text-shadow: none !important;
}

html[data-theme="light"] body .service-package-card p,
html[data-theme="light"] body .service-directory-card p,
html[data-theme="light"] body .service-directory-card li,
html[data-theme="light"] body .service-choice-card small,
html[data-theme="light"] body .area-card p,
html[data-theme="light"] body .case-card p,
html[data-theme="light"] body .doubt-item p,
html[data-theme="light"] body .workflow-step-surface p,
html[data-theme="light"] body .reason-item p {
  color: #52616a !important;
}

/* Final cascade layer for light mode. Keep article cards dark; brighten every other surface. */
html[data-theme="light"] body {
  background: #f3f4f2 !important;
  background-image: none !important;
  color: #17242e !important;
}

html[data-theme="light"] body .section,
html[data-theme="light"] body .section-muted,
html[data-theme="light"] body .trust-bar,
html[data-theme="light"] body .doubts-section,
html[data-theme="light"] body .workflow-block,
html[data-theme="light"] body .articles-home-section,
html[data-theme="light"] body .service-archive-page,
html[data-theme="light"] body #services,
html[data-theme="light"] body #popular,
html[data-theme="light"] body #articles,
html[data-theme="light"] body #about,
html[data-theme="light"] body #why-pro-lex,
html[data-theme="light"] body #faq {
  background: #eef1ef !important;
  background-image: none !important;
}

html[data-theme="light"] body .doubts-section,
html[data-theme="light"] body #popular,
html[data-theme="light"] body #about,
html[data-theme="light"] body #faq {
  background: #f1efeb !important;
}

html[data-theme="light"] body .workflow-experience,
html[data-theme="light"] body .reasons-panel,
html[data-theme="light"] body .articles-grid,
html[data-theme="light"] body .services-grid,
html[data-theme="light"] body .service-directory-grid {
  background: transparent !important;
  background-image: none !important;
}

html[data-theme="light"] body .service-package-card,
html[data-theme="light"] body .service-directory-card,
html[data-theme="light"] body .service-choice-card,
html[data-theme="light"] body .area-card,
html[data-theme="light"] body .case-card,
html[data-theme="light"] body .doubt-item,
html[data-theme="light"] body .faq-list details,
html[data-theme="light"] body .contact-form,
html[data-theme="light"] body .contacts-panel,
html[data-theme="light"] body .contacts-row,
html[data-theme="light"] body .workflow-step-surface,
html[data-theme="light"] body .reason-item {
  background: #fffcf7 !important;
  background-image: none !important;
  border: 1px solid #cbd3d1 !important;
  color: #17242e !important;
  box-shadow: 0 12px 28px rgba(23, 36, 46, 0.08) !important;
}

html[data-theme="light"] body .service-package-card:hover,
html[data-theme="light"] body .service-package-card:focus-within,
html[data-theme="light"] body .service-directory-card:hover,
html[data-theme="light"] body .service-directory-card:focus-within,
html[data-theme="light"] body .service-choice-card:hover,
html[data-theme="light"] body .service-choice-card:focus-visible,
html[data-theme="light"] body .area-card:hover,
html[data-theme="light"] body .case-card:hover,
html[data-theme="light"] body .doubt-item:hover,
html[data-theme="light"] body .doubt-item:focus-within,
html[data-theme="light"] body .faq-list details:hover,
html[data-theme="light"] body .workflow-step-surface:hover,
html[data-theme="light"] body .workflow-step-surface:focus-visible,
html[data-theme="light"] body .reason-item:hover,
html[data-theme="light"] body .reason-item:focus-within {
  background: #fffcf7 !important;
  background-image: none !important;
  border-color: #aebdbb !important;
  box-shadow: 0 16px 34px rgba(23, 36, 46, 0.12) !important;
}

html[data-theme="light"] body .service-package-card h2,
html[data-theme="light"] body .service-package-card h3,
html[data-theme="light"] body .service-directory-card h2,
html[data-theme="light"] body .service-directory-card h3,
html[data-theme="light"] body .service-choice-card strong,
html[data-theme="light"] body .area-card h2,
html[data-theme="light"] body .area-card h3,
html[data-theme="light"] body .case-card h2,
html[data-theme="light"] body .case-card h3,
html[data-theme="light"] body .doubt-item h3,
html[data-theme="light"] body .workflow-step-surface h2,
html[data-theme="light"] body .workflow-step-surface h3,
html[data-theme="light"] body .reason-item h2,
html[data-theme="light"] body .reason-item h3 {
  color: #17242e !important;
  text-shadow: none !important;
}

html[data-theme="light"] body .service-package-card p,
html[data-theme="light"] body .service-directory-card p,
html[data-theme="light"] body .service-directory-card li,
html[data-theme="light"] body .service-choice-card small,
html[data-theme="light"] body .area-card p,
html[data-theme="light"] body .case-card p,
html[data-theme="light"] body .doubt-item p,
html[data-theme="light"] body .workflow-step-surface p,
html[data-theme="light"] body .reason-item p {
  color: #52616a !important;
}

/* Last word for light mode: solid, premium surfaces with no washout gradients. */
html.light[data-theme="light"] body {
  --light-page: #f3f4f2;
  --light-section: #eef1ef;
  --light-section-warm: #f1efeb;
  --light-card: #fffcf7;
  --light-card-border: #cbd3d1;
  --light-ink: #17242e;
  --light-muted: #52616a;
  background: var(--light-page) !important;
  background-image: none !important;
  color: var(--light-ink) !important;
}

html.light[data-theme="light"] body :where(
  .section, .section-muted, .trust-bar, .doubts-section,
  .workflow-block, .articles-home-section, .service-archive-page,
  #services, #popular, #articles, #about, #why-pro-lex, #faq
) {
  background: var(--light-section) !important;
  background-image: none !important;
  color: var(--light-ink) !important;
}

html.light[data-theme="light"] body :where(.doubts-section, #popular, #about, #faq) {
  background: var(--light-section-warm) !important;
}

html.light[data-theme="light"] body :where(
  .workflow-experience, .reasons-panel, .articles-grid,
  .services-grid, .service-directory-grid
) {
  background: transparent !important;
  background-image: none !important;
}

/* Article cards are deliberately absent here: their dark/light-text treatment stays intact. */
html.light[data-theme="light"] body :where(
  .service-package-card, .service-directory-card, .service-choice-card,
  .area-card, .case-card, .doubt-item, .faq-list details,
  .contact-form, .contacts-panel, .contacts-row,
  .workflow-step-surface, .reason-item
) {
  background: var(--light-card) !important;
  background-image: none !important;
  border: 1px solid var(--light-card-border) !important;
  color: var(--light-ink) !important;
  box-shadow: 0 12px 28px rgba(23, 36, 46, 0.08) !important;
}

html.light[data-theme="light"] body :where(
  .service-package-card:hover, .service-package-card:focus-within,
  .service-directory-card:hover, .service-directory-card:focus-within,
  .service-choice-card:hover, .service-choice-card:focus-visible,
  .area-card:hover, .case-card:hover, .doubt-item:hover,
  .doubt-item:focus-within, .faq-list details:hover,
  .workflow-step-surface:hover, .workflow-step-surface:focus-visible,
  .reason-item:hover, .reason-item:focus-within
) {
  background: var(--light-card) !important;
  background-image: none !important;
  border-color: #aebdbb !important;
  box-shadow: 0 16px 34px rgba(23, 36, 46, 0.12) !important;
}

html.light[data-theme="light"] body :where(
  .service-package-card h2, .service-package-card h3,
  .service-directory-card h2, .service-directory-card h3,
  .service-choice-card strong, .area-card h2, .area-card h3,
  .case-card h2, .case-card h3, .doubt-item h3,
  .workflow-step-surface h2, .workflow-step-surface h3,
  .reason-item h2, .reason-item h3
) {
  color: var(--light-ink) !important;
  text-shadow: none !important;
}

html.light[data-theme="light"] body :where(
  .service-package-card p, .service-directory-card p,
  .service-directory-card li, .service-choice-card small,
  .area-card p, .case-card p, .doubt-item p,
  .workflow-step-surface p, .reason-item p
) {
  color: var(--light-muted) !important;
}

/* Final light-theme finish: calm editorial backgrounds and crisp ivory surfaces. */
html.light[data-theme="light"] body {
  --light-page: #f3f4f2;
  --light-section: #eef1ef;
  --light-section-warm: #f1efeb;
  --light-card: #fffcf7;
  --light-card-border: #cbd3d1;
  --light-ink: #17242e;
  --light-muted: #52616a;
  background: var(--light-page) !important;
  background-image: none !important;
  color: var(--light-ink) !important;
}

html.light[data-theme="light"] body :where(
  .section,
  .section-muted,
  .trust-bar,
  .doubts-section,
  .workflow-block,
  .articles-home-section,
  .service-archive-page,
  #services,
  #popular,
  #articles,
  #about,
  #why-pro-lex,
  #faq
) {
  background: var(--light-section) !important;
  background-image: none !important;
  color: var(--light-ink) !important;
}

html.light[data-theme="light"] body :where(
  .doubts-section,
  #popular,
  #about,
  #faq
) {
  background: var(--light-section-warm) !important;
}

html.light[data-theme="light"] body :where(
  .workflow-experience,
  .reasons-panel,
  .articles-grid,
  .services-grid,
  .service-directory-grid
) {
  background: transparent !important;
  background-image: none !important;
}

/* All light-theme content cards share one bright, readable surface. Article cards
   are intentionally excluded: they remain dark with white type. */
html.light[data-theme="light"] body :where(
  .service-package-card,
  .service-directory-card,
  .service-choice-card,
  .area-card,
  .case-card,
  .doubt-item,
  .faq-list details,
  .contact-form,
  .contacts-panel,
  .contacts-row,
  .workflow-step-surface,
  .reason-item
) {
  background: var(--light-card) !important;
  background-image: none !important;
  border: 1px solid var(--light-card-border) !important;
  color: var(--light-ink) !important;
  box-shadow: 0 12px 28px rgba(23, 36, 46, 0.08) !important;
}

html.light[data-theme="light"] body :where(
  .service-package-card:hover,
  .service-package-card:focus-within,
  .service-directory-card:hover,
  .service-directory-card:focus-within,
  .service-choice-card:hover,
  .service-choice-card:focus-visible,
  .area-card:hover,
  .case-card:hover,
  .doubt-item:hover,
  .doubt-item:focus-within,
  .faq-list details:hover,
  .workflow-step-surface:hover,
  .workflow-step-surface:focus-visible,
  .reason-item:hover,
  .reason-item:focus-within
) {
  background: var(--light-card) !important;
  background-image: none !important;
  border-color: #aebdbb !important;
  box-shadow: 0 16px 34px rgba(23, 36, 46, 0.12) !important;
}

html.light[data-theme="light"] body :where(
  .service-package-card h2,
  .service-package-card h3,
  .service-directory-card h2,
  .service-directory-card h3,
  .service-choice-card strong,
  .area-card h2,
  .area-card h3,
  .case-card h2,
  .case-card h3,
  .doubt-item h3,
  .workflow-step-surface h2,
  .workflow-step-surface h3,
  .reason-item h2,
  .reason-item h3
) {
  color: var(--light-ink) !important;
  text-shadow: none !important;
}

html.light[data-theme="light"] body :where(
  .service-package-card p,
  .service-directory-card p,
  .service-directory-card li,
  .service-choice-card small,
  .area-card p,
  .case-card p,
  .doubt-item p,
  .workflow-step-surface p,
  .reason-item p
) {
  color: var(--light-muted) !important;
}

html.light[data-theme="light"] body .workflow-block {
  background: var(--light-section) !important;
  background-image: none !important;
}

/* Final light-theme surface system: neutral gray sections, clear ivory cards. */
html[data-theme="light"] body {
  background-color: #f5f6f4 !important;
  background-image: none !important;
  color: #17242e !important;
}

html[data-theme="light"] body .trust-bar,
html[data-theme="light"] body #services,
html[data-theme="light"] body #articles,
html[data-theme="light"] body .articles-home-section,
html[data-theme="light"] body .service-archive-page {
  background-color: #f5f6f4 !important;
  background-image: none !important;
}

html[data-theme="light"] body .doubts-section,
html[data-theme="light"] body #popular,
html[data-theme="light"] body #faq {
  background-color: #f1f2f0 !important;
  background-image: none !important;
}

html[data-theme="light"] body #about,
html[data-theme="light"] body #why-pro-lex {
  background-color: #edeef0 !important;
  background-image: none !important;
}

html.light[data-theme="light"] body :where(
  .service-package-card,
  .service-directory-card,
  .service-choice-card,
  .area-card,
  .case-card,
  .doubt-item,
  .faq-list details,
  .contact-form,
  .contacts-panel,
  .contacts-row
) {
  background-color: #fffcf7 !important;
  background-image: none !important;
  border-color: #d0d7d5 !important;
  color: #17242e !important;
  box-shadow: 0 14px 30px rgba(23, 36, 46, 0.07) !important;
}

html.light[data-theme="light"] body :where(
  .service-package-card:hover,
  .service-package-card:focus-within,
  .service-directory-card:hover,
  .service-directory-card:focus-within,
  .service-choice-card:hover,
  .service-choice-card:focus-visible,
  .area-card:hover,
  .case-card:hover,
  .doubt-item:hover,
  .doubt-item:focus-within,
  .faq-list details:hover,
  .contacts-row:hover
) {
  background-color: #fffcf7 !important;
  background-image: none !important;
  border-color: #aebfbd !important;
  box-shadow: 0 18px 36px rgba(23, 36, 46, 0.1) !important;
}

html.light[data-theme="light"] body :where(
  .service-package-card h2,
  .service-package-card h3,
  .service-directory-card h2,
  .service-directory-card h3,
  .service-choice-card strong,
  .doubt-item h3
) {
  color: #17242e !important;
  text-shadow: none !important;
}

html.light[data-theme="light"] body :where(
  .service-package-card p,
  .service-directory-card p,
  .service-directory-card li,
  .service-choice-card small,
  .doubt-item p
) {
  color: #435660 !important;
}

html.light[data-theme="light"] body .workflow-block {
  background-color: #f1f2f0 !important;
  background-image: none !important;
  color: #17242e !important;
}

html.light[data-theme="light"] body .workflow-step-surface,
html.light[data-theme="light"] body .reason-item {
  border: 1px solid #d0d7d5 !important;
  background: #fffcf7 !important;
  color: #17242e !important;
  box-shadow: 0 12px 26px rgba(23, 36, 46, 0.06) !important;
}

html.light[data-theme="light"] body .workflow-step-surface:hover,
html.light[data-theme="light"] body .workflow-step-surface:focus-visible,
html.light[data-theme="light"] body .reason-item:hover,
html.light[data-theme="light"] body .reason-item:focus-within {
  border-color: #aebfbd !important;
  background: #fffcf7 !important;
  box-shadow: 0 16px 32px rgba(23, 36, 46, 0.09) !important;
}

/* Final polish for the current light-theme direction and card controls. */
html[data-theme="light"] body #services .service-package-card .package-heading h3,
html:not([data-theme="light"]) body #services .service-package-card .package-heading h3 {
  font-size: clamp(1.2rem, 1.6vw, 1.48rem) !important;
  line-height: 1.18 !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
}

html[data-theme="light"] body #services .service-package-card .package-link,
html:not([data-theme="light"]) body #services .service-package-card .package-link,
html[data-theme="light"] body #popular .service-package-card .package-link,
html:not([data-theme="light"]) body #popular .service-package-card .package-link,
html[data-theme="light"] body .service-directory-card .package-link,
html:not([data-theme="light"]) body .service-directory-card .package-link,
html[data-theme="light"] body .case-card .package-link,
html:not([data-theme="light"]) body .case-card .package-link {
  min-height: 46px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 4px !important;
  background: #30383b !important;
  color: #ffffff !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

html[data-theme="light"] body #services .service-package-card .package-link:hover,
html[data-theme="light"] body #services .service-package-card .package-link:focus-visible,
html:not([data-theme="light"]) body #services .service-package-card .package-link:hover,
html:not([data-theme="light"]) body #services .service-package-card .package-link:focus-visible,
html[data-theme="light"] body #popular .service-package-card .package-link:hover,
html[data-theme="light"] body #popular .service-package-card .package-link:focus-visible,
html:not([data-theme="light"]) body #popular .service-package-card .package-link:hover,
html:not([data-theme="light"]) body #popular .service-package-card .package-link:focus-visible,
html[data-theme="light"] body .service-directory-card .package-link:hover,
html[data-theme="light"] body .service-directory-card .package-link:focus-visible,
html:not([data-theme="light"]) body .service-directory-card .package-link:hover,
html:not([data-theme="light"]) body .service-directory-card .package-link:focus-visible,
html[data-theme="light"] body .case-card .package-link:hover,
html[data-theme="light"] body .case-card .package-link:focus-visible,
html:not([data-theme="light"]) body .case-card .package-link:hover,
html:not([data-theme="light"]) body .case-card .package-link:focus-visible {
  border-color: rgba(255, 255, 255, 0.32) !important;
  background: #424d51 !important;
  color: #ffffff !important;
}

/* Keep the dialogue marks decorative and outside the index's reading path. */
.doubt-item::before {
  top: 12px !important;
  right: 14px !important;
  left: auto !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
  color: rgba(var(--gold-rgb), 0.28) !important;
  content: "“" !important;
  font: 600 2.6rem/0.75 "Noto Serif", serif !important;
}

.doubt-item::after {
  right: 10px !important;
  bottom: -5px !important;
  color: rgba(var(--gold-rgb), 0.15) !important;
  content: "”" !important;
  font-size: 3.6rem !important;
}

.doubt-item h3 {
  padding-inline: 8px 36px !important;
}

/* A warmer editorial paper field with alternating sage and cream zones. */
html[data-theme="light"] body {
  background-color: #f8f6f0 !important;
  background-image:
    radial-gradient(circle at 8% 8%, rgba(214, 169, 111, 0.16), transparent 25rem),
    radial-gradient(circle at 92% 70%, rgba(118, 165, 176, 0.13), transparent 30rem),
    linear-gradient(135deg, rgba(255, 255, 255, 0.55), transparent 38%),
    var(--decor-platinum) !important;
}

html[data-theme="light"] body .section,
html[data-theme="light"] body .doubts-section,
html[data-theme="light"] body .trust-bar {
  background-color: #faf8f2 !important;
  background-image:
    radial-gradient(circle at 0% 12%, rgba(185, 138, 89, 0.12), transparent 21rem),
    radial-gradient(circle at 100% 86%, rgba(105, 190, 230, 0.1), transparent 24rem),
    linear-gradient(145deg, rgba(255, 255, 255, 0.62), transparent 46%),
    var(--decor-platinum) !important;
}

html[data-theme="light"] body .section.section-muted {
  background-color: #f0f4f1 !important;
  background-image:
    radial-gradient(circle at 88% 16%, rgba(142, 205, 170, 0.16), transparent 22rem),
    radial-gradient(circle at 14% 84%, rgba(223, 181, 100, 0.1), transparent 24rem),
    linear-gradient(145deg, rgba(255, 255, 255, 0.58), transparent 48%),
    var(--decor-platinum) !important;
}

html[data-theme="light"] body #popular,
html[data-theme="light"] body #articles,
html[data-theme="light"] body #about {
  background-color: #f5f2eb !important;
}

html[data-theme="light"] body #services,
html[data-theme="light"] body #faq,
html[data-theme="light"] body #why-pro-lex {
  background-color: #f0f4f1 !important;
}

html[data-theme="light"] body #services .service-package-card h3,
html[data-theme="light"] body #popular .service-package-card h3,
html[data-theme="light"] body .doubt-item h3 {
  color: #17242e !important;
}

html[data-theme="light"] body #services .service-package-description,
html[data-theme="light"] body #popular .service-package-card p,
html[data-theme="light"] body .doubt-item p {
  color: #344650 !important;
}

/* Final polish for the current light-theme direction and card controls. */
html[data-theme="light"] body #services .service-package-card .package-heading h3,
html:not([data-theme="light"]) body #services .service-package-card .package-heading h3 {
  font-size: clamp(1.2rem, 1.6vw, 1.48rem) !important;
  line-height: 1.18 !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
}

html[data-theme="light"] body #services .service-package-card .package-link,
html:not([data-theme="light"]) body #services .service-package-card .package-link,
html[data-theme="light"] body #popular .service-package-card .package-link,
html:not([data-theme="light"]) body #popular .service-package-card .package-link,
html[data-theme="light"] body .service-directory-card .package-link,
html:not([data-theme="light"]) body .service-directory-card .package-link,
html[data-theme="light"] body .case-card .package-link,
html:not([data-theme="light"]) body .case-card .package-link {
  min-height: 46px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 4px !important;
  background: #30383b !important;
  color: #ffffff !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

html[data-theme="light"] body #services .service-package-card .package-link:hover,
html[data-theme="light"] body #services .service-package-card .package-link:focus-visible,
html:not([data-theme="light"]) body #services .service-package-card .package-link:hover,
html:not([data-theme="light"]) body #services .service-package-card .package-link:focus-visible,
html[data-theme="light"] body #popular .service-package-card .package-link:hover,
html[data-theme="light"] body #popular .service-package-card .package-link:focus-visible,
html:not([data-theme="light"]) body #popular .service-package-card .package-link:hover,
html:not([data-theme="light"]) body #popular .service-package-card .package-link:focus-visible,
html[data-theme="light"] body .service-directory-card .package-link:hover,
html[data-theme="light"] body .service-directory-card .package-link:focus-visible,
html:not([data-theme="light"]) body .service-directory-card .package-link:hover,
html:not([data-theme="light"]) body .service-directory-card .package-link:focus-visible,
html[data-theme="light"] body .case-card .package-link:hover,
html[data-theme="light"] body .case-card .package-link:focus-visible,
html:not([data-theme="light"]) body .case-card .package-link:hover,
html:not([data-theme="light"]) body .case-card .package-link:focus-visible {
  border-color: rgba(255, 255, 255, 0.32) !important;
  background: #424d51 !important;
  color: #ffffff !important;
}

/* Keep the dialogue marks decorative and outside the index's reading path. */
.doubt-item::before {
  top: 12px !important;
  right: 14px !important;
  left: auto !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
  color: rgba(var(--gold-rgb), 0.28) !important;
  content: "“" !important;
  font: 600 2.6rem/0.75 "Noto Serif", serif !important;
}

.doubt-item::after {
  right: 10px !important;
  bottom: -5px !important;
  color: rgba(var(--gold-rgb), 0.15) !important;
  content: "”" !important;
  font-size: 3.6rem !important;
}

.doubt-item h3 {
  padding-inline: 8px 36px !important;
}

/* A warmer editorial paper field with alternating sage and cream zones. */
html[data-theme="light"] body {
  background-color: #f8f6f0 !important;
  background-image:
    radial-gradient(circle at 8% 8%, rgba(214, 169, 111, 0.16), transparent 25rem),
    radial-gradient(circle at 92% 70%, rgba(118, 165, 176, 0.13), transparent 30rem),
    linear-gradient(135deg, rgba(255, 255, 255, 0.55), transparent 38%),
    var(--decor-platinum) !important;
}

html[data-theme="light"] body .section,
html[data-theme="light"] body .doubts-section,
html[data-theme="light"] body .trust-bar {
  background-color: #faf8f2 !important;
  background-image:
    radial-gradient(circle at 0% 12%, rgba(185, 138, 89, 0.12), transparent 21rem),
    radial-gradient(circle at 100% 86%, rgba(105, 190, 230, 0.1), transparent 24rem),
    linear-gradient(145deg, rgba(255, 255, 255, 0.62), transparent 46%),
    var(--decor-platinum) !important;
}

html[data-theme="light"] body .section.section-muted {
  background-color: #f0f4f1 !important;
  background-image:
    radial-gradient(circle at 88% 16%, rgba(142, 205, 170, 0.16), transparent 22rem),
    radial-gradient(circle at 14% 84%, rgba(223, 181, 100, 0.1), transparent 24rem),
    linear-gradient(145deg, rgba(255, 255, 255, 0.58), transparent 48%),
    var(--decor-platinum) !important;
}

html[data-theme="light"] body #popular,
html[data-theme="light"] body #articles,
html[data-theme="light"] body #about {
  background-color: #f5f2eb !important;
}

html[data-theme="light"] body #services,
html[data-theme="light"] body #faq,
html[data-theme="light"] body #why-pro-lex {
  background-color: #f0f4f1 !important;
}

html[data-theme="light"] body #services .service-package-card h3,
html[data-theme="light"] body #popular .service-package-card h3,
html[data-theme="light"] body .doubt-item h3 {
  color: #17242e !important;
}

html[data-theme="light"] body #services .service-package-description,
html[data-theme="light"] body #popular .service-package-card p,
html[data-theme="light"] body .doubt-item p {
  color: #344650 !important;
}

/* Final refinement: compact service cards, stronger editorial type and one CTA treatment. */
#services .service-package-card {
  min-height: 326px !important;
  gap: 10px !important;
  padding: 18px !important;
}

#services .service-package-card .package-heading {
  gap: 10px !important;
}

#services .service-package-card .package-heading h3 {
  max-width: 420px !important;
  font-size: clamp(1.36rem, 1.85vw, 1.72rem) !important;
  font-weight: 600 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.13 !important;
}

#services .service-package-description {
  font-size: 0.9rem !important;
  line-height: 1.5 !important;
}

/* Every action attached to a service card uses the same bronze control. */
#services .service-package-card .package-link,
#popular .service-package-card .package-link,
.service-directory-card .package-link,
.case-card .package-link {
  min-height: 46px !important;
  align-items: center !important;
  justify-content: space-between !important;
  border: 1px solid rgba(218, 174, 122, 0.92) !important;
  border-radius: 4px !important;
  padding: 0 14px !important;
  background: #c7925d !important;
  color: #17120d !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.28),
    0 8px 18px rgba(88, 54, 27, 0.18) !important;
}

#services .service-package-card .package-link:hover,
#services .service-package-card .package-link:focus-visible,
#popular .service-package-card .package-link:hover,
#popular .service-package-card .package-link:focus-visible,
.service-directory-card .package-link:hover,
.service-directory-card .package-link:focus-visible,
.case-card .package-link:hover,
.case-card .package-link:focus-visible {
  border-color: #edc28e !important;
  background: #d6a46f !important;
  color: #17120d !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.38),
    0 12px 24px rgba(88, 54, 27, 0.24) !important;
  transform: translateY(-1px);
}

#services .service-package-card .package-link .material-symbols-outlined,
#popular .service-package-card .package-link .material-symbols-outlined,
.service-directory-card .package-link .material-symbols-outlined,
.case-card .package-link .material-symbols-outlined {
  color: currentColor !important;
}

/* Reapply the service identity to the large decorative logos in both themes. */
#popular .service-package-medical_information,
#services .service-package-medical_information {
  --package-accent-rgb: 142, 205, 170 !important;
}

#popular .service-package-cases,
#services .service-package-cases {
  --package-accent-rgb: 223, 181, 100 !important;
}

#popular .service-package-badge,
#services .service-package-badge {
  --package-accent-rgb: 229, 158, 116 !important;
}

#popular .service-package-handshake,
#services .service-package-handshake {
  --package-accent-rgb: 190, 176, 134 !important;
}

#popular .service-package-workspace_premium,
#services .service-package-workspace_premium {
  --package-accent-rgb: 201, 163, 232 !important;
}

#popular .service-package-code,
#services .service-package-code {
  --package-accent-rgb: 105, 190, 230 !important;
}

#popular .service-package-person_search,
#services .service-package-person_search {
  --package-accent-rgb: 166, 196, 229 !important;
}

#popular .service-package-card .package-card-logo,
#services .service-package-card .package-card-logo {
  color: rgb(var(--package-accent-rgb)) !important;
  filter: saturate(1.18) contrast(1.08) !important;
  opacity: 0.14 !important;
}

#popular .service-package-card:hover .package-card-logo,
#popular .service-package-card:focus-within .package-card-logo,
#services .service-package-card:hover .package-card-logo,
#services .service-package-card:focus-within .package-card-logo {
  opacity: 0.22 !important;
}

/* Make the doubts section read like an actual conversation. */
.doubt-item {
  padding-top: 28px !important;
}

.doubt-item::before {
  top: 8px !important;
  right: auto !important;
  left: 16px !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
  color: rgba(var(--gold-rgb), 0.3) !important;
  content: "«" !important;
  font: 600 3.5rem/0.8 "Noto Serif", serif !important;
}

.doubt-item::after {
  right: 12px !important;
  bottom: -8px !important;
  color: rgba(var(--gold-rgb), 0.18) !important;
  content: "»" !important;
  font-size: 5.8rem !important;
}

.doubt-item h3 {
  position: relative;
  z-index: 1;
  padding-inline: 18px 8px !important;
  color: var(--primary-strong) !important;
  font-size: 1rem !important;
}

.doubt-item h3::after {
  display: block;
  margin-top: 8px;
  color: rgba(var(--gold-rgb), 0.62);
  content: "• • •";
  font-size: 0.62rem;
  letter-spacing: 0.2em;
  line-height: 1;
}

.doubt-quote {
  color: rgba(var(--gold-rgb), 0.86);
  font-family: "Noto Serif", serif;
  font-size: 1.2em;
  font-weight: 600;
}

/* Light theme: warm paper and platinum-cream section fields instead of grey wash. */
html[data-theme="light"] {
  --page-bg: #f8f6f0 !important;
  --section-bg: #fcfbf7 !important;
  --section-alt: #f3f0e8 !important;
  --section-strong: #e8e2d8 !important;
  --surface: #fcfbf7 !important;
  --surface-low: #fffefa !important;
  --surface-container: #f6f2ea !important;
  --surface-high: #ffffff !important;
  --surface-variant: #e4ded4 !important;
  --card-bg: #fffefa !important;
  --card-bg-hover: #ffffff !important;
  --card-bg-featured: #f3efe7 !important;
  --text: #17242e !important;
  --text-muted: #40515b !important;
  --light-card-surface: #fffefa !important;
  --light-card-hover: #ffffff !important;
}

html[data-theme="light"] body,
html[data-theme="light"] .section,
html[data-theme="light"] .doubts-section,
html[data-theme="light"] .trust-bar {
  background-color: #f8f6f0 !important;
  background-image:
    radial-gradient(circle at 8% 12%, rgba(185, 138, 89, 0.08), transparent 24rem),
    radial-gradient(circle at 92% 76%, rgba(119, 166, 177, 0.07), transparent 28rem),
    var(--decor-platinum) !important;
}

html[data-theme="light"] #about,
html[data-theme="light"] #services,
html[data-theme="light"] #popular,
html[data-theme="light"] #faq,
html[data-theme="light"] #why-pro-lex,
html[data-theme="light"] #trust,
html[data-theme="light"] #articles,
html[data-theme="light"] .articles-home-section {
  background-color: #f8f6f0 !important;
}

html[data-theme="light"] .section-copy h2,
html[data-theme="light"] .doubts-header h2,
html[data-theme="light"] .section h2,
html[data-theme="light"] .section h3 {
  color: #17242e !important;
}

html[data-theme="light"] .section-copy p,
html[data-theme="light"] .doubts-header p,
html[data-theme="light"] .section > .container > p {
  color: #40515b !important;
}

html[data-theme="light"] #services .service-package-card {
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--package-accent-rgb), 0.2),
      rgba(var(--package-accent-rgb), 0.08) 54%,
      rgba(255, 255, 255, 0.98)
    ) !important;
}

html[data-theme="light"] #popular .service-package-card {
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--package-accent-rgb), 0.2),
      rgba(var(--package-accent-rgb), 0.08) 54%,
      rgba(255, 255, 255, 0.98)
    ) !important;
}

html[data-theme="light"] .doubt-item {
  border-color: rgba(68, 83, 91, 0.2) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.86), transparent 54%),
    #fffefa !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 14px 30px rgba(54, 64, 69, 0.1) !important;
}

html[data-theme="light"] .doubt-item:hover,
html[data-theme="light"] .doubt-item:focus-within {
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.96), transparent 56%),
    #ffffff !important;
  border-color: rgba(185, 138, 89, 0.56) !important;
}

/* Highest-specificity finish: keeps the compact service treatment above legacy card rules. */
html[data-theme="light"] body #services .service-package-card,
html:not([data-theme="light"]) body #services .service-package-card {
  min-height: 326px !important;
  gap: 10px !important;
  padding: 18px !important;
}

html[data-theme="light"] body #services .service-package-card .package-heading h3,
html:not([data-theme="light"]) body #services .service-package-card .package-heading h3 {
  font-size: clamp(1.36rem, 1.85vw, 1.72rem) !important;
  font-weight: 600 !important;
  letter-spacing: -0.025em !important;
  line-height: 1.13 !important;
}

html[data-theme="light"] body #services .service-package-card .package-link,
html:not([data-theme="light"]) body #services .service-package-card .package-link,
html[data-theme="light"] body #popular .service-package-card .package-link,
html:not([data-theme="light"]) body #popular .service-package-card .package-link {
  min-height: 46px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(218, 174, 122, 0.92) !important;
  border-radius: 4px !important;
  background: #c7925d !important;
  color: #17120d !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

/* One lightness step for the light-theme block hierarchy; article cards stay intentionally dark. */
html[data-theme="light"] {
  --page-bg: #fbfaf8 !important;
  --section-bg: #f6f5f2 !important;
  --section-alt: #fcfbf9 !important;
  --section-strong: #efeee9 !important;
  --surface: #fbfaf8 !important;
  --surface-low: #f6f5f2 !important;
  --surface-container: #fcfbf9 !important;
  --surface-high: #ffffff !important;
  --surface-variant: #f0efeb !important;
  --card-bg: #ffffff !important;
  --card-bg-hover: #ffffff !important;
  --card-bg-featured: #fdfcf9 !important;
  --light-card-surface: #ffffff !important;
  --light-card-hover: #ffffff !important;
}

html[data-theme="light"] .section-muted,
html[data-theme="light"] .trust-bar,
html[data-theme="light"] .subscription-benefits,
html[data-theme="light"] .subscription-comparison-section,
html[data-theme="light"] .subscription-faq-section {
  background-color: #f6f5f2 !important;
}

html[data-theme="light"] #about,
html[data-theme="light"] #popular,
html[data-theme="light"] .articles-home-section,
html[data-theme="light"] .article-archive-page,
html[data-theme="light"] .article-detail-page,
html[data-theme="light"] .pricing-page,
html[data-theme="light"] .service-archive-page,
html[data-theme="light"] .service-detail-page,
html[data-theme="light"] .work-pricing-section {
  background-color: #fbfaf8 !important;
}

html[data-theme="light"] .area-card,
html[data-theme="light"] .service-package-card,
html[data-theme="light"] .service-choice-card,
html[data-theme="light"] .service-directory-card,
html[data-theme="light"] .service-info-card,
html[data-theme="light"] .pricing-service-item,
html[data-theme="light"] .pricing-format-card,
html[data-theme="light"] .pricing-decision-card,
html[data-theme="light"] .subscription-plan,
html[data-theme="light"] .subscription-faq-list details,
html[data-theme="light"] .contacts-panel,
html[data-theme="light"] .contacts-row,
html[data-theme="light"] .contact-form,
html[data-theme="light"] .contact-dialog-panel,
html[data-theme="light"] .list-card,
html[data-theme="light"] .wide-link,
html[data-theme="light"] .trust-note,
html[data-theme="light"] .doubt-item,
html[data-theme="light"] .faq-list details,
html[data-theme="light"] .workflow-step-surface,
html[data-theme="light"] .subscription-benefit {
  background-color: #ffffff !important;
}

/* The services catalogue uses the same refined package-card language as Popular services. */
#services .service-package-card {
  --package-accent-rgb: var(--area-accent-rgb);
  min-height: 390px !important;
  gap: 14px !important;
  border-radius: 6px !important;
  padding: 22px !important;
  background-color: var(--card-bg) !important;
  background-image: none !important;
  text-align: left !important;
}

#services .service-package-card .package-card-logo {
  position: absolute !important;
  right: clamp(18px, 2.4vw, 30px) !important;
  bottom: clamp(72px, 8vw, 112px) !important;
  z-index: 0 !important;
  color: rgb(var(--package-accent-rgb)) !important;
  font-size: clamp(6.2rem, 10vw, 9.2rem) !important;
  line-height: 1 !important;
  opacity: 0.075 !important;
  pointer-events: none !important;
  transform: rotate(-7deg) !important;
  transition: opacity 260ms ease, transform 360ms cubic-bezier(0.22, 1, 0.36, 1) !important;
}

#services .service-package-card:hover .package-card-logo,
#services .service-package-card:focus-within .package-card-logo {
  opacity: 0.12 !important;
  transform: rotate(-4deg) scale(1.035) !important;
}

#services .service-package-card .package-heading,
#services .service-package-card .service-package-description,
#services .service-package-card .package-link {
  position: relative;
  z-index: 1;
}

#services .service-package-card .package-heading h3 {
  max-width: 380px;
  font-size: clamp(1.2rem, 1.6vw, 1.48rem) !important;
  line-height: 1.18 !important;
}

#services .service-package-card .package-heading > .material-symbols-outlined {
  color: rgb(var(--package-accent-rgb)) !important;
}

#services .service-package-description {
  margin: 0 !important;
  max-width: 44ch;
  color: var(--text-muted) !important;
  font-size: 0.92rem !important;
  line-height: 1.62 !important;
}

#services .service-package-card .package-link {
  display: inline-flex !important;
  width: 100% !important;
  min-height: 44px !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: auto !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(var(--package-accent-rgb), 0.34) !important;
  border-radius: 4px !important;
  background:
    linear-gradient(110deg, rgba(var(--package-accent-rgb), 0.1), transparent 62%),
    rgba(var(--ink-rgb), 0.16) !important;
  color: rgb(var(--package-accent-rgb)) !important;
}

#services .service-package-card .package-link:hover,
#services .service-package-card .package-link:focus-visible {
  border-color: rgba(var(--package-accent-rgb), 0.66) !important;
  background:
    linear-gradient(110deg, rgba(var(--package-accent-rgb), 0.18), transparent 66%),
    rgba(var(--package-accent-rgb), 0.06) !important;
  color: rgb(var(--package-accent-rgb)) !important;
}

html:not([data-theme="light"]) #services .service-package-card,
html:not([data-theme="light"]) #services .service-package-card:hover,
html:not([data-theme="light"]) #services .service-package-card:focus-within {
  border-color: rgba(var(--gold-rgb), 0.24) !important;
  background-color: var(--graphite-card) !important;
  background-image:
    linear-gradient(145deg, rgba(255, 255, 255, 0.045), transparent 44%),
    linear-gradient(320deg, rgba(255, 255, 255, 0.018), transparent 42%) !important;
}

html:not([data-theme="light"]) #services .service-package-card:hover,
html:not([data-theme="light"]) #services .service-package-card:focus-within {
  border-color: rgba(var(--gold-rgb), 0.52) !important;
  background-color: var(--graphite-card-hover) !important;
  background-image: linear-gradient(145deg, rgba(255, 255, 255, 0.065), transparent 48%) !important;
}

html[data-theme="light"] #services .service-package-card,
html[data-theme="light"] #services .service-package-card:hover,
html[data-theme="light"] #services .service-package-card:focus-within {
  border-color: rgba(var(--package-accent-rgb), 0.34) !important;
  background-color: #ffffff !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--package-accent-rgb), 0.14),
      rgba(var(--package-accent-rgb), 0.045) 54%,
      rgba(255, 255, 255, 0.98)
    ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 12px 28px rgba(var(--ink-rgb), 0.08) !important;
}

html[data-theme="light"] #services .service-package-card:hover,
html[data-theme="light"] #services .service-package-card:focus-within {
  border-color: rgba(var(--package-accent-rgb), 0.62) !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--package-accent-rgb), 0.19),
      rgba(var(--package-accent-rgb), 0.065) 58%,
      rgba(255, 255, 255, 0.99)
    ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 18px 34px rgba(var(--ink-rgb), 0.12) !important;
}

@media (min-width: 981px) {
  #services .service-package-card.area-card-wide {
    display: grid !important;
    grid-template-columns: minmax(240px, 0.78fr) minmax(0, 1fr) minmax(168px, 220px) !important;
    column-gap: clamp(20px, 3vw, 44px) !important;
    align-items: center !important;
  }

  #services .service-package-card.area-card-wide .package-heading {
    grid-column: 1;
    grid-row: 1;
  }

  #services .service-package-card.area-card-wide .service-package-description {
    grid-column: 2;
    grid-row: 1;
    max-width: none;
  }

  #services .service-package-card.area-card-wide .package-link {
    grid-column: 3;
    grid-row: 1;
    align-self: center;
  }
}

/* Runtime theme uses html.light. Keep article cards dark in the light page theme. */
html.light .article-card,
html.light .article-card:hover,
html.light .article-card:focus-visible {
  border-color: rgba(218, 179, 126, 0.42) !important;
  background-color: #151817 !important;
  background-image: none !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 18px 42px rgba(12, 14, 14, 0.26) !important;
}

html.light .article-card::before {
  filter: saturate(1.08) contrast(1.22) brightness(0.84) !important;
  opacity: 0.82 !important;
}

html.light .article-card::after,
html.light .article-card:hover::after,
html.light .article-card:focus-visible::after {
  background:
    linear-gradient(105deg, rgba(7, 9, 9, 0.86) 0%, rgba(13, 16, 16, 0.66) 52%, rgba(18, 18, 16, 0.38) 100%),
    linear-gradient(118deg, transparent 0 54%, rgba(191, 133, 74, 0.2) 54.12% 54.3%, transparent 54.48% 100%),
    linear-gradient(90deg, rgba(191, 133, 74, 0.035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px) !important;
  background-size: 100% 100%, 100% 100%, 74px 74px, 74px 74px !important;
  opacity: 1 !important;
}

html.light .article-card-index,
html.light .article-card-icon,
html.light .article-card-meta,
html.light .article-card-meta .material-symbols-outlined,
html.light .article-card strong,
html.light .article-card h2,
html.light .article-card-description,
html.light .article-card p {
  color: #ffffff !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.88) !important;
}

html.light .article-card-icon {
  background: rgba(191, 133, 74, 0.16) !important;
}

html.light .article-card-category,
html.light .article-card-link,
html.light .article-card-link .material-symbols-outlined {
  color: #c18b52 !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.88) !important;
}

/* The light contact form stays a readable light panel while the article cards remain dark. */
html.light .contact-form:not(.contact-form-compact),
html.light .contact-dialog .contact-dialog-panel {
  border-color: rgba(23, 36, 46, 0.2) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.9), transparent 44%),
    #fffefa !important;
  color: #17242e !important;
}

html.light .contact-form:not(.contact-form-compact) .form-field span,
html.light .contact-form:not(.contact-form-compact) .form-brief-summary > span:first-child,
html.light .contact-form:not(.contact-form-compact) .form-segment-group legend,
html.light .contact-dialog .contact-dialog-header h2,
html.light .contact-dialog .form-field span {
  color: #17242e !important;
}

html.light .contact-form:not(.contact-form-compact) .form-field input,
html.light .contact-form:not(.contact-form-compact) .form-field textarea,
html.light .contact-dialog .form-field input,
html.light .contact-dialog .form-field textarea {
  border-color: rgba(23, 36, 46, 0.22) !important;
  background: #f6f8f8 !important;
  color: #17242e !important;
  caret-color: #17242e !important;
}

html.light .contact-form:not(.contact-form-compact) .form-field input::placeholder,
html.light .contact-form:not(.contact-form-compact) .form-field textarea::placeholder,
html.light .contact-dialog .form-field input::placeholder,
html.light .contact-dialog .form-field textarea::placeholder {
  color: rgba(23, 36, 46, 0.58) !important;
}

html.light .contact-form:not(.contact-form-compact) .form-field input:focus,
html.light .contact-form:not(.contact-form-compact) .form-field textarea:focus,
html.light .contact-dialog .form-field input:focus,
html.light .contact-dialog .form-field textarea:focus {
  border-color: rgba(117, 75, 40, 0.56) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(185, 138, 89, 0.14) !important;
}

html.light .contact-form:not(.contact-form-compact) .form-hint,
html.light .contact-form:not(.contact-form-compact) .form-status,
html.light .contact-form:not(.contact-form-compact) .form-trust-list,
html.light .contact-dialog .form-hint,
html.light .contact-dialog .form-status,
html.light .contact-dialog .form-trust-list {
  color: #526777 !important;
}

html.light .contact-form:not(.contact-form-compact) .form-footer .button-primary,
html.light .contact-dialog .form-footer .button-primary {
  border-color: #1f2426 !important;
  background: linear-gradient(135deg, #3b4143 0%, #1f2426 100%) !important;
  color: #f7f6f3 !important;
}

/* Article cards are intentionally dark in both themes; the page around them stays light. */
.articles-home-section .article-card,
.article-archive-page .article-card,
.article-directory-card,
.articles-home-section .article-card:hover,
.articles-home-section .article-card:focus-visible,
.article-archive-page .article-card:hover,
.article-archive-page .article-card:focus-visible,
.article-directory-card:hover,
.article-directory-card:focus-visible {
  border-color: rgba(218, 179, 126, 0.42) !important;
  background-color: #151817 !important;
  background-image: none !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 18px 42px rgba(12, 14, 14, 0.26) !important;
}

.articles-home-section .article-card::before,
.article-archive-page .article-card::before,
.article-directory-card::before {
  filter: saturate(1.08) contrast(1.22) brightness(0.84) !important;
  opacity: 0.82 !important;
}

.articles-home-section .article-card::after,
.article-archive-page .article-card::after,
.article-directory-card::after,
.articles-home-section .article-card:hover::after,
.articles-home-section .article-card:focus-visible::after,
.article-archive-page .article-card:hover::after,
.article-archive-page .article-card:focus-visible::after,
.article-directory-card:hover::after,
.article-directory-card:focus-visible::after {
  background:
    linear-gradient(105deg, rgba(7, 9, 9, 0.86) 0%, rgba(13, 16, 16, 0.66) 52%, rgba(18, 18, 16, 0.38) 100%),
    linear-gradient(118deg, transparent 0 54%, rgba(191, 133, 74, 0.2) 54.12% 54.3%, transparent 54.48% 100%),
    linear-gradient(90deg, rgba(191, 133, 74, 0.035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px) !important;
  background-size: 100% 100%, 100% 100%, 74px 74px, 74px 74px !important;
  opacity: 1 !important;
}

.articles-home-section .article-card-index,
.articles-home-section .article-card-icon,
.articles-home-section .article-card-meta,
.articles-home-section .article-card-meta .material-symbols-outlined,
.articles-home-section .article-card strong,
.articles-home-section .article-card h2,
.articles-home-section .article-card-description,
.articles-home-section .article-card p,
.article-archive-page .article-card-index,
.article-archive-page .article-card-icon,
.article-archive-page .article-card-meta,
.article-archive-page .article-card-meta .material-symbols-outlined,
.article-archive-page .article-card strong,
.article-archive-page .article-card h2,
.article-archive-page .article-card-description,
.article-archive-page .article-card p,
.article-directory-card .article-card-index,
.article-directory-card .article-card-icon,
.article-directory-card .article-card-meta,
.article-directory-card .article-card-meta .material-symbols-outlined,
.article-directory-card strong,
.article-directory-card h2,
.article-directory-card .article-card-description,
.article-directory-card p {
  color: #ffffff !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.88) !important;
}

.articles-home-section .article-card-icon,
.article-archive-page .article-card-icon,
.article-directory-card .article-card-icon {
  background: rgba(191, 133, 74, 0.16) !important;
}

.articles-home-section .article-card-category,
.articles-home-section .article-card-link,
.articles-home-section .article-card-link .material-symbols-outlined,
.article-archive-page .article-card-category,
.article-archive-page .article-card-link,
.article-archive-page .article-card-link .material-symbols-outlined,
.article-directory-card .article-card-category,
.article-directory-card .article-card-link,
.article-directory-card .article-card-link .material-symbols-outlined {
  color: #c18b52 !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.88) !important;
}

/* Exact article-card direction: dark surface with bright, high-contrast copy. */
html[data-theme="light"] .article-card,
html[data-theme="light"] .article-card:hover,
html[data-theme="light"] .article-card:focus-visible {
  border-color: rgba(var(--article-bronze-rgb), 0.34) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.045), transparent 44%),
    linear-gradient(320deg, rgba(255, 255, 255, 0.018), transparent 42%),
    #111313 !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 18px 42px rgba(0, 0, 0, 0.24) !important;
}

html[data-theme="light"] .article-card:hover,
html[data-theme="light"] .article-card:focus-visible {
  border-color: rgba(var(--article-bronze-rgb), 0.72) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.07), transparent 48%),
    #1b1c1c !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    0 24px 48px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="light"] .article-card::before {
  filter: saturate(1.16) contrast(1.14) brightness(0.94) !important;
  opacity: 0.62 !important;
}

html[data-theme="light"] .article-card:hover::before,
html[data-theme="light"] .article-card:focus-visible::before {
  opacity: 0.72 !important;
}

html[data-theme="light"] .article-card::after {
  background:
    radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 0%), rgba(var(--article-bronze-rgb), 0.12), transparent 34%),
    linear-gradient(105deg, rgba(17, 19, 19, 0.9) 0%, rgba(17, 19, 19, 0.76) 52%, rgba(17, 19, 19, 0.52) 100%),
    linear-gradient(118deg, transparent 0 54%, rgba(var(--article-bronze-rgb), 0.17) 54.12% 54.28%, transparent 54.44% 100%) !important;
  opacity: 1 !important;
}

html[data-theme="light"] .article-card-index,
html[data-theme="light"] .article-card-icon,
html[data-theme="light"] .article-card-meta,
html[data-theme="light"] .article-card-meta .material-symbols-outlined,
html[data-theme="light"] .article-card strong,
html[data-theme="light"] .article-card h2,
html[data-theme="light"] .article-card-description,
html[data-theme="light"] .article-card p {
  color: #ffffff !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.84) !important;
}

html[data-theme="light"] .article-card-description,
html[data-theme="light"] .article-card p {
  color: rgba(255, 255, 255, 0.88) !important;
}

html[data-theme="light"] .article-card-category,
html[data-theme="light"] .article-card-link,
html[data-theme="light"] .article-card-link .material-symbols-outlined {
  color: rgb(var(--article-bronze-rgb)) !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.84) !important;
}

html[data-theme="light"] .article-card-icon {
  background: rgba(var(--article-bronze-rgb), 0.16) !important;
  color: rgb(var(--article-bronze-rgb)) !important;
}

html[data-theme="light"] .service-choice-card > .material-symbols-outlined:first-child,
html[data-theme="light"] .service-choice-card .service-choice-arrow {
  color: rgb(var(--choice-accent-rgb)) !important;
  filter: none !important;
}

/* Let each service card carry a quiet wash of the same color as its small logo. */
html[data-theme="light"] .area-card,
html[data-theme="light"] .service-directory-card {
  background-color: #fffefa !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--area-accent-rgb), 0.105),
      rgba(var(--area-accent-rgb), 0.035) 54%,
      rgba(255, 254, 250, 0.94)
    ) !important;
}

html[data-theme="light"] .area-card:hover,
html[data-theme="light"] .area-card:focus-within,
html[data-theme="light"] .service-directory-card:hover,
html[data-theme="light"] .service-directory-card:focus-within {
  background-color: #fffefa !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--area-accent-rgb), 0.15),
      rgba(var(--area-accent-rgb), 0.055) 58%,
      rgba(255, 254, 250, 0.96)
    ) !important;
}

/* Article surfaces: keep the editorial section as contrast-rich as the dark theme. */
html[data-theme="light"] {
  --article-graphite: #111313;
  --article-graphite-hover: #1b1c1c;
  --article-graphite-deep: #0d0e0e;
  --article-ivory: #f5f1e9;
  --article-muted: #d0c9be;
  --article-bronze-rgb: 185, 138, 89;
  --article-dark-decor:
    linear-gradient(90deg, rgba(185, 138, 89, 0.034) 1px, transparent 1px),
    linear-gradient(180deg, rgba(229, 222, 210, 0.018) 1px, transparent 1px),
    linear-gradient(135deg, transparent 0 48%, rgba(185, 138, 89, 0.022) 48.1% 48.28%, transparent 48.42% 100%);
}

html[data-theme="light"] .articles-home-section,
html[data-theme="light"] .work-pricing-section > .articles-home-section,
html[data-theme="light"] .article-archive-page,
html[data-theme="light"] .article-detail-page {
  background-color: var(--article-graphite-deep) !important;
  background-image: var(--article-dark-decor) !important;
  background-position: center top !important;
  background-repeat: repeat !important;
  background-size: 104px 104px, 104px 104px, 208px 208px !important;
  color: var(--article-ivory) !important;
}

html[data-theme="light"] .articles-home-section .section-copy h2,
html[data-theme="light"] .articles-home-section .section-copy p,
html[data-theme="light"] .articles-home-section .section-kicker,
html[data-theme="light"] .articles-home-section .articles-home-link {
  color: var(--article-ivory) !important;
}

html[data-theme="light"] .articles-home-section .section-copy p {
  color: rgba(245, 241, 233, 0.72) !important;
}

html[data-theme="light"] .articles-home-section .section-kicker,
html[data-theme="light"] .articles-home-section .articles-home-link,
html[data-theme="light"] .articles-home-section .articles-home-link .material-symbols-outlined {
  color: rgb(var(--article-bronze-rgb)) !important;
}

html[data-theme="light"] .articles-home-section .article-card,
html[data-theme="light"] .article-archive-page .article-card {
  border-color: rgba(var(--article-bronze-rgb), 0.28) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.045), transparent 44%),
    linear-gradient(320deg, rgba(255, 255, 255, 0.018), transparent 42%),
    var(--article-graphite) !important;
  color: var(--article-ivory) !important;
  box-shadow:
    inset 0 1px 0 rgba(235, 241, 242, 0.045),
    0 18px 42px rgba(0, 0, 0, 0.2) !important;
}

html[data-theme="light"] .articles-home-section .article-card:hover,
html[data-theme="light"] .articles-home-section .article-card:focus-visible,
html[data-theme="light"] .article-archive-page .article-card:hover,
html[data-theme="light"] .article-archive-page .article-card:focus-visible {
  border-color: rgba(var(--article-bronze-rgb), 0.66) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.065), transparent 48%),
    var(--article-graphite-hover) !important;
  box-shadow:
    inset 0 1px 0 rgba(235, 241, 242, 0.065),
    0 22px 46px rgba(0, 0, 0, 0.28) !important;
}

html[data-theme="light"] .articles-home-section .article-card::after,
html[data-theme="light"] .article-archive-page .article-card::after {
  background:
    radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 0%), rgba(var(--article-bronze-rgb), 0.11), transparent 34%),
    linear-gradient(105deg, rgba(17, 19, 19, 0.94) 0%, rgba(17, 19, 19, 0.78) 52%, rgba(17, 19, 19, 0.56) 100%),
    linear-gradient(118deg, transparent 0 54%, rgba(var(--article-bronze-rgb), 0.13) 54.12% 54.28%, transparent 54.44% 100%) !important;
  opacity: 1 !important;
}

html[data-theme="light"] .articles-home-section .article-card:hover::after,
html[data-theme="light"] .articles-home-section .article-card:focus-visible::after,
html[data-theme="light"] .article-archive-page .article-card:hover::after,
html[data-theme="light"] .article-archive-page .article-card:focus-visible::after {
  opacity: 0.82 !important;
}

html[data-theme="light"] .articles-home-section .article-card-index,
html[data-theme="light"] .articles-home-section .article-card-icon,
html[data-theme="light"] .articles-home-section .article-card-category,
html[data-theme="light"] .articles-home-section .article-card-meta,
html[data-theme="light"] .articles-home-section .article-card-meta .material-symbols-outlined,
html[data-theme="light"] .articles-home-section .article-card strong,
html[data-theme="light"] .articles-home-section .article-card h2,
html[data-theme="light"] .articles-home-section .article-card-description,
html[data-theme="light"] .articles-home-section .article-card p,
html[data-theme="light"] .articles-home-section .article-card-link,
html[data-theme="light"] .article-archive-page .article-card-index,
html[data-theme="light"] .article-archive-page .article-card-icon,
html[data-theme="light"] .article-archive-page .article-card-category,
html[data-theme="light"] .article-archive-page .article-card-meta,
html[data-theme="light"] .article-archive-page .article-card-meta .material-symbols-outlined,
html[data-theme="light"] .article-archive-page .article-card strong,
html[data-theme="light"] .article-archive-page .article-card h2,
html[data-theme="light"] .article-archive-page .article-card-description,
html[data-theme="light"] .article-archive-page .article-card p,
html[data-theme="light"] .article-archive-page .article-card-link {
  color: var(--article-ivory) !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.72) !important;
}

html[data-theme="light"] .articles-home-section .article-card-category,
html[data-theme="light"] .articles-home-section .article-card-link,
html[data-theme="light"] .articles-home-section .article-card-link .material-symbols-outlined,
html[data-theme="light"] .article-archive-page .article-card-category,
html[data-theme="light"] .article-archive-page .article-card-link,
html[data-theme="light"] .article-archive-page .article-card-link .material-symbols-outlined {
  color: rgb(var(--article-bronze-rgb)) !important;
}

html[data-theme="light"] .articles-home-section .article-card-description,
html[data-theme="light"] .articles-home-section .article-card p,
html[data-theme="light"] .article-archive-page .article-card-description,
html[data-theme="light"] .article-archive-page .article-card p,
html[data-theme="light"] .article-archive-page .article-results-meta {
  color: var(--article-muted) !important;
}

html[data-theme="light"] .articles-home-section .article-card-icon,
html[data-theme="light"] .article-archive-page .article-card-icon {
  background: rgba(var(--article-bronze-rgb), 0.12) !important;
  color: rgb(var(--article-bronze-rgb)) !important;
}

html[data-theme="light"] .articles-home-section .article-card-index,
html[data-theme="light"] .article-archive-page .article-card-index {
  color: rgba(var(--article-bronze-rgb), 0.78) !important;
}

/* Archive controls follow the same graphite / bronze language. */
html[data-theme="light"] .article-archive-page .article-category-strip button,
html[data-theme="light"] .article-archive-page .article-results-meta button,
html[data-theme="light"] .article-archive-page .article-search-control,
html[data-theme="light"] .article-archive-page .article-archive-tools,
html[data-theme="light"] .article-archive-page .article-empty-state {
  border-color: rgba(var(--article-bronze-rgb), 0.28) !important;
  background: rgba(17, 19, 19, 0.82) !important;
  color: var(--article-muted) !important;
}

html[data-theme="light"] .article-archive-page .article-category-strip button:hover,
html[data-theme="light"] .article-archive-page .article-category-strip button:focus-visible,
html[data-theme="light"] .article-archive-page .article-category-strip button.is-active,
html[data-theme="light"] .article-archive-page .article-results-meta button:hover,
html[data-theme="light"] .article-archive-page .article-results-meta button:focus-visible,
html[data-theme="light"] .article-archive-page .article-search-control:focus-within {
  border-color: rgba(var(--article-bronze-rgb), 0.72) !important;
  background: rgba(27, 28, 28, 0.96) !important;
  color: var(--article-ivory) !important;
  box-shadow: 0 0 0 4px rgba(var(--article-bronze-rgb), 0.1) !important;
}

html[data-theme="light"] .article-archive-page .article-search-control .material-symbols-outlined,
html[data-theme="light"] .article-archive-page .article-results-meta button,
html[data-theme="light"] .article-archive-page .article-category-strip button.is-active {
  color: rgb(var(--article-bronze-rgb)) !important;
}

html[data-theme="light"] .article-archive-page .article-search-control input {
  color: var(--article-ivory) !important;
}

html[data-theme="light"] .article-archive-page .article-search-control input::placeholder {
  color: rgba(208, 201, 190, 0.64) !important;
}

/* Article detail: summary, featured lists and the table-of-contents share the dark-theme contrast. */
html[data-theme="light"] .article-detail-page .article-summary,
html[data-theme="light"] .article-detail-page .article-markdown--featured-lists > ol:nth-of-type(1) > li {
  border-color: rgba(var(--article-bronze-rgb), 0.28) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.045), transparent 44%),
    var(--article-graphite) !important;
  color: var(--article-ivory) !important;
  box-shadow:
    inset 0 1px 0 rgba(235, 241, 242, 0.045),
    0 18px 42px rgba(0, 0, 0, 0.2) !important;
}

html[data-theme="light"] .article-detail-page .article-summary-header h2,
html[data-theme="light"] .article-detail-page .article-summary-kicker,
html[data-theme="light"] .article-detail-page .article-summary-card h3,
html[data-theme="light"] .article-detail-page .article-summary-card p,
html[data-theme="light"] .article-detail-page .article-markdown h2,
html[data-theme="light"] .article-detail-page .article-markdown h3,
html[data-theme="light"] .article-detail-page .article-markdown p,
html[data-theme="light"] .article-detail-page .article-markdown li,
html[data-theme="light"] .article-detail-page .article-markdown li strong {
  color: var(--article-ivory) !important;
}

html[data-theme="light"] .article-detail-page .article-summary-card p,
html[data-theme="light"] .article-detail-page .article-markdown p,
html[data-theme="light"] .article-detail-page .article-markdown li {
  color: var(--article-muted) !important;
}

html[data-theme="light"] .article-detail-page .article-summary-kicker,
html[data-theme="light"] .article-detail-page .article-summary-number,
html[data-theme="light"] .article-detail-page .article-summary-card > .material-symbols-outlined,
html[data-theme="light"] .article-detail-page .article-markdown ul li::before,
html[data-theme="light"] .article-detail-page .article-markdown ol li::marker {
  color: rgb(var(--article-bronze-rgb)) !important;
}

html[data-theme="light"] .article-detail-page .article-summary-grid {
  border-color: rgba(var(--article-bronze-rgb), 0.24) !important;
  background: rgba(var(--article-bronze-rgb), 0.2) !important;
}

html[data-theme="light"] .article-detail-page .article-summary-card {
  background: rgba(13, 14, 14, 0.9) !important;
}

html[data-theme="light"] .article-detail-page .article-summary-card:hover {
  background: var(--article-graphite-hover) !important;
}

html[data-theme="light"] .article-detail-page .article-markdown--featured-lists > ol:nth-of-type(1) > li::before,
html[data-theme="light"] .article-detail-page .article-markdown--featured-lists > ol:nth-of-type(2) > li::before {
  border-color: rgba(var(--article-bronze-rgb), 0.52) !important;
  background: var(--article-graphite-deep) !important;
  color: rgb(var(--article-bronze-rgb)) !important;
}

html[data-theme="light"] .article-detail-page .article-markdown--featured-lists > ol:nth-of-type(2) > li::after {
  background: linear-gradient(rgba(var(--article-bronze-rgb), 0.56), rgba(var(--article-bronze-rgb), 0.12)) !important;
}

html[data-theme="light"] .article-detail-page .article-toc .service-direction-link-copy > strong,
html[data-theme="light"] .article-detail-page .article-toc .service-direction-link {
  color: var(--article-muted) !important;
}

html[data-theme="light"] .article-detail-page .article-toc .service-direction-link:hover,
html[data-theme="light"] .article-detail-page .article-toc .service-direction-link:focus-visible,
html[data-theme="light"] .article-detail-page .article-toc .service-direction-link.is-active {
  background: rgba(var(--article-bronze-rgb), 0.12) !important;
  color: var(--article-ivory) !important;
}

html[data-theme="light"] .article-detail-page .article-toc .service-direction-link.is-active .service-direction-link-copy > strong,
html[data-theme="light"] .article-detail-page .article-toc .service-direction-link::before,
html[data-theme="light"] .article-detail-page .article-toc .service-direction-link::after {
  color: rgb(var(--article-bronze-rgb)) !important;
}

/* Final light-theme correction: airy article pages, crisp light cards, and lighter homepage cards. */
html[data-theme="light"] .articles-home-section,
html[data-theme="light"] .work-pricing-section > .articles-home-section,
html[data-theme="light"] .article-archive-page,
html[data-theme="light"] .article-detail-page {
  background-color: var(--page-bg) !important;
  background-image: var(--decor-platinum) !important;
  background-position: center top !important;
  background-repeat: repeat !important;
  background-size: var(--decor-size) !important;
  color: var(--text) !important;
}

html[data-theme="light"] .articles-home-section .section-copy h2,
html[data-theme="light"] .articles-home-section .section-copy p,
html[data-theme="light"] .articles-home-section .section-kicker,
html[data-theme="light"] .articles-home-section .articles-home-link {
  color: var(--text) !important;
}

html[data-theme="light"] .articles-home-section .section-copy p {
  color: var(--text-muted) !important;
}

html[data-theme="light"] .articles-home-section .section-kicker,
html[data-theme="light"] .articles-home-section .articles-home-link,
html[data-theme="light"] .articles-home-section .articles-home-link .material-symbols-outlined {
  color: var(--primary-strong) !important;
}

html[data-theme="light"] .articles-home-section .article-card,
html[data-theme="light"] .article-archive-page .article-card {
  border-color: rgba(var(--ink-rgb), 0.28) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(var(--article-bronze-rgb), 0.035) 70%),
    #fffefa !important;
  color: #1d252a !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 16px 34px rgba(var(--ink-rgb), 0.14) !important;
}

html[data-theme="light"] .articles-home-section .article-card:hover,
html[data-theme="light"] .articles-home-section .article-card:focus-visible,
html[data-theme="light"] .article-archive-page .article-card:hover,
html[data-theme="light"] .article-archive-page .article-card:focus-visible {
  border-color: rgba(var(--article-bronze-rgb), 0.62) !important;
  background:
    linear-gradient(145deg, #ffffff, rgba(var(--article-bronze-rgb), 0.075) 70%),
    #fffefa !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 22px 44px rgba(var(--ink-rgb), 0.2) !important;
}

html[data-theme="light"] .articles-home-section .article-card::after,
html[data-theme="light"] .article-archive-page .article-card::after {
  background:
    radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 0%), rgba(var(--article-bronze-rgb), 0.08), transparent 34%),
    linear-gradient(105deg, rgba(255, 253, 247, 0.86) 0%, rgba(255, 253, 247, 0.66) 52%, rgba(255, 253, 247, 0.38) 100%),
    linear-gradient(118deg, transparent 0 54%, rgba(var(--article-bronze-rgb), 0.12) 54.12% 54.28%, transparent 54.44% 100%) !important;
  opacity: 1 !important;
}

html[data-theme="light"] .articles-home-section .article-card-index,
html[data-theme="light"] .articles-home-section .article-card-icon,
html[data-theme="light"] .articles-home-section .article-card-meta,
html[data-theme="light"] .articles-home-section .article-card-meta .material-symbols-outlined,
html[data-theme="light"] .articles-home-section .article-card strong,
html[data-theme="light"] .articles-home-section .article-card h2,
html[data-theme="light"] .articles-home-section .article-card-description,
html[data-theme="light"] .articles-home-section .article-card p,
html[data-theme="light"] .article-archive-page .article-card-index,
html[data-theme="light"] .article-archive-page .article-card-icon,
html[data-theme="light"] .article-archive-page .article-card-meta,
html[data-theme="light"] .article-archive-page .article-card-meta .material-symbols-outlined,
html[data-theme="light"] .article-archive-page .article-card strong,
html[data-theme="light"] .article-archive-page .article-card h2,
html[data-theme="light"] .article-archive-page .article-card-description,
html[data-theme="light"] .article-archive-page .article-card p {
  color: #1d252a !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.86) !important;
}

html[data-theme="light"] .articles-home-section .article-card-icon,
html[data-theme="light"] .article-archive-page .article-card-icon {
  background: rgba(var(--article-bronze-rgb), 0.1) !important;
  color: rgb(var(--article-bronze-rgb)) !important;
}

html[data-theme="light"] .articles-home-section .article-card-category,
html[data-theme="light"] .articles-home-section .article-card-link,
html[data-theme="light"] .articles-home-section .article-card-link .material-symbols-outlined,
html[data-theme="light"] .article-archive-page .article-card-category,
html[data-theme="light"] .article-archive-page .article-card-link,
html[data-theme="light"] .article-archive-page .article-card-link .material-symbols-outlined {
  color: var(--primary-deep) !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.86) !important;
}

html[data-theme="light"] .articles-home-section .article-card-description,
html[data-theme="light"] .articles-home-section .article-card p,
html[data-theme="light"] .article-archive-page .article-card-description,
html[data-theme="light"] .article-archive-page .article-card p,
html[data-theme="light"] .article-archive-page .article-results-meta {
  color: rgba(var(--ink-rgb), 0.76) !important;
}

html[data-theme="light"] .article-archive-page .article-category-strip button,
html[data-theme="light"] .article-archive-page .article-results-meta button,
html[data-theme="light"] .article-archive-page .article-search-control,
html[data-theme="light"] .article-archive-page .article-archive-tools,
html[data-theme="light"] .article-archive-page .article-empty-state {
  border-color: rgba(var(--ink-rgb), 0.18) !important;
  background: rgba(255, 254, 250, 0.88) !important;
  color: rgba(var(--ink-rgb), 0.72) !important;
  box-shadow: 0 10px 26px rgba(var(--ink-rgb), 0.06) !important;
}

html[data-theme="light"] .article-archive-page .article-category-strip button:hover,
html[data-theme="light"] .article-archive-page .article-category-strip button:focus-visible,
html[data-theme="light"] .article-archive-page .article-category-strip button.is-active,
html[data-theme="light"] .article-archive-page .article-results-meta button:hover,
html[data-theme="light"] .article-archive-page .article-results-meta button:focus-visible,
html[data-theme="light"] .article-archive-page .article-search-control:focus-within {
  border-color: rgba(var(--article-bronze-rgb), 0.56) !important;
  background: rgba(var(--article-bronze-rgb), 0.1) !important;
  color: var(--primary-deep) !important;
  box-shadow: 0 0 0 4px rgba(var(--article-bronze-rgb), 0.08) !important;
}

html[data-theme="light"] .article-archive-page .article-search-control input {
  color: rgba(var(--ink-rgb), 0.88) !important;
}

html[data-theme="light"] .article-archive-page .article-search-control input::placeholder {
  color: rgba(var(--ink-rgb), 0.56) !important;
}

html[data-theme="light"] .article-detail-page .article-summary,
html[data-theme="light"] .article-detail-page .article-markdown--featured-lists > ol:nth-of-type(1) > li {
  border-color: rgba(var(--ink-rgb), 0.2) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(var(--article-bronze-rgb), 0.035) 70%),
    #fffefa !important;
  color: #1d252a !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 16px 34px rgba(var(--ink-rgb), 0.12) !important;
}

html[data-theme="light"] .article-detail-page .article-summary-header h2,
html[data-theme="light"] .article-detail-page .article-summary-card h3,
html[data-theme="light"] .article-detail-page .article-markdown h2,
html[data-theme="light"] .article-detail-page .article-markdown h3,
html[data-theme="light"] .article-detail-page .article-markdown li strong {
  color: #1d252a !important;
}

html[data-theme="light"] .article-detail-page .article-summary-card p,
html[data-theme="light"] .article-detail-page .article-markdown p,
html[data-theme="light"] .article-detail-page .article-markdown li {
  color: rgba(var(--ink-rgb), 0.78) !important;
}

html[data-theme="light"] .article-detail-page .article-summary-kicker,
html[data-theme="light"] .article-detail-page .article-summary-number,
html[data-theme="light"] .article-detail-page .article-summary-card > .material-symbols-outlined,
html[data-theme="light"] .article-detail-page .article-markdown ul li::before,
html[data-theme="light"] .article-detail-page .article-markdown ol li::marker {
  color: var(--primary-deep) !important;
}

html[data-theme="light"] .article-detail-page .article-summary-grid {
  border-color: rgba(var(--ink-rgb), 0.16) !important;
  background: rgba(var(--ink-rgb), 0.12) !important;
}

html[data-theme="light"] .article-detail-page .article-summary-card {
  background: rgba(255, 254, 250, 0.96) !important;
}

html[data-theme="light"] .article-detail-page .article-summary-card:hover {
  background: #ffffff !important;
}

html[data-theme="light"] .article-detail-page .article-markdown--featured-lists > ol:nth-of-type(1) > li::before,
html[data-theme="light"] .article-detail-page .article-markdown--featured-lists > ol:nth-of-type(2) > li::before {
  border-color: rgba(var(--article-bronze-rgb), 0.46) !important;
  background: #fffefa !important;
  color: var(--primary-deep) !important;
}

html[data-theme="light"] .article-detail-page .article-markdown--featured-lists > ol:nth-of-type(2) > li::after {
  background: linear-gradient(rgba(var(--article-bronze-rgb), 0.46), rgba(var(--article-bronze-rgb), 0.12)) !important;
}

html[data-theme="light"] .article-detail-page .article-toc .service-direction-link-copy > strong,
html[data-theme="light"] .article-detail-page .article-toc .service-direction-link {
  color: rgba(var(--ink-rgb), 0.76) !important;
}

html[data-theme="light"] .article-detail-page .article-toc .service-direction-link:hover,
html[data-theme="light"] .article-detail-page .article-toc .service-direction-link:focus-visible,
html[data-theme="light"] .article-detail-page .article-toc .service-direction-link.is-active {
  background: rgba(var(--article-bronze-rgb), 0.1) !important;
  color: var(--primary-deep) !important;
}

/* Keep every homepage card airy while preserving the established logo accent colors. */
html[data-theme="light"] #services .area-card,
html[data-theme="light"] #popular .service-package-card,
html[data-theme="light"] .service-choice-card {
  background-color: #fffefa !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 12px 28px rgba(var(--ink-rgb), 0.08) !important;
}

html[data-theme="light"] #services .area-card:hover,
html[data-theme="light"] #services .area-card:focus-within,
html[data-theme="light"] #popular .service-package-card:hover,
html[data-theme="light"] #popular .service-package-card:focus-within,
html[data-theme="light"] .service-choice-card:hover,
html[data-theme="light"] .service-choice-card:focus-visible {
  background-color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    0 18px 34px rgba(var(--ink-rgb), 0.12) !important;
}

/* Final intensity pass: let article imagery read and let service accents lead. */
html[data-theme="light"] .articles-home-section .article-card::before,
html[data-theme="light"] .article-archive-page .article-card::before {
  filter: saturate(1.18) contrast(1.12) brightness(0.98) !important;
  opacity: 0.58 !important;
}

html[data-theme="light"] .articles-home-section .article-card:hover::before,
html[data-theme="light"] .articles-home-section .article-card:focus-visible::before,
html[data-theme="light"] .article-archive-page .article-card:hover::before,
html[data-theme="light"] .article-archive-page .article-card:focus-visible::before {
  opacity: 0.7 !important;
}

html[data-theme="light"] .articles-home-section .article-card::after,
html[data-theme="light"] .article-archive-page .article-card::after {
  background:
    radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 0%), rgba(var(--article-bronze-rgb), 0.1), transparent 34%),
    linear-gradient(105deg, rgba(255, 253, 247, 0.7) 0%, rgba(255, 253, 247, 0.42) 52%, rgba(255, 253, 247, 0.16) 100%),
    linear-gradient(118deg, transparent 0 54%, rgba(var(--article-bronze-rgb), 0.16) 54.12% 54.28%, transparent 54.44% 100%) !important;
}

html[data-theme="light"] #services .area-card,
html[data-theme="light"] .service-directory-card {
  border-color: rgba(var(--area-accent-rgb), 0.34) !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--area-accent-rgb), 0.2),
      rgba(var(--area-accent-rgb), 0.075) 54%,
      rgba(255, 254, 250, 0.94)
    ) !important;
}

html[data-theme="light"] #services .area-card:hover,
html[data-theme="light"] #services .area-card:focus-within,
html[data-theme="light"] .service-directory-card:hover,
html[data-theme="light"] .service-directory-card:focus-within {
  border-color: rgba(var(--area-accent-rgb), 0.62) !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--area-accent-rgb), 0.27),
      rgba(var(--area-accent-rgb), 0.105) 58%,
      rgba(255, 254, 250, 0.97)
    ) !important;
}

html[data-theme="light"] #popular .service-package-card {
  border-color: rgba(var(--package-accent-rgb), 0.34) !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--package-accent-rgb), 0.2),
      rgba(var(--package-accent-rgb), 0.075) 54%,
      rgba(255, 254, 250, 0.94)
    ) !important;
}

html[data-theme="light"] #popular .service-package-card:hover,
html[data-theme="light"] #popular .service-package-card:focus-within {
  border-color: rgba(var(--package-accent-rgb), 0.62) !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--package-accent-rgb), 0.27),
      rgba(var(--package-accent-rgb), 0.105) 58%,
      rgba(255, 254, 250, 0.97)
    ) !important;
}

html[data-theme="light"] .service-choice-card {
  border-color: rgba(var(--choice-accent-rgb), 0.34) !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--choice-accent-rgb), 0.2),
      rgba(var(--choice-accent-rgb), 0.075) 54%,
      rgba(255, 254, 250, 0.94)
    ) !important;
}

html[data-theme="light"] .service-choice-card:hover,
html[data-theme="light"] .service-choice-card:focus-visible {
  border-color: rgba(var(--choice-accent-rgb), 0.62) !important;
  background-image:
    linear-gradient(
      145deg,
      rgba(var(--choice-accent-rgb), 0.27),
      rgba(var(--choice-accent-rgb), 0.105) 58%,
      rgba(255, 254, 250, 0.97)
    ) !important;
}

/* Authoritative final theme layer: these rules intentionally stay last in the cascade. */
html[data-theme="light"] .article-card,
html[data-theme="light"] .article-card:hover,
html[data-theme="light"] .article-card:focus-visible {
  border-color: rgba(185, 138, 89, 0.38) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.045), transparent 44%),
    linear-gradient(320deg, rgba(255, 255, 255, 0.018), transparent 42%),
    #111313 !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 18px 42px rgba(0, 0, 0, 0.24) !important;
}

html[data-theme="light"] .article-card:hover,
html[data-theme="light"] .article-card:focus-visible {
  border-color: rgba(185, 138, 89, 0.78) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.07), transparent 48%),
    #1b1c1c !important;
}

html[data-theme="light"] .article-card::before {
  filter: saturate(1.16) contrast(1.14) brightness(0.94) !important;
  opacity: 0.62 !important;
}

html[data-theme="light"] .article-card:hover::before,
html[data-theme="light"] .article-card:focus-visible::before {
  opacity: 0.72 !important;
}

html[data-theme="light"] .article-card::after {
  background:
    radial-gradient(circle at var(--pointer-x, 50%) var(--pointer-y, 0%), rgba(185, 138, 89, 0.12), transparent 34%),
    linear-gradient(105deg, rgba(17, 19, 19, 0.9) 0%, rgba(17, 19, 19, 0.76) 52%, rgba(17, 19, 19, 0.52) 100%),
    linear-gradient(118deg, transparent 0 54%, rgba(185, 138, 89, 0.17) 54.12% 54.28%, transparent 54.44% 100%) !important;
  opacity: 1 !important;
}

html[data-theme="light"] .article-card-index,
html[data-theme="light"] .article-card-icon,
html[data-theme="light"] .article-card-meta,
html[data-theme="light"] .article-card-meta .material-symbols-outlined,
html[data-theme="light"] .article-card strong,
html[data-theme="light"] .article-card h2,
html[data-theme="light"] .article-card-description,
html[data-theme="light"] .article-card p {
  color: #ffffff !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.84) !important;
}

html[data-theme="light"] .article-card-category,
html[data-theme="light"] .article-card-link,
html[data-theme="light"] .article-card-link .material-symbols-outlined,
html[data-theme="light"] .article-card-icon {
  color: rgb(185, 138, 89) !important;
}

html[data-theme="light"] .article-card-icon {
  background: rgba(185, 138, 89, 0.16) !important;
}

/* Authoritative light contact form layer. */
html[data-theme="light"] .contact-form:not(.contact-form-compact) {
  display: grid !important;
  gap: 14px !important;
  border: 1px solid rgba(23, 36, 46, 0.22) !important;
  border-radius: 4px !important;
  padding: clamp(20px, 3vw, 25px) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.86), transparent 42%),
    linear-gradient(180deg, #fffefa 0%, #f1eee7 100%) !important;
  color: #17242e !important;
  color-scheme: light !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.96),
    0 24px 70px rgba(23, 36, 46, 0.16) !important;
}

html[data-theme="light"] .contact-form.contact-form-compact {
  display: grid !important;
  gap: 14px !important;
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #17120c !important;
}

html[data-theme="light"] .contact-form .form-field > span,
html[data-theme="light"] .contact-form .form-segment-group legend,
html[data-theme="light"] .contact-form .form-brief-summary > span:first-child {
  color: #17242e !important;
}

html[data-theme="light"] .contact-form .form-field input,
html[data-theme="light"] .contact-form .form-field textarea {
  border-color: rgba(23, 36, 46, 0.22) !important;
  background: #f6f8f8 !important;
  color: #17242e !important;
  caret-color: #17242e !important;
}

html[data-theme="light"] .contact-form .form-field input::placeholder,
html[data-theme="light"] .contact-form .form-field textarea::placeholder {
  color: rgba(23, 36, 46, 0.58) !important;
}

html[data-theme="light"] .contact-form .form-field input:focus,
html[data-theme="light"] .contact-form .form-field textarea:focus {
  border-color: rgba(117, 75, 40, 0.56) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(185, 138, 89, 0.14) !important;
}

html[data-theme="light"] .contact-form .form-hint,
html[data-theme="light"] .contact-form .form-status,
html[data-theme="light"] .contact-form .form-trust-list,
html[data-theme="light"] .contact-form .form-brief-summary small {
  color: #526777 !important;
}

html[data-theme="light"] .contact-form .form-footer .button-primary {
  border-color: #1f2426 !important;
  background: linear-gradient(135deg, #3b4143 0%, #1f2426 100%) !important;
  color: #f7f6f3 !important;
}

/* The light-theme contact CTA keeps the same two dark surfaces as the dark theme. */
html[data-theme="light"] .cta.media-section {
  background-color: #090807 !important;
  background-image:
    linear-gradient(90deg, rgba(9, 8, 7, 0.28), rgba(9, 8, 7, 0.08) 48%, rgba(9, 8, 7, 0.22)),
    url("/assets/cta-consultation-background.webp") !important;
  color: rgba(243, 238, 230, 0.78) !important;
}

html[data-theme="light"] .cta.media-section .media-overlay {
  background: linear-gradient(90deg, rgba(9, 8, 7, 0.96), rgba(9, 8, 7, 0.78) 48%, rgba(9, 8, 7, 0.5)) !important;
}

html[data-theme="light"] .cta.media-section .cta-contact-item {
  border-color: rgba(185, 130, 79, 0.24) !important;
  background: rgba(18, 17, 16, 0.72) !important;
  color: #f3eee6 !important;
}

html[data-theme="light"] .cta.media-section .cta-contact-item:hover,
html[data-theme="light"] .cta.media-section .cta-contact-item:focus-visible {
  border-color: rgba(208, 160, 107, 0.58) !important;
  background: rgba(29, 26, 22, 0.9) !important;
  color: #f3eee6 !important;
}

html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) {
  border-color: rgba(var(--gold-rgb), 0.24) !important;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.026) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px),
    #111313 !important;
  background-size: 72px 72px, 72px 72px, auto !important;
  color: #f3eee6 !important;
  color-scheme: dark !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.045),
    0 24px 70px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) .form-field > span,
html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) .form-segment-group legend,
html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) .form-brief-summary > span:first-child {
  color: rgba(243, 238, 230, 0.84) !important;
}

html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) .form-field input,
html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) .form-field textarea {
  border-color: rgba(243, 238, 230, 0.18) !important;
  background: #0d1012 !important;
  color: #f3eee6 !important;
  caret-color: #f3eee6 !important;
}

html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) .form-field input::placeholder,
html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) .form-field textarea::placeholder {
  color: rgba(243, 238, 230, 0.48) !important;
}

html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) .form-hint,
html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) .form-status,
html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) .form-trust-list,
html[data-theme="light"] .cta.media-section .contact-form:not(.contact-form-compact) .form-brief-summary small {
  color: rgba(243, 238, 230, 0.68) !important;
}

html[data-theme="light"] .contact-dialog .contact-dialog-panel {
  border-color: rgba(23, 36, 46, 0.2) !important;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.9), transparent 44%),
    #fffefa !important;
  color: #17242e !important;
}

/* Contact dialog: keep each theme internally consistent and use one mobile scroller. */
body:has(.contact-dialog[open]) {
  overflow: hidden;
}

.contact-dialog,
html[data-theme="light"] .contact-dialog {
  overflow: hidden;
}

@media (max-width: 640px) {
  .contact-dialog,
  html[data-theme="light"] .contact-dialog {
    width: calc(100% - 20px);
    max-height: calc(100dvh - 20px);
  }

  .contact-dialog .contact-dialog-panel,
  html[data-theme="light"] .contact-dialog .contact-dialog-panel {
    gap: 18px;
    max-height: calc(100dvh - 20px);
    padding: 18px;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
  }

  .contact-dialog .contact-dialog-header {
    gap: 12px;
  }

  .contact-dialog .contact-dialog-header > div {
    gap: 8px;
  }

  .contact-dialog .contact-form-compact,
  .contact-dialog .form-grid {
    gap: 12px !important;
  }

  .contact-dialog .form-field textarea {
    min-height: 104px !important;
    resize: none;
  }
}

/* Absolute final overrides: the light theme ends here in the cascade. */
html[data-theme="light"] body #services .service-package-card .package-heading h3,
html:not([data-theme="light"]) body #services .service-package-card .package-heading h3 {
  font-size: clamp(1.2rem, 1.6vw, 1.48rem) !important;
  line-height: 1.18 !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
}

html[data-theme="light"] body #services .service-package-card .package-link,
html:not([data-theme="light"]) body #services .service-package-card .package-link,
html[data-theme="light"] body #popular .service-package-card .package-link,
html:not([data-theme="light"]) body #popular .service-package-card .package-link,
html[data-theme="light"] body .service-directory-card .package-link,
html:not([data-theme="light"]) body .service-directory-card .package-link,
html[data-theme="light"] body .case-card .package-link,
html:not([data-theme="light"]) body .case-card .package-link {
  min-height: 46px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 4px !important;
  background: #30383b !important;
  color: #ffffff !important;
  font-size: 0.74rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

html[data-theme="light"] body #services .service-package-card .package-link:hover,
html[data-theme="light"] body #services .service-package-card .package-link:focus-visible,
html:not([data-theme="light"]) body #services .service-package-card .package-link:hover,
html:not([data-theme="light"]) body #services .service-package-card .package-link:focus-visible,
html[data-theme="light"] body #popular .service-package-card .package-link:hover,
html[data-theme="light"] body #popular .service-package-card .package-link:focus-visible,
html:not([data-theme="light"]) body #popular .service-package-card .package-link:hover,
html:not([data-theme="light"]) body #popular .service-package-card .package-link:focus-visible,
html[data-theme="light"] body .service-directory-card .package-link:hover,
html[data-theme="light"] body .service-directory-card .package-link:focus-visible,
html:not([data-theme="light"]) body .service-directory-card .package-link:hover,
html:not([data-theme="light"]) body .service-directory-card .package-link:focus-visible,
html[data-theme="light"] body .case-card .package-link:hover,
html[data-theme="light"] body .case-card .package-link:focus-visible,
html:not([data-theme="light"]) body .case-card .package-link:hover,
html:not([data-theme="light"]) body .case-card .package-link:focus-visible {
  border-color: rgba(255, 255, 255, 0.32) !important;
  background: #424d51 !important;
  color: #ffffff !important;
}

.doubt-item::before {
  top: 12px !important;
  right: 14px !important;
  left: auto !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
  color: rgba(var(--gold-rgb), 0.28) !important;
  content: "“" !important;
  font: 600 2.6rem/0.75 "Noto Serif", serif !important;
}

.doubt-item::after {
  right: 10px !important;
  bottom: -5px !important;
  color: rgba(var(--gold-rgb), 0.15) !important;
  content: "”" !important;
  font-size: 3.6rem !important;
}

.doubt-item h3 {
  padding-inline: 8px 36px !important;
}

/* Light theme: neutral sections, ivory cards, and no hover brightening. */
html[data-theme="light"] body {
  background: #f3f4f2 !important;
  background-image: none !important;
  color: #17242e !important;
}

html[data-theme="light"] body .section,
html[data-theme="light"] body .section-muted,
html[data-theme="light"] body .trust-bar,
html[data-theme="light"] body .doubts-section,
html[data-theme="light"] body .workflow-block,
html[data-theme="light"] body .articles-home-section,
html[data-theme="light"] body .service-archive-page,
html[data-theme="light"] body #services,
html[data-theme="light"] body #popular,
html[data-theme="light"] body #articles,
html[data-theme="light"] body #about,
html[data-theme="light"] body #why-pro-lex,
html[data-theme="light"] body #faq {
  background: #eef1ef !important;
  background-image: none !important;
}

html[data-theme="light"] body .doubts-section,
html[data-theme="light"] body #popular,
html[data-theme="light"] body #about,
html[data-theme="light"] body #faq {
  background: #f1efeb !important;
}

html[data-theme="light"] body .workflow-experience,
html[data-theme="light"] body .reasons-panel,
html[data-theme="light"] body .articles-grid,
html[data-theme="light"] body .services-grid,
html[data-theme="light"] body .service-directory-grid {
  background: transparent !important;
  background-image: none !important;
}

/* Article cards are intentionally excluded: they stay dark with white text. */
html[data-theme="light"] body .service-package-card,
html[data-theme="light"] body .service-directory-card,
html[data-theme="light"] body .service-choice-card,
html[data-theme="light"] body .area-card,
html[data-theme="light"] body .case-card,
html[data-theme="light"] body .doubt-item,
html[data-theme="light"] body .faq-list details,
html[data-theme="light"] body .contact-form,
html[data-theme="light"] body .contacts-panel,
html[data-theme="light"] body .contacts-row,
html[data-theme="light"] body .workflow-step-surface,
html[data-theme="light"] body .reason-item {
  background: #fffcf7 !important;
  background-image: none !important;
  border: 1px solid #cbd3d1 !important;
  color: #17242e !important;
  box-shadow: 0 12px 28px rgba(23, 36, 46, 0.08) !important;
}

html[data-theme="light"] body .service-package-card:hover,
html[data-theme="light"] body .service-package-card:focus-within,
html[data-theme="light"] body .service-directory-card:hover,
html[data-theme="light"] body .service-directory-card:focus-within,
html[data-theme="light"] body .service-choice-card:hover,
html[data-theme="light"] body .service-choice-card:focus-visible,
html[data-theme="light"] body .area-card:hover,
html[data-theme="light"] body .case-card:hover,
html[data-theme="light"] body .doubt-item:hover,
html[data-theme="light"] body .doubt-item:focus-within,
html[data-theme="light"] body .faq-list details:hover,
html[data-theme="light"] body .workflow-step-surface:hover,
html[data-theme="light"] body .workflow-step-surface:focus-visible,
html[data-theme="light"] body .reason-item:hover,
html[data-theme="light"] body .reason-item:focus-within {
  background: #fffcf7 !important;
  background-image: none !important;
  border-color: #aebdbb !important;
  box-shadow: 0 16px 34px rgba(23, 36, 46, 0.12) !important;
}

html[data-theme="light"] body .service-package-card h2,
html[data-theme="light"] body .service-package-card h3,
html[data-theme="light"] body .service-directory-card h2,
html[data-theme="light"] body .service-directory-card h3,
html[data-theme="light"] body .service-choice-card strong,
html[data-theme="light"] body .area-card h2,
html[data-theme="light"] body .area-card h3,
html[data-theme="light"] body .case-card h2,
html[data-theme="light"] body .case-card h3,
html[data-theme="light"] body .doubt-item h3,
html[data-theme="light"] body .workflow-step-surface h2,
html[data-theme="light"] body .workflow-step-surface h3,
html[data-theme="light"] body .reason-item h2,
html[data-theme="light"] body .reason-item h3 {
  color: #17242e !important;
  text-shadow: none !important;
}

html[data-theme="light"] body .service-package-card p,
html[data-theme="light"] body .service-directory-card p,
html[data-theme="light"] body .service-directory-card li,
html[data-theme="light"] body .service-choice-card small,
html[data-theme="light"] body .area-card p,
html[data-theme="light"] body .case-card p,
html[data-theme="light"] body .doubt-item p,
html[data-theme="light"] body .workflow-step-surface p,
html[data-theme="light"] body .reason-item p {
  color: #52616a !important;
}