/* Design 1: aligned to the owner-supplied art direction; live HTML/CSS, not a flattened mockup. */
.design-one { --bg:#07131e; --bg2:#0a1a25; --surface:#102431; --text:#f3f8f6; --muted:#b1c3ca; --subtle:#91a8b2; --lime:#65ff8b; --lime-text:#061810; --line:rgba(190,220,235,.2); }
:root[data-theme="light"] .design-one { --bg:#edf3f4; --bg2:#e2ecee; --surface:#fff; --text:#102531; --muted:#405d66; --subtle:#46616c; --lime:#236f3b; --lime-text:#fff; --line:rgba(16,37,49,.2); }
.design-one .home-header { background:var(--bg); }
.design-one .nav-shell { min-height:82px; }
.design-one .desktop-nav { gap:30px; }
.design-one .text-brand { font-size:28px; font-weight:950; font-style:italic; letter-spacing:-.06em; }
.text-brand > span { color:var(--lime); }
.design-one .nav-cta { border:1px solid var(--lime); color:var(--lime); background:transparent; border-radius:12px; padding:13px 18px; font-size:10px; letter-spacing:.04em; }
.design-one .nav-cta:hover { color:var(--lime-text); background:var(--lime); transform:none; }
.design-one .icon-button { border-radius:9px; }
.cinema-hero { position:relative; isolation:isolate; color:#f4faf8; background:#07131e; }
.hero-photograph,.hero-shade { position:absolute; inset:0; width:100%; height:100%; }
.hero-photograph { object-fit:cover; object-position:center 32%; z-index:-2; filter:saturate(.6); }
.hero-shade { z-index:-1; background:linear-gradient(90deg,rgba(3,14,25,.98),rgba(3,14,25,.88) 27%,rgba(3,14,25,.28) 65%,rgba(3,14,25,.12)),linear-gradient(0deg,#07131e,transparent 35%); }
.hero-inner { min-height:690px; padding-block:58px 86px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.hero-kicker { font-size:10px; font-weight:800; letter-spacing:.17em; color:#b7d3d7; margin:0 0 23px; }
.design-one .hero-title { max-width:58%; margin:0 0 23px; color:#f4faf8; font-family:Impact,"Arial Narrow","Segoe UI",sans-serif; font-size:clamp(76px,7.4vw,110px); font-weight:400; line-height:.99; letter-spacing:-.015em; }
.design-one .hero-title em { color:#83ff9e; }
.hero-intro { font-size:17px; line-height:1.6; max-width:350px; margin:0; color:#e0ebed; }
.home-hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:18px; margin-top:27px; }
.design-one .button { border-radius:999px; }
.design-one .home-hero-actions .button-primary { background:#65ff8b; color:#061810; padding:17px 25px; gap:22px; }
.design-one .home-hero-actions .button-primary:hover { background:#9bffb3; }
.hero-text-link { background:rgba(3,14,25,.64); display:inline-flex; min-height:55px; align-items:center; justify-content:center; border:1px solid #d1e4e8; border-radius:999px; color:#f4faf8; font-size:13px; font-weight:800; padding:14px 24px; }
.hero-text-link:hover { background:rgba(3,14,25,.82); }
.hero-release { color:#b8cdd3; font-size:11px; margin:17px 0 0; }
.hero-mantra { font-size:9px; font-weight:800; letter-spacing:.16em; margin:25px 0 0; color:#d1e2e7; }
.hero-mantra > span { color:#83ff9e; }
.home-benefits { position:relative; z-index:2; margin-top:-34px; padding:21px 30px 24px; background:var(--surface); border:1px solid var(--line); border-radius:13px; box-shadow:0 12px 30px rgba(0,0,0,.16); }
.benefits-label { margin:0 0 15px; color:var(--subtle); font-size:9px; font-weight:750; letter-spacing:.12em; text-align:center; }
.benefits-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.benefits-row article { display:flex; justify-content:center; align-items:center; gap:14px; border-right:1px solid var(--line); padding-right:24px; }
.benefits-row article:last-child { border:0; padding-right:0; }
.benefits-row svg { width:28px; height:28px; flex:0 0 28px; color:var(--text); }
.benefits-row h3 { margin:0; font-size:15px; font-weight:500; letter-spacing:0; line-height:1.5; }
.home-eyebrow { font-size:10px; color:var(--lime); font-weight:800; letter-spacing:.15em; margin:0 0 21px; }
.home-preview { position:relative; isolation:isolate; margin-top:-30px; padding-block:95px 65px; background:#07131e; color:#f4faf8; --text:#f4faf8; --muted:#bdced3; --subtle:#9bb1b9; --lime:#65ff8b; --lime-text:#061810; --line:rgba(190,220,235,.2); }
.preview-atmosphere { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 80%; opacity:.13; z-index:-2; }
.home-preview::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#07131e,transparent 40%,#07131e),linear-gradient(90deg,#07131e,transparent 70%); z-index:-1; pointer-events:none; }
.preview-grid { display:grid; grid-template-columns:1fr 1.15fr; gap:80px; align-items:center; }
.preview-copy { min-width:0; }
.preview-copy h2 { margin:0 0 24px; font-family:Impact,"Arial Narrow","Segoe UI",sans-serif; font-size:clamp(46px,4.3vw,64px); font-weight:400; line-height:1.05; letter-spacing:-.01em; }
.preview-copy h2 > span { color:#83ff9e; }
.preview-intro { color:var(--muted); font-size:17px; line-height:1.7; max-width:360px; margin:0 0 30px; }
.design-one .preview-copy .button-primary { background:#65ff8b; color:#061810; padding:17px 24px; gap:24px; }
.design-one .preview-copy .button-primary:hover { background:#9bffb3; }
.preview-note { color:var(--subtle); font-size:11px; line-height:1.7; margin:18px 0 0; }
.phone-stage { padding:40px 60px 30px; min-width:0; position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.phone-frame { width:350px; max-width:100%; position:relative; background:#02080c; border:7px solid #03080c; outline:2px solid #7b8587; border-radius:43px; transform:rotate(-13deg); box-shadow:15px 20px 0 -9px #53616a,28px 38px 48px rgba(0,0,0,.6); color:#f4faf8; }
.phone-speaker { position:absolute; top:7px; left:50%; transform:translateX(-50%); width:91px; height:20px; border-radius:13px; background:#02080c; z-index:1; }
.phone-screen { background:linear-gradient(160deg,#102735,#05131d 58%,#102631); border-radius:35px; padding:40px 16px 30px; }
.phone-brand { color:#f4faf8; text-align:center; font-size:21px; font-weight:950; font-style:italic; letter-spacing:-.05em; margin:0; }
.phone-brand > span { color:#65ff8b; }
.phone-concept-label { font-size:8px; letter-spacing:.09em; color:#b6d0d8; text-align:center; margin:5px 0 15px; }
.phone-workout-photo { position:relative; isolation:isolate; border-radius:9px; background:#0a1b25; height:175px; display:flex; align-items:flex-end; padding:15px; }
.phone-workout-photo > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 20%; z-index:-2; border-radius:9px; }
.phone-workout-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#07131e,rgba(7,19,30,.15)); z-index:-1; border-radius:9px; }
.phone-workout-photo > p { margin:0; font-size:17px; line-height:1.2; color:#f4faf8; font-weight:500; }
.phone-workout-photo strong { font-size:26px; font-weight:900; }
.phone-demo-banner { background:#65ff8b; color:#061810; text-align:center; border-radius:9px; padding:12px 8px; margin:12px 0 15px; font-size:12px; font-weight:850; }
.phone-feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.phone-tile { min-width:0; padding:13px 5px 12px; border:1px solid #53717c; border-radius:10px; background:#0a1d29; text-align:center; display:flex; align-items:center; flex-direction:column; gap:8px; }
.phone-tile svg { color:#9de9f1; width:28px; height:28px; }
.phone-tile span { color:#e1eff2; font-size:10px; font-weight:700; line-height:1.3; }
.phone-disclaimer { color:#b6d0d8; margin:18px 0 0; text-align:center; font-size:8px; font-weight:600; letter-spacing:.06em; }
.phone-home-indicator { position:absolute; bottom:8px; left:50%; transform:translateX(-50%); width:85px; height:4px; border-radius:4px; background:#b6d0d8; }
.phone-stage-caption { position:relative; color:#b6d0d8; text-align:center; font-size:9px; font-weight:700; letter-spacing:.18em; margin:50px 0 0; }
.home-outdoors { position:relative; isolation:isolate; background:#07131e; color:#f4faf8; }
.outdoor-visual { position:absolute; inset:0; clip-path:polygon(0 0,100% 70px,100% 100%,0 100%); z-index:-2; }
.outdoor-visual > img { width:100%; height:100%; object-fit:cover; object-position:center 43%; transform:scaleX(-1); }
.outdoor-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,17,28,.96),rgba(3,17,28,.75) 32%,rgba(3,17,28,.05) 80%),linear-gradient(0deg,rgba(3,17,28,.6),transparent 55%); }
.outdoor-copy { min-height:520px; padding-block:115px 65px; }
.home-outdoors .home-eyebrow { color:#b6d0d8; }
.outdoor-copy h2 { font-family:Impact,"Arial Narrow","Segoe UI",sans-serif; font-size:clamp(56px,5.1vw,78px); font-weight:400; line-height:1.02; letter-spacing:-.01em; margin:0 0 22px; }
.outdoor-copy h2 > span { color:#83ff9e; }
.outdoor-copy > p:not(.home-eyebrow) { color:#e0ebed; font-size:16px; line-height:1.7; margin:0 0 27px; }
.outdoor-link { display:inline-flex; align-items:center; gap:14px; color:#f4faf8; font-size:14px; font-weight:700; }
.outdoor-link > span { width:40px; height:40px; border-radius:50%; border:1px solid #65ff8b; color:#65ff8b; display:grid; place-items:center; font-size:22px; }
.outdoor-link:hover { color:#83ff9e; }
.home-deeper { padding-block:48px; display:grid; grid-template-columns:1fr 1.3fr; gap:70px; align-items:center; }
.home-deeper .home-eyebrow { margin-bottom:12px; }
.home-deeper h2 { font-size:30px; margin:0; font-weight:800; letter-spacing:-.035em; }
.home-deeper nav { display:grid; grid-template-columns:1fr 1fr; gap:0 30px; }
.home-deeper nav a { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid var(--line); font-size:13px; font-weight:650; }
.home-deeper nav a span { color:var(--lime); }
.home-deeper nav a:hover { color:var(--lime); }
.home-footer { border-top:1px solid var(--line); }
.home-footer-main { display:flex; justify-content:space-between; align-items:center; gap:22px; padding-block:28px; }
.home-footer-main p { margin:0; color:var(--muted); font-size:12px; }
.footer-top { font-size:12px; font-weight:700; padding-block:12px; }
.footer-top > span { color:var(--lime); margin-left:10px; }
.home-footer-fine { display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px 25px; padding-block:20px; border-top:1px solid var(--line); color:var(--subtle); font-size:10px; }
.home-footer-fine p { margin:0; }
.home-footer-fine a { text-decoration:underline; text-underline-offset:3px; }
@media(max-width:1150px) { .design-one .desktop-nav{gap:22px} .preview-grid{gap:35px} .phone-stage{padding-inline:40px} }
@media(max-width:900px) {
 .design-one .nav-shell{min-height:76px} .hero-inner{min-height:650px;padding-block:55px 80px} .design-one .hero-title{font-size:78px;max-width:60%}
 .hero-intro{max-width:300px;font-size:16px} .hero-photograph{object-position:62% 30%}
 .home-benefits{padding:18px 20px 21px} .benefits-row{gap:15px} .benefits-row article{gap:9px;padding-right:15px} .benefits-row svg{width:24px;height:24px;flex-basis:24px} .benefits-row h3{font-size:12px}
 .preview-grid{grid-template-columns:.9fr 1.1fr;gap:25px} .preview-copy h2{font-size:43px} .preview-intro{font-size:15px} .phone-stage{padding-inline:25px} .phone-frame{transform:rotate(-10deg)} .phone-screen{padding-inline:12px} .phone-tile span{font-size:9px} .phone-workout-photo{height:150px}
 .home-deeper{gap:35px} .home-deeper nav{gap:0 20px} .home-deeper h2{font-size:27px}
}
@media(max-width:600px) {
 .design-one .nav-shell{min-height:68px} .design-one .text-brand{font-size:25px}
 .hero-inner{min-height:570px;padding-block:50px 75px;justify-content:center} .hero-kicker{font-size:8px;margin-bottom:20px;letter-spacing:.12em}
 .design-one .hero-title{font-size:clamp(43px,11vw,60px);max-width:65%;margin-bottom:20px} .hero-photograph{object-position:72% 25%}
 .hero-shade{background:linear-gradient(90deg,rgba(3,14,25,.95),rgba(3,14,25,.78) 28%,rgba(3,14,25,.17) 78%),linear-gradient(0deg,#07131e,transparent 48%)}
 .hero-intro{font-size:13px;max-width:230px;line-height:1.6} .home-hero-actions{gap:12px;margin-top:24px;width:100%} .design-one .home-hero-actions .button-primary{padding:14px 18px;font-size:12px;gap:15px} .hero-text-link{font-size:11px;min-height:49px;padding:13px 17px} .hero-release{font-size:9px;margin-top:13px} .hero-mantra{font-size:8px;margin-top:20px;letter-spacing:.1em}
 .home-benefits{margin-top:-32px;padding:14px 12px 17px;border-radius:10px} .benefits-label{font-size:8px;margin-bottom:13px} .benefits-row{gap:8px} .benefits-row article{flex-direction:column;text-align:center;padding-right:8px;gap:8px} .benefits-row h3{font-size:10px;line-height:1.45} .benefits-row svg{width:23px;height:23px;flex-basis:23px}
 .home-preview{padding-block:75px 20px;margin-top:-35px} .preview-grid{grid-template-columns:1fr;gap:16px} .preview-copy{max-width:350px} .home-eyebrow{font-size:9px} .preview-copy h2{font-size:38px;margin-bottom:16px} .preview-intro{font-size:14px;margin-bottom:23px;max-width:285px} .design-one .preview-copy .button-primary{padding:14px 20px;font-size:12px;gap:20px} .preview-note{font-size:10px;margin-top:12px}
 .phone-stage{padding:35px 36px 30px} .phone-frame{width:300px;transform:rotate(-9deg);border-width:6px;border-radius:37px} .phone-screen{padding:38px 13px 28px;border-radius:31px} .phone-brand{font-size:20px} .phone-workout-photo{height:150px} .phone-feature-grid{gap:6px} .phone-tile{padding:11px 4px;gap:7px} .phone-tile svg{width:24px;height:24px} .phone-tile span{font-size:9px} .phone-concept-label{font-size:7px} .phone-disclaimer{font-size:7px} .phone-stage-caption{margin-top:36px;font-size:8px}
 .outdoor-visual{clip-path:polygon(0 0,100% 40px,100% 100%,0 100%)} .outdoor-visual > img{object-position:43% center} .outdoor-visual::after{background:linear-gradient(90deg,rgba(3,17,28,.95),rgba(3,17,28,.65) 45%,rgba(3,17,28,.15)),linear-gradient(0deg,rgba(3,17,28,.55),transparent)}
 .outdoor-copy{min-height:465px;padding-block:90px 50px} .home-outdoors .home-eyebrow{font-size:8px;max-width:210px} .outdoor-copy h2{font-size:46px;margin-bottom:20px} .outdoor-copy > p:not(.home-eyebrow){font-size:13px;max-width:255px;line-height:1.65} .outdoor-link{font-size:12px;gap:12px} .outdoor-link > span{width:35px;height:35px}
 .home-deeper{display:block;padding-block:35px} .home-deeper h2{font-size:25px;margin-bottom:15px} .home-deeper nav{gap:0 20px} .home-deeper nav a{font-size:11px;line-height:1.5}
 .home-footer-main{flex-wrap:wrap;padding-block:23px;gap:8px 20px} .home-footer-main p{order:3;width:100%;font-size:11px} .home-footer-fine{display:grid;gap:12px;font-size:9px;line-height:1.7}
}

/* Task 6: concise descriptions inside the existing three-highlight strip. */
.benefits-row h3 { font-weight:750; }
.benefit-summary { margin:3px 0 0; font-size:12px; line-height:1.5; color:var(--subtle); }
@media(max-width:900px){.benefit-summary{font-size:11px}}
@media(max-width:600px){.benefit-summary{font-size:10px}}