/*
=========================================
Progres Store
Main Stylesheet
=========================================
*/

/*======================================
ROOT
======================================*/

:root{

    --primary:#0B5ED7;

    --primary-dark:#084298;

    --dark:#0A2540;

    --text:#4B5563;

    --bg:#F8FAFC;

    --white:#ffffff;

    --border:#E5E7EB;

    --success:#22C55E;

    --danger:#FF4D4F;

    --radius:18px;

    --transition:.30s ease;

}


/*======================================
RESET
======================================*/

*{

    margin:0;

    padding:0;

    box-sizing:border-box;

}

html{

    scroll-behavior:smooth;

}

body{

    font-family:'Inter',sans-serif;

    background:var(--bg);

    color:var(--dark);

    line-height:1.7;

    font-size:16px;

}

img{

    max-width:100%;

    display:block;

}

a{

    color:inherit;

    text-decoration:none;

}

ul{

    list-style:none;

}

button{

    font:inherit;

}


/*======================================
CONTAINER
======================================*/

.container{

    width:min(1200px,92%);

    margin:auto;

}


/*======================================
SECTION
======================================*/

section{

    padding:100px 0;

}

/*======================================
BUTTON
======================================*/

.btn{
    
    transform:translateY(0);

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:10px;

    padding:16px 34px;

    border-radius:14px;

    transition:var(--transition);

    font-weight:600;

}

.btn-primary{

    background:var(--primary);

    color:#fff;

}

.btn-primary:hover{

    background:var(--primary-dark);

    transform:translateY(-3px);

    box-shadow:

        0 18px 35px rgba(11,94,215,.25);

}

.btn-outline{

    border:2px solid var(--border);

    background:#fff;

}

.btn-outline:hover{
    
    transform:translateY(-3px);

    box-shadow:

    0 10px 20px rgba(0,0,0,.08);

    border-color:var(--primary);

}

/*======================================
FOOTER
======================================*/

.site-footer{

    padding:35px 0;

    border-top:1px solid var(--border);

    background:#fff;

}

.site-footer p{

    margin:0;

    text-align:center;

    color:var(--text);

    font-size:15px;

}


/*======================================
RESPONSIVE
======================================*/

@media(max-width:768px){

    section{

        padding:70px 0;

    }

    h1{

        font-size:42px;

    }

    h2{

        font-size:34px;

    }

}

@media(max-width:992px){
    
    .woocommerce-MyAccount-navigation{

    float:none;

    width:100%;

    margin-bottom:30px;

}

.woocommerce-MyAccount-content{

    float:none;

    width:100%;

    }

}