.yadbod-page {
  background: var(--cream);
  color: var(--ink);
}
.yb-main {
  overflow: hidden;
  background: var(--cream);
}
.yb-hero {
  height: 300px;
  display: grid;
  grid-template-columns: 45% 55%;
  direction: ltr;
  background: #f7f0e5;
  border-top: 4px solid var(--navy);
  overflow: hidden;
}
.yb-hero-copy {
  direction: rtl;
  text-align: right;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 27px 11vw 24px 42px;
  position: relative;
  z-index: 2;
}
.yb-breadcrumb {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  color: #4c6675;
  font-size: 11px;
}
.yb-breadcrumb a {
  font-weight: 700;
  color: #12344e;
}
.yb-breadcrumb span,.yb-eyebrow {
  color: #b67a2e;
}
.yb-eyebrow {
  margin: 0 0 7px;
  font-size: 12px;
  font-weight: 700;
}
.yb-hero h1 {
  margin: 0;
  color: #0a3651;
  font-size: 48px;
  line-height: 1.05;
}
.yb-title-rule {
  width: 160px;
  height: 20px;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 6px 0 8px;
}
.yb-title-rule span {
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg,transparent,#c49351);
}
.yb-title-rule span:last-child {
  transform: scaleX(-1);
}
.yb-title-rule i {
  width: 7px;
  height: 7px;
  border: 1px solid #b77b31;
  transform: rotate(45deg);
}
.yb-lead {
  margin: 0;
  max-width: 530px;
  color: #4d6574;
  font-size: 12px;
  line-height: 2;
}
.yb-hero-visual {
  position: relative;
  overflow: hidden;
  background: #0b2d42;
}
.yb-hero-visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: blur(1.2px);
  transform: scale(1.025);
}
.yb-hero-visual:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg,#f7f0e5 0%,rgba(247,240,229,.78) 13%,rgba(247,240,229,.24) 35%,rgba(247,240,229,0) 60%),linear-gradient(0deg,rgba(3,24,35,.16),rgba(3,24,35,.03));
}
.yb-intro {
  padding: 28px 5vw 12px;
  background: #fffaf2;
  text-align: center;
}
.yb-kicker {
  display: block;
  color: #b67a2e;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  margin-bottom: 6px;
}
.yb-intro h2 {
  margin: 0 0 8px;
  font-size: 28px;
  color: #12344e;
}
.yb-intro p {
  margin: 0 auto;
  max-width: 720px;
  color: #68757e;
  font-size: 11px;
  line-height: 2;
}
.yb-gallery {
  padding: 34px 5vw 54px;
  columns: 4 220px;
  column-gap: 22px;
  background: radial-gradient(circle at 12% 8%,rgba(201,131,36,.05),transparent 26%),
    linear-gradient(180deg,#fffaf2 0%,#f8f1e6 100%);
}
.yb-card {
  position: relative;
  break-inside: avoid;
  margin: 0 0 22px;
  padding: 9px;
  border: 1px solid rgba(185,122,45,.34);
  border-radius: 14px;
  background: linear-gradient(145deg,#f4ead9 0%,#fffaf2 48%,#ead9bf 100%);
  box-shadow: 0 16px 34px rgba(5,34,50,.11),
    0 3px 8px rgba(5,34,50,.08),
    inset 0 0 0 1px rgba(255,255,255,.72);
  overflow: visible;
  transition: transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
.yb-card::before {
  content: "";
  position: absolute;
  inset: 5px;
  z-index: 0;
  border: 1px solid rgba(10,54,81,.14);
  border-radius: 10px;
  pointer-events: none;
}
.yb-card::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -7px;
  width: 42%;
  height: 7px;
  transform: translateX(-50%);
  border-radius: 50%;
  background: rgba(7,35,51,.11);
  filter: blur(5px);
  opacity: .75;
  pointer-events: none;
}
.yb-card:hover {
  transform: translateY(-6px);
  border-color: rgba(185,122,45,.62);
  box-shadow: 0 22px 44px rgba(5,34,50,.16),
    0 5px 12px rgba(5,34,50,.1),
    inset 0 0 0 1px rgba(255,255,255,.8);
}
.yb-image-button {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  padding: 8px;
  border: 0;
  border-radius: 9px;
  background: #fffdf8;
  cursor: zoom-in;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(10,54,81,.08),
    0 2px 8px rgba(9,35,50,.06);
}
.yb-image-button::before {
  content: "";
  position: absolute;
  inset: 8px;
  z-index: 2;
  border: 1px solid rgba(201,131,36,.2);
  border-radius: 5px;
  pointer-events: none;
}
.yb-image-button::after {
  content: "⌕";
  position: absolute;
  left: 14px;
  bottom: 14px;
  z-index: 3;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 50%;
  background: rgba(3,24,35,.72);
  color: #fffaf2;
  font-size: 17px;
  line-height: 1;
  opacity: 0;
  transform: translateY(5px);
  transition: opacity .22s ease,transform .22s ease;
  backdrop-filter: blur(5px);
}
.yb-card:hover .yb-image-button::after {
  opacity: 1;
  transform: translateY(0);
}
.yb-card img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 4px;
  background: #eee5d8;
  filter: saturate(.96) contrast(1.01);
  transition: transform .45s cubic-bezier(.2,.7,.2,1),filter .3s ease;
}
.yb-card:hover img {
  transform: scale(1.018);
  filter: saturate(1.02) contrast(1.02);
}
.yb-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 30px;
  background: rgba(2,17,25,.92);
  backdrop-filter: blur(7px);
}
.yb-lightbox.is-open {
  display: flex;
}
.yb-lightbox-dialog {
  max-width: min(94vw,1200px);
  max-height: 90vh;
  display: flex;
  align-items: center;
  justify-content: center;
}
.yb-lightbox-dialog img {
  max-width: 94vw;
  max-height: 88vh;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 24px 70px rgba(0,0,0,.42);
}
.yb-lightbox-close {
  position: fixed;
  top: 18px;
  right: 22px;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 50%;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: 29px;
  line-height: 1;
  z-index: 2;
}
@media(max-width:900px) {
  .yb-hero {
    grid-template-columns: 1fr;
    height: auto;
  }
  .yb-hero-copy {
    padding: 34px 7vw;
  }
  .yb-hero-visual {
    height: 220px;
  }
  .yb-hero h1 {
    font-size: 38px;
  }
  .yb-gallery {
    columns: 3 190px;
    column-gap: 16px;
  }
  .yb-card {
    margin-bottom: 16px;
    padding: 8px;
  }
}
@media(max-width:620px) {
  .yb-hero h1 {
    font-size: 32px;
  }
  .yb-gallery {
    columns: 2 145px;
    padding: 22px 12px 38px;
    column-gap: 10px;
  }
  .yb-card {
    margin-bottom: 12px;
    padding: 6px;
    border-radius: 10px;
  }
  .yb-image-button {
    padding: 6px;
  }
  .yb-image-button::before {
    inset: 6px;
  }
  .yb-card:hover {
    transform: translateY(-3px);
  }
  .yb-lightbox {
    padding: 18px;
  }
}
/* Pagination */
.yb-is-hidden {
  display: none !important;
}
.yb-pagination-wrap {
  padding: 0 5vw 48px;
  background: #f8f1e6;
  text-align: center;
}
.yb-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  direction: ltr;
}
.yb-page-number,.yb-page-nav {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(10,54,81,.15);
  border-radius: 10px;
  background: #fffaf2;
  color: #12344e;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(5,34,50,.06);
  transition: transform .2s ease,border-color .2s ease,background .2s ease,color .2s ease;
}
.yb-page-number:hover,.yb-page-nav:hover:not(:disabled) {
  transform: translateY(-2px);
  border-color: rgba(185,122,45,.45);
}
.yb-page-number.is-active {
  background: var(--navy);
  color: #fff;
  border-color: var(--navy);
  box-shadow: 0 8px 18px rgba(6,35,52,.18);
}
.yb-page-nav:disabled {
  opacity: .35;
  cursor: not-allowed;
  box-shadow: none;
}
.yb-page-status {
  margin: 10px 0 0;
  color: #68757e;
  font-size: 11px;
}
@media(max-width:620px) {
  .yb-pagination-wrap {
    padding: 0 12px 34px;
  }
  .yb-page-number,.yb-page-nav {
    width: 34px;
    height: 34px;
    border-radius: 9px;
  }
  .yb-pagination {
    gap: 6px;
  }
}
/* Page 1 — editorial gallery layout */
.yb-gallery.is-first-page {
  columns: unset;
  display: grid;
  grid-template-columns: repeat(8,minmax(0,1fr));
  gap: 20px;
  align-items: start;
  padding-top: 30px;
}
.yb-gallery.is-first-page .yb-card {
  grid-column: span 2;
  margin: 0;
  padding: 7px;
  border-radius: 12px;
  background: linear-gradient(145deg,#f0e2cd 0%,#fffaf1 46%,#ead7b9 100%);
  box-shadow: 0 12px 28px rgba(5,34,50,.10),0 2px 7px rgba(5,34,50,.07),inset 0 0 0 1px rgba(255,255,255,.76);
}
.yb-gallery.is-first-page .yb-image-button {
  width: 100%;
  aspect-ratio: 3 / 4;
  padding: 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fffdf8;
}
.yb-gallery.is-first-page .yb-card img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
/* The only landscape image on page 1 becomes the visual anchor. */
.yb-gallery.is-first-page .yb-card:nth-child(3) {
  order: -10;
  grid-column: 1 / span 4;
}
.yb-gallery.is-first-page .yb-card:nth-child(3) .yb-image-button {
  aspect-ratio: 16 / 9;
  padding: 10px;
}
.yb-gallery.is-first-page .yb-card:nth-child(1) {
  order: -9;
  grid-column: 5 / span 2;
}
.yb-gallery.is-first-page .yb-card:nth-child(2) {
  order: -8;
  grid-column: 7 / span 2;
}
/* Center the final three frames of page 1. */
.yb-gallery.is-first-page .yb-card:nth-child(8) {
  grid-column: 2 / span 2;
}
.yb-gallery.is-first-page .yb-card:nth-child(9) {
  grid-column: 4 / span 2;
}
.yb-gallery.is-first-page .yb-card:nth-child(10) {
  grid-column: 6 / span 2;
}
.yb-gallery.is-first-page .yb-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 18px 38px rgba(5,34,50,.14),0 4px 10px rgba(5,34,50,.09),inset 0 0 0 1px rgba(255,255,255,.82);
}
@media(max-width:900px) {
  .yb-gallery.is-first-page {
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 15px;
  }
  .yb-gallery.is-first-page .yb-card,
  .yb-gallery.is-first-page .yb-card:nth-child(1),
  .yb-gallery.is-first-page .yb-card:nth-child(2),
  .yb-gallery.is-first-page .yb-card:nth-child(8),
  .yb-gallery.is-first-page .yb-card:nth-child(9),
  .yb-gallery.is-first-page .yb-card:nth-child(10) {
    grid-column: span 2;
    order: 0;
  }
  .yb-gallery.is-first-page .yb-card:nth-child(3) {
    grid-column: 1 / -1;
    order: -1;
  }
}
@media(max-width:620px) {
  .yb-gallery.is-first-page {
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 10px;
    padding-top: 20px;
  }
  .yb-gallery.is-first-page .yb-card,
  .yb-gallery.is-first-page .yb-card:nth-child(1),
  .yb-gallery.is-first-page .yb-card:nth-child(2),
  .yb-gallery.is-first-page .yb-card:nth-child(8),
  .yb-gallery.is-first-page .yb-card:nth-child(9),
  .yb-gallery.is-first-page .yb-card:nth-child(10) {
    grid-column: span 1;
  }
  .yb-gallery.is-first-page .yb-card:nth-child(3) {
    grid-column: 1 / -1;
  }
  .yb-gallery.is-first-page .yb-image-button {
    padding: 5px;
  }
}
/* Exact image-fit cards: card dimensions follow the image itself */
.yb-card,
.yb-gallery.is-first-page .yb-card {
  padding: 0;
  overflow: hidden;
  background: transparent;
  border: 1px solid rgba(185,122,45,.34);
  border-radius: 10px;
}
.yb-card::before,
.yb-card::after {
  display: none;
}
.yb-image-button,
.yb-gallery.is-first-page .yb-image-button,
.yb-gallery.is-first-page .yb-card:nth-child(3) .yb-image-button {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  padding: 0;
  border-radius: 9px;
  background: transparent;
  box-shadow: none;
  overflow: hidden;
}
.yb-image-button::before {
  display: none;
}
.yb-card img,
.yb-gallery.is-first-page .yb-card img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  object-fit: contain;
  border-radius: 9px;
  background: transparent;
}
@media(max-width:620px) {
  .yb-card,
  .yb-gallery.is-first-page .yb-card {
    padding: 0;
  }
}
/* ===== YADBOD GALLERY — FINAL UNIFIED DESIGN ===== */
.yb-gallery,
.yb-gallery.is-first-page {
  columns: unset !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 22px !important;
  align-items: stretch !important;
  padding: 34px 5vw 42px !important;
  background: radial-gradient(circle at 12% 0%, rgba(201,131,36,.055), transparent 26%),
    linear-gradient(180deg, #fffaf2 0%, #f7f0e6 100%) !important;
}
.yb-card,
.yb-gallery.is-first-page .yb-card,
.yb-gallery.is-first-page .yb-card:nth-child(n) {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  grid-column: auto !important;
  order: 0 !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 7px !important;
  overflow: hidden !important;
  border: 1px solid rgba(185,122,45,.34) !important;
  border-radius: 14px !important;
  background: linear-gradient(145deg,#f1e6d4 0%,#fffaf4 48%,#ead8bd 100%) !important;
  box-shadow: 0 12px 28px rgba(5,34,50,.09), 0 2px 7px rgba(5,34,50,.06) !important;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease !important;
}
.yb-card::before,
.yb-card::after {
  display: none !important;
}
.yb-card:hover {
  transform: translateY(-5px) !important;
  border-color: rgba(185,122,45,.62) !important;
  box-shadow: 0 18px 38px rgba(5,34,50,.14), 0 4px 10px rgba(5,34,50,.08) !important;
}
.yb-image-button,
.yb-gallery.is-first-page .yb-image-button,
.yb-gallery.is-first-page .yb-card:nth-child(n) .yb-image-button {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 5 !important;
  padding: 10px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: #fffdf9 !important;
  box-shadow: inset 0 0 0 1px rgba(10,54,81,.08) !important;
  cursor: zoom-in !important;
}
.yb-image-button::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 8px !important;
  z-index: 2 !important;
  border: 1px solid rgba(201,131,36,.20) !important;
  border-radius: 6px !important;
  pointer-events: none !important;
}
.yb-image-button::after {
  content: "↗" !important;
  position: absolute !important;
  left: 14px !important;
  bottom: 14px !important;
  z-index: 3 !important;
  width: 30px !important;
  height: 30px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(255,255,255,.48) !important;
  border-radius: 50% !important;
  background: rgba(3,24,35,.78) !important;
  color: #fffaf2 !important;
  font-size: 14px !important;
  opacity: 0 !important;
  transform: translateY(5px) !important;
  transition: opacity .2s ease, transform .2s ease !important;
}
.yb-card:hover .yb-image-button::after {
  opacity: 1 !important;
  transform: translateY(0) !important;
}
.yb-card img,
.yb-gallery.is-first-page .yb-card img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 5px !important;
  background: #fffdf9 !important;
  filter: saturate(.97) contrast(1.01) !important;
  transition: transform .38s ease, filter .28s ease !important;
}
.yb-card:hover img {
  transform: scale(1.018) !important;
  filter: saturate(1.02) contrast(1.02) !important;
}
.yb-pagination-wrap {
  padding: 0 5vw 50px !important;
  background: #f7f0e6 !important;
}
.yb-pagination {
  gap: 9px !important;
}
.yb-page-number,
.yb-page-nav {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(10,54,81,.16) !important;
  background: #fffaf2 !important;
  color: #12344e !important;
  box-shadow: 0 5px 14px rgba(5,34,50,.06) !important;
}
.yb-page-number.is-active {
  background: var(--navy) !important;
  color: #fff !important;
  border-color: var(--navy) !important;
  box-shadow: 0 8px 18px rgba(6,35,52,.18) !important;
}
@media (max-width: 1180px) {
  .yb-gallery,
  .yb-gallery.is-first-page {
    grid-template-columns: repeat(4, minmax(0,1fr)) !important;
  }
}
@media (max-width: 900px) {
  .yb-gallery,
  .yb-gallery.is-first-page {
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: 16px !important;
    padding: 28px 4vw 38px !important;
  }
}
@media (max-width: 650px) {
  .yb-gallery,
  .yb-gallery.is-first-page {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 11px !important;
    padding: 20px 12px 30px !important;
  }
  .yb-card,
  .yb-gallery.is-first-page .yb-card {
    padding: 5px !important;
    border-radius: 10px !important;
  }
  .yb-image-button,
  .yb-gallery.is-first-page .yb-image-button {
    padding: 6px !important;
    border-radius: 7px !important;
  }
  .yb-image-button::before {
    inset: 5px !important;
  }
}
/* ===== YADBOD — REDISTRIBUTED PAGE 1 PHOTOS ONLY ===== */
.yb-gallery.yb-page-1 {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  max-width: 1180px !important;
  margin-inline: auto !important;
}
.yb-gallery.yb-page-2,
.yb-gallery.yb-page-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  max-width: 930px !important;
  margin-inline: auto !important;
}
@media (max-width: 900px) {
  .yb-gallery.yb-page-1,
  .yb-gallery.yb-page-2,
  .yb-gallery.yb-page-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    max-width: none !important;
  }
}
@media (max-width: 560px) {
  .yb-gallery.yb-page-1,
  .yb-gallery.yb-page-2,
  .yb-gallery.yb-page-3 {
    grid-template-columns: 1fr !important;
  }
}

/* Memorials pagination: hidden cards must override the gallery's final
   display:flex !important declarations, including its higher-specificity rules. */
.yb-gallery .yb-card.yb-is-hidden,
.yb-gallery.is-first-page .yb-card.yb-is-hidden,
.yb-gallery.is-first-page .yb-card.yb-is-hidden:nth-child(n) {
  display: none !important;
}