:root {
  --primary: #417d73;
  --accent: #e1dac2;
  --ink: #1f2a2a;
  --paper: #ffffff;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--paper); color: var(--ink); font: 16px/1.6 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Noto Sans', 'Liberation Sans', sans-serif; }
.sidebar {
  position: fixed; top: 0; left: 0; bottom: 0; width: 380px;
  background: linear-gradient(90deg, var(--primary) 0 340px, var(--accent) 340px 360px, transparent 360px);
  padding: 24px 16px; border-right: 1px solid #ddd;
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start;
}
.brand { width:340px; display:flex; justify-content:center; align-items:center; margin: 12px 0 8px; }
.brand img { max-width: 200px; height:auto; display:block; margin:12px auto 16px; }
.sidebar nav ul { list-style: none; margin: 8px 0 0 0; padding: 0 0 0 8px; max-height: calc(100vh - 180px); overflow-y: auto; overflow-x: hidden; }
.sidebar nav a { color: #f1f1f1; text-decoration: none; display: block; padding: 6px 8px; border-radius: 8px; background: rgba(255,255,255,.0); font-size:17px; font-weight:500; letter-spacing:0.5px; text-shadow: 1px 1px 2px rgba(0,0,0,0.6); transition: background-color 180ms ease, color 180ms ease, border-left 180ms ease, padding-left 180ms ease; }
.sidebar nav a:hover { background: rgba(255,255,255,.25); font-weight:600; color:#ffffff; }
.sidebar nav a.active { background: var(--accent); font-weight:700; border-left: 6px solid var(--ink); padding-left: 6px; color:#000; }
.content { margin-left: 400px; padding: 32px 24px 64px; max-width: 980px; }
.content h1, .content h2 { margin-top: 0; }
.content h1 { border-bottom: 3px solid var(--accent); padding-bottom: 6px; }
.footer { margin-top: 48px; font-size: 14px; opacity: .85; text-align: center; }
.footer-logo { max-width: 120px; display:block; margin:16px auto 0; opacity:0.6; }

.nav-group { color: #e1dac2; opacity: 1; font-size: 14px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; margin: 18px 0 8px 8px; border-bottom: 1px solid rgba(225,218,194,.35); padding-bottom: 4px; }

/* NAV WIDTH FIX */
.sidebar nav { margin-right: 0; padding-left: 0; }
.sidebar nav, .sidebar nav ul { width: 341px; }
.sidebar nav a, .sidebar nav a.active {
  max-width: 320px;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
  padding-right: 28px;
}

/* Indented submenu under each group */
.nav-sub { list-style: none; margin: 6px 0 12px 4px; padding-left: 12px; }
.nav-sub li a { padding-left: 16px; }

/* SCROLLBAR ACCENT */
.sidebar nav ul { scrollbar-color: var(--ink) var(--accent); scrollbar-width: thin; }
.sidebar nav ul::-webkit-scrollbar { width: 14px; }
.sidebar nav ul::-webkit-scrollbar-track { background: var(--accent); }
.sidebar nav ul::-webkit-scrollbar-thumb { background: rgba(31,42,42,0.65); border-radius: 8px; border: 2px solid var(--accent); }

/* Second-level indent under Offerings */
.nav-sub2 { list-style: none; margin: 4px 0 10px 0; padding-left: 22px; border-left: 1px solid rgba(225,218,194,.35); }
.nav-sub2 li a { padding-left: 18px; }

/* H-OVERFLOW FIX */
.sidebar nav ul ul { overflow-x: hidden; width: 100%; max-width: 100%; }
.nav-sub2 { max-width: 100%; }



/* Page photos */
.page-photo { margin: 8px 0 24px 0; }
.page-photo img { max-width: 100%; height: auto; display: block; border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,.15); }


/* Accessibility: skip link (visible on focus) */
.skip-link{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden;}
.skip-link:focus{position:static;width:auto;height:auto;margin:8px;display:inline-block;background:#e5ddc2;color:#1c2c2c;padding:6px 10px;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.2);}