@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;500;600;700&family=Inter:ital,wght@0,400;0,500;0,600;1,400&family=Space+Mono:wght@400;700&display=swap');

:root {
  --j5-cream:       #f3e8cf;
  --j5-cream-soft:  #f8efd9;
  --j5-teal:        #073327;
  --j5-sage:        #5e7a6c;
  --j5-gold:        #a07d23;
  --j5-gold-bright: #c9a04a;
  --j5-coral:       #b04a32;
  --j5-font-display: 'Oswald', system-ui, sans-serif;
  --j5-font-body:    'Inter', system-ui, sans-serif;
  --j5-font-mono:    'Space Mono', 'Courier New', monospace;
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--j5-teal);
  font-family: var(--j5-font-body);
  color: var(--j5-cream);
}
[hidden] { display: none !important; }
button { white-space: nowrap; }
img { max-width: 100%; }

a { color: var(--j5-gold-bright); }
a:hover { color: var(--j5-cream); }
a[style]:hover { opacity: 0.88; }

@keyframes j5fade { from { transform: translateY(12px); } to { transform: none; } }
@keyframes j5accordion { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
.j5-giving-panel:not([hidden]) { animation: j5accordion 0.28s ease; }

/* member area */
.j5-page { max-width: 948px; margin: 0 auto; padding: 104px 44px 90px; }
.j5-doc h1 { font-family: var(--j5-font-display); font-weight: 600; font-size: 28px; line-height: 1.04; letter-spacing: 0.02em; text-transform: uppercase; color: var(--j5-cream); margin: 0 0 18px; }
.j5-navlink { font-family: var(--j5-font-display); font-weight: 500; font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; text-decoration: none; padding: 8px 0; }
@media (max-width: 720px) {
  .j5-page { padding: 96px 22px 72px; }
  .j5-bar { padding: 0 20px !important; gap: 14px; }
  .j5-bar nav { gap: 18px !important; }
}
