.coaching--app-preview .coaching-layout { grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr); gap:clamp(28px,4.5vw,64px); }
.app-home-preview,.app-tour-section { min-width:0; --app-text:#c2ccc7; }
.app-preview-top { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:20px; }
.app-preview-top .eyebrow { margin:0; font-size:.875rem; }
.app-swipe-hint { display:none; color:var(--app-text); font-size:.875rem; }
.app-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; padding:4px 4px 8px; min-width:0; }
.app-gallery:focus-visible { outline:2px solid var(--cyan); outline-offset:4px; }
.app-card { min-width:0; }
.app-card-label { display:flex; gap:9px; align-items:center; margin:0 0 14px; font-size:.875rem; font-weight:750; color:#fff; }
.app-card-label >span { color:var(--green); font-size:.75rem; font-weight:850; }
.app-screen-button { display:block; position:relative; border:0; padding:0; width:100%; background:none; color:#fff; cursor:zoom-in; text-align:left; }
.app-phone { display:block; width:100%; padding:5px; border:1px solid #5c6c62; border-radius:25px; background:#060907; box-shadow:0 18px 32px #0004; transition:border-color .18s ease,transform .18s ease; }
.app-screen-window { display:block; overflow:hidden; border-radius:19px; aspect-ratio:944/1856; background:#000; }
.app-screen-window img { display:block; width:100%; height:auto; max-width:none; }
.app-phone--program .app-screen-window img { margin-top:-24.9%; }
.app-phone--program .app-screen-window { aspect-ratio:944/1813; }
.app-phone--workout .app-screen-window img,.app-phone--progress .app-screen-window img { margin-top:-12%; }
.app-enlarge { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:10px 1px 0; color:var(--green); font-size:.875rem; font-weight:700; }
.app-enlarge >span { font-size:1.25rem; line-height:1; }
.app-screen-button:hover .app-phone { border-color:var(--green); transform:translateY(-3px); }
.app-screen-button:focus-visible,.app-tour-link:focus-visible,.app-promo-play:focus-visible { outline:3px solid var(--cyan); outline-offset:5px; }
.app-card-description { margin:12px 0 0; color:var(--app-text); font-size:1rem; line-height:1.6; }
.app-access-note { margin:24px 0 16px; padding-top:20px; border-top:1px solid var(--line); color:var(--app-text); font-size:1rem; line-height:1.6; }
.app-tour-link { display:inline-block; color:var(--green); text-decoration:underline; text-underline-offset:5px; font-size:1rem; font-weight:750; }
.app-tour-link:hover { color:#fff; }
.app-tour-section { margin-top:80px; padding:48px clamp(20px,3vw,42px); border:1px solid #34463b; border-top:3px solid var(--green); background:linear-gradient(135deg,#142219,#0b120e 70%); scroll-margin-top:105px; }
.app-tour-heading { display:grid; grid-template-columns:1.1fr 1fr; gap:40px; align-items:end; margin-bottom:34px; }
.app-tour-heading .eyebrow { color:var(--green); margin:0 0 18px; font-size:.875rem; }
.app-tour-heading h2 { font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif; font-size:clamp(2.1rem,3.7vw,3.7rem); font-weight:400; line-height:1.06; text-transform:uppercase; margin:0; }
.app-tour-heading >p { margin:0; color:var(--app-text); font-size:1rem; max-width:480px; }
.app-gallery--full { gap:34px; }
.app-gallery--full .app-screen-button { max-width:265px; margin:0 auto; }
.app-gallery--full .app-card-label { font-size:1rem; margin-bottom:18px; }
.app-gallery--full .app-card h3 { font-size:1.35rem; line-height:1.25; margin:25px 0 10px; }
.app-gallery--full .app-card-description { margin:0; }
.app-example-note { color:var(--app-text); font-size:.875rem; margin:26px 0 0; }
.app-support-note { border-left:3px solid var(--green); padding:22px 26px; background:#1c2d20; margin-top:32px; }
.app-support-note strong { font-size:1.25rem; color:#fff; }
.app-support-note p { margin:10px 0 0; font-size:1rem; color:#d0d9d4; max-width:85ch; }
.app-promo-layout { display:grid; grid-template-columns:.85fr 1.15fr; gap:32px; align-items:center; margin-top:48px; padding-top:36px; border-top:1px solid var(--line); }
.app-promo-layout .eyebrow { color:var(--green); font-size:.875rem; }
.app-promo-layout h3 { font-family:Impact,Haettenschweiler,'Arial Narrow Bold',sans-serif; font-size:clamp(1.8rem,3vw,2.7rem); font-weight:400; text-transform:uppercase; line-height:1.08; margin:0 0 16px; }
.app-promo-layout p:not(.eyebrow) { color:var(--app-text); font-size:1rem; }
.app-promo-frame { position:relative; aspect-ratio:16/9; overflow:hidden; border:1px solid #65765e; background:#000; }
.app-promo-frame iframe,.app-promo-play { display:block; position:absolute; inset:0; width:100%; height:100%; border:0; }
.app-promo-play img { width:100%; height:100%; object-fit:cover; opacity:.5; }
.app-promo-play::after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,#071007b3,transparent); }
.app-play-control { position:absolute; z-index:1; inset:0; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:14px; font-size:1rem; font-weight:800; color:#fff; }
.app-play-icon { width:56px; height:56px; display:grid; place-items:center; padding-left:3px; background:var(--green); color:#081006; border-radius:50%; font-size:1.35rem; box-shadow:0 5px 24px #0005; }
.app-promo-play:hover .app-play-icon { background:#d0ff79; }
.app-tour-actions { display:flex; align-items:center; flex-wrap:wrap; gap:24px; margin-top:36px; }
.app-tour-actions .button { white-space:normal; text-align:center; }
.app-preview-top--mobile { display:none; }
.app-image-dialog { box-sizing:border-box; width:min(calc(100vw - 24px),620px); max-width:none; height:auto; max-height:calc(100dvh - 24px); margin:auto; padding:0; border:1px solid #678451; border-radius:14px; background:#0c160f; color:#fff; overflow:hidden; box-shadow:0 24px 100px #000a; }
.app-image-dialog::backdrop { background:#020604e8; }
.app-image-dialog:not([open]) { display:none; }
.app-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 20px; border-bottom:1px solid var(--line); }
.app-dialog-header h2 { margin:0; font-size:1.1rem; line-height:1.25; font-family:inherit; font-weight:750; text-transform:none; }
.app-dialog-close { border:1px solid #657a64; border-radius:6px; background:#1b2c1e; color:#fff; padding:9px 14px; min-height:44px; cursor:pointer; font-size:1rem; }
.app-dialog-close:focus-visible { outline:3px solid var(--cyan); outline-offset:3px; }
.app-dialog-content { overflow:auto; max-height:calc(100dvh - 112px); padding:20px; overscroll-behavior:contain; }
.app-dialog-content .app-phone { width:min(100%,520px); margin:auto; padding:0; border:0; box-shadow:none; border-radius:12px; }
.app-dialog-content .app-screen-window { border-radius:12px; }
.app-image-open body { overflow:hidden; }
@media (max-width:1100px) { .coaching--app-preview .coaching-layout { grid-template-columns:1fr; gap:42px; }.app-home-preview { width:100%; }.app-home-preview .app-screen-button { max-width:245px; margin:auto; }.app-home-preview .app-gallery { gap:28px; }.app-gallery--full { gap:22px; }.app-tour-heading { gap:24px; } }
@media (max-width:760px) { .app-tour-section { margin-top:48px; padding:32px 20px; }.app-tour-heading { grid-template-columns:1fr; gap:22px; }.app-tour-heading h2 { font-size:clamp(2rem,7.5vw,3rem); }.app-promo-layout { grid-template-columns:1fr; gap:24px; }.app-support-note { padding:20px; }.app-tour-actions { align-items:stretch; flex-direction:column; gap:20px; } }
@media (max-width:600px) { .app-gallery,.app-home-preview .app-gallery { display:flex; gap:20px; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; padding:4px 4px 16px; scrollbar-width:thin; scrollbar-color:#789b42 #152019; }.app-card { flex:0 0 min(76vw,250px); width:min(76vw,250px); scroll-snap-align:start; }.app-swipe-hint { display:block; }.app-preview-top--mobile { display:flex; margin-top:-10px; }.app-gallery--full .app-card { width:min(68vw,265px); flex-basis:min(68vw,265px); }.app-card-description { font-size:1rem; }.app-preview-top { flex-wrap:wrap; }.app-gallery--full .app-card h3 { font-size:1.25rem; }.app-dialog-content { padding:10px; }.app-dialog-header { padding:12px 14px; }.app-tour-section { padding-right:16px; padding-left:16px; } }
@media (prefers-reduced-motion:reduce) { .app-phone { transition:none; }.app-screen-button:hover .app-phone { transform:none; }.app-gallery { scroll-behavior:auto; } }