/* nw_sal_v2_type_20261020: text sizes on one rem scale */
/* nw_sal_v2_20261020 (v2.1: the mockup) - the salute honor page, one scrolling page (Vincent, 20 Oct 2026).
   Only on ?layout=v2 until approved. Every panel the page already renders is shown, in the
   order of the sticky index; nothing is fetched or built differently. Colours only from the
   page's own variables, so each nation still dresses its hero. */

.sal-v2 { display: flex; flex-direction: column; }
.sal-v2 > * { order: 50; }
.sal-v2 > .mem-subject-hero { order: 0; }
.sal-v2 > .sal-v2-index { order: 1; }
.sal-v2 > #tab-life { order: 10; }
.sal-v2 > #tab-moh { order: 11; }
.sal-v2 > #tab-letters { order: 12; }
.sal-v2 > #tab-service { order: 20; }
.sal-v2 > #tab-also { order: 21; }
.sal-v2 > #tab-longway { order: 22; }
.sal-v2 > #tab-lostwith { order: 23; }
.sal-v2 > #tab-decorations { order: 30; }
.sal-v2 > #tab-uniform { order: 31; }
.sal-v2 > #tab-badges { order: 32; }
.sal-v2 > #tab-family { order: 40; }
.sal-v2 > #tab-rest { order: 50; }
.sal-v2 > #tab-memorials { order: 51; }
.sal-v2 > #tab-remembered { order: 52; }
.sal-v2 > #tab-place { order: 53; }
.sal-v2 > #tab-media { order: 60; }
.sal-v2 > #tab-connections { order: 70; }
.sal-v2 > #tab-keeping { order: 80; }
.sal-v2 > .sal-record-tribute { order: 90; }
.sal-v2 > .sal-tribute-cta { order: 91; }

/* v2.2 (Vincent, 20 Oct 2026): the whole viewport; one typeface; prose set to be read */
.sal-record.sal-v2 { max-width: none; width: 100%; margin-inline: 0; }

/* One typeface for the whole record: the platform's own sans, the face the header and menus are set in.
   Weights carry the hierarchy (the name 800, headings 700, text 400). Hebrew and other scripts fall back
   to the system face of the same kind. */
.sal-v2, .sal-v2 * { font-family: var(--nw-font-sans, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif) !important; }

/* Prose: paragraphs with air between them, a readable size and a line no longer than the eye can follow */
.sal-v2 .mem-subject-tab-panel p { font-size: 1rem !important; line-height: 1.75 !important; margin: 0 0 1.1em;  }
.sal-v2 .mem-subject-tab-panel p:last-child { margin-bottom: 0; }
.sal-v2 .sal-life-summary { font-size: 1.25rem !important; line-height: 1.65 !important;  }
.sal-v2 .mem-subject-tab-panel blockquote { margin: 1.2em 0; padding: .2em 0 .2em 1.2em; border-left: 3px solid var(--mem-gold, #b8933a); font-size: 1rem; line-height: 1.75; font-style: italic;  }

/* Every panel shows; the index scrolls to it rather than swapping it in. */
.sal-v2 .mem-subject-tab-panel { display: flex !important; flex-direction: column; gap: 1.25rem; scroll-margin-top: calc(var(--mem-topbar-h, 64px) + 64px); }
.sal-v2 > .mem-subject-tab-panel + .mem-subject-tab-panel { margin-top: 1.25rem; }
.sal-v2-h { margin: 1.75rem 0 .5rem; font-size: .75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--mem-gold, #7a5b22); }
.sal-record.sal-v2 .sal-panel, .sal-record.sal-v2 .mem-subject-section { border: 0 !important; border-radius: 12px; box-shadow: 0 1px 3px rgba(0,0,0,.08); margin-bottom: 0; }

/* The hero band: his nation's colours as a thin edge (the full band stays for a POW / MIA plate),
   the name in the memorial serif, his service seal small at the top of At a glance. */
.sal-v2 .sal-herocard-nation:not(:has(.sal-herocard-powmia)) { height: 8px; }
.sal-v2 .sal-herocard-nation:not(:has(.sal-herocard-powmia)) span { display: none; }
.sal-v2 .sal-herocard:not(:has(.sal-herocard-powmia)) > .mem-subject-hero-inner { padding-top: 30px; }
.sal-v2 .mem-subject-name { font-weight: 800; letter-spacing: -.01em; font-size: 2.5rem; line-height: 1.05; }
.sal-v2 .sal-herocard-emblem { top: 34px; right: 28px; transform: none; height: 64px; z-index: 3; }
.sal-v2-hh { display: inline-flex; align-items: center; gap: .6rem; margin-top: .6rem; color: var(--mem-t1, #1f1d1a); text-decoration: none; font-size: .875rem; }
.sal-v2-hh img { height: 22px; width: auto; display: block; box-shadow: 0 0 0 1px rgba(0,0,0,.15); }
.sal-v2-acts { display: flex !important; flex-wrap: wrap; gap: 8px; justify-content: flex-start !important; margin: .9rem 0 0 !important; padding: 0 !important; position: static !important; float: none !important; }

/* The sticky index */
.sal-v2-index {
  position: sticky; top: var(--mem-topbar-h, 64px); z-index: 30;
  display: flex; flex-wrap: wrap; gap: 2px 4px;
  margin: 1.25rem 0 1rem; padding: 0 .5rem;
  background: var(--mem-bg, #f4f1ea);
  border-bottom: 1px solid var(--mem-border, #e0d9ca);
}
.sal-v2-index a {
  display: inline-flex; align-items: center; min-height: 48px; padding: 0 .9rem;
  color: var(--mem-t2, #5b554c); text-decoration: none; font-size: 1rem;
  border-bottom: 3px solid transparent;
}
.sal-v2-index a:hover { color: var(--mem-t1, #1f1d1a); }
.sal-v2-index a.active { color: var(--mem-t1, #1f1d1a); font-weight: 700; border-bottom-color: var(--nat-primary, var(--mem-gold, #9b1c2c)); }
.sal-v2-index a:focus-visible { outline: 2px solid var(--mem-gold, #b8933a); outline-offset: -2px; }

.sal-v2-counts { display: flex; flex-wrap: wrap; gap: 8px; margin: .7rem 0 .2rem; }
.sal-v2-counts a {
  padding: .4rem .85rem; border-radius: 999px; font-size: .875rem; text-decoration: none;
  background: var(--mem-surface2, rgba(0,0,0,.05)); color: var(--mem-t1, #1f1d1a);
}
.sal-v2-counts a:hover { background: var(--mem-border, rgba(0,0,0,.1)); }
.sal-v2-counts b { font-weight: 700; }

/* At a glance, in the space right of his name */
.sal-v2 .mem-subject-hero-inner { flex-wrap: wrap; }
.sal-v2-glance {
  flex: 1 1 280px; max-width: 360px; margin-left: auto; position: relative; z-index: 2;
  display: flex; flex-direction: column; gap: .8rem;
  padding-left: 1.5rem; border-left: 1px solid var(--mem-border, #e6e0d3);
  font-size: .875rem; line-height: 1.4;
}
.sal-v2-glance .sal-v2-k { min-height: 64px; display: flex; align-items: center; padding-right: 80px; }
.sal-v2-k { margin: 0; font-size: .6875rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--mem-gold, #7a5b22); }
.sal-v2-glance dl { display: grid; grid-template-columns: max-content 1fr; gap: .3rem .9rem; margin: 0; }
.sal-v2-glance dt { color: var(--mem-t2, #5b554c); }
.sal-v2-glance dd { margin: 0; }
.sal-v2-wars { display: flex; flex-wrap: wrap; gap: 6px; }
.sal-v2-wars a { padding: 2px 9px; border-radius: 4px; font-size: .75rem; text-decoration: none; background: var(--mem-surface2, rgba(0,0,0,.05)); color: var(--mem-t1, #1f1d1a); }
.sal-v2-grave { display: flex !important; gap: 12px; align-items: center; }
.sal-v2-tile { width: 72px; height: 56px; border-radius: 6px; background: #d3e6c6; position: relative; flex: 0 0 auto; }
.sal-v2-tile i { position: absolute; left: 30px; top: 20px; width: 12px; height: 12px; border-radius: 50%; background: var(--nat-primary, #9b1c2c); border: 2px solid #fff; }
.sal-v2-faces { display: flex; align-items: center; gap: 6px; }
.sal-v2-face { width: 34px; height: 34px; border-radius: 50%; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; font-size: .6875rem; background: var(--mem-surface2, #e6e0d3); color: var(--mem-t2, #5b554c); }
.sal-v2-face img { width: 100%; height: 100%; object-fit: cover; }
.sal-v2-faces a { margin-left: 4px; font-size: .875rem; }
.sal-v2-grave, .sal-v2-fam { display: block; padding: .55rem .7rem; border: 1px solid var(--mem-border, #e6e0d3); border-radius: 8px; text-decoration: none; color: inherit; }
.sal-v2-grave:hover, .sal-v2-fam:hover { border-color: var(--mem-gold, #b8933a); }
.sal-v2-grave small, .sal-v2-fam small { display: block; color: var(--mem-t2, #5b554c); }

@media (max-width: 900px) {
  .sal-v2-glance { max-width: none; padding-left: 0; border-left: 0; padding-top: 1rem; border-top: 1px solid var(--mem-border, #e6e0d3); }
}
@media (prefers-reduced-motion: reduce) { .sal-v2 * { scroll-behavior: auto !important; } }

/* v2.3: every prose box reads the same - full text colour, one size, paragraphs, a readable measure */
.sal-v2 .sal-prose, .sal-v2 .sal-story, .sal-v2 .sal-tribute-text { font-size: 1rem !important; line-height: 1.75 !important; color: var(--mem-t1, #1f1d1a) !important; max-width: 78ch !important; }
.sal-v2 .sal-prose p, .sal-v2 .sal-story p { margin: 0 0 1.1em !important; }
.sal-v2 .sal-prose p:last-child, .sal-v2 .sal-story p:last-child { margin-bottom: 0 !important; }
.sal-v2 .sal-life-summary { max-width: 78ch !important; }

/* v2.4: text fills its card - no narrowed column; right-to-left pages start their text on the right */
.sal-v2 .mem-subject-tab-panel p, .sal-v2 .sal-prose, .sal-v2 .sal-story, .sal-v2 .sal-tribute-text, .sal-v2 .sal-life-summary, .sal-v2 .mem-subject-tab-panel blockquote { max-width: none !important; }
.sal-v2 [dir=rtl] { text-align: start; }
.sal-v2-counts a[dir=ltr], .sal-v2-glance dd[dir=ltr] { unicode-bidi: isolate; }

/* nw_sal_v2_sticky_20261020: .mem-main{overflow-x:hidden} (memorial-core.css) made it a scroll box that never
   scrolls, so position:sticky stuck to it and not to the window. clip trims the same overflow without that. */
.mem-main:has(.sal-v2), .mem-body:has(.sal-v2), .sal-page:has(.sal-v2), main:has(.sal-v2) { overflow-x: clip !important; overflow-y: visible !important; }
.sal-v2-index { position: -webkit-sticky; position: sticky; }

/* nw_sal_v2_spy_20261020: a section lands just under the index; a clicked entry keeps no box */
.sal-v2 .mem-subject-tab-panel, .sal-v2 .sal-v2-h { scroll-margin-top: var(--sal-v2-stick, 140px) !important; }
.sal-v2-index a, .sal-v2-index a:focus { outline: none; box-shadow: none !important; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; border-radius: 0 !important; background: none !important; }
.sal-v2-index a:focus-visible { outline: 2px solid var(--mem-gold, #b8933a); outline-offset: -2px; }
/* nw_sal_v2_plate_20261020: the index is his nameplate once his card has gone by */
.sal-v2-index { flex-wrap: nowrap !important; align-items: center; gap: 0 14px !important; padding: 0 16px !important; transition: box-shadow .2s ease; }
.sal-v2-links { display: flex; flex: 1 1 auto; min-width: 0; gap: 0 2px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.sal-v2-links::-webkit-scrollbar { display: none; }
.sal-v2-links a { flex: 0 0 auto; white-space: nowrap; }
.sal-v2-index a, .sal-v2-index a:focus, .sal-v2-index a:focus-visible, .sal-v2-index button:focus { outline: 0 !important; }
.sal-v2-links a:focus-visible { box-shadow: inset 0 -3px 0 var(--mem-gold, #b8933a) !important; background: var(--mem-surface2, rgba(0,0,0,.05)) !important; }
.sal-v2-plate { display: none; align-items: center; gap: 10px; flex: 0 1 auto; min-width: 0; padding: 6px 16px 6px 0; border-right: 1px solid var(--mem-border, #e0d9ca); text-decoration: none !important; color: var(--mem-t1, #1f1d1a) !important; border-bottom: 0 !important; min-height: 0 !important; }
.sal-v2-plate-face { width: 2.5rem; height: 2.5rem; flex: 0 0 auto; border-radius: 50%; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; background: var(--mem-surface2, #e6e0d3); color: var(--mem-t2, #5b554c); font-size: .75rem; font-weight: 700; box-shadow: 0 0 0 2px var(--nat-primary, var(--mem-gold, #b8933a)); }
.sal-v2-plate-face img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; display: block; }
.sal-v2-plate-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.sal-v2-plate-txt b { font-size: 1rem; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sal-v2-plate-txt small { font-size: .75rem; color: var(--mem-t2, #5b554c); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sal-v2-plate-rib { height: .75rem; width: auto; flex: 0 0 auto; box-shadow: 0 0 0 1px rgba(0,0,0,.15); }
.sal-v2-top { display: none; flex: 0 0 auto; width: 2.25rem; height: 2.25rem; border-radius: 50%; border: 1px solid var(--mem-border, #e0d9ca); background: var(--mem-surface, #fff); color: var(--mem-t2, #5b554c); font-size: 1rem; line-height: 1; cursor: pointer; }
.sal-v2-top:hover { color: var(--mem-t1, #1f1d1a); border-color: var(--mem-gold, #b8933a); }
.sal-v2-index.is-stuck { background: var(--mem-surface, #fff) !important; border-top: 3px solid var(--nat-primary, var(--mem-gold, #9b1c2c)); border-bottom-color: transparent; box-shadow: 0 6px 16px rgba(0,0,0,.08); }
.sal-v2-index.is-stuck .sal-v2-plate { display: flex; }
.sal-v2-index.is-stuck .sal-v2-top { display: inline-flex; align-items: center; justify-content: center; }
@media (max-width: 720px) {
  .sal-v2-index { flex-wrap: wrap !important; padding: 0 !important; gap: 0 !important; position: sticky; }
  .sal-v2-plate { flex: 1 1 100%; border-right: 0; border-bottom: 1px solid var(--mem-border, #e0d9ca) !important; padding: 6px 56px 6px 12px; }
  .sal-v2-plate-txt small, .sal-v2-plate-rib { display: none; }
  .sal-v2-plate-face { width: 2rem; height: 2rem; }
  .sal-v2-links { flex: 1 1 100%; padding: 0 6px; }
  .sal-v2-links a { min-height: 44px !important; padding: 0 .75rem !important; }
  .sal-v2-top { position: absolute; right: 10px; top: 6px; width: 2rem; height: 2rem; }
}

/* nw_sal_v2_pad_20261020: the header already carries his nation's line; the bar gets room to breathe */
.sal-v2-index.is-stuck { border-top: 0 !important; border-bottom: 1px solid var(--mem-border, #e0d9ca) !important; }
.sal-v2-index { padding: .5rem 1.75rem !important; gap: 0 1.5rem !important; }
.sal-v2-index.is-stuck { padding-top: .75rem !important; padding-bottom: .75rem !important; }
.sal-v2-plate { gap: .85rem; padding: .25rem 1.5rem .25rem 0; flex: 0 0 auto; max-width: 45%; }
.sal-v2-plate-face { width: 3rem; height: 3rem; }
.sal-v2-plate-txt { gap: .2rem; }
.sal-v2-plate-txt b { font-size: 1.125rem; }
.sal-v2-plate-txt small { font-size: .875rem; }
.sal-v2-plate-rib { height: .875rem; margin-left: .35rem; }
.sal-v2-links { gap: 0 .35rem; }
.sal-v2-links a { padding: 0 1rem !important; }
.sal-v2-top { width: 2.5rem; height: 2.5rem; }
.sal-v2-links a:focus-visible { background: none !important; box-shadow: none !important; text-decoration: underline dotted; text-underline-offset: .35em; }
@media (max-width: 720px) {
  .sal-v2-index, .sal-v2-index.is-stuck { padding: 0 !important; gap: 0 !important; }
  .sal-v2-plate { padding: .6rem 3.75rem .6rem 1rem; gap: .7rem; flex: 1 1 100%; max-width: none; }
  .sal-v2-plate-face { width: 2.25rem; height: 2.25rem; }
  .sal-v2-plate-txt b { font-size: 1rem; }
  .sal-v2-links { padding: 0 .5rem; }
  .sal-v2-links a { padding: 0 .85rem !important; }
  .sal-v2-top { right: 1rem; top: .65rem; width: 2.25rem; height: 2.25rem; }
}

/* nw_sal_v2_totop_20261020: the bar's back-to-top wears the same colour as the floating one */
.sal-v2-top { background: var(--mem-gold, #b8933a) !important; color: #fff !important; border: 0 !important; }
.sal-v2-top:hover { filter: brightness(1.1); color: #fff !important; }

/* nw_sal_v2_phonehead_20261020: under 900px memorial-core squeezes the fixed header to 44px while its three rows
   are ~160px, so the rows spilled out of it (see-through) and the page was pushed down by a different guess (the gap).
   On the honor page the header takes its real height in the flow and stays at the top. */
@media (max-width: 900px) {
  body:has(.sal-v2) .mem-topbar { position: sticky !important; top: 0 !important; height: auto !important; }
  body:has(.sal-v2) .mem-layout, body:has(.sal-v2) .mem-main { margin-top: 0 !important; }
  body:has(.sal-v2) .mem-main { padding-top: 0 !important; }
}
/* nw_sal_v2_story_honors_20261020: Story as one card with the citation framed in it; Honors as rack + switches + highest honors */
.sal-v2 #tab-moh.sal-v2-folded { display: none !important; }
.sal-v2 #tab-moh > .sal-moh { display: none; }
.sal-v2-story > .sal-panel-body { padding: 1.75rem 2rem; }
.sal-v2-story .sal-life-summary { margin: 0 0 1.25rem; font-weight: 500; }
.sal-v2-story .sal-prose + .sal-prose, .sal-v2-story .sal-story { margin-top: 1.1em; }
.sal-v2-sub { margin: 1.75rem 0 .6rem; font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--mem-gold, #7a5b22); }
.sal-v2-cite { margin: 1.75rem 0; padding: 1.25rem 1.5rem; border: 1px solid color-mix(in srgb, var(--mem-gold, #b8933a) 45%, transparent); border-radius: 10px; background: color-mix(in srgb, var(--mem-gold, #b8933a) 6%, var(--mem-surface, #fff)); }
.sal-v2-cite-head { display: flex; align-items: center; gap: 1rem; margin-bottom: .9rem; }
.sal-v2-cite-head img { height: 4.5rem; width: auto; flex: 0 0 auto; }
.sal-v2-cite-head b { display: block; font-size: 1.125rem; font-weight: 800; }
.sal-v2-cite-head small { display: block; font-size: .875rem; color: var(--mem-t2, #5b554c); margin-top: .15rem; }
.sal-v2-cite blockquote { margin: 0 !important; padding: 0 !important; border: 0 !important; font-style: italic; max-width: none !important; }
.sal-v2-cite blockquote p { margin: 0 0 .9em !important; }
.sal-v2-cite blockquote p:last-child { margin-bottom: 0 !important; }
.sal-v2-cite figcaption { margin-top: .9rem; font-size: .875rem; color: var(--mem-t2, #5b554c); }

.sal-v2-card { padding: 1.5rem 1.75rem !important; }
.sal-v2-card-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.sal-v2-card-head .sal-v2-k { min-height: 0 !important; padding: 0 !important; }
.sal-v2-switch { display: inline-flex; gap: .5rem; flex-wrap: wrap; }
.sal-v2-switch button { font: inherit; font-size: .875rem; padding: .5rem 1rem; border-radius: 999px; border: 1px solid var(--mem-border, #e0d9ca); background: var(--mem-surface, #fff); color: var(--mem-t1, #1f1d1a); cursor: pointer; }
.sal-v2-switch button:hover { border-color: var(--mem-gold, #b8933a); }
.sal-v2-switch button[aria-selected="true"] { background: var(--mem-gold, #b8933a); border-color: var(--mem-gold, #b8933a); color: #fff; }
.sal-v2-honors-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 2rem; align-items: start; }
.sal-v2-honors-body.is-solo, .sal-v2-honors-body.is-wide { grid-template-columns: minmax(0, 1fr); }
.sal-v2-honors-body.is-wide .sal-v2-top5 { display: none; }
.sal-v2-rack { display: inline-flex; flex-direction: column; gap: 3px; }
.sal-v2-rack-row { display: flex; justify-content: center; gap: 3px; }
.sal-v2-rack-rib { position: relative; display: block; width: 5.75rem; height: 1.6rem; line-height: 0; border-bottom: 0 !important; }
.sal-v2-rack-rib img { width: 100%; height: 100%; object-fit: fill; display: block; box-shadow: 0 0 0 1px rgba(0,0,0,.12); }
.sal-v2-rack-rib:hover img { box-shadow: 0 0 0 2px var(--mem-gold, #b8933a); }
.sal-v2-rack-rib i { position: absolute; right: 3px; bottom: 2px; font-style: normal; font-size: .6875rem; font-weight: 800; line-height: 1; color: #fff; background: rgba(0,0,0,.55); padding: 1px 3px; border-radius: 3px; }
.sal-v2-top5 { display: flex; flex-direction: column; gap: .6rem; }
.sal-v2-top5 > .sal-v2-k { min-height: 0 !important; padding: 0 !important; margin-bottom: .2rem; }
.sal-v2-top5-item { display: flex; align-items: center; gap: 1rem; padding: .85rem 1rem; border: 1px solid var(--mem-border, #e6e0d3); border-radius: 10px; text-decoration: none !important; color: inherit !important; background: var(--mem-surface, #fff); }
.sal-v2-top5-item:hover { border-color: var(--mem-gold, #b8933a); }
.sal-v2-top5-rib { flex: 0 0 auto; width: 3rem; display: flex; justify-content: center; }
.sal-v2-top5-rib img { width: 3rem; height: .9rem; object-fit: fill; display: block; box-shadow: 0 0 0 1px rgba(0,0,0,.12); }
.sal-v2-top5-rib img.is-medal { width: auto; height: 2.25rem; object-fit: contain; box-shadow: none; }
.sal-v2-top5-txt { display: flex; flex-direction: column; min-width: 0; }
.sal-v2-top5-txt b { font-size: 1rem; font-weight: 700; }
.sal-v2-top5-txt small { font-size: .875rem; color: var(--mem-t2, #5b554c); }
.sal-v2-note { font-size: .875rem; color: var(--mem-t2, #5b554c); margin: 0; }
.sal-v2-hv > .sal-panel-body { padding: 0 !important; border: 0 !important; background: none !important; }
@media (max-width: 900px) {
  .sal-v2-honors-body { grid-template-columns: minmax(0, 1fr); }
  .sal-v2-story > .sal-panel-body { padding: 1.25rem; }
  .sal-v2-card { padding: 1.25rem !important; }
  .sal-v2-rack { display: flex; }
}
