/* home.css · the need band, the collections pointer, and the proof row on the homepage */
.need{background:var(--bone);color:var(--black);padding:clamp(72px,9vw,120px) 0}
.need .wrap{display:flex;flex-direction:column;align-items:flex-start;gap:24px;max-width:1000px}
.need .eyebrow{color:#6B5A3E}
.need h2{font-size:clamp(32px,4.2vw,60px);line-height:1.04;letter-spacing:.08em;text-transform:uppercase;font-weight:300}
.need h2 .b{font-weight:600}
.need p{font-size:clamp(17px,1.4vw,20px);line-height:1.7;color:#3A3835;max-width:760px}
.btn--dark{border-color:var(--black);color:var(--black)}
.btn--dark:hover{background:var(--black);color:var(--white)}
.stats{flex-wrap:wrap;justify-content:center}
.stat{width:auto;min-width:150px;align-items:center;text-align:center}
.stat strong{font-variant-numeric:tabular-nums}
.eighteen{max-width:760px;padding-top:28px}
.pointer{background:var(--bone);color:#111;padding:clamp(72px,9vw,110px) 0;text-align:center}
.pointer .wrap{display:flex;flex-direction:column;align-items:center;gap:20px}
.pointer p{font-size:18px;line-height:1.7;color:#3A3835;max-width:640px}
@media (max-width:980px){.stats{gap:36px}.stats .div{display:none}.stat{min-width:40%}.stat strong{font-size:56px}}
@media (max-width:760px){.need .wrap{gap:18px}.need .btn{align-self:stretch;text-align:center}.stat strong{font-size:48px}}
/* founder photo: keep the face in frame (it sits about 37% across, 22% down) */
.welcome__photo{object-position:37% 22%}
@media (max-width:980px){.welcome__photo{height:auto;aspect-ratio:4/5;object-position:37% 20%}}