/* TRACC – site styles (Jacaranda Parkland) */
:root{
  --brand-green:#146C54;--brand-green-deep:#0F4A3B;--brand-gold:#C78A3A;
  --paper:#FBFBF8;--surface:#FFFFFF;--ink:#17241D;--stone:#545C56;--rule:#D9DDD6;
  --sky-top:#D9EFD6;--sky-bottom:#F6FAEE;--ridge-far:#A9C7A3;--ridge-near:#4E8B5B;--park:#9CCB6A;--field:#B6DB7F;
  --river:#36A39C;--tree:#2A6A3D;--bloom:#E6B530;--roof:#B4553A;--wall:#FAF1DF;--jac:#8F6CC4;
  --c1:#146C54;--c2:#2E7FB0;--c3:#7A55B5;--c4:#C78A3A;
  --tint-1:#F2EEF9;--tint-2:#EAF4EE;--tint-3:#E8F2F9;
  --band:#3F2C66;--band-ink:#F4F0FA;--band-soft:#CDBFE6;--error:#B3261E;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-size:1.0625rem;line-height:1.6;overflow-x:hidden}
img,svg{max-width:100%}
a{color:var(--c1)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--brand-gold);outline-offset:2px}
.wrap{max-width:1160px;margin:0 auto;padding:0 28px}
h1,h2,h3{font-family:'Source Serif 4',Georgia,'Times New Roman',serif;font-weight:600;line-height:1.15;color:var(--ink)}

/* Header + logo appear */
.site-header{background:var(--surface)}
.header-inner{display:flex;align-items:center;min-height:132px;padding-top:14px;padding-bottom:14px}
.brand{display:flex;align-items:center;gap:22px;text-decoration:none;color:var(--ink)}
.brand-emblem{width:104px;height:104px;flex-shrink:0}
.brand-text{display:flex;flex-direction:column}
.wordmark{font-family:'Archivo',sans-serif;font-stretch:125%;font-weight:700;font-size:3.2rem;letter-spacing:.16em;line-height:1}
.brand-sub{font-stretch:112%;font-size:.92rem;letter-spacing:.12em;color:var(--stone);margin-top:10px;line-height:1.2}
.emblem .ring path{fill:none;stroke:var(--brand-green);stroke-width:128}
.emblem .tee{fill:var(--brand-green)}
.emblem .roof{fill:var(--brand-gold)}
.brand .emblem .seg,.brand .emblem .tee,.brand .emblem .roof,.brand .wordmark,.brand .brand-sub{opacity:0;animation:appear 1s ease-out forwards}
.brand .emblem .seg:nth-child(1){animation-delay:.2s}
.brand .emblem .seg:nth-child(2){animation-delay:.5s}
.brand .emblem .seg:nth-child(3){animation-delay:.8s}
.brand .emblem .seg:nth-child(4){animation-delay:1.1s}
.brand .emblem .seg:nth-child(5){animation-delay:1.4s}
.brand .emblem .tee{animation-delay:1.9s}
.brand .emblem .roof{animation-delay:2.4s}
.brand .wordmark{animation-delay:2.9s}
.brand .brand-sub{animation-delay:3.3s}
@keyframes appear{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.brand .emblem .seg,.brand .emblem .tee,.brand .emblem .roof,.brand .wordmark,.brand .brand-sub{animation:none;opacity:1}}

/* Navigation bar: five equal, centred links */
.nav-bar{background:var(--surface);border-top:1px solid var(--rule);border-bottom:3px solid var(--brand-green);position:sticky;top:0;z-index:20}
.nav{list-style:none;display:grid;grid-template-columns:repeat(5,1fr)}
.nav li{display:flex}
.nav a{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;padding:16px 8px 13px;text-decoration:none;color:var(--ink);font-size:1rem;font-weight:500;border-bottom:3px solid transparent;margin-bottom:-3px}
.nav li+li a{border-left:1px solid var(--rule)}
.nav a:hover{color:var(--brand-green);background:var(--tint-2)}
.nav a[aria-current="page"]{color:var(--brand-green);font-weight:600;border-bottom-color:var(--brand-gold)}
.m-br{display:none}
.nav-toggle{display:none;width:100%;background:none;border:none;color:var(--ink);font:inherit;font-weight:600;padding:14px 0;cursor:pointer;text-align:center}

/* Hero + landscape */
.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--sky-top) 0%,var(--sky-bottom) 70%);padding-top:96px}
.hero-content{position:relative;z-index:2;max-width:700px}
.hero h1{font-size:clamp(2.3rem,5vw,3.6rem);letter-spacing:-.01em;margin-bottom:24px}
.hero .lead{font-size:1.22rem;max-width:60ch}
.hero .note{margin-top:16px;color:#3E4741;font-size:.98rem;max-width:60ch}
.page-hero{background:linear-gradient(180deg,var(--sky-top) 0%,var(--sky-bottom) 80%);padding-top:64px;overflow:hidden}
.page-hero h1{font-size:clamp(2rem,4.2vw,3rem);margin-bottom:14px}
.page-hero .lead{font-size:1.15rem;max-width:62ch;color:#2C3630}
.page-hero .landscape{height:150px;margin-top:28px}
.landscape{display:block;width:100%;height:300px;margin-top:12px}
.landscape .far{fill:var(--ridge-far)}.landscape .near{fill:var(--ridge-near)}.landscape .park{fill:var(--park)}
.landscape .river{fill:var(--river)}.landscape .tree{fill:var(--tree)}.landscape .bloom{fill:var(--bloom)}
.landscape .jac{fill:var(--jac)}.landscape .trunk{fill:#5B4632}.landscape .wall{fill:var(--wall)}
.landscape .rooftop{fill:var(--roof)}.landscape .field{fill:var(--field)}
.landscape .line{fill:none;stroke:#fff;stroke-width:2;opacity:.85}.landscape .window{fill:#5E6B73;opacity:.55}

/* Buttons */
.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.btn{display:inline-block;padding:14px 26px;font:inherit;font-weight:600;font-size:.98rem;text-decoration:none;border-radius:3px;border:1.5px solid var(--brand-green);cursor:pointer}
.btn-primary{background:var(--brand-green);color:#fff}
.btn-primary:hover{background:var(--brand-green-deep);border-color:var(--brand-green-deep)}
.btn-secondary{background:rgba(255,255,255,.75);color:var(--brand-green)}
.btn-secondary:hover{background:#fff}
.btn-muted{background:var(--surface);color:var(--stone);border-color:var(--rule);cursor:default}

/* Sections */
.section{padding:88px 0}
.tint-1{background:var(--tint-1)}.tint-2{background:var(--tint-2)}.tint-3{background:var(--tint-3)}
.split{display:grid;grid-template-columns:1fr 1.6fr;gap:64px;align-items:start}
.section h2{font-size:clamp(1.75rem,3vw,2.3rem)}
.h2-bar{display:block;width:56px;height:5px;margin-bottom:20px;background:var(--c3);border-radius:3px}
.bar-1{background:var(--c1)}.bar-2{background:var(--c2)}.bar-3{background:var(--c3)}.bar-4{background:var(--c4)}
.section-intro{color:var(--stone);margin-top:14px;max-width:42ch}
.prose p{max-width:66ch}.prose p+p{margin-top:18px}
.prose ul{margin:14px 0 0 1.2em;max-width:64ch}.prose li+li{margin-top:6px}
.a1{--accent:var(--c1)}.a2{--accent:var(--c2)}.a3{--accent:var(--c3)}.a4{--accent:var(--c4)}
.work-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.work-item{background:var(--surface);padding:26px 26px 30px;border-top:5px solid var(--accent);border-radius:2px 2px 6px 6px}
.work-item h3{font-size:1.22rem;margin-bottom:10px;color:var(--accent)}
.work-item p{color:var(--stone);font-size:1rem}
.icon{width:36px;height:36px;margin-bottom:14px;color:var(--accent)}
.members{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
.member{background:var(--surface);border:1px solid var(--rule);border-top:6px solid var(--accent);padding:26px 26px 30px;display:flex;flex-direction:column}
.member h3{font-size:1.2rem;margin-bottom:10px}
.member p{color:var(--stone);font-size:.98rem}
.member .role{display:inline-block;margin-top:16px;font-size:.86rem;font-weight:600;color:var(--accent)}
.member .btn{margin-top:22px;align-self:flex-start}
.fees{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px;margin-top:28px;padding:22px 28px;background:var(--surface);border:1px solid var(--rule);border-left:5px solid var(--brand-gold)}
.principles{background:var(--band);color:var(--band-ink);padding:88px 0}
.principles h2{color:var(--band-ink);font-size:clamp(1.75rem,3vw,2.3rem)}
.principles .h2-bar{background:var(--brand-gold)}
.principles .statement{font-family:'Source Serif 4',Georgia,serif;font-size:clamp(1.25rem,2.2vw,1.6rem);line-height:1.5;max-width:52ch}
.principles .aside{margin-top:22px;color:var(--band-soft);max-width:60ch;font-size:1rem}
.contact-list{list-style:none;display:grid;gap:14px}
.contact-list li{display:grid;grid-template-columns:1fr 1.2fr;gap:24px;padding:20px 24px;background:var(--surface);border-left:5px solid var(--accent);align-items:baseline}
.contact-list a{font-weight:600;text-decoration:none;overflow-wrap:anywhere;color:var(--accent)}
.contact-list a:hover{text-decoration:underline}
.contact-list span{color:var(--stone);font-size:.98rem}
.steps{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.steps li{counter-increment:s;background:var(--surface);padding:22px 22px 26px;border-top:4px solid var(--c3)}
.steps li::before{content:counter(s);display:inline-flex;width:32px;height:32px;border-radius:50%;background:var(--c3);color:#fff;font-weight:700;align-items:center;justify-content:center;margin-bottom:12px}
.steps li p{color:var(--stone);font-size:.98rem}
.steps li strong{display:block;color:var(--ink);margin-bottom:4px}
.values{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.values li{background:var(--surface);border:1px solid var(--rule);border-left:4px solid var(--accent);padding:10px 16px;font-size:.98rem}
.constitution-box{background:var(--surface);border:1px solid var(--rule);border-left:5px solid var(--c3);padding:28px 30px}
.constitution-box p{color:var(--stone);margin:8px 0 20px;max-width:60ch}

/* Leadership */
.exco{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px;margin-top:8px}
.person{background:var(--surface);border:1px solid var(--rule);border-top:5px solid var(--accent);padding:24px;display:flex;align-items:center;gap:16px}
.monogram{width:56px;height:56px;border-radius:50%;background:var(--accent);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;letter-spacing:.04em}
.person h3{font-size:1.15rem}
.person p{color:var(--accent);font-weight:600;font-size:.92rem;margin-top:4px}
.group-title{font-size:1.4rem;margin:0 0 20px}
.group-title+.exco{margin-bottom:56px}

/* Footer */
.site-footer{background:var(--brand-green-deep);color:#E9F1EC;padding:48px 0 36px;font-size:.92rem}
.footer-inner{display:flex;flex-wrap:wrap;justify-content:space-between;gap:28px}
.footer-brand .wordmark{font-size:1.1rem;display:block;color:#fff}
.footer-brand p{color:#B9CCC3;margin-top:8px;max-width:38ch}
.footer-nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:6px 22px}
.footer-nav a{color:#E9F1EC;text-decoration:none}
.footer-nav a:hover{color:var(--brand-gold)}
.legal{margin-top:32px;padding-top:20px;border-top:1px solid rgba(255,255,255,.18);color:#B9CCC3;font-size:.85rem}

/* Forms */
.form-wrap{max-width:860px;margin:0 auto;padding:56px 28px 88px}
.form-intro{background:var(--surface);border:1px solid var(--rule);border-left:5px solid var(--c3);padding:20px 24px;margin-bottom:28px;color:var(--stone)}
.form-intro strong{color:var(--ink)}
.part{background:var(--surface);border:1px solid var(--rule);border-top:5px solid var(--accent);padding:28px 30px 30px;margin-bottom:24px}
.part h2{font-size:1.4rem;margin-bottom:6px}
.part .part-note{color:var(--stone);font-size:.95rem;margin-bottom:18px}
.field{margin-bottom:18px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.row-3{display:grid;grid-template-columns:1fr 2fr 1.4fr;gap:18px}
label.lbl{display:block;font-size:.92rem;font-weight:600;margin-bottom:6px}
.req{color:var(--error)}
input[type=text],input[type=email],input[type=tel],input[type=number],select{width:100%;padding:11px 12px;border:1px solid #C5CBC4;border-radius:4px;font:inherit;font-size:1rem;background:#fff;color:var(--ink)}
input:focus,select:focus{border-color:var(--c1);outline:2px solid rgba(20,108,84,.18)}
input.invalid,select.invalid{border-color:var(--error)}
.hint{font-size:.84rem;color:var(--stone);margin-top:4px}
.err{display:none;font-size:.84rem;color:var(--error);margin-top:4px}
.check{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid #EEF0EC}
.check:first-of-type{border-top:none}
.check input{width:20px;height:20px;margin-top:3px;flex-shrink:0;accent-color:var(--c1)}
.check label{font-size:.98rem}
.tier{margin-top:10px;padding:12px 16px;background:var(--tint-2);border-left:4px solid var(--c1);font-weight:600;display:none}
.sig-box{border:1px solid #C5CBC4;border-radius:4px;background:#fff;height:160px;touch-action:none}
.sig-box canvas{display:block;width:100%;height:100%;cursor:crosshair}
.sig-actions{display:flex;justify-content:space-between;align-items:center;margin-top:6px;gap:12px;flex-wrap:wrap}
.sig-clear{background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:5px 12px;font:inherit;font-size:.85rem;cursor:pointer}
.stamp{font-size:.84rem;color:var(--stone)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-errors{display:none;background:#FCEDEC;border:1px solid #E6B3AF;border-left:5px solid var(--error);padding:16px 20px;margin-bottom:24px;color:#6B1A15}
.form-errors ul{margin:8px 0 0 1.2em}
.submit-row{margin-top:8px}
.submit-row .btn{width:100%;padding:16px;font-size:1.05rem}

/* Responsive */
@media (max-width:980px){
  .split{grid-template-columns:1fr;gap:28px}
  .steps{grid-template-columns:1fr 1fr}
  .wordmark{font-size:2.5rem}.brand-emblem{width:88px;height:88px}.brand-sub{font-size:.74rem}
}
@media (max-width:820px){
  .nav-toggle{display:block}
  .nav{display:none;grid-template-columns:1fr;padding-bottom:10px}
  .nav.open{display:grid}
  .nav li+li a{border-left:none}
  .nav a{border-top:1px solid var(--rule);margin-bottom:0;padding:14px 8px}
  .nav a[aria-current="page"]{border-bottom-color:transparent;background:var(--tint-2)}
}
@media (max-width:760px){
  .hero{padding-top:64px}.landscape{height:170px}.page-hero{padding-top:44px}.page-hero .landscape{height:110px}
  .section,.principles{padding:60px 0}
  .work-grid,.members,.steps,.row,.row-3{grid-template-columns:1fr}
  .row,.row-3{gap:0}
  .contact-list li{grid-template-columns:1fr;gap:4px}
  .brand-sub{font-size:.62rem;letter-spacing:.07em;margin-top:7px;line-height:1.4;}.m-br{display:inline}.header-inner{min-height:100px}.brand{gap:14px}.brand-emblem{width:72px;height:72px}.wordmark{font-size:2.2rem}
  .wrap{padding:0 20px}.form-wrap{padding:36px 16px 64px}.part{padding:22px 18px}
}

/* Six menu items on one line (Service log added) */
@media (min-width: 821px) {
  .nav-bar .nav { grid-template-columns: repeat(6, minmax(0, 1fr)); flex-wrap: nowrap; }
  .nav-bar .nav > li { flex: 1 1 0; min-width: 0; width: auto; max-width: none; }
  .nav-bar .nav a { padding-left: 10px; padding-right: 10px; }
}
/* Seven menu items on one line (City claims added) */
@media (min-width: 821px) {
  .nav-bar .nav { grid-template-columns: repeat(7, minmax(0, 1fr)); }
  .nav-bar .nav a { padding-left: 6px; padding-right: 6px; font-size: .96rem; }
}

/* Eight menu items on one line (Members added) */
@media (min-width: 821px) {
  .nav-bar .nav { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .nav-bar .nav a { padding-left: 4px; padding-right: 4px; font-size: .93rem; }
}

/* Nine menu items on one line (Elections added) */
@media (min-width: 821px) {
  .nav-bar .nav { grid-template-columns: repeat(9, minmax(0, 1fr)); }
  .nav-bar .nav a { padding-left: 2px; padding-right: 2px; font-size: .88rem; }
}
