:root {
    --ink:#0b0b0b;
    --dark:#212121;
    --muted:#434443;
    --soft:#f1f0f1;
    --mint:#00fec0;
    --gradient:linear-gradient(164deg,#0070da,#00ffb8)
}

* {
    box-sizing:border-box
}
html {
    scroll-behavior:smooth;
    scroll-padding-top:24px
}
body {
    margin:0;
    color:var(--ink);
    background:#fff;
    font:400 16px/1.5 Montserrat,Arial,sans-serif
}
h1,h2,h3,p {
    margin:0
}
h1,h2,h3 {
    line-height:1.14
}
h2 {
    font-size:44px;
    letter-spacing:-.66px;
    font-weight:700
}
a {
    color:inherit;
    text-decoration:none
}
a:hover {
    text-decoration:underline
}
img {
    display:block
}
button,input,textarea {
    font:inherit
}
a:focus-visible,input:focus-visible,textarea:focus-visible,button:focus-visible {
    outline:3px solid #0070da;
    outline-offset:5px
}
.wrap {
    width:calc(100% - 80px);
    max-width:1200px;
    margin-inline:auto
}
.button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:14px 24px;
    min-height:46px;
    border:0;
    border-radius:14px;
    font-size:15px;
    line-height:18px;
    font-weight:700;
    cursor:pointer;
    text-align:center
}
.button:hover {
    text-decoration:none;
    filter:brightness(.92)
}
.gradient {
    background:var(--gradient);
    color:#fff
}
.button-dark {
    background:var(--ink);
    color:#fff
}
.site-header,.site-footer {
    background:var(--ink);
    color:#fff
}
.header-inner {
    height:72px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px
}
.header-inner nav {
    display:flex;
    gap:32px;
    font-size:14px;
    font-weight:500
}
.brand {
    display:block;
    flex-shrink:0
}
.mobile-label {
    display:none
}
.skip-link {
    position:fixed;
    top:-100px;
    left:20px;
    z-index:100;
    background:#fff;
    color:#000;
    padding:12px
}
.skip-link:focus {
    top:10px
}
.hero,.assistant-section {
    background-color:var(--ink);
    color:#fff;
    position:relative;
    overflow:hidden
}
.hero {
    background-image:url('images/542c8.svg'),url('images/a848c.svg'),url('images/df552.svg'),url('images/9c876.svg');
    background-position:calc(50% + 410px) -280px,calc(50% - 650px) 220px,calc(50% + 380px) -240px,calc(50% - 670px) 220px;
    background-repeat:no-repeat
}
.hero-inner {
    display:flex;
    align-items:flex-end;
    gap:40px;
    padding-top:80px;
    min-height:705px
}
.hero-copy {
    flex:1;
    min-width:0;
    padding-bottom:80px
}
.hero h1 {
    font-size:72px;
    line-height:78px;
    letter-spacing:-1.44px;
    font-weight:800;
    max-width:798px
}
.hero h1 span {
    color:var(--mint)
}
.hero-copy>p {
    font-size:20px;
    line-height:30px;
    margin-top:24px
}
.store-links {
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:32px
}
.store-links a {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:5px;
    background:white;
    color:var(--ink);
    padding:14px 24px;
    border-radius:14px;
    font-size:15px;
    line-height:18px;
    font-weight:700;
    min-height:62px
}
.store-dark a {
    background:var(--ink);
    color:white
}
.welcome-phone {
    width:300px;
    height:625px;
    flex-shrink:0;
    border:8px solid var(--ink);
    border-bottom:0;
    border-radius:44px 44px 0 0;
    overflow:hidden;
    position:relative;
    background:#0a0a0a
}
.welcome-underlay {
    position:absolute;
    inset:0;
    width:284px;
    height:617px;
    object-fit:cover;
    opacity:.2
}
.welcome-screen {
    position:relative;
    width:284px;
    height:617.453px;
    overflow:hidden;
    border-radius:36px 36px 0 0
}
.welcome-layer {
    position:absolute
}
.welcome-layer img {
    max-width:none
}
.how {
    height:650px;
    overflow:hidden;
    position:relative;
    padding-top:96px
}
.how-heading {
    display:flex;
    justify-content:space-between;
    gap:40px
}
.how-heading h2 {
    max-width:560px
}
.how-heading>p {
    max-width:340px;
    text-align:right;
    color:var(--muted)
}
.steps-scene {
    position:absolute;
    width:1440px;
    left:50%;
    transform:translateX(-50%);
    top:0;
    height:650px
}
.steps {
    list-style:none;
    padding:0;
    margin:0
}
.steps li {
    position:absolute;
    width:246px;
    z-index:1
}
.steps li:nth-child(1) {
    left:93px;
    top:297px;
    width:146px
}
.steps li:nth-child(2) {
    left:556px;
    top:410px;
    width:171px
}
.steps li:nth-child(3) {
    left:693px;
    top:275px;
    width:171px
}
.steps li:nth-child(4) {
    left:1156px;
    top:458px
}
.step-number {
    display:flex;
    align-items:center;
    justify-content:center;
    width:44px;
    height:44px;
    border-radius:50%;
    background:var(--ink);
    color:var(--mint);
    font-size:18px;
    font-weight:800;
    margin-bottom:4px
}
.steps h3 {
    font-size:20px;
    line-height:26px;
    margin-bottom:4px
}
.steps p {
    font-size:15px;
    line-height:23px;
    color:var(--muted)
}
.steps-art img {
    position:absolute;
    object-fit:cover
}
.map-phone {
    left:211px;
    top:203px
}
.qr-body {
    left:725px;
    top:221px
}
.qr-screen {
    left:877px;
    top:230px;
    mask-image:url('images/68203.png');
    mask-position:-152px -9px;
    mask-size:568px 536px;
    mask-repeat:no-repeat
}
.assistant-section {
    background-image:url('images/32f39.svg'),url('images/b0f92.svg');
    background-position:calc(50% + 660px) -74px,calc(50% - 810px) -168px;
    background-repeat:no-repeat
}
.assistant-inner {
    display:grid;
    grid-template-columns:544fr 592fr;
    gap:64px;
    align-items:center;
    padding-block:96px
}
.assistant-copy p {
    margin:20px 0;
    font-size:18px;
    line-height:28px
}
.chat-demo {
    background:var(--dark);
    padding:24px;
    border-radius:28px;
    display:flex;
    flex-direction:column;
    gap:14px;
    font-size:15px;
    line-height:18px
}
.chat-user {
    align-self:flex-end;
    background:var(--muted);
    max-width:296px;
    padding:14px 18px;
    border-radius:18px
}
.chat-assistant {
    align-self:flex-start;
    background:var(--mint);
    color:var(--ink);
    max-width:376px;
    padding:14px 18px;
    border-radius:18px;
    font-weight:500
}
.chat-plans {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    align-items:start
}
.chat-plans>div {
    background:var(--ink);
    padding:16px;
    border-radius:16px
}
.chat-plans h3 {
    color:var(--mint);
    font-size:15px;
    line-height:18px;
    margin-bottom:6px
}
.chat-plans p {
    font-size:13px;
    line-height:20px
}
.features {
    background:var(--soft);
    overflow:hidden;
    background-image:url('images/703cf.svg');
    background-position:calc(50% + 420px) 123px;
    background-repeat:no-repeat
}
.features-inner {
    position:relative;
    min-height:637px;
    padding-top:96px
}
.feature-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    width:736px;
    max-width:calc(100% - 350px);
    margin-top:38px
}
.feature-grid article {
    display:flex;
    gap:20px;
    background:#fff;
    padding:32px;
    border-radius:24px;
    min-height:178px
}
.feature-icon {
    display:flex;
    width:56px;
    height:56px;
    flex-shrink:0;
    align-items:center;
    justify-content:center;
    background:var(--ink);
    border-radius:16px
}
.feature-grid h3 {
    font-size:20px;
    line-height:24px;
    margin-bottom:6px
}
.feature-grid p {
    font-size:15px;
    line-height:23px;
    color:var(--muted)
}
.feature-phone,.download-phone {
    width:300px;
    border:8px solid var(--dark);
    border-bottom:0;
    border-radius:44px 44px 0 0;
    overflow:hidden;
    position:relative;
    flex-shrink:0
}
.feature-phone {
    position:absolute;
    right:31px;
    top:146px;
    height:493px
}
.feature-phone>img {
    position:absolute;
    top:-21.91%;
    left:-.09%;
    width:100%;
    height:132.3%
}
.notch {
    position:absolute;
    top:20px;
    left:50%;
    transform:translateX(-50%);
    height:6px;
    width:90px;
    border-radius:3px;
    background:var(--muted)
}
.section-space {
    padding-block:96px
}
.partner-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
    margin-top:48px
}
.partner-grid article {
    padding:40px;
    border-radius:28px;
    background:var(--soft);
    display:flex;
    flex-direction:column;
    align-items:flex-start
}
.partner-grid .partner-gym {
    background:var(--ink);
    color:#fff
}
.partner-grid h3 {
    font-size:28px;
    line-height:34px
}
.partner-grid p {
    margin-top:16px;
    line-height:25px
}
.partner-grid .button {
    margin-top:auto;
    position:relative;
    top:0
}
.partner-grid p {
    padding-bottom:56px
}
.download {
    background:var(--gradient);
    color:#fff;
    overflow:hidden
}
.download-inner {
    display:flex;
    align-items:flex-end;
    gap:40px;
    min-height:414px;
    padding-top:34px
}
.download-copy {
    flex:1;
    min-width:0;
    padding-bottom:80px
}
.download h2 {
    font-size:56px;
    line-height:62px;
    font-weight:800;
    letter-spacing:-.84px
}
.download-copy>p {
    font-size:18px;
    margin-top:16px
}
.download .store-links {
    margin-top:32px
}
.download-phone {
    height:380px
}
.download-phone>img {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover
}
.site-footer {
    padding:48px 0 24px;
    font-size:14px
}
.footer-inner {
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:24px
}
.site-footer address {
    font-style:normal;
    line-height:22px;
    margin-top:8px
}
.footer-links {
    display:flex;
    flex-wrap:wrap;
    gap:16px 24px;
    padding-top:28px;
    font-size:12px;
    color:#ddd
}
.content-page {
    padding-block:80px;
    min-height:65vh
}
.content-page h1 {
    font-size:44px;
    line-height:1.15;
    margin-bottom:24px
}
.content-page .intro {
    max-width:700px;
    margin-bottom:32px;
    color:var(--muted)
}
.contact-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px
}
.contact-grid article {
    border-radius:24px;
    background:var(--soft);
    padding:28px;
    overflow-wrap:anywhere
}
.contact-grid h2 {
    font-size:22px;
    letter-spacing:0;
    margin-bottom:16px
}
.application-form {
    max-width:800px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:24px
}
.form-field label {
    display:block;
    font-weight:700;
    margin-bottom:8px
}
.form-field input,.form-field textarea {
    width:100%;
    border:1px solid #888;
    border-radius:12px;
    padding:12px;
    background:#fff;
    color:var(--ink)
}
.form-field.full,.form-actions {
    grid-column:1/-1
}
.field-error {
    color:#a10e1c;
    font-size:14px;
    margin-top:6px
}
.alert {
    padding:20px;
    border-radius:12px;
    margin-bottom:24px
}
.alert-success {
    background:#dcfced;
    color:#134e36
}
.alert-error {
    background:#fff0f0;
    color:#8d1420
}

@media(min-width:768px) and (max-width:1250px) {
    .hero h1 {
    font-size:56px;
    line-height:1.1
}
.header-inner nav {
    gap:16px;
    font-size:12px
}
.feature-grid {
    max-width:calc(100% - 320px)
}
.feature-grid article {
    padding:20px;
    gap:12px
}
.feature-grid h3 {
    font-size:17px
}
.feature-phone {
    right:0
}
.steps-scene {
    transform:translateX(-50%) scale(.8);
    transform-origin:top center
}
.how {
    height:560px
}
.how-heading h2 {
    font-size:36px
}
.download h2 {
    font-size:42px;
    line-height:1.15
}

}

@media(max-width:1000px) {
    .header-inner nav {
    display:none
}
.assistant-inner {
    gap:32px
}
.assistant-copy h2 {
    font-size:34px
}
.feature-phone {
    display:none
}
.feature-grid {
    max-width:none;
    width:100%
}
.features-inner {
    padding-bottom:64px;
    min-height:0
}
.download h2 {
    font-size:36px;
    line-height:42px
}
.contact-grid {
    grid-template-columns:1fr
}

}

@media(max-width:767px) {
    .wrap {
    width:calc(100% - 40px)
}
h2 {
    font-size:30px;
    line-height:36px;
    letter-spacing:-.3px
}
.header-inner {
    height:64px
}
.brand img {
    width:104px;
    height:22px
}
.desktop-label {
    display:none
}
.mobile-label {
    display:inline
}
.hero {
    background-image:url('images/d3a83.svg'),url('images/75be2.svg');
    background-position:40px 300px,-250px -250px
}
.hero-inner {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:24px;
    min-height:0;
    padding-top:40px
}
.hero-copy {
    padding-bottom:0
}
.hero h1 {
    font-size:40px;
    line-height:46px;
    letter-spacing:-.6px
}
.hero h1 span {
    color:inherit
}
.hero-copy>p {
    font-size:16px;
    line-height:24px;
    margin-top:24px
}
.store-links {
    margin-top:28px;
    gap:12px;
    flex-wrap:nowrap;
    padding-bottom:16px
}
.store-links a {
    padding:14px 24px;
    min-height:52px;
    white-space:nowrap
}
.store-links img {
    width:24px;
    height:24px
}
.welcome-phone {
    height:520px;
    align-self:center
}
.how {
    height:auto;
    padding:64px 0
}
.how-heading {
    display:block
}
.how-heading>p {
    text-align:left;
    font-size:15px;
    line-height:23px;
    max-width:none;
    margin-top:12px
}
.steps-scene {
    position:static;
    transform:none;
    width:calc(100% - 40px);
    margin:32px auto 0;
    height:auto
}
.steps {
    display:flex;
    flex-direction:column;
    gap:12px
}
.steps li,.steps li:nth-child(n) {
    position:static;
    width:auto;
    display:flex;
    gap:16px;
    padding:20px;
    background:var(--soft);
    border-radius:20px
}
.steps li:last-child {
    background:var(--mint)
}
.step-number {
    width:40px;
    height:40px;
    font-size:16px;
    flex-shrink:0;
    margin:0
}
.steps h3 {
    font-size:18px;
    line-height:24px;
    margin-bottom:6px
}
.steps p {
    font-size:14px;
    line-height:21px
}
.steps-art {
    display:none
}
.assistant-section {
    background-image:url('images/d782e.svg');
    background-position:0 380px
}
.assistant-inner {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    padding-block:64px;
    gap:24px
}
.assistant-copy h2 {
    font-size:30px;
    line-height:36px
}
.assistant-copy p {
    font-size:16px;
    line-height:24px;
    margin:24px 0
}
.assistant-copy .button {
    margin-bottom:8px
}
.chat-demo {
    padding:20px;
    border-radius:24px;
    gap:12px;
    font-size:14px;
    line-height:17px
}
.chat-user {
    max-width:232px;
    padding:12px 16px;
    border-radius:16px
}
.chat-assistant {
    max-width:282px;
    padding:12px 16px;
    background:var(--ink);
    color:#fff;
    border-radius:16px
}
.chat-plans {
    grid-template-columns:1fr;
    gap:10px
}
.chat-plans>div {
    padding:14px;
    border-radius:14px
}
.chat-plans h3 {
    font-size:14px;
    line-height:17px
}
.features {
    background-image:none
}
.features-inner {
    padding-block:64px
}
.features h2 {
    max-width:350px
}
.feature-grid {
    grid-template-columns:1fr;
    gap:12px;
    margin-top:32px
}
.feature-grid article {
    padding:20px;
    gap:16px;
    min-height:0;
    border-radius:20px
}
.feature-icon {
    width:52px;
    height:52px;
    border-radius:14px
}
.feature-grid h3 {
    font-size:18px;
    line-height:24px;
    margin-bottom:4px
}
.feature-grid p {
    font-size:14px;
    line-height:21px
}
.section-space {
    padding-block:64px
}
.partner-grid {
    grid-template-columns:1fr;
    gap:12px;
    margin-top:32px
}
.partner-grid article {
    padding:28px 24px;
    border-radius:24px
}
.partner-grid h3 {
    font-size:22px;
    line-height:27px
}
.partner-grid p {
    font-size:15px;
    line-height:23px;
    margin-top:12px;
    padding-bottom:32px
}
.download {
    background:linear-gradient(111deg,#0070da 13.5%,#00ffb8 86.5%)
}
.download-inner {
    flex-direction:column;
    align-items:stretch;
    gap:16px;
    padding-top:56px;
    min-height:0
}
.download-copy {
    padding-bottom:0
}
.download h2 {
    max-width:315px;
    font-size:36px;
    line-height:42px;
    letter-spacing:-.36px
}
.download-copy>p {
    font-size:16px;
    line-height:20px
}
.download .store-links {
    margin-top:24px
}
.download-phone {
    align-self:center;
    width:280px;
    height:300px
}
.download-phone>img {
    height:202.92%;
    top:-41.94%;
    left:-.03%;
    object-fit:fill
}
.site-footer {
    padding:40px 0 24px
}
.footer-inner {
    flex-direction:column;
    gap:20px
}
.footer-links {
    flex-direction:column;
    gap:12px
}
.content-page {
    padding-block:48px
}
.content-page h1 {
    font-size:32px
}
.application-form {
    grid-template-columns:1fr
}
.form-field.full,.form-actions {
    grid-column:auto
}

}

@media(max-width:370px) {
    .store-links {
    gap:8px
}
.store-links a {
    padding:14px 12px;
    font-size:14px
}
.hero h1 {
    font-size:36px;
    line-height:42px
}
.welcome-phone {
    transform:scale(.9);
    transform-origin:bottom center;
    margin-top:-52px
}
.feature-grid article {
    gap:12px;
    padding:16px
}
.feature-grid h3 {
    font-size:16px
}

}

@media(prefers-reduced-motion:reduce) {
    html {
    scroll-behavior:auto
}

}

/* Tablet: show every step without cropping the desktop illustration. */
@media(min-width:768px) and (max-width:1439px) {
    .how {
    height:auto;
    padding:64px 0
}
.steps-scene {
    position:static;
    transform:none;
    width:calc(100% - 80px);
    margin:32px auto 0;
    height:auto
}
.steps {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px
}
.steps li,.steps li:nth-child(n) {
    position:static;
    width:auto;
    display:flex;
    gap:16px;
    padding:24px;
    border-radius:20px;
    background:var(--soft)
}
.step-number {
    flex-shrink:0
}
.steps-art {
    display:none
}

}

