.main{
    display:flex;
    justify-content:space-between;
    align-items:center;

    gap:80px;

    margin-top:40px;
}

.main-left{
    flex:1;
    max-width:600px;
}

.main-right{
    flex:0 0 420px;
}

.main-left h1{
    font-family:"Cormorant Garamond", serif;

    font-size:100px;
    line-height:1.05;

    color: white;

    margin-bottom:40px;
 
    
}

.main-left h2{
    font-family:"Cormorant Garamond", serif;

    font-size:68px;
    line-height:1.05;

    color:#1F3A5F;

    margin-bottom:28px;
}

.main-left span{
    color: white;
    
}

.main-left p{
    font-family: "Cormorant Garamond";

    font-size:30px;
    line-height:1.6;
    font-style: italic;

    color:#1F3A5F;

}

.main-left h1,
.main-left h2,
.main-left > p,
.main-right {
    opacity: 0;
    animation: dropIn 0.8s cubic-bezier(.22, 1.2, .36, 1) forwards;
}

.main-left h1 {
    animation-delay: 0s;
}

.main-left h2 {
    animation-delay: 0.15s;
}

.main-left > p {
    animation-delay: 0.3s;
}

.main-right {
    animation-delay: 0.45s;
}

@keyframes dropIn {
    from {
        opacity: 0;
        transform: translateY(-80px);
    }

    70% {
        opacity: 1;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.result-card{
    background:white;

    border-radius:24px;

    padding:36px;

    width : 420px;

    min-height: 620px;

    box-shadow:0 15px 40px rgba(0,0,0,.15);

    transition : 0.35s;
}

.result-card:hover{
    
    transform: translate(-12px, -12px) scale(1.02);

    box-shadow:
    0 30px 50px rgba(0,0,0,0.35);
 
    transition : 0.3s;
}

.card-header{
    margin-bottom : 24px;
}

.faculty{
    font-size:14px;

    color:#7b7b7b;

    font-style:italic;
}

.divider{

    height:1px;

    background:#ececec;

    margin:18px 0;

}

.score{

    display:flex;

    justify-content:space-between;

    align-items:center;

}

.score h2{

    font-size:31px;

    color:#1F3A5F;

}

.score span{

    font-size:28px;

    color:#0c9b48;

    font-weight:bold;

}

.answers-container{
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.question{
    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:12px 18px;

    border:1.5px solid #ece2d5;
    border-radius:18px;
}

.question-number{
    font-family:"Roboto", sans-serif;
    font-size:14px;
    color:#555;
}

.answer{
    width:28px;
    height:28px;

    display:flex;
    justify-content:center;
    align-items:center;

    border-radius:50%;

    font-family:"Roboto", sans-serif;
    font-size:15px;
    font-weight:700;
}

.correct{
    background:#dff4df;
    color:#0a8f3d;
}

.wrong{
    background:#ffe1e1;
    color:#d93025;
}

.result{
    margin-top:auto;

    display:flex;
    justify-content:center;
    align-items:center;

    height:42px;

    border:1px solid #1f9d42;
    border-radius:22px;

    background:#e9f8e8;

    font-family:"Cormorant Garamond", serif;
    font-size:20px;
    font-style:italic;
    color:#0d6d2c;
}

.main-left strong{
    color:#D4A24C;
    font-weight:600;
}

.test-left{
    height:400px;
    background:red;
}

.test-right{
    height:500px;
    background:blue;
}