/* Navigation shared by the main rooms and About. */
.skip-link {
  position:absolute; left:12px; top:12px; z-index:30;
  transform:translateY(-160%);
  background:var(--bg); color:var(--tx);
  padding:8px 14px; border-radius:6px; border:1px solid var(--ui-3);
}
.skip-link:focus { transform:none; }
.topbar { height:auto; min-height:72px; flex-wrap:wrap; padding-top:12px; padding-bottom:12px; }
.nav a:focus-visible, .about a:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.about { max-width:980px; margin:auto; padding:64px 28px 80px; }
.about h1 { font:clamp(44px,7vw,76px)/1.05 'Instrument Serif',Georgia,serif; font-weight:400; margin:18px 0 24px; max-width:700px; }
.about .intro { font-size:19px; max-width:620px; color:var(--tx-2); }
.about h2 { font:32px 'Instrument Serif',Georgia,serif; margin:0 0 16px; }
.about h3 { font-size:17px; margin:0 0 8px; }
.about p { margin:0 0 18px; }
.about a { color:var(--cy); text-decoration:underline; text-underline-offset:4px; }
.about section { border-top:1px solid var(--ui-2); margin-top:42px; padding-top:32px; }
.about .rooms { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:32px; }
.about .room { border:1px solid var(--ui-2); background:var(--bg); padding:24px; border-radius:8px; }
.about .history { display:grid; grid-template-columns:148px 1fr; gap:18px 28px; }
.about .date { color:var(--tx-2); font-size:12px; text-transform:uppercase; letter-spacing:.12em; padding-top:4px; }
.about .history p { max-width:640px; }
.about .footnote { color:var(--tx-2); font-size:13px; }
@media(max-width:600px) {
  .topbar { padding:12px 16px; gap:12px; }
  .nav { gap:0; }
  .nav a { padding:8px 10px; }
  .top-end { width:100%; margin-left:0; }
  .about { padding:38px 20px 60px; }
  .about .rooms { grid-template-columns:1fr; }
  .about .history { grid-template-columns:1fr; gap:4px; }
}
