/* =============================================================

   Living Coastal — Blog Pattern Styles

   Mockup version (Batch 1 — Foundation + Callouts)

   Source of truth: development/blog-style-guide/blog-style-guide.md

   Production destination: wpcodebox-css-blog-patterns.css (WPCodeBox 2)

   ============================================================= */



/* -------------------------------------------------------------

   Design tokens

   ------------------------------------------------------------- */

:root {

  /* Brand colors */

  --lc-navy: #334376;

  --lc-gold: #d0a667;

  --lc-teal: #26a9e1;



  /* Neutrals */

  --lc-body: #404040;

  --lc-heading-dark: #1a1a1a;

  --lc-muted: #6b7280;

  --lc-rule: #e5e7eb;

  --lc-surface: #f7f6f2;

  --lc-surface-alt: #f0f4f8;



  /* Semantic */

  --lc-warn-bg: #fff8e6;

  --lc-warn-border: #d4a72c;

  --lc-warn-text: #6b4f00;

  --lc-success-bg: #eaf6ee;

  --lc-success-border: #3a8a4f;

  --lc-danger-bg: #fdecea;

  --lc-danger-border: #c0392b;



  /* Spacing scale */

  --lc-s-1: 4px;

  --lc-s-2: 8px;

  --lc-s-3: 16px;

  --lc-s-4: 24px;

  --lc-s-5: 32px;

  --lc-s-6: 48px;

  --lc-s-7: 64px;



  /* Width tiers (v1.1 2026-07-22: text column 820→880 to match the wider,

     larger-type reading measure chosen for live posts — see project_blog_style_guide) */

  --lc-text-col: 880px;

  --lc-img-narrow: 720px;

  --lc-img-column: 880px;

  --lc-img-fullbleed: 1200px;



  /* Fonts */

  --lc-font-heading: 'Montserrat', system-ui, sans-serif;

  --lc-font-body: 'Mulish', system-ui, sans-serif;



  /* Radii */

  --lc-radius-sm: 4px;

  --lc-radius-md: 8px;

}



/* -------------------------------------------------------------

   Base typography (scoped to .lc-content so it doesn't leak)

   :where() wrapper drops specificity to zero so per-pattern class

   rules win automatically without needing higher specificity.

   ------------------------------------------------------------- */

:where(.lc-content) {

  font-family: var(--lc-font-body);

  font-size: 20px;          /* v1.1 2026-07-22: 18→20px (Brad-approved "Option B" reading size) */

  line-height: 1.7;

  color: var(--lc-body);

}



:where(.lc-content) h1 {

  font-family: var(--lc-font-heading);

  font-weight: 700;

  font-size: 44px;

  line-height: 1.15;

  color: var(--lc-navy);

  margin: 0 0 var(--lc-s-4);

  letter-spacing: -0.01em;

}



:where(.lc-content) h2 {

  font-family: var(--lc-font-heading);

  font-weight: 700;

  font-size: 32px;

  line-height: 1.2;

  color: var(--lc-navy);

  margin: var(--lc-s-6) 0 var(--lc-s-3);

  letter-spacing: -0.005em;

}



:where(.lc-content) h3 {

  font-family: var(--lc-font-heading);

  font-weight: 600;

  font-size: 24px;

  line-height: 1.25;

  color: var(--lc-heading-dark);

  margin: var(--lc-s-5) 0 12px;

}



:where(.lc-content) h4 {

  font-family: var(--lc-font-heading);

  font-weight: 600;

  font-size: 20px;

  line-height: 1.3;

  color: var(--lc-heading-dark);

  margin: var(--lc-s-4) 0 var(--lc-s-2);

}



:where(.lc-content) p {

  margin: 0 0 var(--lc-s-3);

}



:where(.lc-content) p:last-child {

  margin-bottom: 0;

}



/* Prose links only — scoped to p/li so the treatment does NOT leak into

   embedded components (lc-tool cards, CTAs, link cards, comments, etc.) that

   carry their own link/button styling. :where() keeps specificity at (0,0,1). */

:where(.lc-content) :where(p, li) a {

  color: var(--lc-navy);

  text-decoration: underline;

  text-decoration-thickness: 1px;

  text-underline-offset: 3px;

  transition: color 0.15s ease;

}



:where(.lc-content) :where(p, li) a:hover {

  color: var(--lc-teal);

  text-decoration: none;   /* underline drops on hover; color shift is the feedback */

}



:where(.lc-content) strong {

  font-weight: 700;

  color: var(--lc-heading-dark);

}



:where(.lc-content) em {

  font-style: italic;

}



/* Baseline list styles for any <ul> or <ol> inside .lc-content.

   Navy markers, 8px item spacing, body line-height. */

:where(.lc-content) ul,

:where(.lc-content) ol {

  margin: 0 0 var(--lc-s-3);

  padding-left: 28px;

}



:where(.lc-content) ul li,

:where(.lc-content) ol li {

  margin-bottom: 8px;

  padding-left: 4px;

  line-height: 1.65;

}



:where(.lc-content) ul li:last-child,

:where(.lc-content) ol li:last-child {

  margin-bottom: 0;

}



:where(.lc-content) ul li::marker {

  color: var(--lc-navy);

}



:where(.lc-content) ol li::marker {

  color: var(--lc-navy);

  font-weight: 700;

  font-family: var(--lc-font-heading);

}



:where(.lc-content) ul ul,

:where(.lc-content) ol ol,

:where(.lc-content) ul ol,

:where(.lc-content) ol ul {

  margin: 8px 0 0;

}



/* Lead paragraph (intro) */

.lc-lead {

  font-size: 20px;

  line-height: 1.55;

  color: var(--lc-heading-dark);

}



/* -------------------------------------------------------------

   Section Divider

   ------------------------------------------------------------- */

.lc-divider {

  display: flex;

  align-items: center;

  justify-content: center;

  margin: var(--lc-s-6) auto;

  border: 0;

  height: auto;

}



.lc-divider::before,

.lc-divider::after {

  content: '';

  flex: 1;

  height: 1px;

  background: var(--lc-rule);

}



.lc-divider__ornament {

  width: 8px;

  height: 8px;

  margin: 0 var(--lc-s-3);

  background: var(--lc-gold);

  transform: rotate(45deg);

  flex-shrink: 0;

}



/* -------------------------------------------------------------

   The Gist

   Top-of-post 2-3 sentence summary (GEO/AI-citation optimized).

   Works for any article type, not just question-answer articles.

   ------------------------------------------------------------- */

.lc-gist {

  background: var(--lc-surface);

  border-left: 4px solid var(--lc-navy);

  padding: var(--lc-s-4) 28px;

  margin: var(--lc-s-5) auto;

  border-radius: 0 var(--lc-radius-sm) var(--lc-radius-sm) 0;

}



.lc-gist__label {

  font-family: var(--lc-font-heading);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.1em;

  text-transform: uppercase;

  color: var(--lc-navy);

  margin: 0 0 var(--lc-s-2);

  display: block;

}



.lc-gist__body {

  font-size: 18px;

  line-height: 1.6;

  color: var(--lc-heading-dark);

}



.lc-gist__body p {

  margin: 0;

}



.lc-gist__body p + p {

  margin-top: 12px;

}



/* -------------------------------------------------------------

   Take callouts (Lacey + Brad)

   Same skeleton, accent color differs

   ------------------------------------------------------------- */

.lc-take {

  display: grid;

  grid-template-columns: 64px 1fr;

  gap: 20px;

  align-items: start;

  background: var(--lc-surface);

  padding: var(--lc-s-4);

  margin: var(--lc-s-5) auto;

  border-radius: var(--lc-radius-sm);

  border-left: 4px solid;

}



.lc-take--lacey { border-left-color: var(--lc-gold); }

.lc-take--brad  { border-left-color: var(--lc-teal); }



.lc-take__photo {

  width: 64px;

  height: 64px;

  border-radius: 50%;

  overflow: hidden;

  flex-shrink: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  font-family: var(--lc-font-heading);

  font-weight: 600;

  font-size: 24px;

  color: #fff;

}



.lc-take--lacey .lc-take__photo { background: var(--lc-gold); }

.lc-take--brad  .lc-take__photo { background: var(--lc-teal); }



.lc-take__photo img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.lc-take__content {

  min-width: 0;

}



.lc-take__quote {

  font-size: 17px;

  line-height: 1.6;

  color: var(--lc-heading-dark);

  margin: 0 0 12px;

}



.lc-take__quote p { margin: 0; }

.lc-take__quote p + p { margin-top: 10px; }



.lc-take__byline {

  font-family: var(--lc-font-heading);

  font-size: 12px;

  font-weight: 600;

  letter-spacing: 0.06em;

  text-transform: uppercase;

  color: var(--lc-muted);

  margin: 0;

}



.lc-take__byline-name {

  font-weight: 700;

}



.lc-take--lacey .lc-take__byline-name { color: var(--lc-gold); }

.lc-take--brad  .lc-take__byline-name { color: var(--lc-teal); }



/* -------------------------------------------------------------

   Storytime

   Long-form personal/client narrative. Lacey variant for client

   stories; Brad variant for lived-experience stories. Wider than

   Take (full column width), with scene-setter italic intro and

   optional takeaway closer.

   ------------------------------------------------------------- */

.lc-storytime {

  margin: var(--lc-s-6) auto;

  padding: var(--lc-s-5);

  background: var(--lc-surface);

  border-left: 4px solid;

  border-radius: var(--lc-radius-md);

}



.lc-storytime--lacey { border-left-color: var(--lc-gold); }

.lc-storytime--brad  { border-left-color: var(--lc-teal); }



.lc-storytime__header {

  display: flex;

  align-items: center;

  gap: var(--lc-s-3);

  margin-bottom: var(--lc-s-4);

}



.lc-storytime__photo {

  width: 56px;

  height: 56px;

  border-radius: 50%;

  overflow: hidden;

  flex-shrink: 0;

  background: var(--lc-rule);

}



.lc-storytime__photo img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  display: block;

}



.lc-storytime__meta {

  display: flex;

  flex-direction: column;

  gap: 3px;

  min-width: 0;

}



.lc-storytime__label {

  font-family: var(--lc-font-heading);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.1em;

  text-transform: uppercase;

  line-height: 1;

}



.lc-storytime--lacey .lc-storytime__label { color: var(--lc-gold); }

.lc-storytime--brad  .lc-storytime__label { color: var(--lc-teal); }



.lc-storytime__byline {

  font-family: var(--lc-font-heading);

  font-size: 13px;

  font-weight: 600;

  color: var(--lc-heading-dark);

}



.lc-storytime__scene {

  font-style: italic;

  font-size: 17px;

  line-height: 1.55;

  color: var(--lc-muted);

  margin: 0 0 var(--lc-s-3);

  padding-bottom: var(--lc-s-3);

  border-bottom: 1px solid var(--lc-rule);

}



.lc-storytime__body {

  font-size: 17px;

  line-height: 1.7;

  color: var(--lc-heading-dark);

}



.lc-storytime__body p {

  margin: 0 0 var(--lc-s-3);

}



.lc-storytime__body p:last-child {

  margin-bottom: 0;

}



.lc-storytime__lesson {

  margin-top: var(--lc-s-4);

  padding-top: var(--lc-s-3);

  border-top: 1px solid var(--lc-rule);

}



.lc-storytime__lesson-label {

  font-family: var(--lc-font-heading);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.1em;

  text-transform: uppercase;

  display: block;

  margin-bottom: 4px;

}



.lc-storytime--lacey .lc-storytime__lesson-label { color: var(--lc-gold); }

.lc-storytime--brad  .lc-storytime__lesson-label { color: var(--lc-teal); }



.lc-storytime__lesson-body {

  font-size: 15px;

  line-height: 1.55;

  color: var(--lc-heading-dark);

}



/* -------------------------------------------------------------

   Insider Tip

   Generic, no author attribution

   ------------------------------------------------------------- */

.lc-tip {

  display: grid;

  grid-template-columns: 24px 1fr;

  gap: var(--lc-s-3);

  align-items: start;

  background: var(--lc-surface-alt);

  border-left: 4px solid var(--lc-teal);

  padding: 18px 22px;

  margin: var(--lc-s-4) auto;

  border-radius: 0 var(--lc-radius-sm) var(--lc-radius-sm) 0;

}



.lc-tip__icon {

  width: 24px;

  height: 24px;

  color: var(--lc-teal);

  flex-shrink: 0;

  margin-top: 2px;

}



.lc-tip__body {

  font-size: 16px;

  line-height: 1.6;

  color: var(--lc-body);

}



.lc-tip__body p { margin: 0; }

.lc-tip__body p + p { margin-top: 8px; }



.lc-tip__label {

  font-family: var(--lc-font-heading);

  font-weight: 700;

  color: var(--lc-teal);

  letter-spacing: 0.02em;

}



/* -------------------------------------------------------------

   Key Takeaway

   End-of-section summary

   ------------------------------------------------------------- */

.lc-takeaway {

  background: var(--lc-surface);

  padding: 20px var(--lc-s-4);

  margin: var(--lc-s-5) auto;

  border-radius: var(--lc-radius-md);

  border: 1px solid var(--lc-rule);

}



.lc-takeaway__label {

  font-family: var(--lc-font-heading);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.1em;

  text-transform: uppercase;

  color: var(--lc-gold);

  margin: 0 0 6px;

  display: block;

}



.lc-takeaway__body {

  font-size: 17px;

  line-height: 1.55;

  color: var(--lc-heading-dark);

}



.lc-takeaway__body p { margin: 0; }

.lc-takeaway__body p + p { margin-top: 10px; }



/* -------------------------------------------------------------

   Take Action

   Concrete numbered next-steps. End-of-section prescription.

   ------------------------------------------------------------- */

.lc-action {

  background: #fff;

  border: 1px solid var(--lc-rule);

  border-left: 4px solid var(--lc-navy);

  padding: var(--lc-s-4) 28px;

  margin: var(--lc-s-5) auto;

  border-radius: 0 var(--lc-radius-md) var(--lc-radius-md) 0;

  box-shadow: 0 1px 3px rgba(51, 67, 118, 0.06);

}



.lc-action__label {

  font-family: var(--lc-font-heading);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.1em;

  text-transform: uppercase;

  color: var(--lc-navy);

  display: block;

  margin: 0 0 var(--lc-s-3);

}



.lc-action__list {

  counter-reset: action-counter;

  list-style: none;

  padding: 0;

  margin: 0;

}



.lc-action__item {

  counter-increment: action-counter;

  position: relative;

  padding: 4px 0 0 44px;

  margin: 0 0 var(--lc-s-3);

  min-height: 32px;

  font-size: 16px;

  line-height: 1.6;

  color: var(--lc-body);

}



.lc-action__item:last-child {

  margin-bottom: 0;

}



.lc-action__item::before {

  content: counter(action-counter);

  position: absolute;

  left: 0;

  top: 0;

  width: 28px;

  height: 28px;

  background: var(--lc-navy);

  color: #fff;

  font-family: var(--lc-font-heading);

  font-size: 14px;

  font-weight: 700;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  line-height: 1;

}



.lc-action__item strong {

  color: var(--lc-heading-dark);

  font-weight: 700;

}



/* -------------------------------------------------------------

   Warning / Caution

   Flood, insurance, safety, YMYL caveats

   ------------------------------------------------------------- */

.lc-warning {

  display: grid;

  grid-template-columns: 28px 1fr;

  gap: var(--lc-s-3);

  align-items: start;

  background: var(--lc-warn-bg);

  border-left: 4px solid var(--lc-warn-border);

  padding: 20px var(--lc-s-4);

  margin: var(--lc-s-5) auto;

  border-radius: 0 var(--lc-radius-sm) var(--lc-radius-sm) 0;

}



.lc-warning__icon {

  width: 24px;

  height: 24px;

  color: var(--lc-warn-border);

  flex-shrink: 0;

  margin-top: 2px;

}



.lc-warning__heading {

  font-family: var(--lc-font-heading);

  font-size: 16px;

  font-weight: 700;

  color: var(--lc-warn-text);

  margin: 0 0 4px;

  letter-spacing: 0.01em;

}



.lc-warning__body {

  font-size: 16px;

  line-height: 1.6;

  color: var(--lc-heading-dark);

}



.lc-warning__body p { margin: 0; }

.lc-warning__body p + p { margin-top: 8px; }



/* -------------------------------------------------------------

   Comparison Table

   Two-column side-by-side (Biloxi vs Gulfport)

   ------------------------------------------------------------- */

.lc-table {

  width: 100%;

  border-collapse: collapse;

  margin: var(--lc-s-5) auto;

  font-family: var(--lc-font-body);

  font-size: 16px;

  line-height: 1.5;

}



.lc-table--comparison thead th {

  background: var(--lc-navy);

  color: #fff;

  font-family: var(--lc-font-heading);

  font-weight: 600;

  font-size: 15px;

  letter-spacing: 0.02em;

  text-align: left;

  padding: var(--lc-s-3) var(--lc-s-4);

  border: 0;

}



.lc-table--comparison tbody td,

.lc-table--comparison tbody th {

  padding: var(--lc-s-3) var(--lc-s-4);

  border-bottom: 1px solid var(--lc-rule);

  vertical-align: top;

  text-align: left;

}



.lc-table--comparison tbody tr:nth-child(odd) {

  background: var(--lc-surface);

}



.lc-table--comparison tbody tr:last-child td,

.lc-table--comparison tbody tr:last-child th {

  border-bottom: 0;

}



.lc-table--comparison tbody th {

  font-family: var(--lc-font-heading);

  font-weight: 600;

  color: var(--lc-navy);

  width: 30%;

}



/* -------------------------------------------------------------

   Vital Stats Table

   Key-value pairs (mainly CPT profiles, secondary blog use)

   ------------------------------------------------------------- */

.lc-table--vital {

  width: 100%;

  max-width: 540px;

  margin: var(--lc-s-4) auto;

  border-collapse: collapse;

}



.lc-table--vital th,

.lc-table--vital td {

  padding: 12px var(--lc-s-3);

  border-bottom: 1px solid var(--lc-rule);

  text-align: left;

  vertical-align: top;

  font-size: 16px;

}



.lc-table--vital th {

  font-family: var(--lc-font-heading);

  font-weight: 600;

  color: var(--lc-navy);

  width: 40%;

}



.lc-table--vital td {

  color: var(--lc-heading-dark);

}



.lc-table--vital tr:last-child th,

.lc-table--vital tr:last-child td {

  border-bottom: 0;

}



/* -------------------------------------------------------------

   Pros / Cons Box

   Equal 50/50 split, green/red, stack on mobile

   ------------------------------------------------------------- */

.lc-proscons {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: var(--lc-s-3);

  margin: var(--lc-s-5) auto;

}



.lc-proscons__col {

  padding: var(--lc-s-4);

  border-radius: var(--lc-radius-md);

}



.lc-proscons__col--pros {

  background: var(--lc-success-bg);

  border-left: 4px solid var(--lc-success-border);

}



.lc-proscons__col--cons {

  background: var(--lc-danger-bg);

  border-left: 4px solid var(--lc-danger-border);

}



.lc-proscons__heading {

  font-family: var(--lc-font-heading);

  font-weight: 700;

  font-size: 16px;

  letter-spacing: 0.04em;

  text-transform: uppercase;

  margin: 0 0 var(--lc-s-3);

  display: flex;

  align-items: center;

  gap: var(--lc-s-2);

}



.lc-proscons__col--pros .lc-proscons__heading { color: var(--lc-success-border); }

.lc-proscons__col--cons .lc-proscons__heading { color: var(--lc-danger-border); }



.lc-proscons__list {

  list-style: none;

  padding: 0;

  margin: 0;

}



.lc-proscons__list li {

  position: relative;

  padding-left: 26px;

  margin-bottom: 10px;

  font-size: 16px;

  line-height: 1.55;

  color: var(--lc-heading-dark);

}



.lc-proscons__list li:last-child { margin-bottom: 0; }



.lc-proscons__col--pros .lc-proscons__list li::before {

  content: "✓";

  position: absolute;

  left: 0;

  top: 0;

  color: var(--lc-success-border);

  font-weight: 700;

  font-size: 18px;

  line-height: 1.4;

}



.lc-proscons__col--cons .lc-proscons__list li::before {

  content: "✕";

  position: absolute;

  left: 0;

  top: 0;

  color: var(--lc-danger-border);

  font-weight: 700;

  font-size: 18px;

  line-height: 1.4;

}



/* -------------------------------------------------------------

   Stat Highlight

   Single big number with context + source. Centered, narrower

   than column for visual impact.

   ------------------------------------------------------------- */

.lc-stat {

  max-width: 540px;

  margin: var(--lc-s-6) auto;

  text-align: center;

  padding: var(--lc-s-5) 0;

}



.lc-stat--surface {

  background: var(--lc-surface);

  padding: var(--lc-s-5) var(--lc-s-4);

  border-radius: var(--lc-radius-md);

}



.lc-stat__number {

  font-family: var(--lc-font-heading);

  font-size: 64px;

  font-weight: 700;

  line-height: 1;

  color: var(--lc-navy);

  margin: 0 0 var(--lc-s-3);

  letter-spacing: -0.02em;

}



.lc-stat__context {

  font-size: 18px;

  line-height: 1.5;

  color: var(--lc-heading-dark);

  margin: 0 0 var(--lc-s-2);

  max-width: 440px;

  margin-left: auto;

  margin-right: auto;

}



.lc-stat__source {

  font-size: 13px;

  color: var(--lc-muted);

  margin: var(--lc-s-2) 0 0;

  font-style: italic;

}



.lc-stat__source a {

  color: var(--lc-muted);

  text-decoration: underline;

}



/* -------------------------------------------------------------

   Data Callout

   Inline-card with single stat + source. Smaller weight than

   Stat Highlight — supporting evidence, not focal point.

   ------------------------------------------------------------- */

.lc-data-callout {

  background: var(--lc-surface-alt);

  padding: var(--lc-s-3) var(--lc-s-4);

  margin: var(--lc-s-4) auto;

  border-radius: var(--lc-radius-md);

}



.lc-data-callout__body {

  font-size: 17px;

  line-height: 1.5;

  color: var(--lc-heading-dark);

  margin: 0;

}



.lc-data-callout__stat {

  font-family: var(--lc-font-heading);

  font-size: 24px;

  font-weight: 700;

  color: var(--lc-navy);

  letter-spacing: -0.01em;

  display: inline-block;

  vertical-align: baseline;

}



.lc-data-callout__source {

  font-size: 12px;

  color: var(--lc-muted);

  margin: 4px 0 0;

  font-style: italic;

}



/* -------------------------------------------------------------

   Live article wrapper — supports width-tier breakouts

   In production: the WP single-post template provides the

   wrapper; the body uses .lc-content children. This rule mirrors

   the width tiers from the spec (Narrow 720 / Column 820 / Full-bleed 1200).

   ------------------------------------------------------------- */

.lc-article {

  max-width: 1200px;

  margin: 0 auto;

  /* No padding here — parent container (preview-wrap in mockup,

     Bricks section in production) provides the page-edge gutter. */

}



/* Default child width — covers both direct children and grandchildren via

   WP's auto-injected .wp-block-group__inner-container wrapper. */

.lc-article > *,

.lc-article > .wp-block-group__inner-container > * {

  max-width: var(--lc-text-col);

  margin-left: auto;

  margin-right: auto;

}

/* Inner-container wrapper itself must NOT cap to text column — it should

   pass through to its children's individual max-widths. */

.lc-article > .wp-block-group__inner-container {

  max-width: var(--lc-img-fullbleed);

  margin-left: auto;

  margin-right: auto;

}



/* Tier-aware widths for media patterns inside .lc-article */

/* Width tiers — selectors cover BOTH direct children of .lc-article AND

   grandchildren via WP's auto-injected .wp-block-group__inner-container

   wrapper (which appears when .lc-article is rendered from a wp:group block). */

.lc-article > .lc-figure,

.lc-article > .wp-block-group__inner-container > .lc-figure {

  max-width: var(--lc-img-narrow);

}

.lc-article > .lc-figure--column,

.lc-article > .wp-block-group__inner-container > .lc-figure--column {

  max-width: var(--lc-img-column);

}

.lc-article > .lc-figure--full-bleed,

.lc-article > .lc-gallery,

.lc-article > .lc-infographic,

.lc-article > .wp-block-group__inner-container > .lc-figure--full-bleed,

.lc-article > .wp-block-group__inner-container > .lc-gallery,

.lc-article > .wp-block-group__inner-container > .lc-infographic {

  max-width: var(--lc-img-fullbleed);

}

/* Narrower-than-820 patterns must also bump specificity to beat the

   inner-container's > * { max-width: 820px } rule. */

.lc-article > .lc-table--vital,

.lc-article > .lc-stat,

.lc-article > .wp-block-group__inner-container > .lc-table--vital,

.lc-article > .wp-block-group__inner-container > .lc-stat {

  max-width: 540px;

}



/* -------------------------------------------------------------

   Image with Caption

   Default = Narrow tier (720px). Modifiers --column and --full-bleed.

   Tier widths are baked into the classes so they render correctly

   in any context (catalog, article, page).

   ------------------------------------------------------------- */

.lc-figure {

  margin: var(--lc-s-5) auto;

  padding: 0;

  max-width: var(--lc-img-narrow);

}



.lc-figure--column { max-width: var(--lc-img-column); }

.lc-figure--full-bleed { max-width: var(--lc-img-fullbleed); }



.lc-figure img {

  width: 100%;

  height: auto;

  display: block;

  border-radius: var(--lc-radius-sm);

  object-fit: cover;

}



.lc-figure figcaption {

  font-family: var(--lc-font-body);

  font-size: 14px;

  font-style: italic;

  color: var(--lc-muted);

  text-align: center;

  margin-top: var(--lc-s-2);

  line-height: 1.5;

}



/* -------------------------------------------------------------

   Image Gallery

   3 or 4 images in grid, optional shared caption

   ------------------------------------------------------------- */

.lc-gallery {

  margin: var(--lc-s-5) auto;

  max-width: var(--lc-img-fullbleed);

}



.lc-gallery__grid {

  display: grid;

  gap: var(--lc-s-3);

}



.lc-gallery--3 .lc-gallery__grid { grid-template-columns: repeat(3, 1fr); }

.lc-gallery--4 .lc-gallery__grid { grid-template-columns: repeat(4, 1fr); }



.lc-gallery__grid img {

  width: 100%;

  aspect-ratio: 4 / 3;

  object-fit: cover;

  border-radius: var(--lc-radius-sm);

  display: block;

}



.lc-gallery__caption {

  font-size: 14px;

  font-style: italic;

  color: var(--lc-muted);

  text-align: center;

  margin-top: var(--lc-s-3);

}



/* -------------------------------------------------------------

   Before / After

   Side-by-side cells with corner labels

   ------------------------------------------------------------- */

.lc-before-after {

  margin: var(--lc-s-5) auto;

  max-width: var(--lc-img-column);

}



.lc-before-after__grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: var(--lc-s-2);

}



.lc-before-after__cell {

  position: relative;

}



.lc-before-after__cell img {

  width: 100%;

  aspect-ratio: 4 / 3;

  object-fit: cover;

  border-radius: var(--lc-radius-sm);

  display: block;

}



.lc-before-after__label {

  position: absolute;

  top: 12px;

  left: 12px;

  background: rgba(0, 0, 0, 0.72);

  color: #fff;

  padding: 5px 12px;

  border-radius: 3px;

  font-family: var(--lc-font-heading);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.08em;

  text-transform: uppercase;

}



.lc-before-after__cell--after .lc-before-after__label {

  background: var(--lc-gold);

}



.lc-before-after__caption {

  font-size: 14px;

  font-style: italic;

  color: var(--lc-muted);

  text-align: center;

  margin-top: var(--lc-s-2);

}



/* -------------------------------------------------------------

   Video Embed wrapper

   16:9 enforced, rounded corners, dark fallback

   ------------------------------------------------------------- */

.lc-video {

  margin: var(--lc-s-5) auto;

  max-width: var(--lc-img-column);

}



.lc-video__frame {

  position: relative;

  aspect-ratio: 16 / 9;

  background: #000;

  border-radius: var(--lc-radius-md);

  overflow: hidden;

}



.lc-video__frame iframe,

.lc-video__frame video,

.lc-video__frame img {

  width: 100%;

  height: 100%;

  border: 0;

  display: block;

  object-fit: cover;

}



.lc-video__placeholder {

  position: absolute;

  inset: 0;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  background: linear-gradient(135deg, #334376 0%, #1a2647 100%);

  color: #fff;

  font-family: var(--lc-font-heading);

  gap: var(--lc-s-3);

}



.lc-video__play {

  width: 56px;

  height: 56px;

  border-radius: 50%;

  background: rgba(255, 255, 255, 0.18);

  border: 2px solid rgba(255, 255, 255, 0.5);

  display: flex;

  align-items: center;

  justify-content: center;

}



.lc-video__play::before {

  content: "";

  width: 0;

  height: 0;

  border-left: 18px solid #fff;

  border-top: 11px solid transparent;

  border-bottom: 11px solid transparent;

  margin-left: 4px;

}



.lc-video__caption {

  font-family: var(--lc-font-body);

  font-size: 14px;

  font-style: italic;

  color: var(--lc-muted);

  text-align: center;

  margin-top: var(--lc-s-2);

}



/* -------------------------------------------------------------

   Infographic

   Full-bleed container with surface padding

   ------------------------------------------------------------- */

.lc-infographic {

  margin: var(--lc-s-6) auto;

  max-width: var(--lc-img-fullbleed);

  background: var(--lc-surface);

  padding: var(--lc-s-5);

  border-radius: var(--lc-radius-md);

  text-align: center;

}



.lc-infographic img {

  max-width: 100%;

  height: auto;

  display: block;

  margin: 0 auto;

  border-radius: var(--lc-radius-sm);

}



.lc-infographic__caption {

  font-family: var(--lc-font-body);

  font-size: 14px;

  font-style: italic;

  color: var(--lc-muted);

  margin-top: var(--lc-s-3);

}



/* -------------------------------------------------------------

   Map Embed

   Similar to Video, lighter fallback styling

   ------------------------------------------------------------- */

.lc-map {

  margin: var(--lc-s-5) auto;

  max-width: var(--lc-img-column);

}



.lc-map__frame {

  position: relative;

  aspect-ratio: 16 / 9;

  background: var(--lc-surface-alt);

  border-radius: var(--lc-radius-md);

  overflow: hidden;

  border: 1px solid var(--lc-rule);

}



.lc-map__frame iframe,

.lc-map__frame img {

  width: 100%;

  height: 100%;

  border: 0;

  display: block;

  object-fit: cover;

}



.lc-map__placeholder {

  position: absolute;

  inset: 0;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  color: var(--lc-navy);

  font-family: var(--lc-font-heading);

  gap: 12px;

}



.lc-map__pin {

  width: 36px;

  height: 36px;

  background: var(--lc-gold);

  border-radius: 50% 50% 50% 0;

  transform: rotate(-45deg);

  border: 3px solid #fff;

  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);

}



.lc-map__caption {

  font-family: var(--lc-font-body);

  font-size: 14px;

  font-style: italic;

  color: var(--lc-muted);

  text-align: center;

  margin-top: var(--lc-s-2);

}



/* -------------------------------------------------------------

   CTA Box

   Inline lead-capture or contact prompt. Navy fill + gold button.

   ------------------------------------------------------------- */

.lc-cta {

  background: var(--lc-navy);

  color: #fff;

  padding: var(--lc-s-5) var(--lc-s-5);

  margin: var(--lc-s-6) auto;

  border-radius: var(--lc-radius-md);

  text-align: center;

}



.lc-cta__heading {

  font-family: var(--lc-font-heading);

  font-size: 24px;

  font-weight: 700;

  color: #fff;

  margin: 0 0 12px;

  line-height: 1.25;

}



.lc-cta__body {

  font-family: var(--lc-font-body);

  font-size: 17px;

  line-height: 1.55;

  color: rgba(255, 255, 255, 0.9);

  margin: 0 auto var(--lc-s-4);

  max-width: 540px;

}



.lc-cta .lc-cta__button {

  display: inline-block;

  background: var(--lc-gold);

  color: var(--lc-heading-dark);

  font-family: var(--lc-font-heading);

  font-weight: 700;

  font-size: 16px;

  padding: 14px 28px;

  border-radius: 4px;

  text-decoration: none;

  letter-spacing: 0.02em;

  transition: transform 0.15s ease, box-shadow 0.15s ease;

}



.lc-cta .lc-cta__button:hover {

  transform: translateY(-1px);

  box-shadow: 0 4px 12px rgba(208, 166, 103, 0.4);

  color: var(--lc-heading-dark);

}



/* -------------------------------------------------------------

   Internal Link Card

   Styled preview card linking to another LC post or page.

   ------------------------------------------------------------- */

.lc-link-card {

  display: grid;

  grid-template-columns: 160px 1fr;

  gap: var(--lc-s-4);

  align-items: center;

  background: var(--lc-surface);

  padding: var(--lc-s-3);

  margin: var(--lc-s-4) auto;

  border-radius: var(--lc-radius-md);

  text-decoration: none;

  color: var(--lc-body);

  border: 1px solid transparent;

  transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;

}



.lc-content a.lc-link-card {

  text-decoration: none;

  color: var(--lc-body);

}



.lc-link-card:hover {

  border-color: var(--lc-navy);

  color: var(--lc-body);

  transform: translateY(-1px);

  box-shadow: 0 4px 12px rgba(51, 67, 118, 0.08);

}



.lc-link-card__thumb {

  aspect-ratio: 1 / 1;

  overflow: hidden;

  border-radius: var(--lc-radius-sm);

  background: var(--lc-rule);

}



.lc-link-card__thumb img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  display: block;

}



.lc-link-card__content {

  min-width: 0;

}



.lc-link-card__eyebrow {

  font-family: var(--lc-font-heading);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.1em;

  text-transform: uppercase;

  color: var(--lc-gold);

  margin: 0 0 4px;

}



.lc-link-card__title {

  font-family: var(--lc-font-heading);

  font-size: 19px;

  font-weight: 600;

  color: var(--lc-navy);

  margin: 0 0 6px;

  line-height: 1.3;

  transition: color 0.15s ease;

}



.lc-link-card__excerpt {

  font-size: 15px;

  color: var(--lc-muted);

  margin: 0 0 8px;

  line-height: 1.5;

}



.lc-link-card__cta {

  font-family: var(--lc-font-heading);

  font-size: 13px;

  font-weight: 700;

  color: var(--lc-teal);

  letter-spacing: 0.02em;

}



.lc-link-card:hover .lc-link-card__title {

  color: var(--lc-teal);

}



/* -------------------------------------------------------------

   Table of Contents

   Native <details> for collapse. Numbered list with gold accents.

   ------------------------------------------------------------- */

.lc-toc {

  background: var(--lc-surface);

  padding: var(--lc-s-4) 28px;

  margin: var(--lc-s-5) auto;

  border-radius: var(--lc-radius-md);

}



.lc-toc__title {

  font-family: var(--lc-font-heading);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.1em;

  text-transform: uppercase;

  color: var(--lc-gold);

  cursor: pointer;

  list-style: none;

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 0;

  margin: 0 0 var(--lc-s-3);

}



.lc-toc__title::-webkit-details-marker { display: none; }



.lc-toc__title::after {

  content: "";

  width: 10px;

  height: 10px;

  border-right: 2px solid var(--lc-gold);

  border-bottom: 2px solid var(--lc-gold);

  transform: rotate(45deg);

  transition: transform 0.15s ease;

  margin-bottom: 3px;

}



.lc-toc[open] .lc-toc__title {

  margin-bottom: var(--lc-s-3);

}



.lc-toc[open] .lc-toc__title::after {

  transform: rotate(-135deg);

  margin-bottom: 0;

  margin-top: 3px;

}



.lc-toc__list {

  list-style: none;

  counter-reset: toc-counter;

  padding: 0;

  margin: 0;

}



.lc-toc__list li {

  counter-increment: toc-counter;

  padding: 8px 0 8px 36px;

  position: relative;

  border-top: 1px solid var(--lc-rule);

}



.lc-toc__list li:first-child {

  border-top: 0;

}



.lc-toc__list li::before {

  content: counter(toc-counter, decimal-leading-zero);

  position: absolute;

  left: 0;

  top: 50%;

  transform: translateY(-50%);

  font-family: var(--lc-font-heading);

  font-size: 12px;

  font-weight: 700;

  color: var(--lc-gold);

}



.lc-toc__list a {

  font-family: var(--lc-font-body);

  font-size: 16px;

  color: var(--lc-navy);

  text-decoration: none;

  display: block;

  line-height: 1.4;

}



.lc-toc__list a:hover {

  color: var(--lc-teal);

  text-decoration: underline;

  text-underline-offset: 3px;

}



/* -------------------------------------------------------------

   FAQ Accordion

   Native <details>, alternating background, chevron indicator.

   ------------------------------------------------------------- */

.lc-faq {

  margin: var(--lc-s-5) auto;

  border-radius: var(--lc-radius-md);

  overflow: hidden;

  border: 1px solid var(--lc-rule);

}



.lc-faq__item {

  border-bottom: 1px solid var(--lc-rule);

}



.lc-faq__item:last-child { border-bottom: 0; }



.lc-faq__item:nth-child(even) {

  background: var(--lc-surface);

}



.lc-faq__question {

  list-style: none;

  cursor: pointer;

  padding: 18px var(--lc-s-4) 18px 52px;

  font-family: var(--lc-font-heading);

  font-size: 17px;

  font-weight: 600;

  color: var(--lc-navy);

  position: relative;

  line-height: 1.4;

}



.lc-faq__question::-webkit-details-marker { display: none; }



.lc-faq__question::before {

  content: "";

  position: absolute;

  left: 24px;

  top: 50%;

  width: 8px;

  height: 8px;

  border-right: 2px solid var(--lc-gold);

  border-bottom: 2px solid var(--lc-gold);

  transform: translateY(calc(-50% - 3px)) rotate(-45deg);

  transition: transform 0.15s ease;

}



.lc-faq__item[open] .lc-faq__question::before {

  transform: translateY(calc(-50% + 0px)) rotate(45deg);

}



.lc-faq__answer {

  padding: 0 var(--lc-s-4) 18px 52px;

  font-family: var(--lc-font-body);

  font-size: 16px;

  line-height: 1.65;

  color: var(--lc-body);

}



.lc-faq__answer p {

  margin: 0 0 12px;

}



.lc-faq__answer p:last-child {

  margin-bottom: 0;

}



/* -------------------------------------------------------------

   Sources / Citations

   Numbered reference list at end of fact-heavy posts.

   ------------------------------------------------------------- */

.lc-sources {

  margin: var(--lc-s-6) auto;

  padding-top: var(--lc-s-5);

  border-top: 1px solid var(--lc-rule);

}



.lc-sources__title {

  font-family: var(--lc-font-heading);

  font-size: 11px;

  font-weight: 700;

  letter-spacing: 0.1em;

  text-transform: uppercase;

  color: var(--lc-gold);

  margin: 0 0 var(--lc-s-3);

}



.lc-sources__list {

  list-style: decimal;

  padding-left: 24px;

  margin: 0;

}



.lc-sources__list li {

  font-size: 15px;

  line-height: 1.55;

  color: var(--lc-muted);

  padding: 6px 0;

}



.lc-sources__list li a {

  color: var(--lc-navy);

  text-decoration: underline;

  text-underline-offset: 2px;

}



.lc-sources__list li a:hover {

  color: var(--lc-teal);

}



/* -------------------------------------------------------------

   Checklist

   Replaces bullet with green check-circle. For "what's included",

   "things to bring", "what you'll need" style lists.

   ------------------------------------------------------------- */

.lc-list-check {

  list-style: none;

  padding-left: 0;

  margin: var(--lc-s-3) 0;

}



.lc-list-check li {

  position: relative;

  padding-left: 34px;

  margin-bottom: 10px;

  line-height: 1.65;

}



.lc-list-check li:last-child {

  margin-bottom: 0;

}



.lc-list-check li::before {

  content: "✓";

  position: absolute;

  left: 0;

  top: 4px;

  width: 22px;

  height: 22px;

  background: var(--lc-success-border);

  color: #fff;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 13px;

  font-weight: 700;

  line-height: 1;

}



/* -------------------------------------------------------------

   Icon List

   2-column grid of icon + label items. Used for CPT profile

   amenities (Pool, Wifi, Parking, etc).

   ------------------------------------------------------------- */

.lc-list-icon {

  list-style: none;

  padding-left: 0;

  margin: var(--lc-s-3) 0;

  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 10px var(--lc-s-4);

}



.lc-list-icon li {

  display: flex;

  align-items: center;

  gap: 12px;

  margin: 0;

  padding: 6px 0;

  line-height: 1.4;

}



.lc-list-icon__icon {

  width: 22px;

  height: 22px;

  flex-shrink: 0;

  color: var(--lc-navy);

}



/* -------------------------------------------------------------

   Mobile breakpoints

   ------------------------------------------------------------- */

@media (max-width: 768px) {

  .lc-content { font-size: 18px; }   /* v1.1: 17→18 (proportional to the 20px desktop bump) */

  .lc-content h1 { font-size: 36px; }

  .lc-content h2 { font-size: 28px; }

  .lc-content h3 { font-size: 22px; }

  .lc-content h4 { font-size: 18px; }

  .lc-lead { font-size: 19px; }



  .lc-take {

    grid-template-columns: 1fr;

    text-align: center;

    padding: 20px;

  }

  .lc-take__photo {

    margin: 0 auto;

  }



  .lc-storytime {

    padding: var(--lc-s-4);

  }

}



@media (max-width: 480px) {

  .lc-content { font-size: 17px; }   /* v1.1: 16→17 (proportional to the 20px desktop bump) */

  .lc-content h1 { font-size: 30px; }

  .lc-content h2 { font-size: 24px; }

  .lc-content h3 { font-size: 20px; }

  .lc-content h4 { font-size: 18px; }

  .lc-lead { font-size: 17px; }



  .lc-gist,

  .lc-takeaway,

  .lc-warning,

  .lc-action {

    padding-left: 18px;

    padding-right: 18px;

  }



  .lc-stat__number { font-size: 48px; }

}



/* Comparison Table → stacked card layout on mobile */

@media (max-width: 768px) {

  .lc-table--comparison {

    display: block;

  }

  .lc-table--comparison thead {

    display: none;

  }

  .lc-table--comparison tbody,

  .lc-table--comparison tr {

    display: block;

  }

  .lc-table--comparison tbody tr {

    margin-bottom: var(--lc-s-3);

    border: 1px solid var(--lc-rule);

    border-radius: var(--lc-radius-sm);

    overflow: hidden;

    background: #fff;

  }

  .lc-table--comparison tbody tr:nth-child(odd) {

    background: var(--lc-surface);

  }

  .lc-table--comparison tbody th,

  .lc-table--comparison tbody td {

    display: block;

    width: 100%;

    padding: 12px var(--lc-s-3);

    border-bottom: 1px solid var(--lc-rule);

  }

  .lc-table--comparison tbody th {

    background: rgba(51, 67, 118, 0.06);

    font-size: 14px;

    text-transform: uppercase;

    letter-spacing: 0.04em;

  }

  .lc-table--comparison tbody td {

    border-bottom: 0;

  }

  .lc-table--comparison tbody td[data-label]::before {

    content: attr(data-label);

    display: block;

    font-family: var(--lc-font-heading);

    font-weight: 600;

    font-size: 12px;

    text-transform: uppercase;

    letter-spacing: 0.04em;

    color: var(--lc-navy);

    margin-bottom: 4px;

  }



  /* Pros/Cons → stacked vertical */

  .lc-proscons {

    grid-template-columns: 1fr;

  }



  /* Gallery → single column */

  .lc-gallery--3 .lc-gallery__grid,

  .lc-gallery--4 .lc-gallery__grid {

    grid-template-columns: 1fr;

  }



  /* Before/After → stacked */

  .lc-before-after__grid {

    grid-template-columns: 1fr;

  }

}



/* Internal Link Card → stack on smallest screens */

@media (max-width: 480px) {

  .lc-link-card {

    grid-template-columns: 1fr;

  }

  .lc-link-card__thumb {

    aspect-ratio: 16 / 9;

  }

}



/* Icon List → single column on mobile */

@media (max-width: 768px) {

  .lc-list-icon {

    grid-template-columns: 1fr;

  }

}

/* ============================================================
   Media & Text city cards (Communities overview + interim cards)
   Added 2026-07-30 — Bricks doesn't load WP's block-library grid
   CSS, so media-text blocks need these rules to sit side-by-side.
   ============================================================ */
.brxe-post-content .wp-block-media-text, .lc-content .wp-block-media-text{
  display:grid;grid-template-columns:40% auto;gap:28px;align-items:center;margin:30px 0}
.brxe-post-content .wp-block-media-text.has-media-on-the-right,
.lc-content .wp-block-media-text.has-media-on-the-right{grid-template-columns:auto 40%}
.brxe-post-content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media,
.lc-content .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media{order:2}
.brxe-post-content .wp-block-media-text__media, .lc-content .wp-block-media-text__media{margin:0}
.brxe-post-content .wp-block-media-text__media img, .lc-content .wp-block-media-text__media img{
  width:100%;height:100%;max-height:300px;object-fit:cover;border-radius:10px;display:block}
.brxe-post-content .wp-block-media-text__content h3, .lc-content .wp-block-media-text__content h3{margin-top:0}
@media (max-width:640px){
  .brxe-post-content .wp-block-media-text.is-stacked-on-mobile,
  .lc-content .wp-block-media-text.is-stacked-on-mobile{grid-template-columns:100% !important}
  .brxe-post-content .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media,
  .lc-content .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media{order:0}
}

/* --- Compact city-card grid (Communities overview) --- */
.lc-city-grid{margin:26px 0}
.lc-city-grid:not(:has(> .wp-block-group__inner-container)),
.lc-city-grid > .wp-block-group__inner-container{
  display:grid;grid-template-columns:repeat(3,1fr);gap:26px 24px}
.brxe-post-content .lc-city-card, .lc-content .lc-city-card{margin:0}
.brxe-post-content .lc-city-card figure, .lc-content .lc-city-card figure{margin:0 0 10px}
.brxe-post-content .lc-city-card img, .lc-content .lc-city-card img{
  width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:10px;display:block}
.brxe-post-content .lc-city-card h3, .lc-content .lc-city-card h3{margin:2px 0 6px;font-size:1.1rem}
.brxe-post-content .lc-city-card p, .lc-content .lc-city-card p{font-size:.95rem;line-height:1.55;margin:0}
@media (max-width:900px){
  .lc-city-grid:not(:has(> .wp-block-group__inner-container)),
  .lc-city-grid > .wp-block-group__inner-container{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){
  .lc-city-grid:not(:has(> .wp-block-group__inner-container)),
  .lc-city-grid > .wp-block-group__inner-container{grid-template-columns:100%}}

/* --- Section-break rhythm: H2 after a card/grid gets real air above --- */
.brxe-post-content h2.wp-block-heading, .lc-content h2.wp-block-heading{margin-bottom:14px}
.brxe-post-content .wp-block-media-text + h2.wp-block-heading,
.brxe-post-content .lc-city-grid + h2.wp-block-heading,
.lc-content .wp-block-media-text + h2.wp-block-heading,
.lc-content .lc-city-grid + h2.wp-block-heading{margin-top:64px}
/* --- Text-only city cards (town has no real photo yet) --- */
/* Applies only while a card has no figure; re-adding a wp:image reverts it automatically. */
.brxe-post-content .lc-city-card:not(:has(figure)),
.lc-content .lc-city-card:not(:has(figure)){
  border-top:1px solid var(--lc-rule);padding-top:14px}
.brxe-post-content .lc-city-card:not(:has(figure)) h3,
.lc-content .lc-city-card:not(:has(figure)) h3{margin-top:0}

/* A photo-less town sitting in the media-text run needs its own air (Waveland) */
.brxe-post-content .wp-block-media-text + h3.wp-block-heading,
.lc-content .wp-block-media-text + h3.wp-block-heading{margin-top:44px}
