@font-face {
  font-family: "Memorial David";
  src: url("assets/memorial-david-bold-20261006.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: block;
}
:root {
  color-scheme: dark;
  --navy: #06182a;
  --gold: #f5d788;
  --pale-gold: #f4e7c2;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--gold); background: var(--navy); font-family: Arial, "Noto Sans Hebrew", sans-serif; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-underline-offset: .2em; }
button { font: inherit; }
button:focus-visible, a:focus-visible { outline: 3px solid #ffe292; outline-offset: 5px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: absolute; top: -80px; right: 16px; z-index: 8; padding: 10px 18px; background: var(--navy); }
.skip-link:focus { top: 8px; }
.home-bar { background: #061523; border-bottom: 1px solid #d5b16445; }
.bar-inner { max-width: 1380px; margin: auto; padding: 15px 32px; }
.home-bar a { font-size: 17px; font-weight: 600; text-decoration: none; }
.home-bar a:hover { text-decoration: underline; }
.hero { position: relative; width: 66.666667%; max-width: 960px; margin: auto; isolation: isolate; background: #12202c; }
.hero-image { display: block; width: 100%; height: auto; }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; }
.hero-title { position: absolute; inset: 0 8% auto; padding-top: clamp(18px, 3.1vw, 44px); text-align: center; }
h1 { margin: 0; color: #f5dfaa; font-size: clamp(25px, 3.5vw, 48px); line-height: 1.22; font-weight: 700; letter-spacing: -.02em; text-wrap: balance; text-shadow: 0 2px 7px #000b; }
h1 span { display: inline; }
.watermark { position: absolute; bottom: 14px; left: 22px; color: #f1e6caad; font-size: 13px; letter-spacing: .025em; text-shadow: 0 1px 3px #000; }
.fallen-memorial-link { margin: 0; padding: 15px 20px; text-align: center; font-size: 18px; line-height: 1.65; font-weight: 400; background: #06182a; }
.fallen-memorial-link a { font-weight: 400; text-decoration: underline; text-underline-offset: .22em; }
.memorial-search { max-width: 900px; margin: 10px auto 28px; padding: 20px 24px; border: 1px solid #aa875452; border-radius: 5px; background: #0b2235; }
.memorial-search h2 { margin: 0 0 16px; font-size: 25px; text-align: center; color: #f4e7c2; }
.search-controls { display: flex; align-items: center; gap: 12px; }
.search-controls label { font-size: 18px; white-space: nowrap; }
.search-controls input { min-width: 0; flex: 1; width: 100%; padding: 11px 13px; border: 1px solid #bca16b; border-radius: 4px; font: inherit; font-size: 18px; color: #fff0cd; background: #06182a; }
.search-controls input::placeholder { color: #c2baa7; opacity: 1; }
.search-controls button,.locate-plaque { padding: 9px 13px; color: #f8dda0; background: #17354c; border: 1px solid #c1a16070; border-radius: 4px; cursor: pointer; white-space: nowrap; }
.search-controls button:hover,.locate-plaque:hover { background: #214962; }
#search-count { margin: 13px 0 9px; color: #d9cbaa; font-size: 16px; }
.search-table-wrap { max-height: 265px; overflow: auto; border: 1px solid #bca16b57; border-radius: 3px; scrollbar-color: #a58950 #0b2235; }
.search-table { width: 100%; border-collapse: separate; border-spacing: 0; text-align: right; font-size: 17px; }
.search-table th { position: sticky; top: 0; z-index: 1; background: #17354c; color: #f4e7c2; }
.search-table th,.search-table td { padding: 10px 13px; border-bottom: 1px solid #bca16b30; }
.search-table th:nth-child(2),.search-table td:nth-child(2) { text-align: center; }
.search-table th:last-child,.search-table td:last-child { text-align: center; }
.search-table tr:nth-child(even) { background: #102a3d; }
.search-table tr[hidden] { display: none; }
.locate-plaque { padding: 6px 12px; font-size: 16px; }
.no-search-results { text-align: center; padding: 12px; line-height: 1.6; }
.stone-wall { color-scheme: light; background-color: #d5c2a4; background-image: linear-gradient(#3d2c1710,#35260b08),url("assets/stone-wall.webp"); background-size: auto, 1050px 1050px; border-top: 5px solid #a58244; border-bottom: 5px solid #8c6c3a; box-shadow: inset 0 16px 24px #26190624,inset 0 -12px 20px #26190624; }
.wall-inner { max-width: 1360px; padding: 30px 46px 62px; margin: auto; }
.wall-note { margin: 0 0 28px; text-align: center; color: #493b28; font-size: 17px; line-height: 1.5; text-shadow: 0 1px 3px #fff8; }
.plaques { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-start; column-gap: 44px; row-gap: 50px; }
.memorial { width: calc((100% - 88px) / 3); max-width: 390px; min-width: 0; }
.plaque-button { display: block; width: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; border-radius: 3px; }
.mounted-plaque { display: block; width: 100%; height: auto; overflow: visible; filter: drop-shadow(3px 8px 6px #35200a66); transition: filter .18s ease,transform .18s ease; }
.plaque-button:hover .mounted-plaque { transform: translateY(-3px); filter: drop-shadow(4px 12px 9px #35200a75); }
.plaque-button:focus-visible { outline-color: #07314e; }
.site-footer { padding: 34px 22px 28px; text-align: center; font-size: 16px; line-height: 1.6; }
.site-footer p { margin: 11px auto; max-width: 1040px; }
.site-footer .footer-remembrance { margin: 0 0 20px; color: var(--pale-gold); font-size: 24px; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 24px; margin-bottom: 18px; }
.site-footer .rights { font-size: 14px; color: #d0c39f; }
.site-footer .sponsor { margin-top: 18px; }
body.viewer-open { overflow: hidden; }
.plaque-dialog { width: min(94vw,760px); max-width: 760px; height: min(94dvh,1200px); max-height: 94dvh; padding: 0; color: var(--gold); background: #07192b; border: 1px solid #b7904b; border-radius: 4px; box-shadow: 0 24px 90px #0009; }
.plaque-dialog::backdrop { background: #000b; backdrop-filter: blur(3px); }
.viewer-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 18px; border-bottom: 1px solid #d4b36c50; }
.viewer-top h2 { margin: 0; font-size: 24px; line-height: 1.3; }
.viewer-top p { margin: 3px 0 0; font-size: 16px; color: #d1c4a7; }
.close-viewer { flex: 0 0 auto; width: 44px; height: 44px; border: 1px solid #c1a16070; border-radius: 3px; color: #f8dda0; background: #102a3d; cursor: pointer; font-size: 33px; line-height: 1; }
.viewer-stage { height: calc(100% - 151px); display: grid; place-items: center; padding: 18px 12px; background-image: url("assets/stone-wall.webp"); background-size: 900px 900px; }
.viewer-stage .mounted-plaque { height: 100%; width: auto; max-width: 100%; min-height: 0; }
.viewer-controls { display: flex; justify-content: center; align-items: center; gap: 14px; padding: 11px 12px; border-top: 1px solid #d4b36c50; }
.viewer-controls button { padding: 9px 16px; border: 1px solid #c1a16070; color: #f8dda0; background: #102a3d; border-radius: 3px; cursor: pointer; }
.viewer-controls button:hover,.close-viewer:hover { background: #19374d; }
.viewer-count { color: #d0c4a7; font-size: 14px; white-space: nowrap; }
@media (max-width: 1000px) {
  .memorial-search { margin-inline: 24px; }
  .wall-inner { padding-inline: 34px; }
  .plaques { column-gap: 40px; }
  .memorial { width: calc((100% - 40px) / 2); max-width: 380px; }
  h1 { font-size: 35px; }
}
@media (max-width: 620px) {
  .memorial-search { margin: 6px 12px 22px; padding: 18px 12px; }
  .memorial-search h2 { font-size: 23px; }
  .search-controls { flex-wrap: wrap; gap: 9px; }
  .search-controls label { width: 100%; font-size: 17px; }
  .search-controls input { flex-basis: 180px; font-size: 17px; }
  .search-controls button { padding-inline: 10px; font-size: 15px; }
  .search-table-wrap { max-height: 245px; }
  .search-table { font-size: 15px; }
  .search-table th,.search-table td { padding: 9px 6px; }
  .search-table th:first-child { width: 53%; }
  .search-table th:nth-child(2) { width: 21%; }
  .search-table th:last-child { width: 26%; }
  .locate-plaque { padding: 6px 8px; font-size: 14px; }
  .hero { width: 100%; }
  .bar-inner { padding: 12px 18px; }
  .home-bar a { font-size: 16px; }
  .hero-title { inset-inline: 12%; padding-top: 10px; }
  h1 { font-size: clamp(21px,5.5vw,31px); line-height: 1.14; }
  h1 span { display: block; }
  .watermark { left: 10px; bottom: 7px; font-size: 9px; }
  .fallen-memorial-link { padding: 12px 20px; font-size: 17px; line-height: 1.5; }
  .stone-wall { border-width: 3px; background-size: auto,700px 700px; }
  .wall-inner { padding: 22px 24px 35px; }
  .wall-note { font-size: 15px; margin-bottom: 22px; }
  .plaques { row-gap: 34px; }
  .memorial { width: 100%; max-width: 380px; }
  .site-footer { padding-inline: 20px; font-size: 15px; }
  .site-footer .footer-remembrance { font-size: 22px; }
  .site-footer .rights { font-size: 14px; }
  .plaque-dialog { width: 96vw; height: 94dvh; max-height: 94dvh; }
  .viewer-stage { height: calc(100% - 151px); padding: 12px 8px; }
  .viewer-top { padding: 12px; }
  .viewer-top h2 { font-size: 22px; }
  .viewer-controls { gap: 10px; }
  .viewer-controls button { padding: 9px 12px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .mounted-plaque { transition: none; }
}

/* Small album links beneath the memorial plaques. */
.plaque-album-link{margin:10px 0 0;text-align:center;font-size:14px;line-height:1.5}
.plaque-album-link a{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:4px 10px;color:#17354c;text-decoration:underline;text-underline-offset:.2em}
.plaque-album-link a:hover{color:#06182a}
.viewer-album-link{font-size:14px;color:var(--pale-gold);text-underline-offset:.2em}
.plaque-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.plaque-dialog .viewer-stage{height:auto;min-height:0;overflow:hidden}

.construction-plaque{width:min(100%,520px);margin:48px auto 0}
.construction-plaque img{display:block;width:100%;height:auto;filter:drop-shadow(3px 8px 6px #35200a55)}
.site-footer .footer-thanks{margin:26px auto 0;color:var(--pale-gold);font-size:28px;font-weight:700;line-height:1.6}
@media(max-width:620px){.construction-plaque{margin-top:34px}.site-footer .footer-thanks{font-size:24px}}