@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Inter", sans-serif;
}




body{
    font-family: "Inter", sans-serif;
}
:root{
    --primary-color: #00b5ff;
    --primary-dark: #111e4d;
    --primary-light: #243580;
    --secondary-color: #ed193a;
    --secondary-dark: #b01a20;

    --white: #ffffff;
    --gray-50: #f8f9fb;
    --gray-100: #f1f3f7;
    --gray-200: #e2e6ef;
    --gray-600: #5a6478;
    --gray-800: #2d3348;
    --gradient: linear-gradient(105deg, #03A9F4 0%, rgba(17, 30, 77, .78) 50%, rgba(17, 30, 77, .35) 100%);

    --primary-font: "Inter", sans-serif;
}
h1,h2,h3,h4,h5,h6,p{
    margin: 0;
    padding: 0;
}
.section-space{
    padding: 60px 0px;
}
.title-tagline p.text-center {
    display: block;
}
.title-underline.center-line {
    margin: 12px auto 18px;
}

.title-tagline p{
    display: inline-block;
    color: var(--secondary-color);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 6px;
}
h2.section-title{
    font-size: 36px;
    font-weight: 800;
    color: #000;
    line-height: 1.2;
}
h2.section-title span{
    color: var(--secondary-color);
}
.title-underline {
    width: 50px;
    height: 4px;
    background: linear-gradient(90deg, var(--secondary-color), var(--primary-color));
    border-radius: 3px;
    margin: 12px 0px 18px;
}
.section-subtitle {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px;
    font-style: italic;
}


/* Button */
.primary-btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: var(--secondary-color);
    color: #fff;
    font-weight: var(--primary-font);
    font-weight: 700;
    font-size: 14px;
    padding: 14px 28px;
    border-radius: 10px;
    border: 1px solid var(--secondary-color);
    cursor: pointer;
    box-shadow: 0 6px 20px rgba(212, 31, 38, .45);
    transition: background .2s, transform .2s, box-shadow .2s;
    text-decoration: none;
}
.primary-btn:hover {
    background: var(--secondary-dark);
    transform: translateY(-2px);
    box-shadow: 0 12px 30px rgba(212, 31, 38, .5);
    color: #fff;
    text-decoration: none;
}
.primary-btn:focus,
.primary-btn:focus-visible{
    background: var(--secondary-dark);
    box-shadow: 0 12px 30px rgba(212, 31, 38, .5);
    color: #fff;
}

.outline-btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: #ffffff25;
    color: #fff;
    font-weight: var(--primary-font);
    font-weight: 700;
    font-size: 14px;
    padding: 14px 28px;
    border-radius: 10px;
    border: 1px solid #ffffff29;
    cursor: pointer;
    transition: background .2s, transform .2s, box-shadow .2s;
    text-decoration: none;
}
.outline-btn:hover {
    background: #ffffff51;
    transform: translateY(-2px);
    color: #fff;
    text-decoration: none;
}
.outline-btn:focus,
.outline-btn:focus-visible{
    background: #ffffff25;
    color: #fff;
}
.primary-btn img,
.outline-btn img{
    width: 15px;
    height:15px;
    object-fit:contain;
    transition:transform 0.5s;
}
.primary-btn:hover img,
.outline-btn:hover img{
    transform:translateX(3px) scale(1.05);
    transition:transform 0.5s;
}

/* .fade-up.reveal{
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.8s, transform 0.8s;
}
.fade-up.reveal.active{
    opacity: 1;
    transform: translateY(0px);
    transition: opacity 0.8s, transform 0.8s;
}
.fade-right.reveal{
    opacity: 0;
    transform: translateX(-20px);
    transition: opacity 0.8s, transform 0.8s;
}
.fade-right.reveal.active{
    opacity: 1;
    transform: translateX(0px);
    transition: opacity 0.8s, transform 0.8s;
}
.scale-bottom.reveal{
    opacity: 0;
    transform: scale(0);
    transition: opacity 0.8s, transform 0.8s;
    transform-origin: 100% 0%;
}
.scale-bottom.reveal.active{
    opacity: 1;
    transform: scale(1);
    transition: opacity 0.8s, transform 0.8s;
    transform-origin: 100% 0%;
} */


@media (max-width:551px){
    .primary-btn,.outline-btn {
        font-size: 12px;
        padding: 10px 20px;
    }
}