body{padding-left: env(safe-area-inset-left);padding-right: env(safe-area-inset-right);padding-bottom: env(safe-area-inset-bottom)} .hero__title{font-size: clamp(1.75rem,4vw + 0.5rem,4rem)}.hero__subtitle{font-size: clamp(0.9375rem,1.2vw + 0.5rem,1.25rem)} @media (pointer: coarse){button,[role="button"],a.btn,.pill,.converter__adjust-btn,.site-header__dark-toggle,.results-toggle--compact,.faq-section__question,.language-selector__trigger,.share__btn{min-width: 44px;min-height: 44px}} @media (max-width: 480px){ .site-header__inner{padding-inline: 0.75rem}.site-header__logo img{height: 32px}.site-header__nav{display: none}.site-header__cta{display: none}.site-header__dark-toggle{min-width: 44px;min-height: 44px}  .hero__inner{padding: 3rem 1rem 2rem;gap: 1.5rem}.hero__title{font-size: 1.75rem}.hero__subtitle{font-size: 0.9375rem}.hero__badges{gap: 0.75rem}.hero__check-badge{font-size: 0.6875rem}.hero__how-it-works{margin-top: 1.5rem}.hero__how-heading{font-size: 0.75rem}.hero__how-steps{gap: 0.75rem}.hero__how-step{gap: 0.5rem}.hero__how-num{width: 24px;height: 24px;font-size: 0.75rem}.hero__how-title{font-size: 0.75rem}.hero__how-desc{font-size: 0.6875rem} .converter{padding: 1rem;border-radius: 1rem}.converter__step-input{font-size: 2rem;max-width: 160px}.converter__result-value,.result__primary-value{font-size: 2rem}.converter__section-label{font-size: 0.625rem}.converter__stride-bar{padding: 0.5rem 0.625rem}.converter__stride-info{font-size: 0.6875rem}.converter__adjust-btn{font-size: 0.6875rem;padding: 0.25rem 0.5rem}.converter__unit-toggle{top: 0.75rem;right: 0.75rem}.results-toggle--compact{transform: scale(0.8)} .results-panel__inner{padding-inline: 0.75rem}.results-dashboard{gap: 0.75rem}.results-card{padding: 0.875rem;border-radius: 0.875rem}.results-card__label{font-size: 0.5625rem}.results-card__big-value{font-size: 1.75rem}.results-panel__compare-grid{font-size: 0.8125rem}.results-panel__heading{font-size: 0.75rem} .progress-visualizer__inner{padding-inline: 0.75rem}.progress-visualizer__heading{font-size: 1.125rem}.progress-visualizer__landmark-list{gap: 0.5rem} .content-sections__inner{padding-inline: 0.75rem}.content-sections__heading{font-size: 1.25rem}.content-sections__table-wrap{margin-inline: -0.75rem;padding-inline: 0.75rem;overflow-x: auto;-webkit-overflow-scrolling: touch}.content-sections__table{font-size: 0.75rem;min-width: 500px}.content-sections__table th,.content-sections__table td{padding: 0.5rem 0.625rem} .faq-section__heading{font-size: 1.25rem}.faq-section__question-text{font-size: 0.875rem}.faq-section__answer p{font-size: 0.875rem} .internal-links__grid{grid-template-columns: 1fr;gap: 0.75rem}.internal-links__title{font-size: 1.25rem}.internal-links__card-title{font-size: 0.875rem}.internal-links__card-desc{font-size: 0.75rem} .site-footer__inner{gap: 2rem}.site-footer__desc{font-size: 0.8125rem}.site-footer__col-title{font-size: 0.8125rem}.site-footer__links a{font-size: 0.8125rem}  .settings-panel__title{font-size: 0.875rem}.settings-field__label{font-size: 0.625rem}.pill{padding: 0.3125rem 0.625rem;font-size: 0.75rem}.settings-input{min-height: 32px;font-size: 0.8125rem} .scroll-hint{font-size: 0.75rem;padding: 0.5rem 1rem} .language-selector__dropdown{max-height: 60vh} .share__buttons{flex-wrap: wrap} .stats-summary{gap: 0.5rem}.stats-summary__num{font-size: 1.25rem}} @media (min-width: 481px) and (max-width: 1023px){ .site-header__inner{padding-inline: 1.25rem}.site-header__nav{display: flex;gap: 1rem}.site-header__cta{display: inline-flex;font-size: 0.75rem;padding: 0.375rem 1rem} .hero__inner{padding: 4rem 1.5rem 2.5rem}.hero__title{font-size: 2.25rem}.hero__converter{max-width: 100%} .results-dashboard--row-1{grid-template-columns: 1fr 1fr}.results-dashboard--row-2{grid-template-columns: 1fr 1fr} .content-sections__table{min-width: 600px} .internal-links__grid{grid-template-columns: repeat(2,1fr)} .site-footer__inner{flex-wrap: wrap}.site-footer__brand{flex: 1 1 100%}.site-footer__col{flex: 1 1 30%}} @media (min-width: 1024px){  .hero:not(.hero--sub){min-height: min(86vh,46rem)}.hero__inner:not(.hero__inner--sub){flex-direction: row;align-items: center;min-height: min(86vh,46rem);padding: 7rem 2rem 3rem}.hero__content{flex: 1.2;padding-right: 3rem}.hero__converter{flex: 1;max-width: 440px}.hero__title{font-size: 3.5rem;letter-spacing: -0.03em} .results-dashboard--row-1{grid-template-columns: repeat(3,1fr)}.results-dashboard--row-2{grid-template-columns: repeat(auto-fit,minmax(240px,1fr))} .internal-links__grid{grid-template-columns: repeat(4,1fr)}} @media (min-width: 1440px){.container{max-width: 1280px}.hero__title{font-size: 4rem}}  .site-header__hamburger{display: none;flex-direction: column;justify-content: center;align-items: center;gap: 5px;width: 40px;height: 40px;padding: 0;background: none;border: 1px solid rgba(255,255,255,0.15);border-radius: 0.5rem;cursor: pointer;transition: background 0.15s}.site-header__hamburger:hover{background: rgba(255,255,255,0.08)}.site-header__hamburger-line{display: block;width: 18px;height: 2px;background: rgba(255,255,255,0.8);border-radius: 1px;transition: transform 0.25s,opacity 0.25s} .site-header__hamburger.is-open .site-header__hamburger-line:nth-child(1){transform: translateY(7px) rotate(45deg)}.site-header__hamburger.is-open .site-header__hamburger-line:nth-child(2){opacity: 0}.site-header__hamburger.is-open .site-header__hamburger-line:nth-child(3){transform: translateY(-7px) rotate(-45deg)} .mobile-nav{background: rgba(10,10,10,0.98);border-top: 1px solid rgba(255,255,255,0.08);padding: 1rem 1.5rem 1.5rem}.mobile-nav[hidden]{display: none}.mobile-nav__list{list-style: none;margin: 0;padding: 0;display: flex;flex-direction: column;gap: 0}.mobile-nav__list li{border-bottom: 1px solid rgba(255,255,255,0.06)}.mobile-nav__list li:last-child{border-bottom: none}.mobile-nav__list a{display: block;padding: 0.875rem 0;font-size: 0.9375rem;font-weight: 500;color: rgba(255,255,255,0.8);text-decoration: none;transition: color 0.15s}.mobile-nav__list a:hover{color: #e8651a} html[data-theme="light"] .mobile-nav{background: rgba(255,255,255,0.98);border-top-color: rgba(0,0,0,0.08)}html[data-theme="light"] .mobile-nav__list li{border-bottom-color: rgba(0,0,0,0.06)}html[data-theme="light"] .mobile-nav__list a{color: #333}html[data-theme="light"] .mobile-nav__list a:hover{color: #e8651a}html[data-theme="light"] .site-header__hamburger{border-color: rgba(0,0,0,0.15)}html[data-theme="light"] .site-header__hamburger-line{background: #333} @media (max-width: 1023px){.site-header__hamburger{display: flex}} html[data-theme="light"] body:not(.home) .site-header__hamburger{border-color: rgba(0,0,0,0.15)}html[data-theme="light"] body:not(.home) .site-header__hamburger-line{background: #333} @media (max-width: 768px){ .hero__content{text-align: center;display: flex;flex-direction: column;align-items: center}.hero__badge{justify-content: center}.hero__badges{justify-content: center}.hero__subtitle{margin-inline: auto;text-align: center}.hero__title{text-align: center} .hero__how-it-works{margin-top: 1rem;width: 100%}.hero__how-heading{text-align: center;margin-bottom: 0.5rem;font-size: 0.6875rem}.hero__how-steps{display: grid;grid-template-columns: 1fr 1fr 1fr;gap: 0.5rem}.hero__how-step{flex-direction: column;align-items: center;text-align: center;gap: 0.375rem;padding: 0.875rem 0.5rem;background: rgba(255,255,255,0.05);border-radius: 0.75rem;border: 1px solid rgba(255,255,255,0.08);min-height: 84px;justify-content: center}.hero__how-num{width: 28px;height: 28px;min-width: 28px;min-height: 28px;font-size: 0.8125rem;line-height: 1;margin: 0;flex-shrink: 0;border-radius: 50%;display: flex;align-items: center;justify-content: center;box-shadow: 0 2px 10px -2px rgba(232,101,26,0.55)}.hero__how-step > div{display: flex;flex-direction: column;align-items: center} .hero__how-title{font-size: 0.6875rem;letter-spacing: 0.02em;line-height: 1.25;color: rgba(255,255,255,0.92)}.hero__how-desc{display: block;margin-top: 0.125rem;font-size: 0.625rem;line-height: 1.3;color: rgba(255,255,255,0.60)} .hero__settings{text-align: left}.settings-panel__body{grid-template-columns: 1fr}}  @media (max-width: 380px){.hero__inner{padding: 4.5rem 0.75rem 1.5rem;gap: 1rem}.hero__title{font-size: 1.5rem;line-height: 1.2}.hero__subtitle{font-size: 0.8125rem}.hero__badges{flex-wrap: wrap;gap: 0.5rem}.hero__check-badge{font-size: 0.625rem;padding: 0.25rem 0.5rem} .converter{padding: 0.75rem;border-radius: 0.875rem}.converter__step-input{font-size: 1.75rem;max-width: 130px}.converter__result-value,.result__primary-value{font-size: 1.75rem}.converter__step-unit,.converter__result-km{font-size: 0.75rem}.converter__hint{font-size: 0.5625rem} .converter__stride-bar{padding: 0.375rem 0.5rem;gap: 0.375rem}.converter__stride-pill{font-size: 0.6875rem;padding: 0.125rem 0.375rem}.converter__adjust-btn{font-size: 0.625rem;padding: 0.25rem 0.375rem;gap: 0.25rem} .results-dashboard--row-1,.results-dashboard--row-2{grid-template-columns: 1fr}.results-card__big-value{font-size: 1.5rem} .settings-panel__header{padding: 0.75rem}.settings-panel__body{padding: 0.75rem;gap: 0.625rem}.settings-panel__footer{padding: 0.5rem 0.75rem calc(0.75rem + env(safe-area-inset-bottom,0px));gap: 0.5rem} .settings-reset-btn{flex-shrink: 0;padding-inline: 0.625rem;font-size: 0.8125rem;gap: 0.375rem}.settings-reset-btn__label{text-overflow: clip}.settings-panel__done{padding-inline: 0.75rem;font-size: 0.875rem}.pill{padding: 0.25rem 0.5rem;font-size: 0.6875rem;min-height: 36px}.pill--gender{gap: 4px}.pill__icon svg{width: 14px;height: 14px}.activity-card__icon svg{width: 22px;height: 22px}.activity-card__label{font-size: 0.625rem}.settings-input{min-height: 36px;font-size: 0.8125rem;padding: 0.375rem 0.5rem}.settings-goal-card{padding: 0.625rem}.settings-tip-card{padding: 0.5rem 0.625rem} .site-footer__inner{padding-inline: 0.75rem}} @media (max-width: 640px){ .hero__converter{width: 100%;max-width: 100%} .converter{width: 100%;max-width: 100%} .converter-controls{width: 100%} .converter__stride-bar{flex-direction: row;flex-wrap: nowrap;align-items: center;gap: 0.5rem}.converter__stride-info{flex: 1 1 auto;min-width: 0}.converter__adjust-btn{flex: 0 0 auto;width: auto;margin-left: auto} .pill-group--gender{display: flex;gap: 0.5rem;width: 100%}.pill-group--gender .pill{flex: 1;justify-content: center;text-align: center} .activity-grid{gap: 0.5rem}.activity-card{min-height: 64px;padding: 0.5rem 0.25rem} .settings-input-row{flex-wrap: nowrap;gap: 0.375rem}.settings-input{min-width: 0;flex: 1}.settings-unit{flex-shrink: 0;white-space: nowrap} .settings-goal-card__header{flex-wrap: wrap;gap: 0.5rem}.settings-goal-card__title-group{flex: 1;min-width: 0} .results-dashboard--row-1{grid-template-columns: 1fr 1fr}.results-dashboard--row-2{grid-template-columns: 1fr}.results-dashboard--row-3{grid-template-columns: 1fr} .results-panel__compare-grid{font-size: 0.75rem}.results-panel__compare-header span,.results-panel__compare-row span{padding: 0.375rem 0.25rem} .share__action-buttons{flex-wrap: wrap;gap: 0.5rem}.share__buttons{gap: 0.5rem} .progress-visualizer__goals{font-size: 0.625rem;gap: 0;justify-content: space-between}.progress-visualizer__landmark{padding: 0.5rem 0;font-size: 0.8125rem} .content-sections h2{font-size: 1.25rem;line-height: 1.3}.content-sections p,.content-sections li{font-size: 0.9375rem;line-height: 1.6} .faq-section__toggle{padding: 0.875rem 0;min-height: 48px} .internal-links__grid{grid-template-columns: 1fr;gap: 0.625rem}.internal-links__card-link{padding: 0.875rem 1rem} .hero__embed-teaser{font-size: 0.6875rem;padding: 0.375rem 0.75rem} .scroll-hint{font-size: 0.6875rem;padding: 0.375rem 0.875rem}} @media (min-width: 481px) and (max-width: 640px){.results-dashboard--row-1{grid-template-columns: 1fr 1fr}.internal-links__grid{grid-template-columns: 1fr 1fr}} @media (max-width: 640px){ .hero__settings{top: auto;bottom: 0;left: 0;right: 0;width: 100%;max-width: 100%;height: auto; max-height: 88vh;max-height: 88dvh;transform: translateY(100%);border-radius: 1.25rem 1.25rem 0 0;overflow: hidden}.hero__settings[hidden]{transform: translateY(100%)}.hero__settings--open{transform: translateY(0)} .settings-panel{height: auto;max-height: 88vh;max-height: 88dvh;border-radius: 1.25rem 1.25rem 0 0;border-left: none;border-top: 1px solid rgba(255,255,255,0.08)}.settings-panel__body{flex: 1 1 auto;min-height: 0;max-height: none;overflow-y: auto;-webkit-overflow-scrolling: touch} .settings-panel::before{content: none} .settings-panel__footer{flex-shrink: 0;border-top: 1px solid rgba(255,255,255,0.06);gap: 0.5rem;padding: 0.55rem 0.9rem calc(0.55rem + env(safe-area-inset-bottom,0px))}.settings-panel__done,.settings-reset-btn{min-height: 46px;padding: 0.55rem 0.95rem;font-size: 0.875rem}} @media (max-height: 500px) and (orientation: landscape){.hero__inner{padding-top: 4rem;padding-bottom: 1rem;min-height: auto}.hero__how-it-works{display: none}.hero__settings{max-height: 100vh}.settings-panel__body{max-height: calc(100vh - 120px)}} @media (max-width: 768px){.hero__inner--sub{padding-top: 4.5rem;padding-bottom: 1.5rem;gap: 1.25rem}.hero__title--sub{font-size: 1.5rem;line-height: 1.2;text-align: center}.hero--sub .hero__subtitle{font-size: 0.8125rem;text-align: center;max-width: 90%;margin-inline: auto}.hero--sub .hero__converter{width: 100%} .hero__content .stkx-funnel__inner{max-width: none;margin-inline: auto;flex-wrap: wrap;justify-content: center;text-align: center}} @media (max-width: 640px){body.stk-drawer-open{overflow: hidden;touch-action: none}} @media (max-width: 640px){.converter__treadmill-hint{font-size: 0.6875rem;padding: 0.375rem 0.625rem}} @media (max-width: 480px){.settings-locked-pill{font-size: 0.5625rem;padding: 1px 6px}.settings-locked-pill svg{width: 8px;height: 8px}} @media (max-width: 1023px){.site-header{position: absolute}}@media (min-width: 1024px){.site-header{position: fixed}}