/* Real group screenshots, inside a responsive phone frame. */
.hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.85fr);gap:64px;align-items:center;padding-block:56px 64px}
.hero-copy{max-width:660px}
.hero h1{font-size:clamp(42px,4.7vw,64px);letter-spacing:-2.6px}
.hero-lead{max-width:520px;font-size:17px}
.group-preview{min-width:0;margin:0;position:relative;display:flex;flex-direction:column;align-items:center}
.phone-stage{position:relative;width:100%;display:flex;justify-content:center;isolation:isolate}
.phone-stage:before{content:"";position:absolute;inset:12% -4% 5%;background:radial-gradient(ellipse,#ff98001c,transparent 68%);z-index:-1;pointer-events:none}
.phone-frame{width:min(100%,284px);padding:7px;border:1px solid #665647;border-radius:39px;background:linear-gradient(145deg,#3c352f,#080706 40%,#29221c);box-shadow:0 24px 55px #0007,0 0 0 1px #000;position:relative}
.phone-frame:before{content:"";position:absolute;top:100px;left:-3px;height:45px;width:3px;border-radius:2px;background:#51473d}
.phone-screen{position:relative;aspect-ratio:591/1280;border-radius:31px;overflow:hidden;background:#111;touch-action:pan-y}
.phone-screen{cursor:grab;user-select:none;-webkit-user-select:none;touch-action:pan-y pinch-zoom}
.phone-screen.is-dragging{cursor:grabbing}
.phone-track{display:flex;width:100%;height:100%;transition:transform .4s ease;will-change:transform}
.phone-track.is-instant{transition:none}
.phone-slide{flex:0 0 100%;min-width:0;height:100%;margin:0}
.phone-slide img{display:block;width:100%;height:100%;object-fit:contain}
.preview-caption{font-size:11px;color:#a89b8e;text-align:center;line-height:1.6;max-width:290px;margin-top:18px}
@media(min-width:1100px){.phone-frame{transform:rotate(2deg)}}
@media(max-width:900px){.hero{gap:32px;grid-template-columns:minmax(0,1fr) minmax(240px,.8fr)}.hero h1{font-size:46px}.hero-lead{font-size:16px}.phone-frame{width:250px}}
@media(max-width:700px){.hero{grid-template-columns:1fr;gap:36px;padding-block:40px 34px}.hero h1{font-size:clamp(40px,8vw,54px);max-width:590px}.hero-copy{max-width:590px}.group-preview{width:100%}.phone-frame{width:min(78vw,278px)}.phone-stage:before{inset:10% 0 0}.preview-caption{margin-bottom:0}}
@media(prefers-reduced-motion:reduce){.phone-track{transition:none}}