/* =====================================================================
   LKF APREZI MEMORIAL — HOMEPAGE (approved design, Nov 2026)
   Framed portrait with a candle flickering from behind, emblem row,
   live counters, plain page directory, and the two floating buttons
   (Leave a Tribute / Write a Letter) shown on every public page.
   ===================================================================== */
:root {
  --h-bg: #0B1C14; --h-bg2: #0D2219; --h-panel: #163024;
  --h-gold: #C9A15A; --h-gold-hi: #D4AC60; --h-ivory: #F2EEE3; --h-paper: #F2ECDF; --h-ink: #15251D;
  --h-name: "Cormorant Garamond", "Libre Baskerville", Georgia, serif;
  --dock-space: 104px;
}

/* ---------- Shared header: LKF laurel mark + memorial name ------------- */
.site-header .brand { display: flex; align-items: center; gap: 12px; }
.brand-lkf { width: 44px; height: 44px; flex: 0 0 auto; display: block; }
.brand-lkf svg { width: 44px; height: 44px; display: block; }
.brand-lkf .lk-branch { fill: none; stroke: var(--h-gold); stroke-width: 1.4; }
.brand-lkf .lk-leaf { fill: var(--h-gold); }
.brand-lkf text { fill: #E8D5A5; font: 400 11px "Libre Baskerville", Georgia, serif; }
.brand-divider { width: 1px; height: 34px; background: rgba(201,161,90,.6); flex: 0 0 auto; }
.site-header .brand-text { display: flex; flex-direction: column; gap: 3px; }
.site-header .brand-text strong { font: 400 14.5px/1.15 "Libre Baskerville", Georgia, serif; letter-spacing: .08em; color: var(--h-ivory); }
.site-header .brand-text small { font: 400 10.5px/1.2 var(--sans); letter-spacing: .3em; color: #CDBB92; }

/* ---------- Homepage ---------------------------------------------------- */
#home.home { padding: 0; background: var(--h-bg); color: var(--h-ivory); }
#home .home-hero {
  position: relative; overflow: hidden; padding: 22px 16px 20px;
  background:
    radial-gradient(ellipse 60% 55% at -6% 42%, rgba(44,104,66,.75), rgba(44,104,66,0) 70%),
    radial-gradient(ellipse 30% 70% at 4% 70%, rgba(30,80,50,.6), rgba(30,80,50,0) 75%),
    linear-gradient(180deg, var(--h-bg2) 0%, var(--h-bg) 100%);
}
#home .home-drape { position: absolute; left: -40px; top: 40px; width: 150px; height: 470px; opacity: .55; border-radius: 0 60% 40% 0;
  background: repeating-linear-gradient(98deg, rgba(255,255,255,.05) 0 7px, rgba(0,0,0,.12) 7px 16px, rgba(255,255,255,.03) 16px 22px); }
#home .home-laurel { position: absolute; left: 8px; top: 270px; width: 70px; height: 170px; opacity: .35; }
.hl-stem { fill: none; stroke: #B89A5A; stroke-width: 1.4; }
.hl-leaf { fill: #B89A5A; }
#home .home-inner { position: relative; max-width: 560px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; text-align: center; }

#home .home-kicker { display: flex; align-items: center; gap: 12px; margin: 0; font: 400 12px "Libre Baskerville", Georgia, serif; letter-spacing: .32em; text-transform: uppercase; color: var(--h-gold); }
#home .home-kicker span, #home .home-section-title span, .home-legacy-title span { display: block; height: 1px; background: currentColor; }
#home .home-kicker span { width: 34px; }
#home .home-name { margin: 8px 0 0; font-family: var(--h-name); font-weight: 500; line-height: 1.02; }
#home .home-name > span { display: block; }
#home .hn-rank { font-size: clamp(33px, 4vw, 46px); color: var(--h-ivory); }
#home .hn-given { font-size: clamp(32px, 3.9vw, 45px); font-style: italic; font-weight: 600; color: var(--h-gold-hi); }
#home .hn-rtd { font-size: clamp(30px, 3.6vw, 42px); color: var(--h-ivory); }
.home-divider { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 8px; }
.home-divider span { width: 92px; height: 1px; background: var(--h-gold); }
.home-divider svg { width: 14px; height: 14px; fill: var(--h-gold); }
#home .home-tagline { position: relative; z-index: 1; margin: 9px 0 0; font: 400 11px/1.4 "Libre Baskerville", Georgia, serif; letter-spacing: .2em; text-transform: uppercase; color: var(--h-ivory); text-align: center; }

/* Portrait in an ornate gold frame; the candle stands behind it */
#home .home-portrait { position: relative; margin-top: 42px; width: min(230px, 62vw); }
#home .home-glow { position: absolute; z-index: 0; left: 50%; top: -96px; width: 190px; height: 190px; margin-left: -95px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,206,120,.42), rgba(255,170,80,.14) 38%, rgba(255,150,60,0) 68%);
  animation: hGlow 2.8s ease-in-out infinite; }
#home .home-candle { position: absolute; z-index: 1; left: 50%; top: -34px; width: 14px; height: 56px; margin-left: -7px; }
#home .home-candle > span { position: absolute; display: block; }
#home .hc-flame { left: 3px; top: 0; width: 8px; height: 19px; border-radius: 50% 50% 45% 45% / 62% 62% 38% 38%;
  background: radial-gradient(ellipse 50% 60% at 50% 78%, #FFFEF4, #FFF1C2 22%, #FFD27A 46%, #FF9E3C 72%, rgba(255,120,40,0));
  transform-origin: 50% 92%; filter: drop-shadow(0 0 6px rgba(255,190,90,.9)); animation: hFlick 1.6s ease-in-out infinite; }
#home .hc-flame i { position: absolute; left: 30%; right: 30%; bottom: 6%; height: 20%; border-radius: 50%; background: rgba(120,150,255,.4); filter: blur(.6px); }
#home .hc-wick { left: 6.5px; top: 18px; width: 1.5px; height: 4px; background: #2A1E10; }
#home .hc-body { left: 0; top: 21px; width: 14px; height: 35px; border-radius: 2px 2px 1px 1px;
  background: linear-gradient(90deg, #6A5A40, #EFE2C0 38%, #F8EFD8 52%, #D8C49A 74%, #7E6B4C); box-shadow: 0 4px 8px rgba(0,0,0,.5); }
#home .home-frame { position: relative; z-index: 2; margin: 0; padding: 11px; border-radius: 2px;
  background: repeating-linear-gradient(45deg, rgba(60,36,6,.28) 0 1.5px, rgba(0,0,0,0) 1.5px 4px),
              linear-gradient(135deg, #6E4F1C 0%, #E9CF86 16%, #9A7330 32%, #F3DD9A 50%, #8A6428 68%, #D9B864 84%, #6E4F1C 100%);
  box-shadow: 0 18px 40px rgba(0,0,0,.6), inset 0 0 0 1px rgba(255,240,200,.35); }
#home .hf-gap { padding: 3px; background: #3A2A10; }
#home .hf-bevel { padding: 4px; background: linear-gradient(135deg, #F4E2A6, #A7802F 45%, #F0D894 70%, #8C6A2A); }
#home .hf-bevel img { display: block; width: 100%; height: auto; aspect-ratio: 5 / 6; object-fit: cover; object-position: 50% 18%; }
@keyframes hFlick { 0%,100% { transform: scale(1,1) skewX(0deg); } 18% { transform: scale(.92,1.1) skewX(-5deg); } 40% { transform: scale(1.06,.93) skewX(4deg); } 63% { transform: scale(.94,1.08) skewX(-3deg); } 82% { transform: scale(1.03,.97) skewX(2deg); } }
@keyframes hGlow { 0%,100% { opacity: .7; transform: scale(1); } 30% { opacity: 1; transform: scale(1.12); } 55% { opacity: .78; transform: scale(.95); } 78% { opacity: .92; transform: scale(1.05); } }

/* Emblem row */
#home .home-section-title { display: flex; align-items: center; gap: 12px; width: 100%; margin: 22px 0 0; font: 400 12px "Libre Baskerville", Georgia, serif; letter-spacing: .24em; text-transform: uppercase; color: var(--h-gold); }
#home .home-section-title span { flex: 1; opacity: .8; }
#home .home-nations { width: calc(100% + 16px); margin: 14px -8px 0; }
#home .home-nations img { display: block; width: 100%; height: auto; }
#home .home-nation-names { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); column-gap: 4px; margin: 4px 0 0; padding: 0 2px; list-style: none; }
#home .home-nation-names li { text-align: center; font: 400 clamp(6.8px, 1.75vw, 10px)/1.3 "Libre Baskerville", Georgia, serif; text-transform: uppercase; color: #ECE4D2; }

/* Ivory section: live counters + plain page directory */
#home .home-legacy { background: var(--h-paper); color: var(--h-ink); }
#home .home-legacy-inner { max-width: 560px; margin: 0 auto; padding: 22px 16px 26px; }
.home-legacy-title { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 0; font: 400 12.5px "Libre Baskerville", Georgia, serif; letter-spacing: .22em; text-transform: uppercase; color: var(--h-ink); }
.home-legacy-title span { width: 40px; }
#home .home-counts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
#home .home-count { display: flex; align-items: center; justify-content: center; gap: 14px; min-height: 64px; border-radius: 6px; background: var(--h-panel); color: var(--h-ivory); text-decoration: none; transition: filter .2s ease; }
#home .home-count:hover { filter: brightness(1.15); }
#home .home-count svg { width: 34px; height: 30px; fill: none; stroke: var(--h-gold); stroke-width: 1.5; }
#home .home-count-text { display: flex; flex-direction: column; align-items: center; line-height: 1.05; font-family: "Libre Baskerville", Georgia, serif; }
#home .home-count-text b { font-size: 24px; }
#home .home-count-text span { font-size: 14px; }
#home .home-counts-note { margin: 9px 0 0; text-align: center; font: italic 400 12.5px "Libre Baskerville", Georgia, serif; color: #3A443D; }
#home .home-directory { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }
#home .home-dir { display: flex; align-items: stretch; min-height: 60px; border-radius: 7px; border: 1px solid #BDB29A; background: #FAF6EC; color: var(--h-ink); text-decoration: none; overflow: hidden; transition: border-color .2s ease, box-shadow .2s ease; }
#home .home-dir:hover { border-color: var(--h-gold); box-shadow: 0 6px 16px rgba(21,37,29,.12); }
#home .home-dir-icon { flex: 0 0 54px; display: grid; place-items: center; background: var(--h-panel); }
#home .home-dir-icon svg { width: 26px; height: 26px; fill: none; stroke: var(--h-gold); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
#home .home-dir-text { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 8px 12px; }
#home .home-dir-title { font: 700 15.5px/1.25 "Libre Baskerville", Georgia, serif; }
#home .home-dir-desc { font: 400 13.5px/1.3 var(--sans); color: #3A443D; }
#home .home-dir-chev { align-self: center; width: 12px; height: 18px; margin: 0 12px; fill: none; stroke: var(--h-ink); stroke-width: 1.8; }
#home a:focus-visible { outline: 2px solid var(--h-gold); outline-offset: 3px; }

/* Larger screens: same design, a little more generous */
@media (min-width: 761px) {
  #home .home-hero { padding: 28px 24px 34px; }
  #home .home-portrait { width: 262px; margin-top: 44px; }
  #home .home-candle { transform: scale(1.25); transform-origin: 50% 100%; }
  #home .home-kicker, #home .home-section-title { font-size: 13px; }
  #home .home-tagline { font-size: 12.5px; }
  #home .home-legacy-inner { padding: 30px 24px 40px; }
  #home .home-dir-title { font-size: 17px; }
  #home .home-dir-desc { font-size: 14.5px; }
}

/* ---------- Footer closing words with laurels ------------------------- */
.footer-closing-wrap { text-align: center; }
.fc-divider { margin: 0 0 8px; }
.fc-divider span { width: 36px; }
.footer-closing-row { display: flex; align-items: center; justify-content: center; gap: 8px; }
.fc-laurel { width: 30px; height: 48px; flex: 0 0 auto; }
.fc-flip { transform: scaleX(-1); }
.site-footer .footer-closing { margin: 0; font: italic 600 24px/1.15 var(--h-name); }
.site-footer .footer-closing span { display: block; color: var(--h-ivory); }
.site-footer .footer-closing em { display: block; font-style: italic; color: var(--h-gold-hi); }
@media (min-width: 761px) { .site-footer .footer-closing { font-size: 30px; } .fc-laurel { width: 36px; height: 58px; } }

/* ---------- Floating buttons: always in view on every public page ------ */
.memorial-dock {
  position: fixed; z-index: 30; left: 10px; right: 10px; bottom: max(12px, env(safe-area-inset-bottom));
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 8px;
  border-radius: 16px; border: 1px solid rgba(201,161,90,.6); background: rgba(11,26,19,.95);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 14px 40px rgba(0,0,0,.55);
}
@media (min-width: 761px) { .memorial-dock { left: 50%; right: auto; width: min(560px, calc(100% - 28px)); transform: translateX(-50%); } }
.dock-btn { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 62px; padding: 0 10px; border-radius: 11px; text-decoration: none; transition: filter .2s ease; }
.dock-btn svg { position: relative; flex: 0 0 auto; width: 22px; height: 20px; fill: none; stroke-width: 1.8; }
.dock-btn-text { position: relative; display: flex; flex-direction: column; line-height: 1.15; text-align: left; }
.dock-btn-label { font: 700 16px var(--sans); }
.dock-btn-count { font: 600 12.5px var(--sans); }
.dock-btn-primary { background: linear-gradient(115deg, #B38F55, #E3C88D 55%, #C9A764); color: #12170F; }
.dock-btn-primary svg { stroke: #12170F; }
.dock-btn-primary .dock-btn-count { color: #3A3220; }
.dock-btn-secondary { border: 1.5px solid var(--h-gold); background: var(--h-panel); color: var(--h-ivory); }
.dock-btn-secondary svg { stroke: var(--h-gold); }
.dock-btn-secondary .dock-btn-count { color: #D9BE85; }
.dock-btn:hover { filter: brightness(1.07); }
.dock-btn:focus-visible { outline: 2px solid #F0D894; outline-offset: 3px; }
.dock-shimmer { position: absolute; inset: 0; background: linear-gradient(105deg, rgba(255,255,255,0) 35%, rgba(255,255,255,.55) 50%, rgba(255,255,255,0) 65%); background-size: 220% 100%; animation: hShimmer 6s ease-in-out infinite; pointer-events: none; }
@keyframes hShimmer { 0%,72% { background-position: -160% 0; } 100% { background-position: 260% 0; } }
@media (max-width: 360px) { .dock-btn { gap: 7px; padding: 0 6px; } .dock-btn-label { font-size: 15px; } }

/* Step aside where they would get in the way */
body.page-office .memorial-dock, body.modal-open .memorial-dock, body.lightbox-open .memorial-dock,
body.reader-open .memorial-dock, body:has(.main-nav.open) .memorial-dock { display: none; }
/* Keep the end of every page clear of the floating buttons */
body:not(.page-office) .site-footer { padding-bottom: calc(var(--dock-space) + 14px); }

@media (prefers-reduced-motion: reduce) {
  #home .hc-flame, #home .home-glow, .dock-shimmer { animation: none !important; }
}

/* The NMS Ex-Boys tribute's original block is kept only as the word-for-word
   source of its tribute card; it is never displayed on its own. */
article.institutional-tribute[hidden] { display: none !important; }
