.elementor-3079 .elementor-element.elementor-element-c09ce7d{--display:flex;}.elementor-3079 .elementor-element.elementor-element-5dac65b{--display:flex;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}@media(max-width:1024px){.elementor-widget-text-editor{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}}@media(max-width:767px){.elementor-widget-text-editor{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}}/* Start custom CSS *//* ==========================================================================
   Diamondback Dentistry — Blog Master CSS
   Lives in: Elementor → Site Settings → Custom CSS
   Version: v2.0 — 2026-05-27
   Purpose: All shared styling for the 13 blog widgets + prose blocks.
            Every widget HTML block ships without an embedded <style>;
            widgets consume this stylesheet via their .dbd-<section>
            namespace classes.
   ========================================================================== */

/* ---------- 1. Font import ---------- */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;600;700;800&family=Roboto+Slab:wght@400;500&display=swap');

/* ---------- 2. Brand tokens (canonical v1.2 navy/blue palette) ---------- */
:root {
  --dbd-primary:        #0E1A47;
  --dbd-body:           #0E1A47;
  --dbd-body-strong:    #0E1A47;
  --dbd-body-light:     #2B3556;  /* darkened from #44485F for better contrast */
  --dbd-link:           #2563EB;
  --dbd-link-hover:     #1D4ED8;
  --dbd-primary-hover:  #1F2E63;
  --dbd-teal:           #4F73A0;
  --dbd-gold:           #C9A387;
  --dbd-white:          #FFFFFF;
  --dbd-shade:          #F7FAFD;
  --dbd-icon-well:      #EEF3F5;
  --dbd-border:         #B8C4D6;
  --dbd-shadow:         0 4px 18px rgba(14, 26, 71, 0.08);
  --dbd-shadow-lg:      0 8px 28px rgba(14, 26, 71, 0.12);
  --dbd-radius:         16px;
  --dbd-radius-sm:      8px;
  --dbd-font:           'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --dbd-font-slab:      'Roboto Slab', Georgia, serif;
  --dbd-accent-gradient: linear-gradient(90deg, #0E1A47 0%, #2563EB 50%, #C9A387 100%);
}

/* ---------- 3. Shared wrapper for every block (widget + prose) ---------- */
[class^="dbd-"],
[class*=" dbd-"] {
  font-family: var(--dbd-font);
  color: var(--dbd-body);
  max-width: 820px;
  margin: 32px auto;
}
[class^="dbd-"] *,
[class*=" dbd-"] * { box-sizing: border-box; }

/* ---------- 4. Shared card pattern ---------- */
/* Used by: SA, KEY, COMPARE, PROCESS, STAT, PRICE, INSURANCE, FAQ, CTA, AREA, MD */
.dbd-card {
  background: var(--dbd-white);
  border: 1px solid var(--dbd-border);
  border-radius: var(--dbd-radius);
  box-shadow: var(--dbd-shadow);
  padding: 28px 32px;
}
.dbd-card--shade {
  background: var(--dbd-shade);
  box-shadow: none;
}
.dbd-card--bar {
  overflow: hidden;
  padding: 0;
}
.dbd-card--bar > .dbd-card__inner { padding: 28px 32px; }
.dbd-card__bar {
  height: 4px;
  background: var(--dbd-accent-gradient);
}
@media (max-width: 640px) {
  .dbd-card { padding: 24px 20px; }
  .dbd-card--bar > .dbd-card__inner { padding: 24px 20px; }
}

/* ---------- 5. Shared widget heading patterns ---------- */
/* Every widget H2 uses .dbd-h2; widget H3 (rare) uses .dbd-h3. */
.dbd-h2 {
  font-size: 26px;
  font-weight: 700;
  color: var(--dbd-primary);
  line-height: 1.25;
  margin: 0 0 16px 0;
  letter-spacing: -0.01em;
}
.dbd-h3 {
  font-size: 20px;
  font-weight: 700;
  color: var(--dbd-primary);
  line-height: 1.3;
  margin: 0 0 10px 0;
}
@media (max-width: 640px) {
  .dbd-h2 { font-size: 22px; }
}

/* ---------- 6. Shared eyebrow pattern (slate uppercase label) ---------- */
.dbd-eyebrow {
  font-size: 17px;
  font-weight: 700;
  color: var(--dbd-teal);
  letter-spacing: 0.04em;
  margin: 0 0 8px 0;
}

/* ---------- 7. Shared chip / pill pattern ---------- */
/* Used by: AREA neighborhoods + ZIPs, INSURANCE carriers, PRICE meta chips */
.dbd-chip {
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  background: var(--dbd-shade);
  border: 1px solid var(--dbd-border);
  border-radius: 999px;
  font-size: 18px;
  font-weight: 600;
  color: var(--dbd-body);
}
.dbd-chip--icon-well { background: var(--dbd-icon-well); }
.dbd-chip-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0 0 18px 0;
}

/* ---------- 8. Shared link pattern (defeat WP visited-state purple) ---------- */
[class^="dbd-"] a,
[class*=" dbd-"] a {
  color: var(--dbd-link) !important;
  text-decoration: underline;
  font-weight: 600;
}
[class^="dbd-"] a:hover,
[class*=" dbd-"] a:hover { color: var(--dbd-link-hover) !important; }
[class^="dbd-"] a:visited,
[class*=" dbd-"] a:visited { color: var(--dbd-link) !important; }

/* ==========================================================================
   PROSE BLOCKS  —  .dbd-prose-<NN>
   The H2/H3/p markup that ships between widgets.
   Heading-spacing standard: asymmetric em-based margins, first-child reset,
   heading-to-paragraph tightening.
   ========================================================================== */

.dbd-prose-01,
.dbd-prose-02,
.dbd-prose-03,
.dbd-prose-04,
.dbd-prose-05,
.dbd-prose-06,
.dbd-prose-07,
.dbd-prose-08,
.dbd-prose-09,
.dbd-prose-10 {
  font-family: var(--dbd-font);
  font-size: 18px;
  line-height: 1.65;
  color: var(--dbd-body);
}

/* First-child reset — no dead gap at top of block */
[class^="dbd-prose-"] > :first-child { margin-top: 0; }

/* --- H2 (default treatment — top rule + navy) --- */
/* Used on every H2 except the first one of each Custom HTML file */
[class^="dbd-prose-"] h2 {
  font-size: 1.6em;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--dbd-primary);
  margin-top: 2.5em;
  margin-bottom: 0.75em;
  padding-top: 0.55em;
  border-top: 3px solid var(--dbd-primary);
}

/* --- H2 section opener (Option D — tinted bar + chunky left rule) --- */
/* Used on the FIRST H2 of each Custom HTML file in the blog. */
/* Apply by adding class="dbd-prose__h2--opener" to that H2. */
[class^="dbd-prose-"] h2.dbd-prose__h2--opener {
  border-top: 0;
  padding: 0.6em 0.75em;
  background: var(--dbd-shade);
  border-left: 5px solid var(--dbd-primary);
  border-radius: 4px;
  margin-top: 0;  /* first-child of file, no top gap needed */
}

/* --- H3 (left rule + accent blue color) --- */
[class^="dbd-prose-"] h3 {
  font-size: 1.25em;
  line-height: 1.3;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--dbd-link);
  margin-top: 2em;
  margin-bottom: 0.5em;
  padding-left: 0.7em;
  border-left: 4px solid var(--dbd-link);
}

/* --- Heading-to-first-paragraph tightening --- */
[class^="dbd-prose-"] h2 + p,
[class^="dbd-prose-"] h3 + p { margin-top: 0; }

/* --- Paragraphs --- */
[class^="dbd-prose-"] p {
  margin-top: 0;
  margin-bottom: 1.5em;
  font-size: 18px;
  font-weight: 500;
  color: var(--dbd-body);
}

/* --- Lists --- */
[class^="dbd-prose-"] ul,
[class^="dbd-prose-"] ol {
  margin: 0 0 1.5em;
  padding-left: 1.5em;
}
[class^="dbd-prose-"] li {
  margin-bottom: 0.5em;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.65;
}

/* ==========================================================================
   END Master CSS
   ========================================================================== *//* End custom CSS */