@import url('https://fonts.googleapis.com/css2?family=Dela+Gothic+One&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Oswald:wght@200..700&display=swap');

:root {
    --bg1: #151828;
    --bg2: #1B1F34;
    --body: #959DCC;
    --brand: #FF69B4 ; 
    --white: #fff;
}

body{
    font-family: "Inter",sans-serif;
    color: var(--body);
    background-color: var(--bg1);
    line-height: 1.8;
}

h1,h2,h3,h4,h5,h6{
    font-family: "Dela Gothic One",sans-serif;
    color: var(--white) !important;
}

img{
    width: 100%;
}

.navbar{
    background: linear-gradient(to bottom, #1B1F34, rgba(27, 31, 52, 0.2));
}

.book{
    background-color: var(--brand);
    border-color: var(--brand);
    color: var(--white);
}

.home{
    background-image: linear-gradient(to right,rgba(27, 31, 52, 0.8), rgba(27, 31, 52, 0.8)),url(./imgs/Screenshot\ 2026-01-31\ 211233.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
.started{
    border-color: var(--brand) ; 
    color: var(--brand);
}

.icon{
    color: var(--brand);
}

.review{
    background-color: var(--bg2);
}

.tweet{
    color: var(--brand);
}
.tweet:hover{
    opacity: 0.7;
    transform: scale(1.2);
}

.app{
    background-image:linear-gradient(to right,rgba(27, 31, 52, 0.8), rgba(27, 31, 52, 0.8)), url(./imgs/app.jpg);
    background-size: cover;
    position: center;
    min-height: 100vh;
    display: flex;
    align-items: center;
}

form{
    background-color: var(--bg2);
    padding: 3em;
}

.submit{
    background-color: var(--brand);
    color: var(--bg1);
    border-color: #FF69B4;
}
.submit:hover{
    background-color: var(--bg1);
    border-color: var(--bg1);
    color: var(--brand);
}

@media (max-width: 991px) {
    .navbar-collapse {
        background:var(--bg1);
        padding: 20px;
        margin-top: 10px;
        border-radius: 5px;
        backdrop-filter: blur(10px); /* Optional: adds blur effect */
    }
}