:root {
  --brand-green: #2f6b4f;
  --brand-green-dark: #214d39;
  --brand-green-soft: #edf4ef;
  --brand-red: #c3262f;
  --brand-red-dark: #a81f27;
  --brand-red-soft: #fbefef;
  --brand-ink: #1e211f;
  --brand-muted: #66706a;
  --brand-border: #dddeda;
  --brand-surface: #f6f7f4;
}

body {
  background: #fff;
  color: var(--brand-ink);
}

a { color: var(--brand-green-dark); }
a:hover { color: var(--brand-red-dark); }

.foundation-header {
  position: relative;
  z-index: 20;
  background: rgba(255, 255, 255, .98);
  border-bottom: 1px solid var(--brand-border);
}

.foundation-header__inner,
.module-bar__inner,
.foundation-footer__inner,
.foundation-footer__bottom {
  width: min(1180px, calc(100% - 2rem));
  margin-inline: auto;
}

.foundation-header__inner {
  min-height: 92px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding-block: 1rem;
}

.foundation-brand {
  display: inline-flex;
  align-items: center;
  gap: .8rem;
  color: var(--brand-green-dark);
  text-decoration: none;
  line-height: 1;
}

.foundation-brand:hover { color: var(--brand-green-dark); }

.foundation-brand__mark {
  position: relative;
  flex: 0 0 46px;
  width: 46px;
  height: 52px;
}

.foundation-brand__flower {
  position: absolute;
  top: 1px;
  left: 14px;
  width: 30px;
  height: 31px;
  background: var(--brand-red);
  clip-path: polygon(50% 0, 62% 18%, 82% 8%, 79% 30%, 100% 35%, 81% 49%, 96% 66%, 72% 67%, 73% 91%, 53% 76%, 39% 100%, 31% 76%, 8% 85%, 18% 61%, 0 52%, 22% 40%, 7% 21%, 33% 24%);
  transform: rotate(-10deg);
}

.foundation-brand__stem {
  position: absolute;
  left: 7px;
  bottom: 3px;
  width: 28px;
  height: 30px;
  border-left: 4px solid var(--brand-green);
  border-bottom: 4px solid var(--brand-green);
  transform: skewX(-24deg);
}

.foundation-brand__copy { display: grid; gap: .2rem; }
.foundation-brand__copy strong {
  font-size: .98rem;
  line-height: .95;
  letter-spacing: .035em;
}
.foundation-brand__copy small {
  font-size: .7rem;
  color: var(--brand-green);
}

.foundation-header__actions {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.foundation-header__utility,
.foundation-header__primary {
  display: flex;
  align-items: center;
  gap: 1rem;
}

.foundation-header__utility a {
  color: var(--brand-ink);
  text-decoration: none;
  font-size: .92rem;
  border-bottom: 1px solid transparent;
}
.foundation-header__utility a:hover { border-color: currentColor; }

.header-help-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: .7rem 1.15rem;
  border-radius: 999px;
  background: var(--brand-red);
  color: #fff;
  font-weight: 750;
  text-decoration: none;
}
.header-help-button:hover { color: #fff; background: var(--brand-red-dark); }

.foundation-menu { position: relative; }
.foundation-menu summary {
  list-style: none;
  cursor: pointer;
  font-weight: 750;
  color: var(--brand-green-dark);
  padding: .55rem 0;
}
.foundation-menu summary::-webkit-details-marker { display: none; }
.foundation-menu summary::after { content: "  ☰"; color: var(--brand-red); }

.foundation-menu__panel {
  position: absolute;
  right: 0;
  top: calc(100% + .65rem);
  width: min(360px, calc(100vw - 2rem));
  padding: 1.2rem;
  border: 1px solid var(--brand-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 20px 55px rgba(31, 59, 44, .16);
  display: grid;
  gap: .5rem;
}
.foundation-menu__panel a {
  color: var(--brand-ink);
  text-decoration: none;
  padding: .6rem .7rem;
  border-radius: 8px;
}
.foundation-menu__panel a:hover { background: var(--brand-green-soft); color: var(--brand-green-dark); }
.foundation-menu__divider { height: 1px; background: var(--brand-border); margin-block: .35rem; }
.foundation-menu__label {
  margin: .25rem .7rem 0;
  color: var(--brand-muted);
  font-size: .72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.module-bar {
  background: var(--brand-green-dark);
  color: #fff;
}
.module-bar__inner {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.module-bar__title {
  color: #fff;
  text-decoration: none;
  font-weight: 800;
  letter-spacing: .01em;
}
.module-bar__title:hover { color: #fff; }
.module-bar nav { display: flex; align-items: center; gap: 1rem; }
.module-bar nav a {
  color: rgba(255, 255, 255, .92);
  text-decoration: none;
  font-size: .92rem;
}
.module-bar nav a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }

main { min-height: 56vh; }

.hero-branded {
  position: relative;
  overflow: hidden;
  margin-top: 2rem;
  padding: clamp(3rem, 7vw, 6rem) clamp(1.5rem, 4vw, 4rem);
  border-radius: 24px;
  background:
    radial-gradient(circle at 85% 18%, rgba(195, 38, 47, .14), transparent 24%),
    linear-gradient(135deg, #f4f7f4 0%, #fff 62%);
  border: 1px solid #e1e7e2;
}
.hero-branded::after {
  content: "";
  position: absolute;
  right: -90px;
  bottom: -150px;
  width: 360px;
  height: 360px;
  border: 34px solid rgba(47, 107, 79, .08);
  border-radius: 50%;
}
.hero-branded .hero-copy { position: relative; z-index: 1; max-width: 780px; }
.hero-branded h1 { max-width: 760px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.4rem; }
.hero-note {
  margin-top: 1.2rem;
  color: var(--brand-muted);
  font-size: .9rem;
}

.eyebrow { color: var(--brand-red-dark); }
.button { background: var(--brand-red); }
.button:hover { background: var(--brand-red-dark); }
.button-secondary { background: var(--brand-green-dark); }
.button-secondary:hover { background: var(--brand-green); }

.card,
.donation-panel,
.empty-state,
.auth-panel,
.form-panel,
.dashboard-card,
.author-callout {
  border-color: var(--brand-border);
  box-shadow: 0 8px 28px rgba(30, 60, 44, .045);
}
.card:hover { box-shadow: 0 16px 34px rgba(30, 60, 44, .10); }
.author-callout { background: var(--brand-green-soft); }
.dashboard-guide > div { border-left-color: var(--brand-red); background: #fff; }
.form-intro { background: var(--brand-green-soft); }

.progress-track { background: #e7ebe7; }
.progress-fill { background: var(--brand-green); }
.amount-option:has(input:checked) { border-color: var(--brand-red); background: var(--brand-red-soft); }
.donation-panel { border-top: 4px solid var(--brand-red); }

.foundation-footer {
  margin-top: 5rem;
  background: var(--brand-green-dark);
  color: rgba(255, 255, 255, .86);
}
.foundation-footer__inner {
  display: grid;
  grid-template-columns: 1.35fr 1fr 1fr 1fr;
  gap: 2.5rem;
  padding-block: 3.2rem 2.3rem;
}
.foundation-footer .foundation-brand { color: #fff; }
.foundation-footer .foundation-brand__copy small { color: rgba(255,255,255,.72); }
.foundation-footer .foundation-brand__stem { border-color: #fff; opacity: .85; }
.foundation-footer__intro { max-width: 300px; margin-top: 1rem; font-size: .9rem; }
.foundation-footer h2 {
  margin: 0 0 .9rem;
  color: #fff;
  font-size: .9rem;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.foundation-footer nav { display: grid; gap: .55rem; }
.foundation-footer nav a,
.foundation-footer a { color: rgba(255,255,255,.88); text-decoration: none; }
.foundation-footer nav a:hover,
.foundation-footer a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.foundation-footer address { font-style: normal; display: grid; gap: .4rem; font-size: .92rem; }
.foundation-footer__bottom {
  padding-block: 1rem 1.4rem;
  border-top: 1px solid rgba(255,255,255,.16);
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: rgba(255,255,255,.68);
  font-size: .82rem;
}
.foundation-footer__bottom p { margin: 0; }

@media (max-width: 900px) {
  .foundation-header__utility { display: none; }
  .foundation-footer__inner { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 720px) {
  .foundation-header__inner { min-height: 76px; gap: 1rem; }
  .foundation-brand__mark { flex-basis: 40px; width: 40px; height: 46px; }
  .foundation-brand__copy strong { font-size: .87rem; }
  .foundation-brand__copy small { display: none; }
  .header-help-button { display: none; }
  .module-bar__inner { align-items: flex-start; padding-block: .8rem; flex-direction: column; }
  .module-bar nav { width: 100%; overflow-x: auto; padding-bottom: .15rem; }
  .hero-branded { margin-top: 1rem; border-radius: 16px; }
  .foundation-footer__inner { grid-template-columns: 1fr; gap: 1.8rem; }
  .foundation-footer__bottom { flex-direction: column; }
}

@media (max-width: 440px) {
  .foundation-header__inner { width: min(100% - 1rem, 1180px); }
  .foundation-header__primary { margin-left: auto; }
  .foundation-menu__panel { right: -.25rem; }
  .module-bar nav { gap: .8rem; }
  .hero-actions .button { width: 100%; text-align: center; }
}
