@font-face {
    font-family: 'HelveticandRegular';
    src: url('fonts/HelveticaNowDisplay-Regular.woff2') format('woff2'),
    url('fonts/HelveticaNowDisplay-Regular.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'HelveticandBold';
    src: url('fonts/HelveticaNowDisplay-Bold.woff2') format('woff2'),
    url('fonts/HelveticaNowDisplay-Bold.woff') format('woff');
    font-display: swap;
}
@font-face {
    font-family: 'HelveticandBlack';
    src: url('fonts/HelveticaNowDisplay-Black.woff2') format('woff2'),
    url('fonts/HelveticaNowDisplay-Black.woff') format('woff');
    font-display: swap;
}

:root{--cl-action: #FFCC02;--cl-sy: #313131;--cl-dk: #000;--cl-md: #EFEFEF;--cl-lt: #ffffff;}
html{position: relative;height: inherit;min-height: 100%;}
body {position: absolute;display: block;height: 100%;min-height: 100%;width: 100%;min-width: 330px;background: var(--cl-dk);padding: 0;margin: 0;}

*{box-sizing: border-box;}
h1, h2, h3, h4, p, span, label, a, button, input, select, textarea, li, *{font-family: 'HelveticandRegular', sans-serif;font-style: normal;font-weight: 400;text-decoration: none;margin: 0;padding: 0;letter-spacing: 0;}
h1, h2, h3, h4, p, span, label, a, button, input, select, textarea, li{color: var(--cl-lt);font-size: 25px;line-height: 30px;}
*::placeholder{font-family: 'HelveticandRegular', sans-serif;font-style: normal;color: var(--cl-dk);margin: 0;font-weight: 400;}
::-webkit-scrollbar{display: block;width: 10px;}
::-webkit-scrollbar-track{background: var(--cl-md);}
::-webkit-scrollbar-thumb{background: var(--cl-action);}
::-webkit-scrollbar-thumb:hover{background: var(--cl-action);}

*.font-sbold, .font-sbold *{font-family: 'HelveticandBold', sans-serif;}
*.font-black, .font-black *{font-family: 'HelveticandBlack', sans-serif;}
h1 b, h2 b,p b,*.font-bold, .font-bold *{font-family: 'HelveticandBold', sans-serif;}
.marked{display: inline-block;background: var(--cl-action);font-family: 'HelveticandBold', serif;color: var(--cl-sy);padding: 0 8px 4px;border-radius: 10px}

.font-sm,.font-sm *{font-size: 22px;line-height: 30px;}
.font-lg, .font-lg *{font-size: 50px;line-height: 55px;}
.font-giant, .font-giant *{font-size: 65px;line-height: 70px;}
.font-up {text-transform: uppercase}
.line-height-1{line-height: 1}
.line-height-2{line-height: 2}
.underline{text-decoration: underline}

.cl-action{color: var(--cl-action)}
.cl-lt{color: var(--cl-lt)}
.cl-dk{color: var(--cl-dk)}
.cl-sy{color: var(--cl-sy)}

.mt-1{margin-top: 10px;}.mb-1{margin-bottom: 10px;}
.mt-2{margin-top: 20px;}.mb-2{margin-bottom: 20px;}
.mt-3{margin-top: 30px;}.mb-3{margin-bottom: 30px;}
.mt-4{margin-top: 40px;}.mb-4{margin-bottom: 40px;}
.mt-5{margin-top: 50px;}.mb-5{margin-bottom: 50px;}
.mt-6{margin-top: 60px;}.mb-6{margin-bottom: 60px;}
.mt-8{margin-top: 80px;}.mb-8{margin-bottom: 80px;}

.flex, .flex-desk, .flex-pad{display: flex;align-items: center;justify-content: space-between;}
.flex.wrap{flex-wrap: wrap;}
.flex.gap{gap: 20px;}
.flex.top{align-items: flex-start;}
.flex.start{justify-content: flex-start;}
.txt-center, .txt-center * {text-align: center}
.text-line-desktop{display: block;}
.container{margin: 0 auto;max-width: 1200px;}

.btn {font-family: 'HelveticandBold', sans-serif;display: flex;align-items: center;width: fit-content;background-color: var(--cl-action);color: var(--cl-dk);text-align: center;cursor: pointer;padding: 12px 16px 14px;margin: 0 auto;transition: all .2s ease;border-radius: 32px;font-size: 20px;}
.btn.special{background: none;border: 3px solid var(--cl-sy)}

.btn.mob{display: none;}
.btn:hover{box-shadow: 0 3px 4px 2px rgba(0, 0, 0, 0.2);}

ul{padding: 16px 0 32px 32px;}
li{margin: 0 0 8px}

.hero-section{position: relative;padding: 100px 0 200px;}
.hero-section::after{content: '';position: absolute;top: 825px;right: calc(50% - 108px);display: block;width: 1136px;height: 1022px;background: url(img/tire-mark-one.avif) no-repeat 0 0 / auto;z-index: -1;}
.hero-section .container{position: relative}
.hero-section a.logo{display: block;width: 100%;max-width: 369px;background: url(svg/logo.svg) 0 50% no-repeat;background-size: contain;aspect-ratio: 369 / 94;margin: 0 0 80px;}
.hero-section .icon-box{position: absolute;display: flex;align-items: center;justify-content: center;top: 0;right: 0;z-index: 99;}
.hero-section .icon-box a{display: block;height: 38px;width: 38px;background: no-repeat 50% / contain;margin-left: 8px}
.hero-section .icon-box a:nth-child(1){background-image: url("svg/instagram.svg")}
.hero-section .icon-box a:nth-child(2){background-image: url("svg/facebook.svg")}
.hero-section h1{max-width: 850px;margin-bottom: 80px;}
.hero-section .content .txt-box{max-width: min(440px, 41%);margin-left:0}
.hero-section .content::after{content: '';display: block;width: 100%;max-width: min(832px, 58%);height: 636px;background: url("img/hero.avif") no-repeat 50% / cover;border-radius: 30px;}
.hero-section .btn{margin-left: 0}
.hero-section p.font-sm{margin-top: 40px;max-width: 230px;}
.hero-section p.font-sm::before{content: '';display: block;width: 100%;max-width: 48px;height: 48px;background: url("svg/arrow-right.svg") no-repeat 50% / contain;border-radius: 30px;margin-right: 10px;}

.icon-section{position: relative;padding: 40px 0}
.icon-section h2 {max-width: 740px;text-align: center;margin: 0 auto 40px;}
.icon-section p {text-align: center;margin: 0 auto 50px;}
.icon-section span{width: 100%;max-width: 166px;min-height: 229px;}
.icon-section span::before{content: '';display: block;width: 69px;height: 75px;background: no-repeat 50% / contain;margin-bottom: 30px}
.icon-section div span:nth-child(1)::before{background-image: url("svg/icon-1.svg")}
.icon-section div span:nth-child(2)::before{background-image: url("svg/icon-2.svg")}
.icon-section div span:nth-child(3)::before{background-image: url("svg/icon-3.svg")}
.icon-section div span:nth-child(4)::before{background-image: url("svg/icon-4.svg")}
.icon-section div span:nth-child(5)::before{background-image: url("svg/icon-5.svg")}

.video-section{border-radius: 20px}
.video-section iframe{display: block;width: 100%;max-width: 1190px;aspect-ratio: 16/9;border-radius: 20px;margin: 40px auto 80px;}

.solution-section{max-width: 1190px;padding: 200px 0 80px;margin: 0 auto;}
.solution-section::before{content: '';display: block;width: 100%;max-width: min(596px, 48%);height: 638px;background: url(img/solution.avif) no-repeat 0 / cover;margin-bottom: 20px;border-radius: 30px;}
.solution-section .txt-box{width: 100%;max-width: min(530px, 49%);}
.solution-section .txt-box span{margin-top: 20px;}
.solution-section .txt-box span::before{content: '';display: block;width: 100%;max-width: 24px;height: 24px;background: url("svg/arrow-right.svg") no-repeat 50% / contain;border-radius: 30px;margin-right: 10px;}
.solution-section .txt-box .btn{margin-left: 0}

.model-section{background: var(--cl-md);padding: 100px 0}
.model-section *{color: var(--cl-dk)}
.model-section h2 span{display: block;}

.model-section .content{position: relative;min-height: 500px;max-width: 1200px;margin: 80px auto}
.model-section .content div{position: absolute;display: flex;flex-direction: column;justify-content: center;background: var(--cl-action);padding: 80px 48px;border-radius: 30px;box-shadow: 11px 11px 14px 0 rgba(0,0,0,0.11);}
.model-section .content div h3{font-size: 30px;margin-bottom: 30px;}
.model-section .content div p{position: relative;padding-left: 32px;}
.model-section .content div p::before{content: '';position: absolute;left: 0;top: 6px;display: block;width: 100%;max-width: 20px;height: 20px;background: url("svg/arrow-right.svg") no-repeat 50% / contain;border-radius: 30px;margin-right: 10px;}
.model-section .content div:nth-child(1){max-width: 460px;top: 40px;left: 10px;}
.model-section .content div:nth-child(1) p::before{background-image: url("svg/arrow-right-lt.svg")}
.model-section .content div:nth-child(2){max-width: 530px;top: 260px;left: 135px;background: var(--cl-lt)}
.model-section .content div:nth-child(3){max-width: min(520px, 50%);top: 0;left: calc(50% - 80px);background: var(--cl-sy)}
.model-section .content div:nth-child(3) *{color: var(--cl-lt)}
.model-section .content div:nth-child(4){max-width: 500px;top: 280px;left: calc(50% + 90px);padding: 56px 56px 26px;}

.next-section{position: relative;padding: 80px 0;margin: 0 auto}
.next-section::before{content: '';position: absolute;top: 0;left: 50%;display: block;width: 1454px;max-width: 50%;height: 820px;background: url(img/tire-mark-two.avif) no-repeat 0 100% / auto;z-index: -1}
.next-section .container::before{content: '';display: block;width: 100%;max-width: min(596px, 48%);height: 638px;background: url(img/form.avif) no-repeat 50% / cover;margin-bottom: 20px;border-radius: 30px;}
.next-section .txt-box{width: 100%;max-width: min(530px, 49%);}
.next-section li::marker {color: var(--cl-action);}
.next-section a{margin-left: 0}

.form-section{padding: 60px 0 80px;margin: 0 auto}
.form-section .txt-box{max-width: min(620px, 50%);margin: 0 0 100px;}
.form-section a{margin-left: 0}
#rdstation-bricks-embeddable-form-bricks-component-S63TgKpc1RKjnyAy2L_lng .bricks--section{border-radius: 24px;overflow: hidden}

footer .container{border-top: 3px solid #383838;}
footer a.logo{display: block;width: 100%;max-width: 369px;background: url(svg/logo.svg) 0 50% no-repeat;background-size: contain;aspect-ratio: 369 / 94;margin: 40px auto 64px;}

@media (max-width: 1500px) {
    .business-section .content{margin-right: 650px}
}
@media (max-width: 1240px) {
    * .container{margin: 0 20px;}
}

@media (max-width: 990px) {
    *.flex-desk{display: block;}

    .hero-section::after{top: calc(100% - 323px);right: 0;display: block;width: 100%;max-width: 50%;height: 323px;background: url(img/tire-mark-one-mob.avif) no-repeat 0 100% / cover;}

    .icon-section div{justify-content: center;}
    .icon-section span{display: flex;justify-content: flex-start;width: 100%;max-width: 280px;min-height: 100px;}
    .icon-section span::before{width: 100%;max-width: 70px;margin-bottom: 0;margin-right: 20px;}

    .solution-section{max-width: 600px;}
    .solution-section::before{content: none;}
    .solution-section .txt-box{max-width: 100%;}
    .solution-section .txt-box div{display: block;width: 100%;max-width: 596px;aspect-ratio: 596/638;background: url(img/solution.avif) no-repeat 0 / cover;margin-bottom: 20px;border-radius: 15px;}
    .solution-section .txt-box .btn {width: 100%;justify-content: center;}

    html body .model-section .container .content div{position: initial;max-width: 600px;margin: 0 auto 32px;padding: 32px 40px;}
    .model-section .content div h3{margin-bottom: 20px;}

    .form-section .container{flex-direction: column;}
    .form-section .txt-box{max-width: 330px;margin: 0 auto 80px;}
    .form-section .form{max-width: 500px;margin: 0 auto}
}
@media (max-width: 768px) {
    h1, h2, h3, h4, p, span, label, a, button, input, select, textarea, li{font-size: 16px;line-height: 18px;}

    .font-sm,.font-sm *{font-size: 16px;line-height: 18px;}
    .font-md {font-size: 24px;line-height: 30px;}
    .font-lg, .font-lg *{font-size: 25px;line-height: 26px;}
    .font-giant, .font-giant *{font-size: 30px;line-height: 35px;}
    .btn{font-size: 16px;line-height: 30px;}

    .btn.desktop{display: none}
    .btn.mob{display: block;}

    .hero-section{padding: 10px 0 40px;}
    .hero-section a.logo{height: 32px;}
    .hero-section .icon-box a{height: 32px;width: 32px;border-radius: 50px;background-size: cover}
    .hero-section h1{margin-bottom: 30px;}
    .hero-section .content{flex-wrap: wrap}
    .hero-section .content .txt-box{max-width: 100%;}
    .hero-section .content p.flex{max-width: 250px;margin: 30px 0}
    .hero-section .content p.flex::before{width: 24px;height: 24px;}
    .hero-section .content::after{content: none;}
    .hero-section .txt-box div::before{content: '';display: block;width: calc(100% + 40px);max-width: calc(100% + 40px);height: auto;aspect-ratio: 208 / 159;background: url("img/hero.avif") no-repeat 50% / cover;margin: 30px -20px 0;}

    .icon-section h2,
    .icon-section p:nth-child(2){text-align: center}
    .icon-section span{display: flex;justify-content: flex-start;align-items: center;width: 100%;max-width: 212px;min-height: 80px;}
    .icon-section span::before{width: 100%;max-width: 40px;margin-bottom: 0;margin-right: 20px;}

    .model-section .content div h3{font-size: 20px;line-height: 22px;}

    .next-section::before{content: '';position: absolute;top: 0;left: 51%;display: block;width: 600px;max-width: 49%;height: 350px;background: url(img/tire-mark-two-mob.avif) no-repeat 0 100% / auto;z-index: -1}
    .next-section .container::before{content: none;}
    .next-section .txt-box{max-width: 300px;margin: 0 auto}
}
@media (max-width: 520px) {
    .hero-section .container .icon-box a{height: 24px;width: 24px;}

    .form-section .form,
    #rdstation-bricks-embeddable-form-bricks-component-S63TgKpc1RKjnyAy2L_lng,
    #rdstation-bricks-embeddable-form-bricks-component-S63TgKpc1RKjnyAy2L_lng .bricks--component,
    #rdstation-bricks-embeddable-form-bricks-component-S63TgKpc1RKjnyAy2L_lng .bricks--section > div {max-width: 100%;}
}