/* ══════════════════════════════════════════════════════════════════════
   BusinessExpert Site-Wide Editorial Stylesheet v1.0
   ══════════════════════════════════════════════════════════════════════
   Extracted from the credit card section's editorial design system.
   Applies to all singular posts/pages via WordPress enqueue.

   CC pages override these with their own page-id-scoped inline styles.
   This file sets the baseline for every other page on the site.

   Palette:
     Text:    #1A1A1E (headings) / #2A2A2E (body) / #4A4A52 (secondary)
              #6E6E78 (muted) / #8A8A94 (metadata)
     Accent:  #6704A4
     Surface: #F9F5FB (hero/breadcrumb bg) / #FDFCFE (table alt rows)
     Border:  #F0ECF4 (light) / #E8E2EF (medium) / #DDD6E5 (strong)
   ══════════════════════════════════════════════════════════════════════ */


/* ── 0a. STICKY FIX — override theme overflow:hidden on .site-main ── */

.site-main {
  overflow: visible !important;
}


/* ── 0. BREADCRUMBS — quiet lavender zone ── */

.section-breadcrumbs {
  margin-bottom: 0;
  padding-bottom: 20px;
  position: relative;
}
.section-breadcrumbs::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(-50vw + 50%);
  right: calc(-50vw + 50%);
  background: #F9F5FB;
  z-index: -1;
}
#breadcrumbs,
#breadcrumbs a,
#breadcrumbs span {
  font-size: 12px;
  color: #7A7584;
  font-weight: 400;
  letter-spacing: 0.01em;
}
#breadcrumbs a:hover {
  color: #4A4654;
}
#breadcrumbs img {
  opacity: 0.55;
  width: 12px;
  height: 12px;
}


/* ── 1. HERO SECTION — lavender background, refined heading ── */

.hero-section {
  padding-top: 8px;
  padding-bottom: 20px;
  position: relative;
}
.hero-section::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(-50vw + 50%);
  right: calc(-50vw + 50%);
  background: #F9F5FB;
  z-index: -1;
}
.hero-section h1 {
  font-size: 38px;
  line-height: 1.18;
  letter-spacing: -0.02em;
  color: #1A1A1E;
  margin-top: 2px;
  margin-bottom: 8px;
  max-width: 620px;
}

/* Quieter advertising disclosure */
.ad-disclaimer-tooltip {
  font-size: 11px;
  opacity: 0.9;
}
.ad-disclaimer-tooltip img {
  opacity: 0.5;
  filter: grayscale(100%);
  width: 13px;
  height: 13px;
}
.ad-tooltip-title {
  font-size: 11px;
  color: #7A7584;
  font-weight: 400;
}


/* ── 1b. HERO METADATA STRIP — unified author/readtime/date ── */

.be-meta-strip {
  display: flex;
  align-items: center;
  gap: 0;
  font-size: 13px;
  line-height: 1.4;
  width: 100%;
  padding: 10px 0 6px;
}
.be-meta-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  margin-right: 12px;
  flex-shrink: 0;
}
.be-meta-author {
  color: #4A4654;
  font-weight: 500;
  white-space: nowrap;
}
.be-meta-author .be-meta-label {
  color: #7A7584;
  font-weight: 400;
}
.be-meta-divider {
  width: 1px;
  height: 14px;
  background: #D0CDD6;
  margin: 0 8px;
  flex-shrink: 0;
}
.be-readtime-inline {
  display: flex;
  align-items: center;
  gap: 4px;
  color: #6E6E78;
  font-weight: 400;
  white-space: nowrap;
}
.be-readtime-icon {
  color: #9A95A3;
  flex-shrink: 0;
}
.be-meta-date {
  color: #7A7584;
  font-weight: 400;
  white-space: nowrap;
  margin-left: auto;
}
.be-disclosure-aligned {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  padding-top: 8px;
}


/* ── 1c. HIDE LEGACY WP HERO ELEMENTS ── */

.date-time-section { display: none !important; }


/* ── 1d. HERO ZONE REFINEMENTS — tighter spacing, left-aligned labels ── */

.cc-hero-zone {
  margin-bottom: 40px;
  padding-bottom: 20px;
}
.cc-hero-grid {
  gap: 48px;
  align-items: start;
}
.cc-hero-verdict {
  font-size: 17px;
  line-height: 1.75;
  margin-top: 20px;
  color: #1E1E22;
}
.cc-hero-tp {
  border-color: #E8E2EF;
  padding: 24px;
}
.cc-hero-tp__label {
  color: #8A8A94;
  font-size: 10px;
  letter-spacing: 0.08em;
  text-align: left;
}
.cc-hero-tp__name { text-align: left; }
.cc-hero-tp__tagline { text-align: left; }
.cc-hero-tp__logo { margin: 16px 0 0 0; }
.cc-hero-tp__list { margin: 16px 0 20px; padding-top: 16px; }
.cc-hero-tp__list li { padding: 5px 0 5px 24px; font-size: 14px; line-height: 1.5; }
.cc-hero-tp__cta {
  padding: 12px 24px;
  display: inline-block;
  width: auto;
  border-radius: 8px;
  font-size: 14px;
}


/* ── 1e. SECTION DIVIDERS ── */

.cc-section-divider {
  margin-top: 64px;
  padding-top: 64px;
  border-top: 1px solid #F0ECF4;
}


/* ── 2. GLOBAL RHYTHM — type scale: 17px body, 26px H2, 20px H3 ── */

.entry-content p {
  font-size: 17px;
  line-height: 1.75;
  color: #2A2A2E;
  margin-bottom: 1.6em;
}
.entry-content h2.wp-block-heading {
  margin-top: 64px;
  margin-bottom: 22px;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #1A1A1E;
}
.entry-content h3.wp-block-heading {
  margin-top: 44px;
  margin-bottom: 16px;
  font-size: 20px;
  font-weight: 700;
  color: #2A2A2E;
}


/* ── 3. WP TABLES — calm, scannable rows ── */

.wp-block-table.is-style-stripes table {
  border-collapse: collapse;
}
.wp-block-table.is-style-stripes table th {
  font-size: 12px;
  font-weight: 600;
  padding: 14px 18px;
  background: #FAFAFA;
  color: #6E6E78;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.wp-block-table.is-style-stripes table td {
  font-size: 15px;
  padding: 16px 18px;
  line-height: 1.55;
}
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background: #FDFCFE;
}
.wp-block-table.is-style-stripes tbody tr:nth-child(even) {
  background: #fff;
}

/* ── 3a. TABLE OVERFLOW — prevent horizontal blowout ── */

.wp-block-table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.wp-block-table table {
  max-width: 100%;
  width: 100%;
}

/* ── 3b. LINKS IN TABLES — tone down so they read as inline refs, not CTAs ── */

.wp-block-table td a {
  font-size: inherit;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}


/* ── 4. METHODOLOGY BOX ── */

.wp-block-group.methodology {
  border-color: #F0ECF4 !important;
  background: #FDFCFE !important;
  border-radius: 12px !important;
  padding: 24px 28px 32px !important;
  margin-top: 64px !important;
}


/* ── 4b. POST-TABLE NARROWING — uniform width below comparison table ── */

.cc-ct ~ * {
  max-width: 820px;
  box-sizing: border-box;
}
.cc-ct ~ .be-article-section {
  max-width: none;
}


/* ── 5. LINKS — accent colour ── */

.entry-content a {
  color: #6704A4;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.entry-content a:hover {
  color: #4F0280;
}


/* ── 6. HIDE copy-delete-posts PLUGIN FRONTEND UI ── */
/* Plugin renders an admin "Elements to copy:" panel on the public page for logged-in
   admins. It belongs in wp-admin, not on the live article. Third-party plugin uses
   inline styles so !important is needed to suppress its output. */
.cdp-left,
.cdp-right,
.cdp-container,
[class^="cdp-"],
[class*=" cdp-"] {
  display: none !important;
}
