/* Social moments frame the hero while the copy stays centered. */
.social-hero{display:grid;grid-template-columns:minmax(205px,1fr) minmax(490px,690px) minmax(205px,1fr);gap:10px;min-height:640px;max-width:none;padding:54px max(20px,calc((100vw - 1500px)/2));overflow:hidden}
.social-hero .hero-copy{z-index:2;align-self:center;text-align:center}
.social-hero h1{font-size:clamp(42px,4.3vw,68px);line-height:1.04;letter-spacing:-.035em;margin:0 auto 24px;max-width:720px}
.social-hero .hero-copy>p{font-size:19px;line-height:1.42;max-width:660px;margin:0 auto 27px;color:#434147}
.social-hero .hero-ctas{justify-content:center}
.social-hero .hero-ctas .primary{background:#242328;min-width:180px;box-shadow:0 9px 20px #1813191c}
.social-hero .hero-ctas .primary:hover{background:#101013}
.hero-side{position:relative;height:520px;align-self:center}
.social-moment{position:absolute;display:block;width:240px;height:185px;transition:transform .25s ease}
.social-moment:hover{transform:translateY(-5px) rotate(0)}
.social-moment:before{content:'';position:absolute;inset:13px 0;border-radius:40% 35% 43% 35%;background:#d6b9f4;transform:rotate(-8deg)}
.social-moment .moment-photo-pair{position:absolute;inset:0 10px 10px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;border-radius:24px 32px 29px 24px;transform:rotate(-3deg)}
.social-moment .moment-photo{width:52%;height:100%;object-fit:cover}
.social-moment .moment-photo:nth-child(2){margin-left:-2px}
.moment-label{position:absolute;z-index:2;left:5px;bottom:-10px;padding:9px 16px;border-radius:9px;font-size:13px;font-weight:900;letter-spacing:.045em;text-transform:uppercase;transform:rotate(-8deg);box-shadow:0 6px 13px #00000015}
.label-lilac{background:#bca2ef;color:#252033}.label-pink{background:#ff7fa1;color:#33212b}.label-yellow{background:#ffcc6b;color:#30271a}
.hero-side-left .moment-near{left:-18px;top:25px;transform:rotate(-5deg)}
.hero-side-left .moment-community{left:16px;bottom:24px;transform:rotate(5deg)}
.hero-side-right .moment-club{right:-2px;top:16px;transform:rotate(6deg)}
.hero-side-right .moment-event{right:22px;bottom:22px;transform:rotate(-5deg)}
.moment-community:before,.moment-club:before{background:#ffa2b9}.moment-event:before{background:#ffd07d}
.hero-side-right .moment-label{left:auto;right:-5px;transform:rotate(7deg)}
.hero-side-left:after,.hero-side-right:after{content:'';position:absolute;width:70px;height:48px;border:2px solid #d9b9c2;border-top:0;border-right:0;border-radius:50%;opacity:.65}
.hero-side-left:after{right:15px;top:222px;transform:rotate(-35deg)}.hero-side-right:after{left:14px;bottom:214px;transform:rotate(145deg)}
@media(max-width:1180px){.social-hero{grid-template-columns:minmax(160px,1fr) minmax(430px,1.7fr) minmax(160px,1fr);padding-inline:14px}.social-moment{width:190px;height:155px}.social-hero h1{font-size:clamp(40px,4vw,56px)}.social-hero .hero-copy>p{font-size:17px}.hero-side-left .moment-near{left:-25px}.hero-side-left .moment-community{left:-5px}.hero-side-right .moment-club{right:-22px}.hero-side-right .moment-event{right:-5px}}
@media(max-width:850px){.social-hero{grid-template-columns:1fr 1fr;gap:20px;padding:64px 24px 50px;min-height:0}.social-hero .hero-copy{grid-column:1/-1;grid-row:1}.social-hero h1{font-size:clamp(40px,6.5vw,56px);max-width:650px}.social-hero .hero-copy>p{max-width:600px}.hero-side{height:235px;width:100%;max-width:310px;margin:auto}.social-moment{width:48%;height:125px}.hero-side-left .moment-near,.hero-side-right .moment-club{left:0;right:auto;top:0}.hero-side-left .moment-community,.hero-side-right .moment-event{left:auto;right:0;top:87px;bottom:auto}.moment-label{font-size:9px;padding:6px 9px;white-space:nowrap}.hero-side:after{display:none}}
@media(max-width:550px){.social-hero{padding:58px 14px 38px;gap:13px}.social-hero h1{font-size:clamp(35px,9vw,46px);line-height:1.06}.social-hero .hero-copy>p{font-size:16px}.hero-side{height:178px}.social-moment{height:95px;width:54%}.hero-side-left .moment-community,.hero-side-right .moment-event{top:70px}.moment-label{bottom:-3px;font-size:8px;padding:5px 7px}.hero-side-right .moment-label{right:-8px}}
@media(max-width:550px){.hero-side-right .moment-club{z-index:2}.hero-side-right .moment-club .moment-label{left:0;right:auto}.hero-side-right .moment-event .moment-label{right:0}}
