/* Match the bright, compact landscape composition of the locked homepage. */
:root{--cream:#fafbf8;--paper:#fffefa;--green:#073d29;--dark:#003520;--ink:#0a392a;--muted:#435d51;--line:#e2e4dd;--script:"Segoe Script","Brush Script MT",cursive}
header{background:#fff;box-shadow:0 1px 0 #103e2d0c}
.welcome>span,footer em{font-family:var(--script);font-weight:400}
.brand-mark{background-color:#fff}
.button,.icon,.round-arrow{background:linear-gradient(135deg,#104b34,#003822)}
.button.secondary{background:transparent}
.home-view{background:#fff}
.home-view .hero{min-height:0;height:clamp(345px,25vw,440px);align-items:flex-start}
.home-view .hero>img{object-position:center top}
.home-view .hero:after{background:linear-gradient(90deg,rgba(0,24,12,.18),rgba(0,24,12,.06) 39%,transparent 60%)}
.home-view .hero-copy{padding:38px 4% 40px;text-shadow:0 2px 6px #001c13b3}
.home-view .hero .eyebrow{font-family:var(--script);font-size:clamp(26px,2.5vw,37px);line-height:1.35;margin-bottom:2px}
.home-view .hero h1{font-size:clamp(40px,4vw,65px);line-height:1.08;font-weight:600;letter-spacing:-.015em}
.home-view .hero .subline{font-size:clamp(17px,1.8vw,27px);letter-spacing:.18em;line-height:1.35;margin-top:0}
.home-view .hero .motto{font-size:clamp(21px,1.8vw,29px);margin-top:6px;padding-top:4px;border-top:1px solid #e0e9d9a0;width:max-content;max-width:100%}
.home-view .hero-aside{right:2.5%;bottom:48px;padding:27px 24px;background:#073d29db;border:0;border-radius:4px;font-size:22px;min-width:215px}
.home-view .hero-aside:after{content:'';display:block;width:75%;height:1px;background:#dce8d4a3;margin:18px auto 0}
.home-main{max-width:none;padding:0 2.1% 8px;background:#fff}
.home-cards{gap:8px;margin-top:-25px}
.home-card{padding:9px 10px 8px;background:linear-gradient(120deg,#fffefa,#f4f3ee);border-color:#e5e4df;box-shadow:0 2px 4px #0c2f201f;min-height:190px}
.home-card .icon{width:56px;height:56px;margin-bottom:8px;flex-shrink:0}
.home-card .icon svg{width:30px;height:30px}
.home-card h2{font-size:clamp(17px,1.28vw,22px);line-height:1.18}
.home-card p{font-size:14px;line-height:1.35;margin:8px 0 9px}
.home-card .round-arrow{width:28px;height:28px}
.home-bottom{grid-template-columns:1.45fr 1fr 1.45fr;gap:8px;margin-top:8px}
.home-bottom .photo-panel{min-height:258px}
.home-bottom .photo-panel img{filter:brightness(1.16) saturate(1.32);object-position:center 54%}
.home-bottom .photo-panel:last-child img{filter:brightness(1.4) saturate(1.35);object-position:center 58%}
.home-bottom .photo-panel:after{inset:62% 0 0;background:linear-gradient(transparent,#091711b5)}
.home-bottom .photo-panel>div{left:19px;right:18px;bottom:14px;text-shadow:0 1px 4px #0009}
.home-bottom .photo-panel h2{font-size:27px}
.home-bottom .photo-panel p{font-size:15px;margin-top:0}
.mission{background:radial-gradient(ellipse at 45% 0,#20543b,#073c29 70%);padding:15px 24px 17px}
.mission:before{content:'❧';font:38px/1 Georgia,serif;display:block;height:35px;margin-bottom:0;transform:rotate(-24deg);color:#fff}
.mission h2{font-size:27px}
.mission p{font-size:15px;line-height:1.42;margin-top:6px}
.mission em{font-family:var(--script);font-size:17px;line-height:1.5;margin-top:12px;padding-top:10px;font-weight:400}
footer{padding:15px 2.4%;background:linear-gradient(115deg,#003822,#07422d 60%,#002f1e);min-height:78px;gap:25px}
footer strong{font-size:14px;letter-spacing:.025em}footer p{margin-top:2px}footer em{font-size:18px}
.preview-bar{background:#eef1e9;color:#284b3b;padding:5px 2.4%}
@media(min-width:1400px){
 header{display:grid;grid-template-columns:minmax(350px,32%) 1fr 230px;grid-template-rows:39px 58px;align-items:center;padding:0 2.4%;column-gap:20px}
 .masthead,.welcome{display:contents}
 .brand{grid-column:1;grid-row:1/3;gap:14px;align-self:center}
 .brand-mark{width:86px;height:86px}
 .brand strong{font-size:clamp(23px,2.1vw,34px);white-space:nowrap}
 .brand-sub{font-size:12px;letter-spacing:.28em}
 .brand small{font-size:10px;letter-spacing:.24em;margin-top:4px;padding-top:3px}
 .welcome>span{grid-column:2/4;grid-row:1;text-align:right;font-size:20px;align-self:end;line-height:1.5}
 .welcome>.button{grid-column:3;grid-row:2;padding:9px 13px;font-size:14px;width:100%;gap:13px}
 #navigation{grid-column:2;grid-row:2;border-top:0;padding:0;gap:19px;justify-content:space-between;align-self:center}
 #navigation a{font-size:12px;white-space:nowrap;padding:8px 0 7px}
 #navigation a[href="#/board"],#navigation a[href="#/announcements"]{display:none}
}
@media(min-width:801px) and (max-width:1399px){.masthead{padding:12px 3% 10px}.brand strong{font-size:27px}.brand-mark{height:64px;width:64px}#navigation{gap:24px}#navigation a{font-size:13px;padding:9px 0 8px}.home-card p{font-size:14px}.home-card h2{font-size:17px}.home-bottom{grid-template-columns:1.35fr 1fr 1.35fr}.mission{padding:18px}.mission p{font-size:14px}.mission em{font-size:15px}}
@media(max-width:800px){
 .home-view .hero{height:330px}
 .home-view .hero>img{object-position:46% center}
 .home-view .hero:after{background:linear-gradient(90deg,#00231165,transparent 85%)}
 .home-view .hero-copy{padding:36px 5%}
 .home-view .hero h1{font-size:38px;max-width:530px}
 .home-view .hero .subline{font-size:17px}
 .home-view .hero .motto{font-size:22px}
 .home-main{padding:0 4% 12px}
 .home-cards{gap:10px}
 .home-card{padding:14px 12px 12px}
 .home-card h2{font-size:19px}
 .home-bottom{grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
 .mission{grid-row:2;grid-column:1/-1;padding:22px 12%}
 footer{padding:22px 5%}
}
@media(max-width:520px){
 .home-view .hero{height:330px}
 .home-view .hero>img{object-position:40% center}
 .home-view .hero-copy{padding:35px 5%}
 .home-view .hero h1{font-size:36px;max-width:360px;line-height:1.1}
 .home-view .hero .eyebrow{font-size:26px}
 .home-view .hero .subline{font-size:14px;letter-spacing:.13em;margin-top:7px}
 .home-view .hero .motto{font-size:20px;margin-top:9px}
 .home-card h2{font-size:18px}
 .home-bottom{grid-template-columns:1fr}
 .mission{grid-row:auto;grid-column:auto;padding:24px}
 .home-bottom .photo-panel{min-height:250px}
}
/* Final alignment with the reference: reveal the entrance sign and tighten cards. */
.home-view .hero>img{object-position:center 45%}
.home-card{padding-top:8px;padding-bottom:8px}
.home-card .icon{width:54px;height:54px;margin-bottom:6px}
.home-card p{line-height:1.28;margin:5px 0}
.home-card .round-arrow{width:26px;height:26px}
.mission:before{content:none}
.mission-leaf{width:37px;height:37px;display:block;margin:0 auto 3px;color:white;flex-shrink:0}
@media(min-width:1400px){header{grid-template-columns:minmax(350px,28%) 1fr 220px;column-gap:16px}.brand strong{font-size:clamp(23px,1.9vw,31px)}#navigation{gap:12px}#navigation a[href="#/board"],#navigation a[href="#/announcements"]{display:block}}
@media(max-width:800px){.home-view .hero>img{object-position:46% center}.home-card{padding:14px 12px 12px}.home-card p{line-height:1.4;margin:8px 0 12px}.home-card .icon{margin-bottom:10px}}
@media(max-width:520px){.home-view .hero>img{object-position:40% center}}

/* Consistent bright imagery across page banners and community topics. */
.page-banner{min-height:250px}
.page-banner>img{object-position:center 42%}
.page-banner:after{background:linear-gradient(90deg,#032b1bd9 0%,#032b1b65 38%,transparent 72%)}
.page-banner .hero-copy{text-shadow:0 2px 5px #03261970}
.community-topic-list{display:grid;gap:28px}
.community-topic{grid-template-columns:minmax(0,.95fr) minmax(0,1.2fr);scroll-margin-top:20px}
.community-topic>img{height:100%;min-height:300px;max-height:none;object-fit:cover}
.community-topic>div{min-width:0;padding:30px 34px}
.community-topic .icon{margin-bottom:14px}
.community-topic .button{margin-top:20px}
.community-topic#pool>img{filter:brightness(1.12) saturate(1.25)}
.community-topic#yard>img{filter:brightness(1.3) saturate(1.25)}
.community-topic#resources>img{object-position:58% center}
.community-topic#faq>img{object-position:56% center}
.community-topic .faq{margin-top:12px}
@media(max-width:800px){.community-topic{grid-template-columns:1fr}.community-topic>img{height:240px;min-height:0;max-height:240px}.community-topic>div{padding:26px}.page-banner{min-height:230px}.page-banner>img{object-position:48% center}.page-banner:after{background:linear-gradient(90deg,#032b1bb0,#032b1b30)}}
@media(max-width:520px){.community-topic>img{height:210px;max-height:210px}.community-topic>div{padding:22px}.page-banner{min-height:220px}.community-topic .document-row{gap:6px}}