.tsco-hero{
    width:100%;
    height:calc(100vh - 84px);
    min-height:620px;
    max-height:780px;
    margin-top:44px;
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;
    font-family:'Urbanist',sans-serif;
    background:#08101C;
}

.tsco-hero-media{
    position:absolute;
    inset:0;
    z-index:1;
    display:block;
}

.tsco-hero-media img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center right;
    display:block;
}

.tsco-hero-overlay{
    position:absolute;
    inset:0;
    z-index:2;
    background:rgba(10,14,22,.66);
}

.tsco-hero::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:3;
    background:linear-gradient(90deg,rgba(10,14,22,.92) 0%,rgba(10,14,22,.76) 44%,rgba(10,14,22,.20) 100%);
}

.tsco-hero .container{
    width:min(1440px,100%);
    margin:0 auto;
    padding:0 44px;
    position:relative;
    z-index:4;
}

.tsco-hero-content{
    width:min(700px,100%);
}

.tsco-hero h1{
    margin:0;
    max-width:760px;
    color:#ffffff;
    font-size:clamp(40px,4vw,40px);
    line-height:1.08;
    letter-spacing:-.035em;
    font-weight:600;
}

.tsco-hero h1 span{
    display:block;
    color:#ffffff;
    font-weight:500;
}

.tsco-hero p{
    max-width:660px;
    margin:18px 0 0;
    color:rgba(255,255,255,.86);
    font-size:18px;
    line-height:1.55;
    font-weight:300;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.tsco-hero-actions{
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:28px;
}

.tsco-hero-primary,
.tsco-hero-secondary{
    min-height:52px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:0 24px;
    text-decoration:none;
    font-size:15px;
    line-height:1;
    font-weight:500;
    position:relative;
    overflow:hidden;
    isolation:isolate;
    transition:transform .25s ease,background .25s ease,color .25s ease,border-color .25s ease;
}

.tsco-hero-primary::before,
.tsco-hero-secondary::before{
    content:"";
    position:absolute;
    inset:0;
    transform:translateX(-101%);
    transition:transform .32s ease;
    z-index:-1;
}

.tsco-hero-primary{
    color:#ffffff;
    background:#A63539;
    border:1px solid #A63539;
}

.tsco-hero-primary::before{
    background:#ffffff;
}

.tsco-hero-primary:hover{
    color:#A63539;
    transform:translateY(-3px);
}

.tsco-hero-primary:hover::before,
.tsco-hero-secondary:hover::before{
    transform:translateX(0);
}

.tsco-hero-secondary{
    color:#ffffff;
    background:transparent;
    border:1px solid rgba(255,255,255,.48);
}

.tsco-hero-secondary::before{
    background:#A63539;
}

.tsco-hero-secondary:hover{
    color:#ffffff;
    border-color:#A63539;
    transform:translateY(-3px);
}

.tsco-hero-primary i{
    transition:transform .25s ease;
}

.tsco-hero-primary:hover i{
    transform:translateX(5px);
}

.tsco-hero-points{
    width:min(500px,100%);
    margin-top:30px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    border:1px solid rgba(255,255,255,.22);
    background:rgba(255,255,255,.07);
}

.tsco-hero-points div{
    padding:16px 18px;
    border-right:1px solid rgba(255,255,255,.18);
    position:relative;
    overflow:hidden;
    transition:transform .25s ease,background .25s ease;
}

.tsco-hero-points div:last-child{
    border-right:0;
}

.tsco-hero-points div::before{
    content:"";
    position:absolute;
    inset:0;
    background:#A63539;
    transform:translateY(101%);
    transition:transform .28s ease;
    z-index:-1;
}

.tsco-hero-points div:hover{
    background:rgba(255,255,255,.12);
    transform:translateY(-4px);
}

.tsco-hero-points div:hover::before{
    transform:translateY(0);
}

.tsco-hero-points strong{
    display:block;
    color:#ffffff;
    font-size:26px;
    line-height:1;
    font-weight:600;
    margin-bottom:6px;
}

.tsco-hero-points span{
    display:block;
    color:rgba(255,255,255,.78);
    font-size:13px;
    line-height:1.3;
    font-weight:300;
}

@media(max-width:1120px){
    .tsco-hero{
        height:auto;
        min-height:720px;
        max-height:none;
        margin-top:74px;
        padding:64px 0;
    }

    .tsco-hero .container{
        padding:0 24px;
    }

    .tsco-hero::after{
        background:rgba(10,14,22,.74);
    }
}

@media(max-width:640px){
    .tsco-hero{
        height:calc(100svh - 68px);
        min-height:540px;
        max-height:none;
        margin-top:68px;
        padding:0;
        display:flex;
        align-items:stretch;
        background:#08101C;
    }

    .tsco-hero-media{
        position:absolute;
        inset:0;
        z-index:1;
    }

    .tsco-hero-media img{
        object-fit:cover;
        object-position:center top;
    }

    .tsco-hero-overlay{
        display:block;
        background:rgba(8,16,28,.34);
    }

    .tsco-hero::after{
        display:block;
        background:linear-gradient(
            180deg,
            rgba(8,16,28,.20) 0%,
            rgba(8,16,28,.58) 38%,
            rgba(8,16,28,.94) 100%
        );
    }

    .tsco-hero .container{
        width:100%;
        padding:0 14px 18px;
        display:flex;
        align-items:flex-end;
        position:relative;
        z-index:4;
    }

    .tsco-hero-content{
        width:100%;
        display:flex;
        flex-direction:column;
        align-items:flex-start;
        text-align:left;
    }

    .tsco-hero h1{
        width:100%;
        max-width:360px;
        margin:0;
        font-size:clamp(24px,7vw,31px);
        line-height:1.08;
        letter-spacing:-.03em;
        font-weight:600;
    }

    .tsco-hero h1 span{
        display:block;
        margin-top:3px;
        font-size:clamp(18px,5.3vw,24px);
        line-height:1.15;
        letter-spacing:-.025em;
        font-weight:500;
    }

    .tsco-hero p{
        width:100%;
        max-width:360px;
        margin:12px 0 0;
        font-size:13.5px;
        line-height:1.45;
        -webkit-line-clamp:2;
    }

    .tsco-hero-actions{
        width:100%;
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:8px;
        margin-top:16px;
    }

    .tsco-hero-primary,
    .tsco-hero-secondary{
        width:100%;
        min-height:42px;
        padding:0 8px;
        font-size:12px;
    }

    .tsco-hero-points{
        width:100%;
        margin-top:12px;
        grid-template-columns:repeat(3,1fr);
        background:rgba(255,255,255,.06);
    }

    .tsco-hero-points div{
        padding:9px 5px;
        text-align:center;
        border-right:1px solid rgba(255,255,255,.16);
    }

    .tsco-hero-points strong{
        font-size:20px;
        margin-bottom:4px;
    }

    .tsco-hero-points span{
        font-size:9.7px;
        line-height:1.14;
    }
}

@media(max-width:390px){
    .tsco-hero{
        min-height:510px;
    }

    .tsco-hero h1{
        font-size:24px;
        max-width:330px;
    }

    .tsco-hero h1 span{
        font-size:18px;
    }

    .tsco-hero p{
        font-size:12.5px;
    }

    .tsco-hero-primary,
    .tsco-hero-secondary{
        min-height:40px;
        font-size:11px;
    }

    .tsco-hero-points strong{
        font-size:18px;
    }

    .tsco-hero-points span{
        font-size:9px;
    }
}

@media(max-height:680px) and (max-width:640px){
    .tsco-hero{
        min-height:480px;
    }

    .tsco-hero h1{
        font-size:23px;
    }

    .tsco-hero h1 span{
        font-size:17px;
    }

    .tsco-hero p{
        margin-top:9px;
        font-size:12px;
        line-height:1.35;
    }

    .tsco-hero-actions{
        margin-top:12px;
    }

    .tsco-hero-points{
        margin-top:9px;
    }

    .tsco-hero-points div{
        padding:7px 4px;
    }
}