/* Decade Shooter: a standalone, responsive visual alternative. */
:root{--green:#153f32;--ink:#24382f;--muted:#4b5c52;--paper:#f7f8f3;--line:#d8dfd5;--accent:#d9eb9b;--gutter:clamp(20px,4vw,72px)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--paper);color:var(--ink);font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;font-size:20px;line-height:1.65}
img{max-width:100%;display:block}
a{color:inherit;text-underline-offset:5px}
a:focus-visible{outline:3px solid #3474bd;outline-offset:6px}
h1,h2,h3,p{margin:0}
h1,h2,h3{line-height:1.12;letter-spacing:-.04em;font-weight:600}
h2{font-size:clamp(32px,3.2vw,52px)}
h3{font-size:25px;letter-spacing:-.02em}
.skip-link{position:absolute;top:8px;left:16px;transform:translateY(-150%);z-index:5;background:white;padding:12px}
.skip-link:focus{transform:none}
.site-header{max-width:1600px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px var(--gutter);background:white}
body:has(.site-header){border-top:5px solid var(--green)}
.brand{flex:0 1 310px;min-width:180px}
.brand img{width:100%;height:auto}
nav{display:flex;gap:28px;align-items:center;font-size:17px;font-weight:600}
nav a{display:inline-flex;align-items:center;min-height:48px;text-decoration:none;white-space:nowrap}
nav a:hover{text-decoration:underline}
.button{display:inline-flex;justify-content:center;align-items:center;gap:24px;padding:15px 22px;min-height:56px;background:var(--green);color:white;border:1px solid var(--green);border-radius:6px;text-decoration:none;font-size:18px;font-weight:600;line-height:1.4}
.button:hover{background:#265b47}
.header-join{white-space:nowrap}
.hero{position:relative;max-width:1456px;margin:8px auto 0;background:var(--green);isolation:isolate}
.hero-image{width:100%;height:auto;aspect-ratio:1023/553;object-fit:contain}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(4,26,15,.82),transparent 67%);z-index:0;pointer-events:none}
.hero-copy{position:absolute;top:9%;left:5%;right:5%;z-index:1;color:white}
.eyebrow{font-size:14px;line-height:1.5;letter-spacing:.15em;font-weight:700;margin-bottom:20px}
.hero h1{font-size:clamp(40px,5.5vw,82px);max-width:850px;letter-spacing:-.055em;font-weight:600;line-height:1.02}
.hero .eyebrow{color:var(--accent)}
.mission{max-width:1456px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:40px;padding:32px 5%;background:var(--green);color:white}
.mission p{max-width:800px;font-size:clamp(20px,1.65vw,26px);line-height:1.5}
.text-link{display:inline-flex;gap:20px;align-items:center;min-height:48px;font-weight:600;white-space:nowrap}
.mission .text-link{color:var(--accent);font-size:18px}
.stories{max-width:1456px;padding:0 var(--gutter);margin:auto}
.story{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(32px,5vw,80px);padding:88px 0;border-bottom:1px solid var(--line)}
.story .eyebrow{color:#426847}
.paragraph{min-width:0}
.paragraph h2{margin-bottom:28px}
.paragraph p+p{margin-top:20px}
.paragraph h3{margin:28px 0 12px}
.pic-frame{min-width:0;overflow:hidden;border-radius:10px}
.pic-frame img{width:100%;aspect-ratio:4/4.3;object-fit:cover}
.story-about .pic-frame img{aspect-ratio:4/3.7}
.story-improvement .pic-frame img{aspect-ratio:4/5;object-position:85% center}
.story-snapshot .pic-frame{align-self:start}
.story-snapshot .pic-frame img{aspect-ratio:4/5}
.story-goals{background:#eaf0e4;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);border:none}
.story-goals .pic-frame img{aspect-ratio:1}
.smart-list{list-style:none;padding:0;margin:24px 0 0;counter-reset:goal}
.smart-list li{counter-increment:goal;padding:12px 0;border-bottom:1px solid #c6d3c0;display:flex;align-items:center;gap:20px;font-size:22px;font-weight:600}
.smart-list li::before{content:"0" counter(goal);font-size:15px;color:#44653c;font-weight:500}
.tools{max-width:1456px;margin:auto;padding:80px var(--gutter) 96px;text-align:center}
.tools .eyebrow{color:#426847}
.tools h2{max-width:800px;margin:0 auto 44px}
.icon-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.icon-item{background:white;border:1px solid var(--line);border-radius:10px;padding:28px 18px 32px;min-width:0}
.icon-item img{width:168px;aspect-ratio:1;object-fit:contain;margin:0 auto 24px}
.icon-item h3{font-size:22px;line-height:1.3;letter-spacing:-.02em}
.connect{background:var(--green);color:white;padding:72px max(var(--gutter),calc((100vw - 1312px)/2));display:flex;align-items:center;justify-content:space-between;gap:48px}
.connect .eyebrow{color:var(--accent)}
.connect h2{font-size:clamp(38px,4vw,64px);margin-bottom:24px}
.connect p:not(.eyebrow){max-width:600px;color:#e2eade}
.connect-links{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.button-light{color:var(--green);background:var(--accent);border-color:var(--accent)}
.button-light:hover{background:#edf7d1}
.connect-links .text-link{font-size:18px}
footer{display:flex;justify-content:space-between;align-items:center;padding:24px var(--gutter);gap:24px;font-size:16px;max-width:1456px;margin:auto}
footer a{min-height:48px;display:inline-flex;align-items:center}
@media(min-width:1600px){body{font-size:24px}.story{gap:72px}.site-header nav{font-size:20px}.icon-item h3{font-size:25px}.button{font-size:21px}}
@media(max-width:1100px){.site-header{flex-wrap:wrap;gap:12px 24px}.brand{flex-basis:280px}.site-header nav{order:3;width:100%;justify-content:center;border-top:1px solid var(--line);padding-top:8px}.story{gap:32px;padding-block:60px}.hero{margin-top:0}.hero h1{font-size:clamp(40px,6vw,66px)}.mission{gap:24px}.mission p{font-size:20px}.icon-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.connect{gap:32px}.connect-links{flex-shrink:0}}
@media(max-width:820px){body{font-size:20px}.hero-copy{top:8%}.hero .eyebrow{font-size:12px;margin-bottom:12px}.hero h1{font-size:clamp(34px,6vw,49px)}.mission{align-items:flex-start;flex-direction:column;gap:16px}.story{grid-template-columns:minmax(0,1fr);gap:32px;max-width:680px;margin-inline:auto}.story .paragraph{grid-row:1}.pic-frame img,.story-about .pic-frame img,.story-improvement .pic-frame img,.story-snapshot .pic-frame img{aspect-ratio:4/3}.story-goals{max-width:none;margin-inline:calc(-1 * var(--gutter))}.story-goals .pic-frame img{aspect-ratio:4/3}.story h2{font-size:38px}.story .eyebrow{margin-bottom:14px}.connect{flex-direction:column;align-items:flex-start;padding-block:56px}.tools{padding-block:60px}.connect-links{flex-shrink:1}}
@media(max-width:540px){.site-header{padding:18px 20px 8px;justify-content:center;gap:14px}.brand{flex-basis:270px}.header-join{width:100%;font-size:17px;min-height:48px;padding:12px}.site-header nav{gap:20px;font-size:15px;padding-top:4px}.hero{display:flex;flex-direction:column}.hero-copy{position:static;padding:32px 24px 28px;order:-1}.hero::after{display:none}.hero h1{font-size:clamp(34px,9vw,47px)}.hero .eyebrow{font-size:12px}.hero-image{aspect-ratio:1023/553}.mission{padding:26px 24px 30px;border-top:1px solid #42614b}.mission p{font-size:20px}.story{padding-block:48px}.story h2{font-size:34px}.paragraph h2{margin-bottom:22px}.icon-grid{grid-template-columns:1fr;gap:14px}.icon-item{display:flex;align-items:center;text-align:left;gap:20px;padding:20px}.icon-item img{width:90px;flex:0 0 90px;margin:0}.icon-item h3{font-size:21px}.tools h2{font-size:34px}.connect-links{width:100%}.connect-links .button{width:100%;font-size:18px;gap:16px}.connect-links .text-link{white-space:normal}footer{font-size:14px;gap:12px}.text-link{white-space:normal}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}