:root {
  --scarlet: #a92f2a;
  --scarlet-deep: #84201d;
  --navy: #1e3850;
  --ink: #2f2d2a;
  --cream: #fff9ef;
  --sand: #f4eadc;
  --warm: #e6c4b6;
  --line: #d8cab7;
  --muted: #625d56;
  --shell: 1180px;
  --gutter: clamp(1.25rem, 4vw, 4.5rem);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { background: var(--cream); color: var(--ink); font: 16px/1.62 Arial, Helvetica, sans-serif; margin: 0; }
img { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: Georgia, "Times New Roman", serif; font-weight: 400; letter-spacing: 0; }
h1 { font-size: clamp(3.1rem, 5.6vw, 5.85rem); line-height: 1.04; }
h2 { font-size: clamp(2.35rem, 4.3vw, 4.65rem); line-height: 1.08; }
h3 { font-size: clamp(1.4rem, 2.25vw, 2rem); line-height: 1.18; }
.shell { margin-inline: auto; max-width: var(--shell); width: calc(100% - (var(--gutter) * 2)); }
.section { padding-block: clamp(4.5rem, 8vw, 7.5rem); }
.skip-link { background: var(--cream); color: var(--navy); font-weight: 700; left: 1rem; padding: .75rem 1rem; position: fixed; top: -5rem; z-index: 100; }
.skip-link:focus { top: 1rem; }
.eyebrow { color: var(--scarlet); font-size: .78rem; font-weight: 700; letter-spacing: .065em; margin-bottom: .95rem; text-transform: uppercase; }
.eyebrow--light { color: #ffe7df; }
.lede { color: var(--muted); font: clamp(1.08rem, 1.8vw, 1.28rem)/1.58 Georgia, "Times New Roman", serif; max-width: 600px; }
.button { align-items: center; border: 1px solid transparent; cursor: pointer; display: inline-flex; font: 700 .9rem/1.1 Arial, Helvetica, sans-serif; gap: 1rem; justify-content: space-between; min-height: 50px; padding: .9rem 1.1rem; text-decoration: none; }
.button--scarlet { background: var(--scarlet); color: #fffaf4; }
.button--scarlet:hover { background: var(--scarlet-deep); }
.button--outline { background: transparent; border-color: var(--navy); color: var(--navy); }
.button--light { background: var(--cream); color: var(--navy); }
.button--light:hover { background: #fff; }
.button-row { align-items: center; display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }

.site-header { background: var(--cream); border-bottom: 1px solid var(--line); position: relative; z-index: 10; }
.election-banner { background: var(--scarlet); color: #fffaf4; font-size: .76rem; font-weight: 700; letter-spacing: .055em; }
.election-banner__inner { display: flex; justify-content: center; padding: .68rem 0; text-align: center; }
.header-main { align-items: center; display: flex; gap: 2rem; justify-content: space-between; min-height: 94px; }
.brand { display: block; flex: 0 0 auto; width: 205px; }
.brand img { height: auto; width: 100%; }
.site-nav { align-items: center; display: flex; gap: clamp(.8rem, 2.3vw, 2rem); }
.site-nav a { border-bottom: 2px solid transparent; color: var(--ink); font-size: .9rem; font-weight: 700; padding: .5rem 0; text-decoration: none; white-space: nowrap; }
.site-nav a:hover, .site-nav a[aria-current="page"] { border-color: var(--scarlet); color: var(--scarlet-deep); }
.site-nav .donate-link { background: var(--scarlet); border: 1px solid var(--scarlet); color: #fffaf4; padding: .65rem .9rem; }
.site-nav .donate-link:hover { background: var(--scarlet-deep); border-color: var(--scarlet-deep); color: #fffaf4; }

.home-hero { background: var(--cream); display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(380px, .92fr); }
.home-hero__copy { align-items: center; display: flex; padding: clamp(4.5rem, 7vw, 7.5rem) var(--gutter); }
.home-hero__copy-inner { margin-left: auto; max-width: 650px; width: 100%; }
.home-hero h1 { color: var(--navy); margin-bottom: 1.35rem; }
.home-hero__visual { align-self: center; border-left: 1px solid var(--line); padding: clamp(3rem, 5vw, 4.75rem) var(--gutter); }
.hero-portrait {
  aspect-ratio: 4 / 5;
  border-radius: 44% 44% 10% 10% / 31% 31% 8% 8%;
  margin-inline: auto;
  max-width: 330px;
  overflow: hidden;
}
.hero-portrait img {
  height: 100%;
  object-fit: cover;
  object-position: center top;
  width: 100%;
}
.hero-signup { background: #fffdf8; border: 1px solid var(--line); border-top: 4px solid var(--scarlet); margin: 1.35rem auto 0; max-width: 405px; padding: 1.35rem; }
.hero-signup h2 { color: var(--ink); font-size: 1.6rem; line-height: 1.17; margin-bottom: .4rem; }
.hero-signup > p:not(.form-note) { color: var(--muted); font-size: .93rem; line-height: 1.45; margin-bottom: .85rem; }
.hero-signup label, .form-panel label { color: var(--navy); display: block; font-size: .8rem; font-weight: 700; margin-bottom: .42rem; }
.signup-form__row { display: flex; gap: .65rem; }
.hero-signup input, .form-panel input, .form-panel textarea { background: #fffdf9; border: 1px solid #bcae9a; color: var(--ink); font: 1rem Arial, Helvetica, sans-serif; min-width: 0; padding: .88rem; width: 100%; }
.form-note { color: #6d5d53; font-size: .76rem; line-height: 1.45; margin: .9rem 0 0; }

.community-banner { background: #233f58 url("assets/community-lake.png") center/cover no-repeat; color: #fffaf3; min-height: 390px; position: relative; }
.community-banner::before { background: linear-gradient(90deg, rgb(18 42 61 / 89%), rgb(31 67 91 / 62%)); content: ""; inset: 0; position: absolute; }
.community-banner__inner { padding-block: clamp(4.75rem, 8vw, 7rem); position: relative; text-align: center; }
.community-banner h2 { line-height: 1.03; margin-bottom: 1.35rem; text-shadow: 0 2px 15px rgb(0 0 0 / 28%); }
.places { font-size: .82rem; font-weight: 700; letter-spacing: .06em; margin: 0; }
.places span { color: #f3c8b4; padding-inline: .42rem; }

.home-intro { background: var(--cream); border-bottom: 1px solid var(--line); }
.split-intro { align-items: start; display: grid; gap: clamp(2.5rem, 8vw, 8rem); grid-template-columns: .9fr 1.1fr; }
.intro-links { border-top: 2px solid var(--scarlet); }
.intro-links a { align-items: center; border-bottom: 1px solid var(--line); color: var(--navy); display: flex; font: 1.3rem/1.2 Georgia, "Times New Roman", serif; justify-content: space-between; padding: 1.05rem 0; text-decoration: none; }
.intro-links a span { color: var(--scarlet); font-family: Arial, Helvetica, sans-serif; }
.home-community { background: var(--sand); }
.community-intro { align-items: center; display: grid; gap: clamp(2.5rem, 7vw, 7rem); grid-template-columns: minmax(0, .9fr) minmax(280px, 1.1fr); }
.community-photo { border-radius: 140px 140px 8px 8px; height: 430px; overflow: hidden; }
.community-photo img { height: 100%; object-fit: cover; object-position: center; width: 100%; }
.community-chips { display: flex; flex-wrap: wrap; gap: .65rem; list-style: none; margin: 1.7rem 0 0; padding: 0; }
.community-chips li { border: 1px solid var(--line); color: var(--navy); font-size: .9rem; font-weight: 700; padding: .52rem .75rem; }

.page-hero { background: var(--sand); border-bottom: 1px solid var(--line); padding-block: clamp(4rem, 8vw, 7.5rem); }
.page-hero__grid { align-items: center; display: grid; gap: clamp(2rem, 7vw, 7rem); grid-template-columns: .95fr 1.05fr; }
.page-hero h1 { color: var(--navy); margin-bottom: 1rem; }
.page-hero__image { border-radius: 190px 190px 8px 8px; height: 450px; overflow: hidden; }
.page-hero__image img { height: 100%; object-fit: cover; object-position: center; width: 100%; }
.bio-layout { align-items: start; display: grid; gap: clamp(2.5rem, 7vw, 7rem); grid-template-columns: .8fr 1.2fr; }
.bio-facts { border-top: 2px solid var(--scarlet); margin: 0; }
.bio-facts div { border-bottom: 1px solid var(--line); padding: 1rem 0; }
.bio-facts dt { color: var(--scarlet); font-size: .78rem; font-weight: 700; margin-bottom: .15rem; }
.bio-facts dd { color: var(--navy); font: 1.12rem/1.3 Georgia, "Times New Roman", serif; margin: 0; }
.bio-copy { color: var(--muted); font-size: 1.08rem; }
.bio-copy p:first-of-type { color: var(--ink); font: 1.42rem/1.48 Georgia, "Times New Roman", serif; }
.family-band { background: var(--navy); color: #fffaf3; }
.family-band__grid { display: grid; grid-template-columns: 1fr 1fr; }
.family-band__photo { min-height: 510px; }
.family-band__photo img { height: 100%; object-fit: cover; width: 100%; }
.family-band__copy { align-self: center; padding: clamp(3rem, 7vw, 7rem); }
.family-band__copy h2 { line-height: 1.1; }
.family-band__copy p:not(.eyebrow) { color: #e1e8eb; }
.service-grid { display: grid; gap: 0; grid-template-columns: repeat(2, 1fr); margin-top: 2rem; }
.service-grid article { border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); padding: 1.6rem; }
.service-grid article:nth-child(odd) { border-left: 1px solid var(--line); }
.service-grid article:nth-child(even) { border-inline: 1px solid var(--line); }
.service-grid h3 { color: var(--navy); margin-bottom: .5rem; }
.service-grid p { color: var(--muted); margin-bottom: 0; }
.photo-row { display: grid; grid-template-columns: 1.18fr .82fr; }
.photo-row figure { margin: 0; min-height: 380px; overflow: hidden; }
.photo-row img { height: 100%; object-fit: cover; width: 100%; }

.priorities-hero { background: var(--navy); color: #fffaf3; }
.priorities-hero h1 { color: #fffaf3; }
.priorities-hero .lede { color: #e2e9ec; }
.priority-list { background: var(--cream); }
.priority-block { border-bottom: 1px solid var(--line); padding-block: clamp(3.8rem, 7vw, 6.5rem); }
.priority-block:nth-child(even) { background: #f8f0e5; }
.priority-block__grid { display: grid; gap: clamp(1.75rem, 5vw, 5rem); grid-template-columns: 100px 1fr; }
.priority-number { color: var(--scarlet); font: 2rem/1 Georgia, "Times New Roman", serif; padding-top: .35rem; }
.priority-block h2 { color: var(--navy); margin-bottom: 1rem; }
.priority-lede { color: var(--ink); font: 1.32rem/1.48 Georgia, "Times New Roman", serif; max-width: 800px; }
.copy-columns { color: var(--muted); columns: 2; column-gap: 3rem; max-width: 900px; }
.copy-columns p { break-inside: avoid; }

.involved-intro { background: var(--sand); }
.involved-intro__grid { align-items: center; display: grid; gap: clamp(2.5rem, 7vw, 7rem); grid-template-columns: .9fr 1.1fr; }
.involved-intro__photo { border-radius: 150px 150px 8px 8px; height: 430px; overflow: hidden; }
.involved-intro__photo img { height: 100%; object-fit: cover; object-position: center 38%; width: 100%; }
.signup-strip { background: var(--cream); border-block: 1px solid var(--line); }
.signup-strip__inner { align-items: center; display: grid; gap: clamp(2rem, 6vw, 5rem); grid-template-columns: .9fr 1.1fr; padding-block: clamp(3rem, 6vw, 5rem); }
.form-panel { background: #fffdf9; border: 1px solid var(--line); border-top: 4px solid var(--scarlet); padding: 1.25rem; }
.yard-section { background: var(--navy); color: #fffaf3; }
.yard-section__grid { align-items: center; display: grid; gap: clamp(2.5rem, 7vw, 7rem); grid-template-columns: .85fr 1.15fr; }
.yard-section h2 { line-height: 1.1; }
.yard-section p:not(.eyebrow):not(.form-note) { color: #dce5e8; }
.yard-scene { background: linear-gradient(90deg, rgb(20 38 30 / 4%), rgb(20 38 30 / 13%)), url("assets/yard-scene-sunrise-dew-v2.png") center/cover no-repeat; border: 7px solid #e7dbca; box-shadow: 0 18px 35px rgb(0 0 0 / 25%); min-height: 475px; overflow: hidden; position: relative; }
.yard-scene::before { background: linear-gradient(transparent 54%, rgb(15 57 30 / 14%) 54%); content: ""; inset: 0; pointer-events: none; position: absolute; }
.yard-sign { aspect-ratio: 24 / 18; background: repeating-linear-gradient(90deg, rgb(39 50 57 / 4%) 0 1px, transparent 1px 8px), #fffdf7; border: 3px solid #f6f0e5; box-shadow: 0 3px 0 #b9ab98, 0 18px 24px rgb(0 0 0 / 28%); left: 50%; padding: 1.15rem; position: absolute; top: 43%; transform: translate(-50%, -50%) rotate(-1.5deg); width: min(71%, 410px); z-index: 2; }
.yard-sign::before { border: 1px solid #cfc2b0; content: ""; inset: .48rem; pointer-events: none; position: absolute; }
.yard-sign::after { background: linear-gradient(125deg, rgb(255 255 255 / 42%), transparent 34%); content: ""; inset: 0; pointer-events: none; position: absolute; }
.yard-sign img { background: #fffdf7; height: 100%; object-fit: contain; padding: .15rem; position: relative; width: 100%; z-index: 1; }
.yard-stake { background: linear-gradient(90deg, transparent calc(15% - 2px), #687178 calc(15% - 2px) calc(15% + 3px), transparent calc(15% + 3px) calc(85% - 2px), #687178 calc(85% - 2px) calc(85% + 3px), transparent calc(85% + 3px)); height: 174px; left: 50%; position: absolute; top: calc(43% + min(27vw, 154px)); transform: translateX(-50%); width: min(57%, 322px); z-index: 1; }
.yard-stake::before, .yard-stake::after { background: #687178; box-shadow: 0 1px 1px rgb(0 0 0 / 22%); content: ""; height: 4px; left: 15%; position: absolute; right: 15%; }
.yard-stake::before { top: 35px; }
.yard-stake::after { top: 105px; }
.yard-caption { color: #cfd9dd; font-size: .78rem; margin-top: .85rem; }
.request-cta { margin-top: 1.4rem; }
.volunteer-section { background: var(--cream); }
.volunteer-grid { align-items: start; display: grid; gap: clamp(2.5rem, 7vw, 7rem); grid-template-columns: 1fr 1fr; }
.volunteer-grid p { color: var(--muted); }
.interest-options { border: 0; margin: 0 0 1.25rem; padding: 0; }
.interest-options legend { color: var(--navy); font: 1.28rem/1.2 Georgia, "Times New Roman", serif; margin-bottom: .75rem; }
.interest-options label, .consent { align-items: center; color: var(--ink); display: flex; font-size: .92rem; gap: .6rem; margin: .5rem 0; }
.interest-options input, .consent input { accent-color: var(--scarlet); height: 1rem; margin: 0; width: 1rem; }
.form-grid { display: grid; gap: .85rem; grid-template-columns: 1fr 1fr; }
.form-panel > label { margin-top: .85rem; }
.form-panel textarea { resize: vertical; }
.field-hint { color: var(--muted); font-size: .78rem; font-weight: 400; }
.form-panel > .button { margin-top: 1.15rem; }
.privacy-copy { max-width: 800px; }
.privacy-copy h2 { color: var(--navy); font-size: 2rem; margin-top: 2.5rem; }
.privacy-copy h2:first-child { margin-top: 0; }
.privacy-copy p { color: var(--muted); font-size: 1.06rem; }

.page-cta { background: var(--scarlet); color: #fffaf3; }
.page-cta__inner { align-items: center; display: flex; gap: 2rem; justify-content: space-between; padding-block: clamp(3rem, 6vw, 5rem); }
.page-cta h2 { margin-bottom: 0; }
.site-footer { background: #142d42; color: #d7e0e5; }
.footer-inner { align-items: center; display: flex; gap: 2rem; justify-content: space-between; padding-block: 2rem; }
.footer-inner img { width: 165px; }
.footer-inner p { font-size: .8rem; margin: 0; }
.footer-inner nav { display: flex; gap: 1rem; }
.footer-inner a { color: #fffaf3; font-size: .85rem; text-decoration: none; }

@media (max-width: 820px) {
  .header-main { align-items: flex-start; flex-direction: column; gap: .7rem; padding-block: 1rem; }
  .site-nav { max-width: 100%; overflow-x: auto; padding-bottom: .25rem; width: 100%; }
  .site-nav a { font-size: .85rem; }
  .home-hero, .page-hero__grid, .split-intro, .community-intro, .bio-layout, .involved-intro__grid, .signup-strip__inner, .yard-section__grid, .volunteer-grid { grid-template-columns: 1fr; }
  .home-hero__copy { padding-block: 4rem 3rem; }
  .home-hero__visual { border-left: 0; border-top: 1px solid var(--line); padding-block: 2.5rem 3.5rem; }
  .hero-portrait { max-width: 330px; }
  .page-hero__image { height: 440px; max-width: 580px; }
  .family-band__grid, .photo-row { grid-template-columns: 1fr; }
  .family-band__photo { min-height: 420px; }
  .priority-block__grid { grid-template-columns: 1fr; gap: 1rem; }
  .priority-number { padding-top: 0; }
  .yard-scene { max-width: 650px; }
  .footer-inner { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 560px) {
  .election-banner { font-size: clamp(.62rem, 2.7vw, .72rem); letter-spacing: .035em; }
  .election-banner__inner { align-items: center; justify-content: center; }
  .election-banner__inner span { white-space: nowrap; }
  .brand { width: 185px; }
  .site-nav { gap: .55rem; justify-content: space-between; overflow: visible; }
  .site-nav a { font-size: .72rem; }
  .site-nav .donate-link { padding: .48rem .42rem; }
  .home-hero h1, .page-hero h1 { font-size: 3.25rem; }
  .hero-portrait { max-width: 300px; }
  .signup-form__row { flex-direction: column; }
  .hero-signup .button, .form-panel .button { width: 100%; }
  .community-banner { background-position: 58% center; min-height: 0; }
  .community-banner::before { background: linear-gradient(90deg, rgb(18 42 61 / 78%), rgb(31 67 91 / 52%)); }
  .community-banner__inner { padding-block: 3.25rem; text-align: left; }
  .community-banner h2 { font-size: clamp(2.55rem, 11vw, 3.25rem); margin-bottom: 1rem; }
  .places { font-size: .7rem; line-height: 1.75; }
  .places span { padding-inline: .2rem; }
  .community-photo { height: 360px; }
  .page-hero__image, .involved-intro__photo { border-radius: 100px 100px 8px 8px; height: 380px; }
  .service-grid { grid-template-columns: 1fr; }
  .service-grid article, .service-grid article:nth-child(odd), .service-grid article:nth-child(even) { border-inline: 1px solid var(--line); }
  .copy-columns { columns: 1; }
  .yard-scene { min-height: 400px; }
  .yard-sign { padding: .7rem; top: 43%; width: min(82%, 390px); }
  .yard-stake { height: 155px; top: calc(43% + min(31vw, 140px)); }
  .form-grid { grid-template-columns: 1fr; }
  .page-cta__inner { align-items: flex-start; flex-direction: column; }
  .footer-inner nav { flex-wrap: wrap; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }