/* Land of Hope — extends about.css (same header, parchment, fonts). Gallery and lightbox only.
   Parchment override is scoped to #loh so About and other pages keep center/100% 100%. */
#loh .parch{
  background-color:#efd9bf;
  background-image:url('images/land-of-hope/parchment-tile.jpg');
  background-repeat:repeat;
  background-position:top center;
  background-size:520px auto;
}
#loh .a-name{font-size:clamp(32px,4.8cqw,56px);line-height:1.12;padding:0 .2em;margin:0}
#loh .a-sub{margin:2px 0 0}
#loh .loh-ref{margin:2px 0 0;text-align:center;font-style:italic;font-weight:500;font-size:20px;color:#22140e}
#loh .m-back{margin-top:8px;margin-bottom:6px}
#loh .lang-switch{margin-bottom:10px;height:40px}
#loh .flourish{margin:4px auto 8px}
#loh .pull{margin:.55em 8px .7em;padding:8px 16px}
#loh .loh-card > article > p{margin-bottom:.75em}
#loh .loh-note{margin-bottom:.7em}


.about-card.loh-card{max-width:1040px;padding:22px 40px 48px}
button.loh-open{padding:0;border:0;background:transparent;cursor:pointer;display:block;margin:0 auto;
  -webkit-tap-highlight-color:transparent;font:inherit;color:inherit}
.loh-hero{display:block;width:min(420px,92%);height:auto;margin:10px auto 22px;border-radius:3px;
  box-shadow:0 6px 22px #3a1d1233,0 0 0 1px #9c7a4588;background:#e8d4a8}
.loh-note{font-size:17.5px;font-style:italic;text-align:center;color:#4a3220;margin:0 8% 1.4em}
.loh-support{display:flex;justify-content:center;margin:8px 0 6px}
.loh-support a{display:inline-block;padding:10px 28px;border-radius:999px;text-decoration:none;
  background:linear-gradient(#7a2232,#4a0f1b 70%,#360a13);color:#f7e6c4;
  box-shadow:inset 0 0 0 1.5px #d6ab62,inset 0 2px 4px #0006,0 2px 6px #5a2e1a44;
  font-size:18px;font-weight:500;letter-spacing:.04em}
.loh-support a:hover{color:#fff4da}
.loh-gallery{display:flex;flex-direction:column;gap:36px;margin:8px 0 10px}
.loh-item{margin:0}
.loh-item button{display:block;width:100%;padding:0;border:0;background:transparent;cursor:pointer;
  border-radius:3px;-webkit-tap-highlight-color:transparent}
.loh-item img{display:block;width:100%;height:auto;border-radius:3px;
  box-shadow:0 4px 16px #3a1d1230,0 0 0 1px #9c7a4566}
.loh-item button:hover img{box-shadow:0 6px 20px #3a1d1240,0 0 0 1px #c89b52}
.loh-item button:focus-visible{outline:2px solid #f0c66e;outline-offset:3px}
.loh-item figcaption{margin:12px 4px 0;text-align:center}
.loh-item h3{margin:0 0 6px;font-family:'Pinyon Script','Snell Roundhand','Apple Chancery',cursive;
  font-weight:400;font-size:clamp(26px,3.6cqw,34px);line-height:1.15;color:#4a1420}
.loh-item p{margin:0;font-size:17.5px;line-height:1.45;font-weight:500;color:#24150f}
.loh-hint{margin:8px 0 0;text-align:center;font-size:15px;font-style:italic;color:#6a4a32}


/* Interactive campus map */
.loh-map{position:relative;margin:4px auto 8px;width:100%}
.loh-map > img{display:block;width:100%;height:auto;border-radius:3px;
  box-shadow:0 4px 16px #3a1d1230,0 0 0 1px #9c7a4566}
.loh-hotspot{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);
  padding:0;border:0;margin:0;background:transparent;cursor:pointer;border-radius:6px;
  -webkit-tap-highlight-color:transparent}
.loh-hotspot:hover,.loh-hotspot:focus-visible{
  outline:2px solid #c89b52;outline-offset:2px;background:rgba(200,155,82,.16)}
.loh-tip{position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);
  background:#3a0c15ee;color:#f7e6c4;border:1px solid #d6ab62;border-radius:4px;
  padding:4px 10px;font-size:14px;line-height:1.25;white-space:nowrap;pointer-events:none;
  opacity:0;transition:opacity .15s;z-index:2;box-shadow:0 2px 8px #0006}
.loh-hotspot:hover .loh-tip,.loh-hotspot:focus-visible .loh-tip{opacity:1}
.loh-map-hint{margin:0 0 12px;text-align:center;font-size:15px;font-style:italic;color:#6a4a32}

/* lightbox */
.lightbox{border:0;padding:0;background:transparent;width:min(1240px,96vw);max-width:96vw;max-height:96vh}
.lightbox::backdrop{background:#120a0dcc}
.lightbox-inner{position:relative;background:#1a100c;border:1px solid #c89b52;border-radius:4px;
  padding:18px 18px 16px;box-shadow:0 12px 40px #000a;max-height:96vh;overflow:auto}
.lightbox img{display:block;width:auto;height:auto;max-width:100%;max-height:calc(96vh - 110px);margin:0 auto}
.lightbox p{margin:12px 8px 0;text-align:center;color:#f4e2bd;font-size:17px;line-height:1.4}
.lb-close{position:absolute;top:8px;right:10px;width:40px;height:40px;border:0;border-radius:50%;
  background:#4a0f1bcc;color:#f7e6c4;font-size:28px;line-height:1;cursor:pointer}
.lb-close:hover{background:#7a2232}

@media (max-width:1099.98px){
  .about-card.loh-card{padding:16px 16px 32px}
  .loh-item p{font-size:16.5px}
  .loh-note{font-size:16.5px;margin-left:2%;margin-right:2%}
}

/* Keep map labels inside the phone viewport, including keyboard focus. */
@media(max-width:520px){.loh-tip{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);max-width:calc(100vw - 32px);white-space:normal;text-align:center}}
