:root {
  --page-bg: #f4f0e7;
  --paper: #fffdf8;
  --ink: #28322d;
  --muted: #68716c;
  --forest: #2f4a38;
  --forest-dark: #203328;
  --line: #d9d1c3;
  --shadow: 0 8px 24px rgba(32, 51, 40, .10);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--page-bg); color:var(--ink); font-family:Arial,Helvetica,sans-serif; line-height:1.55; }
a { color:inherit; }
.site-header { background:linear-gradient(135deg,var(--forest-dark),var(--forest)); color:#fff; }
.topbar { width:min(1180px,calc(100% - 2rem)); margin:0 auto; min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.brand { font-family:Georgia,"Times New Roman",serif; font-size:1.45rem; font-weight:700; text-decoration:none; }
.nav-links { display:flex; gap:.95rem; flex-wrap:wrap; }
.nav-links a { color:#fff; text-decoration:none; padding:.35rem .15rem; }
.nav-links a:hover,.nav-links a:focus-visible { text-decoration:underline; text-underline-offset:.25rem; }
.hero { width:min(1000px,calc(100% - 2rem)); margin:0 auto; padding:3rem 0 2.5rem; text-align:center; }
.kicker { margin:0 0 .35rem; text-transform:uppercase; letter-spacing:.13em; font-size:.78rem; opacity:.82; }
.hero h1 { margin:0; font-family:Georgia,"Times New Roman",serif; font-size:clamp(2.35rem,6vw,4.4rem); line-height:1.05; }
.hero p { max-width:760px; margin:.9rem auto 0; font-size:1.05rem; opacity:.92; }
.gallery-wrap { width:min(1220px,calc(100% - 2rem)); margin:0 auto; padding:2rem 0 3.5rem; }
.gallery-note { margin:0 0 1.25rem; color:var(--muted); text-align:center; }
.gallery { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:1rem; }
.gallery-card { display:block; overflow:hidden; background:var(--paper); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); color:var(--ink); text-decoration:none; transition:transform .16s ease,box-shadow .16s ease; }
.gallery-card:hover,.gallery-card:focus-visible { transform:translateY(-3px); box-shadow:0 12px 28px rgba(32,51,40,.16); outline:none; }
.gallery-card img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; background:#e8e3d9; }
.caption { padding:.7rem .8rem .8rem; color:var(--muted); font-size:.9rem; overflow-wrap:anywhere; }
.site-footer { padding:2rem 1rem 2.5rem; color:var(--muted); text-align:center; }
.lightbox { position:fixed; inset:0; z-index:999; display:none; align-items:center; justify-content:center; padding:4rem 4.5rem 3rem; background:rgba(8,13,10,.95); }
.lightbox.open { display:flex; }
.lightbox img { display:block; max-width:94vw; max-height:84vh; object-fit:contain; box-shadow:0 10px 35px rgba(0,0,0,.45); }
.lightbox-button { position:fixed; width:48px; height:48px; border:1px solid rgba(255,255,255,.28); border-radius:999px; background:rgba(255,255,255,.13); color:#fff; font-size:1.7rem; cursor:pointer; }
.close-button { top:14px; right:18px; }
.prev-button { left:16px; top:50%; transform:translateY(-50%); }
.next-button { right:16px; top:50%; transform:translateY(-50%); }
.lightbox-caption { position:fixed; left:50%; bottom:12px; transform:translateX(-50%); max-width:min(90vw,900px); padding:.45rem .75rem; border-radius:8px; background:rgba(0,0,0,.48); color:#fff; text-align:center; font-size:.92rem; }
@media (max-width:700px) {
  .topbar { padding:.65rem 0; }
  .hero { padding:2.2rem 0 2rem; }
  .gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.65rem; }
  .caption { padding:.5rem .55rem .6rem; font-size:.78rem; }
  .lightbox { padding:3.5rem .75rem 3rem; }
  .prev-button { left:8px; }
  .next-button { right:8px; }
}
