.smart-intro{position:relative;isolation:isolate;display:flex;align-items:center;min-height:480px;padding-block:64px;color:var(--gymio-on-dark)}.smart-intro>img{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:cover;z-index:-2}.smart-intro::before{content:'';position:absolute;inset:0;background:rgb(0 0 0 / .3);z-index:-1}.smart-intro>div{max-width:760px}.smart-intro h1{font-size:clamp(36px,4.5vw,64px);line-height:1.08;max-width:14em;margin-block:16px 24px;color:inherit}.smart-intro .g-muted{color:inherit}.smart-intro h1::after{content:'';display:block;width:140px;height:12px;margin-top:24px;border-radius:var(--gymio-pill);background:var(--gymio-primary)}.smart-intro .g-text{max-width:600px}
.smart-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding-block:16px 40px}.gymio-ui .smart-nav a{display:flex;align-items:center;gap:16px;position:relative;padding:20px 16px 24px;background:var(--gymio-surface);color:var(--gymio-text);border-radius:var(--gymio-radius)}.gymio-ui .smart-nav a:hover{color:var(--gymio-primary)}.smart-nav a::after{content:'';position:absolute;bottom:0;left:16px;right:16px;height:6px;background:var(--app-color);border-radius:var(--gymio-pill)}.smart-nav img{width:40px;height:40px;object-fit:contain}.smart-nav a>span:last-child{margin-left:auto}
.smart-app{padding-block:56px}.smart-app>header{display:flex;align-items:center;gap:24px;position:relative;padding-bottom:28px;margin-bottom:32px}.smart-app>header::after{content:'';position:absolute;left:0;bottom:0;width:42%;height:14px;border-radius:var(--gymio-pill);background:var(--app-color)}.smart-app:nth-of-type(even)>header::after{left:auto;right:0}.smart-app>header img{width:72px;height:72px;object-fit:contain}.smart-app>header h2,.smart-app>header p{margin:0}.smart-app>header p{margin-bottom:6px}
.smart-features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 40px}.smart-features article{position:relative;padding:24px 24px 16px 60px;background:var(--gymio-surface);border-radius:var(--gymio-radius)}.smart-features article>span{position:absolute;left:20px;top:28px;color:var(--gymio-muted);font-size:14px}.smart-features h3{font-size:22px;margin-top:0;margin-bottom:12px}.smart-features p{margin-bottom:0}
.smart-videos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:32px auto 0;max-width:960px}.smart-videos article{min-width:0;transform-origin:top left}.smart-videos .is-active{grid-column:1/-1}.smart-video-media{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:var(--gymio-radius);background:var(--gymio-dark)}.smart-video-media button{display:block;width:100%;height:100%;padding:0;border:0;cursor:pointer;background:transparent}.smart-video-media img{width:100%;height:100%;object-fit:cover}.smart-video-media button>span{position:absolute;top:50%;left:50%;translate:-50% -50%;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:rgb(0 0 0 / .5);color:var(--gymio-on-dark)}.smart-video-media button:hover>span{background:var(--app-color)}.smart-video-media iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.smart-videos article>p{margin:10px 0 0;color:var(--gymio-muted)}.smart-video-media button:focus-visible{outline-offset:-4px}
.smart-downloads{display:flex;align-items:center;flex-wrap:wrap;gap:16px;margin-top:24px}.smart-downloads p{margin:0 8px 0 0}.smart-connection{margin-top:32px}.smart-connection img{display:block;width:100%;height:auto;max-height:none}
@media(max-width:900px){.smart-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.smart-intro{gap:24px}.smart-features{gap:16px}}
@media(max-width:600px){.smart-intro,.smart-features,.smart-pictures{grid-template-columns:1fr}.smart-intro{min-height:400px;padding-block:40px}.smart-nav{gap:12px}.gymio-ui .smart-nav a{gap:8px;padding:16px 10px}.smart-nav img{width:28px;height:28px}.smart-app{padding-block:32px}.smart-app>header::after{width:70%}.smart-downloads a{flex:0 1 170px}.smart-downloads p{flex-basis:100%}}

.smart-downloads a{display:block;width:190px;max-width:100%;border-radius:6px}.smart-downloads a img{display:block;width:100%;height:auto}
.smart-videos{overflow-anchor:none}

.gymio-ui #main .smart-intro h1.g-title{color:var(--gymio-on-dark)!important}