:root {
  --jsj-v2-ink: #211b17;
  --jsj-v2-bronze: #b08a55;
  --jsj-v2-bronze-dark: #87643a;
  --jsj-v2-cream: #f7f1e7;
  --jsj-v2-soft: #eee4d5;
  --jsj-v2-brown: #302821;
  --jsj-v2-copy: #5a5048;
}

.jsj-v2-story-page { margin-top: 0 !important; overflow: hidden; }
.jsj-v2-story-page h1,
.jsj-v2-story-page h2,
.jsj-v2-story-page h3 {
  font-family: Georgia, "Times New Roman", serif;
  color: var(--jsj-v2-ink);
  line-height: 1.12;
}
.jsj-v2-story-page p { text-wrap: pretty; }
.jsj-v2-section { padding: 100px 5vw; }
.jsj-v2-section p { font-size: 1.08rem; line-height: 1.82; color: var(--jsj-v2-copy); }
.jsj-v2-kicker,
.jsj-v2-eyebrow {
  color: var(--jsj-v2-bronze);
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .17em;
  margin-bottom: 16px;
}
.jsj-v2-copy h2,
.jsj-v2-legacy h2,
.jsj-v2-commitment h2,
.jsj-v2-cta h2 {
  font-size: clamp(2.3rem, 4vw, 3.8rem);
  margin-top: 0;
}
.jsj-v2-divider {
  width: 72px !important;
  border: 0 !important;
  border-top: 3px solid var(--jsj-v2-bronze) !important;
  margin: 28px auto 42px !important;
  opacity: 1 !important;
}
.jsj-v2-divider-light { border-color: #d7b57e !important; }

/* Hero */
.jsj-v2-hero { overflow: hidden; }
.jsj-v2-hero .wp-block-cover__background {
 background: linear-gradient(90deg, rgba(12,10,9,.82) 0%, rgba(12,10,9,.58) 40%, rgba(12,10,9,.12) 72%, rgba(12,10,9,.02) 100%) !important;
  opacity: 1 !important;
}
.jsj-v2-hero .wp-block-cover__image-background { object-position: center center; }
.jsj-v2-hero-copy { max-width: 760px; padding: 86px 6vw; margin-left: 0 !important; }
body .jsj-v2-hero .jsj-v2-hero-copy {
    padding-top: 35px !important;
}
.jsj-v2-eyebrow { color: #d9bc8e; }
.jsj-v2-hero-title {
  color: #fff !important;
  font-size: clamp(3rem, 5.5vw, 5.85rem);
  margin: 0 0 24px;
  text-shadow: 0 4px 22px rgba(0,0,0,.36);
}
.jsj-v2-hero-text {
  color: rgba(255,255,255,.94) !important;
  font-size: clamp(1.08rem, 1.5vw, 1.35rem) !important;
  line-height: 1.72 !important;
  max-width: 690px;
}
.jsj-v2-hero-buttons,
.jsj-v2-cta-buttons { gap: 14px; margin-top: 30px; }
.jsj-v2-button-primary .wp-block-button__link {
  background: var(--jsj-v2-bronze);
  color: #fff;
  border-radius: 4px;
  padding: 15px 27px;
  font-weight: 750;
}
.jsj-v2-button-primary .wp-block-button__link:hover { background: var(--jsj-v2-bronze-dark); }
.jsj-v2-button-light .wp-block-button__link {
  color: #fff;
  border-color: rgba(255,255,255,.9);
  border-radius: 4px;
  padding: 13px 25px;
}
.jsj-v2-button-light .wp-block-button__link:hover { background: #fff; color: var(--jsj-v2-ink); }

/* Welcome */
.jsj-v2-welcome { background: #fff; }
.jsj-v2-columns { gap: clamp(38px, 6vw, 88px); }
.jsj-v2-photo img {
  width: 100%;
  object-fit: cover;
  border-radius: 3px;
  box-shadow: 22px 22px 0 var(--jsj-v2-soft);
}
.jsj-v2-photo-tall img { aspect-ratio: 4 / 5; object-position: 67% center; }
.jsj-v2-photo-right img { box-shadow: -22px 22px 0 var(--jsj-v2-soft); }

/* Legacy */
.jsj-v2-legacy { background: var(--jsj-v2-cream); }
.jsj-v2-legacy > p:not(.jsj-v2-kicker),
.jsj-v2-commitment > p { max-width: 900px; margin-left: auto; margin-right: auto; }
.jsj-v2-quote {
  border: 0 !important;
  margin: 48px auto 0 !important;
  padding: 30px 36px !important;
  max-width: 880px;
  background: #fff;
  box-shadow: 0 14px 38px rgba(33,27,23,.08);
  text-align: center;
  position: relative;
}
.jsj-v2-quote:before {
  content: "“";
  display: block;
  color: var(--jsj-v2-bronze);
  font-family: Georgia, serif;
  font-size: 4.2rem;
  line-height: .7;
  margin-bottom: 8px;
}
.jsj-v2-quote p {
  margin: 0 !important;
  color: var(--jsj-v2-ink) !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.3rem, 2vw, 1.75rem) !important;
  line-height: 1.5 !important;
}

/* Puppy journey */
.jsj-v2-journey { background: #fff; }
.jsj-v2-highlight {
  margin-top: 72px !important;
  padding: 30px 38px;
  border-top: 1px solid rgba(176,138,85,.5);
  border-bottom: 1px solid rgba(176,138,85,.5);
}
.jsj-v2-highlight p {
  margin: 0;
  color: var(--jsj-v2-ink) !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.22rem, 1.7vw, 1.55rem) !important;
  line-height: 1.58 !important;
}

/* Lifetime commitment */
.jsj-v2-commitment { background: var(--jsj-v2-brown); color: #fff; }
.jsj-v2-commitment h2 { color: #fff !important; }
.jsj-v2-commitment > p { color: rgba(255,255,255,.84) !important; }
.jsj-v2-kicker-light { color: #d8b782; }
.jsj-v2-quote-light {
  background: rgba(255,255,255,.08);
  box-shadow: none;
  border: 1px solid rgba(255,255,255,.13) !important;
}
.jsj-v2-quote-light p { color: #fff !important; }

/* CTA */
.jsj-v2-cta { background: var(--jsj-v2-cream); text-align: center; }
.jsj-v2-cta > p { max-width: 790px; margin-left: auto; margin-right: auto; }
.jsj-v2-cta-closing {
  color: var(--jsj-v2-ink) !important;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.25rem !important;
}
.jsj-v2-button-dark .wp-block-button__link {
  color: var(--jsj-v2-ink);
  border-color: var(--jsj-v2-ink);
  border-radius: 4px;
  padding: 13px 25px;
}
.jsj-v2-button-dark .wp-block-button__link:hover { background: var(--jsj-v2-ink); color: #fff; }

/* Editor clarity */
.editor-styles-wrapper .jsj-v2-story-page {
  max-width: none !important;
}
.editor-styles-wrapper .jsj-v2-photo:after {
  content: "Click the image, then choose Replace to add your own photo.";
  display: block;
  margin-top: 10px;
  color: #7a6b5f;
  font-size: 12px;
  font-style: italic;
  text-align: center;
}

@media (max-width: 900px) {
  .jsj-v2-hero { min-height: 620px !important; }
  .jsj-v2-hero .wp-block-cover__background { background: rgba(12,10,9,.56) !important; }
  .jsj-v2-hero .wp-block-cover__image-background { object-position: 65% center; }
  .jsj-v2-hero-copy { padding: 110px 7vw 70px; }
  .jsj-v2-columns { gap: 48px; }
}

@media (max-width: 781px) {
  .jsj-v2-columns-reverse-mobile { flex-direction: column-reverse; }
  .jsj-v2-photo-right img { box-shadow: 14px 14px 0 var(--jsj-v2-soft); }
}

@media (max-width: 650px) {
  .jsj-v2-section { padding: 72px 22px; }
  .jsj-v2-hero { min-height: 650px !important; }
  .jsj-v2-hero-copy { padding: 126px 22px 62px; }
  .jsj-v2-hero .wp-block-cover__image-background { object-position: 70% center; }
  .jsj-v2-hero-title { font-size: 2.7rem; }
  .jsj-v2-hero-buttons .wp-block-button,
  .jsj-v2-hero-buttons .wp-block-button__link,
  .jsj-v2-cta-buttons .wp-block-button,
  .jsj-v2-cta-buttons .wp-block-button__link {
    width: 100%;
    text-align: center;
  }
  .jsj-v2-photo img { box-shadow: 14px 14px 0 var(--jsj-v2-soft); }
  .jsj-v2-quote { padding: 28px 22px !important; }
  .jsj-v2-highlight { padding: 26px 20px; }
}


/* Version 2.1 refinements */
.jsj-v2-hero {
  min-height: 650px !important;
}
.jsj-v2-hero .wp-block-cover__background {
  background: linear-gradient(
    90deg,
    rgba(10,8,7,.90) 0%,
    rgba(10,8,7,.76) 31%,
    rgba(10,8,7,.42) 52%,
    rgba(10,8,7,.08) 76%,
    rgba(10,8,7,.02) 100%
  ) !important;
}
.jsj-v2-hero-copy {
  padding-top: 68px !important;
  padding-bottom: 62px !important;
  max-width: 690px !important;
}
.jsj-v2-hero-title,
.jsj-v2-hero-title strong,
.jsj-v2-hero-title a {
  color: #fffaf0 !important;
}
.jsj-v2-eyebrow {
  color: #d8b779 !important;
}
.jsj-v2-hero-text {
  color: rgba(255,250,240,.96) !important;
}
.jsj-v2-hero .wp-block-button__link,
.jsj-v2-cta .jsj-v2-button-primary .wp-block-button__link {
  background: var(--jsj-v2-bronze) !important;
  border-color: var(--jsj-v2-bronze) !important;
  color: #ffffff !important;
}
.jsj-v2-hero .is-style-outline .wp-block-button__link {
  background: rgba(23,18,14,.22) !important;
  border-color: #e7cfaa !important;
  color: #fffaf0 !important;
}
.jsj-v2-hero .is-style-outline .wp-block-button__link:hover {
  background: #fffaf0 !important;
  color: var(--jsj-v2-ink) !important;
}
.jsj-v2-commitment > p {
  color: rgba(255,255,255,.90) !important;
}
.jsj-v2-commitment .jsj-v2-kicker {
  color: #d8b779 !important;
}
.jsj-v2-section {
  padding-top: 88px;
  padding-bottom: 88px;
}

@media (max-width: 900px) {
  .jsj-v2-hero {
    min-height: 610px !important;
  }
  .jsj-v2-hero-copy {
    padding-top: 84px !important;
  }
}

@media (max-width: 650px) {
  .jsj-v2-hero {
    min-height: 590px !important;
  }
  .jsj-v2-hero-copy {
    padding-top: 95px !important;
  }
}


/* ==========================================================
   VERSION 2.2 — BLOODLINE VAULT EDITION
   Keeps the existing editable page blocks, but restyles the
   entire page to match the black, bronze, cream and espresso
   atmosphere of the JSJ Bloodline Vault.
   ========================================================== */

:root {
  --jsj-vault-black: #0d0b09;
  --jsj-vault-black-soft: #15110d;
  --jsj-vault-espresso: #2b2119;
  --jsj-vault-espresso-light: #3a2d23;
  --jsj-vault-bronze: #b68a4a;
  --jsj-vault-bronze-light: #d8b77d;
  --jsj-vault-bronze-dark: #7c582d;
  --jsj-vault-cream: #f4ead9;
  --jsj-vault-ivory: #fff8ec;
  --jsj-vault-copy: #4b4037;
  --jsj-vault-copy-light: rgba(255,248,236,.88);
  --jsj-vault-line: rgba(182,138,74,.42);
}

/* Global page atmosphere */
.jsj-v2-story-page {
  background: var(--jsj-vault-black) !important;
}
.jsj-v2-story-page h1,
.jsj-v2-story-page h2,
.jsj-v2-story-page h3 {
  letter-spacing: -.02em;
}
.jsj-v2-story-page a {
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}

/* Hero — cinematic vault entrance */
.jsj-v2-hero {
  min-height: 640px !important;
  border-bottom: 1px solid rgba(216,183,125,.28);
  box-shadow: inset 0 -34px 70px rgba(0,0,0,.42);
}
.jsj-v2-hero .wp-block-cover__background {
  background:
    linear-gradient(
      90deg,
      rgba(7,6,5,.94) 0%,
      rgba(7,6,5,.86) 28%,
      rgba(10,8,6,.60) 47%,
      rgba(10,8,6,.20) 70%,
      rgba(10,8,6,.03) 100%
    ) !important;
  opacity: 1 !important;
}
.jsj-v2-hero-copy {
  max-width: 620px !important;
  padding-left: clamp(30px, 5.4vw, 92px) !important;
  padding-right: 24px !important;
}
.jsj-v2-hero-title {
  color: var(--jsj-vault-ivory) !important;
  font-size: clamp(2.8rem, 4.45vw, 5.15rem) !important;
  line-height: 1.02 !important;
  max-width: 610px !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: none !important;
  text-shadow: 0 4px 28px rgba(0,0,0,.68);
}
.jsj-v2-hero-title br {
  display: block;
}
.jsj-v2-eyebrow {
  color: var(--jsj-vault-bronze-light) !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.5);
}
.jsj-v2-hero-text {
  color: var(--jsj-vault-copy-light) !important;
  max-width: 560px !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.55);
}
.jsj-v2-hero .jsj-v2-button-primary .wp-block-button__link {
  background: linear-gradient(180deg, #c29a60 0%, #a9783b 100%) !important;
  border: 1px solid #d7b77f !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.22);
}
.jsj-v2-hero .jsj-v2-button-primary .wp-block-button__link:hover {
  background: linear-gradient(180deg, #d0aa72 0%, #b58345 100%) !important;
  transform: translateY(-1px);
}
.jsj-v2-hero .is-style-outline .wp-block-button__link {
  background: rgba(12,9,7,.50) !important;
  border: 1px solid var(--jsj-vault-bronze-light) !important;
  color: var(--jsj-vault-ivory) !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.18);
}
.jsj-v2-hero .is-style-outline .wp-block-button__link:hover {
  background: var(--jsj-vault-bronze) !important;
  color: #fff !important;
}

/* Cream story sections */
.jsj-v2-welcome,
.jsj-v2-journey,
.jsj-v2-cta {
  background:
    radial-gradient(circle at top left, rgba(182,138,74,.07), transparent 34%),
    var(--jsj-vault-cream) !important;
}
.jsj-v2-welcome h2,
.jsj-v2-journey h2,
.jsj-v2-cta h2 {
  color: var(--jsj-vault-black-soft) !important;
}
.jsj-v2-welcome p,
.jsj-v2-journey p,
.jsj-v2-cta p {
  color: var(--jsj-vault-copy) !important;
}
.jsj-v2-kicker {
  color: var(--jsj-vault-bronze-dark) !important;
}

/* Bronze framed photography */
.jsj-v2-photo img {
  border: 1px solid rgba(124,88,45,.46);
  box-shadow:
    18px 18px 0 rgba(182,138,74,.17),
    0 24px 48px rgba(28,20,13,.18) !important;
}
.jsj-v2-photo-right img {
  box-shadow:
    -18px 18px 0 rgba(182,138,74,.17),
    0 24px 48px rgba(28,20,13,.18) !important;
}

/* Legacy — espresso vault chamber */
.jsj-v2-legacy {
  background:
    linear-gradient(rgba(255,255,255,.015), rgba(255,255,255,.015)),
    var(--jsj-vault-espresso) !important;
  border-top: 1px solid var(--jsj-vault-line);
  border-bottom: 1px solid var(--jsj-vault-line);
}
.jsj-v2-legacy h2 {
  color: var(--jsj-vault-ivory) !important;
}
.jsj-v2-legacy > p:not(.jsj-v2-kicker) {
  color: var(--jsj-vault-copy-light) !important;
}
.jsj-v2-legacy .jsj-v2-kicker {
  color: var(--jsj-vault-bronze-light) !important;
}
.jsj-v2-divider {
  border-top-color: var(--jsj-vault-bronze) !important;
  box-shadow: 0 0 18px rgba(182,138,74,.22);
}

/* Plaque-style statements */
.jsj-v2-quote {
  background:
    linear-gradient(180deg, rgba(255,255,255,.97), rgba(244,234,217,.96)) !important;
  border: 1px solid rgba(182,138,74,.62) !important;
  box-shadow:
    0 22px 46px rgba(0,0,0,.22),
    inset 0 0 0 5px rgba(182,138,74,.08) !important;
}
.jsj-v2-quote:before {
  color: var(--jsj-vault-bronze) !important;
}
.jsj-v2-quote p {
  color: var(--jsj-vault-black-soft) !important;
}

/* First-eight-weeks closing statement */
.jsj-v2-highlight {
  background: rgba(182,138,74,.075);
  border-top-color: rgba(124,88,45,.52) !important;
  border-bottom-color: rgba(124,88,45,.52) !important;
}
.jsj-v2-highlight p {
  color: var(--jsj-vault-black-soft) !important;
}

/* Lifetime support — deepest vault room */
.jsj-v2-commitment {
  background:
    radial-gradient(circle at 50% 0%, rgba(182,138,74,.12), transparent 34%),
    linear-gradient(180deg, #17120e 0%, #0e0b09 100%) !important;
  border-top: 1px solid rgba(216,183,125,.30);
  border-bottom: 1px solid rgba(216,183,125,.22);
}
.jsj-v2-commitment h2 {
  color: var(--jsj-vault-ivory) !important;
}
.jsj-v2-commitment > p {
  color: rgba(255,248,236,.88) !important;
}
.jsj-v2-commitment strong {
  color: var(--jsj-vault-ivory) !important;
}
.jsj-v2-commitment .jsj-v2-kicker {
  color: var(--jsj-vault-bronze-light) !important;
}
.jsj-v2-quote-light {
  background:
    linear-gradient(180deg, rgba(72,55,39,.90), rgba(45,33,24,.94)) !important;
  border: 1px solid rgba(216,183,125,.44) !important;
  box-shadow:
    0 20px 48px rgba(0,0,0,.34),
    inset 0 0 0 5px rgba(182,138,74,.08) !important;
}
.jsj-v2-quote-light p {
  color: var(--jsj-vault-ivory) !important;
}

/* Final CTA — warm illuminated chamber */
.jsj-v2-cta {
  border-top: 1px solid rgba(182,138,74,.32);
}
.jsj-v2-cta .jsj-v2-button-primary .wp-block-button__link {
  background: linear-gradient(180deg, #c29a60 0%, #a9783b 100%) !important;
  border: 1px solid #b98f55 !important;
  color: #fff !important;
}
.jsj-v2-cta .jsj-v2-button-primary .wp-block-button__link:hover {
  background: linear-gradient(180deg, #d0aa72 0%, #b58345 100%) !important;
}
.jsj-v2-cta .jsj-v2-button-dark .wp-block-button__link {
  color: var(--jsj-vault-black-soft) !important;
  border-color: var(--jsj-vault-bronze-dark) !important;
  background: transparent !important;
}
.jsj-v2-cta .jsj-v2-button-dark .wp-block-button__link:hover {
  background: var(--jsj-vault-black-soft) !important;
  border-color: var(--jsj-vault-black-soft) !important;
  color: var(--jsj-vault-ivory) !important;
}

/* Section transitions */
.jsj-v2-section {
  position: relative;
  padding-top: 92px !important;
  padding-bottom: 92px !important;
}
.jsj-v2-welcome:before,
.jsj-v2-journey:before,
.jsj-v2-cta:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: min(88%, 1100px);
  height: 1px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, rgba(182,138,74,.38), transparent);
}

/* Prevent theme colors from overriding key text */
body .jsj-v2-story-page .jsj-v2-hero-title {
  color: var(--jsj-vault-ivory) !important;
}
body .jsj-v2-story-page .jsj-v2-hero-text {
  color: var(--jsj-vault-copy-light) !important;
}
body .jsj-v2-story-page .jsj-v2-commitment p {
  color: rgba(255,248,236,.88) !important;
}

@media (max-width: 900px) {
  .jsj-v2-hero {
    min-height: 600px !important;
  }
  .jsj-v2-hero-title {
    font-size: clamp(2.65rem, 7vw, 4.4rem) !important;
    max-width: 560px !important;
  }
}

@media (max-width: 650px) {
  .jsj-v2-hero {
    min-height: 590px !important;
  }
  .jsj-v2-hero .wp-block-cover__background {
    background: rgba(7,6,5,.70) !important;
  }
  .jsj-v2-hero-copy {
    max-width: 100% !important;
  }
  .jsj-v2-hero-title {
    font-size: clamp(2.35rem, 12vw, 3.35rem) !important;
    line-height: 1.04 !important;
  }
  .jsj-v2-section {
    padding-top: 72px !important;
    padding-bottom: 72px !important;
  }
}


/* ==========================================================
   VERSION 2.3 FINAL — READABILITY AND THEME-OVERRIDE FIXES
   ========================================================== */

/* Force bright hero text in both the editor and live site. */
html body .site .jsj-v2-story-page .jsj-v2-hero h1.jsj-v2-hero-title,
html body .site-main .jsj-v2-story-page .jsj-v2-hero h1.jsj-v2-hero-title,
html body .content-area .jsj-v2-story-page .jsj-v2-hero h1.jsj-v2-hero-title,
html body .jsj-v2-story-page .jsj-v2-hero h1.jsj-v2-hero-title,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-hero h1.jsj-v2-hero-title {
  color: #fff8ec !important;
  -webkit-text-fill-color: #fff8ec !important;
  opacity: 1 !important;
  line-height: 1.06 !important;
  text-shadow: 0 4px 28px rgba(0,0,0,.72) !important;
}

html body .site .jsj-v2-story-page .jsj-v2-hero p.jsj-v2-hero-text,
html body .site-main .jsj-v2-story-page .jsj-v2-hero p.jsj-v2-hero-text,
html body .content-area .jsj-v2-story-page .jsj-v2-hero p.jsj-v2-hero-text,
html body .jsj-v2-story-page .jsj-v2-hero p.jsj-v2-hero-text,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-hero p.jsj-v2-hero-text {
  color: #f5ecdf !important;
  -webkit-text-fill-color: #f5ecdf !important;
  opacity: 1 !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.62) !important;
}

html body .site .jsj-v2-story-page .jsj-v2-hero p.jsj-v2-eyebrow,
html body .site-main .jsj-v2-story-page .jsj-v2-hero p.jsj-v2-eyebrow,
html body .content-area .jsj-v2-story-page .jsj-v2-hero p.jsj-v2-eyebrow,
html body .jsj-v2-story-page .jsj-v2-hero p.jsj-v2-eyebrow,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-hero p.jsj-v2-eyebrow {
  color: #ddb978 !important;
  -webkit-text-fill-color: #ddb978 !important;
  opacity: 1 !important;
}

/* Prevent inherited theme link colors inside hero copy. */
html body .jsj-v2-story-page .jsj-v2-hero-copy,
html body .jsj-v2-story-page .jsj-v2-hero-copy *:not(.wp-block-button__link) {
  color: inherit;
}

/* Make Legacy body text comfortably readable. */
html body .site .jsj-v2-story-page .jsj-v2-legacy > p:not(.jsj-v2-kicker),
html body .site-main .jsj-v2-story-page .jsj-v2-legacy > p:not(.jsj-v2-kicker),
html body .content-area .jsj-v2-story-page .jsj-v2-legacy > p:not(.jsj-v2-kicker),
html body .jsj-v2-story-page .jsj-v2-legacy > p:not(.jsj-v2-kicker),
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-legacy > p:not(.jsj-v2-kicker) {
  color: rgba(255,248,236,.94) !important;
  -webkit-text-fill-color: rgba(255,248,236,.94) !important;
  opacity: 1 !important;
}

html body .jsj-v2-story-page .jsj-v2-legacy strong,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-legacy strong {
  color: #fff8ec !important;
  -webkit-text-fill-color: #fff8ec !important;
}

/* Match Lifetime Support readability to Legacy. */
html body .site .jsj-v2-story-page .jsj-v2-commitment > p,
html body .site-main .jsj-v2-story-page .jsj-v2-commitment > p,
html body .content-area .jsj-v2-story-page .jsj-v2-commitment > p,
html body .jsj-v2-story-page .jsj-v2-commitment > p,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-commitment > p {
  color: rgba(255,248,236,.94) !important;
  -webkit-text-fill-color: rgba(255,248,236,.94) !important;
  opacity: 1 !important;
}

/* Slightly brighter dark-section small headings. */
html body .jsj-v2-story-page .jsj-v2-legacy .jsj-v2-kicker,
html body .jsj-v2-story-page .jsj-v2-commitment .jsj-v2-kicker,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-legacy .jsj-v2-kicker,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-commitment .jsj-v2-kicker {
  color: #ddb978 !important;
  -webkit-text-fill-color: #ddb978 !important;
}

/* Final button polish. */
html body .jsj-v2-story-page .jsj-v2-hero .wp-block-button__link:hover,
html body .jsj-v2-story-page .jsj-v2-cta .wp-block-button__link:hover {
  box-shadow:
    0 0 0 1px rgba(216,183,125,.28),
    0 12px 30px rgba(182,138,74,.32) !important;
}

/* Keep headline wording intact across common desktop widths. */
@media (min-width: 901px) {
  html body .jsj-v2-story-page .jsj-v2-hero-copy {
    max-width: 690px !important;
  }
  html body .jsj-v2-story-page .jsj-v2-hero-title {
    max-width: 650px !important;
    font-size: clamp(3rem, 4.1vw, 4.9rem) !important;
  }
}


/* ==========================================================
   VERSION 2.4 — FINAL LEGACY SECTION FIX
   ========================================================== */

/* Force every paragraph in the Legacy section to a readable warm ivory. */
html body .jsj-v2-story-page .jsj-v2-legacy p,
html body .site .jsj-v2-story-page .jsj-v2-legacy p,
html body .site-main .jsj-v2-story-page .jsj-v2-legacy p,
html body .content-area .jsj-v2-story-page .jsj-v2-legacy p,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-legacy p {
  color: rgba(255,248,236,.93) !important;
  -webkit-text-fill-color: rgba(255,248,236,.93) !important;
  opacity: 1 !important;
}

/* Keep the small section label bronze. */
html body .jsj-v2-story-page .jsj-v2-legacy p.jsj-v2-kicker,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-legacy p.jsj-v2-kicker {
  color: #ddb978 !important;
  -webkit-text-fill-color: #ddb978 !important;
}

/* Keep the quote card text dark on the light plaque. */
html body .jsj-v2-story-page .jsj-v2-legacy .jsj-v2-quote p,
html body .site .jsj-v2-story-page .jsj-v2-legacy .jsj-v2-quote p,
html body .site-main .jsj-v2-story-page .jsj-v2-legacy .jsj-v2-quote p,
html body .content-area .jsj-v2-story-page .jsj-v2-legacy .jsj-v2-quote p,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-legacy .jsj-v2-quote p {
  color: #17120e !important;
  -webkit-text-fill-color: #17120e !important;
  opacity: 1 !important;
}

/* Ensure bold text remains bright and readable in the Legacy section. */
html body .jsj-v2-story-page .jsj-v2-legacy p strong,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-legacy p strong {
  color: #fff8ec !important;
  -webkit-text-fill-color: #fff8ec !important;
}

/* But the quote plaque bold text must stay dark. */
html body .jsj-v2-story-page .jsj-v2-legacy .jsj-v2-quote p strong,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-legacy .jsj-v2-quote p strong {
  color: #17120e !important;
  -webkit-text-fill-color: #17120e !important;
}


/* ==========================================================
   VERSION 2.5 — RESPONSIVE GALLERY FRAME
   Displays the complete family photograph without cropping and
   replaces offset drop shadows with a refined double border.
   ========================================================== */

/* Give the family portrait and copy a balanced desktop layout. */
.jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child {
  flex-basis: 52% !important;
}
.jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child {
  flex-basis: 48% !important;
}

/* Framed-photo treatment: cream mat, bronze outer border, dark inner keyline. */
html body .jsj-v2-story-page .jsj-v2-welcome figure.jsj-v2-photo,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome figure.jsj-v2-photo {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 14px;
  background: var(--jsj-vault-cream, #f4ead9);
  border: 2px solid var(--jsj-vault-bronze, #b68a4a);
  outline: 1px solid rgba(33, 27, 23, .72);
  outline-offset: -8px;
  border-radius: 2px;
  box-shadow: none !important;
}

/* Preserve the complete original photo and center it in the frame. */
html body .jsj-v2-story-page .jsj-v2-welcome figure.jsj-v2-photo img,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome figure.jsj-v2-photo img,
html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-photo-tall img,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-photo-tall img {
  display: block;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  border: 1px solid rgba(33, 27, 23, .56);
  border-radius: 0;
  box-shadow: none !important;
}

/* Remove the former directional shadow from right-side photos as well. */
html body .jsj-v2-story-page .jsj-v2-photo-right img,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-photo-right img {
  box-shadow: none !important;
}

@media (max-width: 900px) {
  .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
  .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child {
    flex-basis: 50% !important;
  }
}

@media (max-width: 781px) {
  .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
  .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child {
    flex-basis: 100% !important;
  }
}

@media (max-width: 650px) {
  html body .jsj-v2-story-page .jsj-v2-welcome figure.jsj-v2-photo,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome figure.jsj-v2-photo {
    padding: 10px;
    outline-offset: -6px;
  }
}

/* ==========================================================
   VERSION 2.6 — FRONT-END FRAME RELIABILITY + CONSISTENCY
   Applies the gallery frame to every editable story-page photo,
   not only the welcome image. High specificity and !important
   protect the styling from theme/front-end overrides.
   ========================================================== */
html body .jsj-v2-story-page figure.wp-block-image.jsj-v2-photo,
body .entry-content .jsj-v2-story-page figure.wp-block-image.jsj-v2-photo,
.editor-styles-wrapper .jsj-v2-story-page figure.wp-block-image.jsj-v2-photo {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 12px !important;
  background: #f4ead9 !important;
  border: 2px solid #b68a4a !important;
  outline: 1px solid rgba(33,27,23,.72) !important;
  outline-offset: -7px !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}

html body .jsj-v2-story-page figure.wp-block-image.jsj-v2-photo > img,
body .entry-content .jsj-v2-story-page figure.wp-block-image.jsj-v2-photo > img,
.editor-styles-wrapper .jsj-v2-story-page figure.wp-block-image.jsj-v2-photo > img {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  border: 1px solid rgba(33,27,23,.56) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Slightly enlarge photo columns while preserving readable copy. */
html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child {
  flex-basis: 54% !important;
}
html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child {
  flex-basis: 46% !important;
}

@media (max-width: 781px) {
  html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
  html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child {
    flex-basis: 100% !important;
  }
}

/* ==========================================================
   VERSION 2.7 — WELCOME PHOTO FRAME FALLBACK
   The family image may lose its custom CSS class after being
   replaced in the editor. Target the actual first image block
   in the Welcome section so the frame always appears.
   ========================================================== */
html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child figure.wp-block-image,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child figure.wp-block-image,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child figure.wp-block-image {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 12px !important;
  background: #f4ead9 !important;
  border: 2px solid #b68a4a !important;
  outline: 1px solid rgba(33,27,23,.72) !important;
  outline-offset: -7px !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}

html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child figure.wp-block-image > img,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child figure.wp-block-image > img,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child figure.wp-block-image > img {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  border: 1px solid rgba(33,27,23,.56) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}


/* ==========================================================
   VERSION 2.8 — LARGER, BETTER-BALANCED PHOTO SECTIONS
   Gives the family portrait more presence and enlarges the
   nursery photograph substantially while preserving the same
   gallery frame on the editor and live page.
   ========================================================== */

/* Allow both photo-and-copy rows to use more of the available desktop width. */
html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns,
html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns,
body .entry-content .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns {
  width: min(1320px, 100%) !important;
  max-width: 1320px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: clamp(34px, 4vw, 58px) !important;
  align-items: center !important;
}

/* Family portrait: approximately 10–12% more visual presence. */
html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child {
  flex-basis: 57% !important;
}
html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child {
  flex-basis: 43% !important;
}

/* Nursery: enlarge the image from the former 44% column to a balanced half-page feature. */
html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:first-child,
body .entry-content .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:first-child,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:first-child {
  flex-basis: 52% !important;
}
html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:last-child,
body .entry-content .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:last-child,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:last-child {
  flex-basis: 48% !important;
}

/* Keep both framed photographs centered inside their columns. */
html body .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image,
html body .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image,
body .entry-content .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image {
  margin-left: auto !important;
  margin-right: auto !important;
}

@media (max-width: 1000px) {
  html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
  html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child,
  html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:first-child,
  html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:last-child,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:first-child,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:last-child {
    flex-basis: 50% !important;
  }
}

@media (max-width: 781px) {
  html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column,
  html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column,
  body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column,
  body .entry-content .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column {
    flex-basis: 100% !important;
  }
}

/* ==========================================================
   VERSION 3.0 — FINAL PHOTO SECTION POLISH
   Consistent framed images, matched visual rhythm, and stronger
   desktop sizing for the Welcome and First Eight Weeks sections.
   These rules intentionally target the actual image block even
   when WordPress removes a custom image class after replacement.
   ========================================================== */

/* Keep both storytelling rows spacious and consistently aligned. */
html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns,
html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns,
body .entry-content .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns {
  width: min(1380px, 100%) !important;
  max-width: 1380px !important;
  gap: clamp(38px, 4.25vw, 66px) !important;
  align-items: center !important;
}

/* Welcome: give the family portrait slightly more presence while
   keeping enough room for the heading and story copy. */
html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child {
  flex-basis: 55% !important;
}
html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:last-child {
  flex-basis: 45% !important;
}

/* First Eight Weeks: true 50/50 balance so the nursery reads as a
   feature image rather than a small accent beside the longer copy. */
html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:first-child,
html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:last-child,
body .entry-content .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:first-child,
body .entry-content .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:last-child,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:first-child,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column:last-child {
  flex-basis: 50% !important;
}

/* Reliable gallery frame on both actual image blocks, regardless of
   whether the editor retained the jsj-v2-photo class. */
html body .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image,
html body .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image,
body .entry-content .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 12px !important;
  background: #f4ead9 !important;
  border: 2px solid #b68a4a !important;
  outline: 1px solid rgba(33,27,23,.72) !important;
  outline-offset: -7px !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}

html body .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image > img,
html body .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image > img,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image > img,
body .entry-content .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image > img,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image > img,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image > img {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  border: 1px solid rgba(33,27,23,.56) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Subtle alignment polish: bring the welcome image upward without
   disturbing mobile stacking or the editor-only replacement note. */
@media (min-width: 1001px) {
  html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
  body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column:first-child {
    transform: translateY(-18px);
  }
}

@media (max-width: 1000px) {
  html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column,
  html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column,
  body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column,
  body .entry-content .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column {
    flex-basis: 50% !important;
  }
}

@media (max-width: 781px) {
  html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column,
  html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column,
  body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column,
  body .entry-content .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns > .wp-block-column,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns > .wp-block-column {
    flex-basis: 100% !important;
    transform: none !important;
  }
}

@media (max-width: 650px) {
  html body .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image,
  html body .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image,
  body .entry-content .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image,
  body .entry-content .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome figure.wp-block-image,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey figure.wp-block-image {
    padding: 9px !important;
    outline-offset: -6px !important;
  }
}


/* ==========================================================
   VERSION 3.1 — SINGLE RELIABLE GALLERY-FRAME COMPONENT
   Apply the frame directly to each section's actual image.
   This survives WordPress replacing or stripping figure classes.
   ========================================================== */

/* The figure is only a clean responsive holder. Remove all legacy
   frame/shadow rules from it so every photo uses one shared system. */
html body .jsj-v2-story-page .jsj-v2-welcome .wp-block-column:first-child figure.wp-block-image,
html body .jsj-v2-story-page .jsj-v2-journey .wp-block-column:last-child figure.wp-block-image,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome .wp-block-column:first-child figure.wp-block-image,
body .entry-content .jsj-v2-story-page .jsj-v2-journey .wp-block-column:last-child figure.wp-block-image,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .wp-block-column:first-child figure.wp-block-image,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .wp-block-column:last-child figure.wp-block-image {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* One gallery frame for both real photos. Target the actual image,
   not a custom class that may disappear when the image is replaced. */
html body .jsj-v2-story-page .jsj-v2-welcome .wp-block-column:first-child figure.wp-block-image > img,
html body .jsj-v2-story-page .jsj-v2-journey .wp-block-column:last-child figure.wp-block-image > img,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome .wp-block-column:first-child figure.wp-block-image > img,
body .entry-content .jsj-v2-story-page .jsj-v2-journey .wp-block-column:last-child figure.wp-block-image > img,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .wp-block-column:first-child figure.wp-block-image > img,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .wp-block-column:last-child figure.wp-block-image > img {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  padding: 12px !important;
  background: #f4ead9 !important;
  border: 2px solid #b68a4a !important;
  outline: 1px solid rgba(33,27,23,.72) !important;
  outline-offset: -7px !important;
  border-radius: 2px !important;
  box-shadow: none !important;
}

/* Maintain equal visual strength and clean vertical alignment. */
html body .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns,
html body .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns,
body .entry-content .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns,
body .entry-content .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .jsj-v2-columns,
.editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .jsj-v2-columns {
  align-items: center !important;
}

@media (max-width: 650px) {
  html body .jsj-v2-story-page .jsj-v2-welcome .wp-block-column:first-child figure.wp-block-image > img,
  html body .jsj-v2-story-page .jsj-v2-journey .wp-block-column:last-child figure.wp-block-image > img,
  body .entry-content .jsj-v2-story-page .jsj-v2-welcome .wp-block-column:first-child figure.wp-block-image > img,
  body .entry-content .jsj-v2-story-page .jsj-v2-journey .wp-block-column:last-child figure.wp-block-image > img,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-welcome .wp-block-column:first-child figure.wp-block-image > img,
  .editor-styles-wrapper .jsj-v2-story-page .jsj-v2-journey .wp-block-column:last-child figure.wp-block-image > img {
    padding: 9px !important;
    outline-offset: -6px !important;
  }
}

/* =========================================================
   JSJ v3.2 — CACHE-SAFE WELCOME PORTRAIT FRAME
   The family photo can lose its block classes when replaced.
   Target the saved alt text directly so the frame always shows.
   ========================================================= */
html body img[alt="The family behind Jordan's Shorty Jacks"],
body .entry-content img[alt="The family behind Jordan's Shorty Jacks"],
.editor-styles-wrapper img[alt="The family behind Jordan's Shorty Jacks"] {
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  padding: 8px !important;
  background: #f7eddc !important;
  border: 1px solid rgba(33,27,23,.56) !important;
  outline: 2px solid #b68a4a !important;
  outline-offset: 5px !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}


/* Contact Form – force visible fields on live page */
body .wp-site-blocks .kb-advanced-form input.kb-field,
body .wp-site-blocks .kb-advanced-form textarea.kb-field,
body .wp-site-blocks .kb-advanced-form select.kb-field {
    background-color: #ffffff !important;
    border: 1px solid #c9b79c !important;
    color: #211b17 !important;
    box-shadow: none !important;
}

body .wp-site-blocks .kb-advanced-form button,
body .wp-site-blocks .kb-advanced-form input[type="submit"] {
    background-color: #b68a4a !important;
    border-color: #b68a4a !important;
    color: #ffffff !important;
}

body .wp-site-blocks .kb-advanced-form button:hover,
body .wp-site-blocks .kb-advanced-form input[type="submit"]:hover {
    background-color: #8f672f !important;
    border-color: #8f672f !important;
    color: #ffffff !important;
}

