/* FOOTER STRIPE */
.footerStripe{
position:fixed;
bottom:0;
left:0;
width:100%;
max-width:430px;
height:20px;
background:#ff8a00;
color:#1c3a73;
font-size:10px;
display:flex;
align-items:center;
justify-content:center;
}


body{
margin:0;
background:#efefef;
font-family:Arial;
display:flex;
justify-content:center;
}

.mobile{
width:100%;
max-width:420px;
padding:10px;
}

/* HEADER */

.header{
background:linear-gradient(90deg,#163d8f,#2f6edb);
border-radius:18px;
padding:18px;
display:flex;
align-items:center;
gap:12px;
color:white;
}

.logo{
width:55px;
height:55px;
background:#ff9a2b;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-size:24px;
overflow: hidden;

}
.logo img{ object-fit: contain; width: 100%;height: 100%; }
.title{
font-size:26px;
font-weight:bold;
}

.title span{
color:#ffa640;
}
/* CARD */

.card{
border-radius:15px;
overflow:hidden;
margin: 10% auto;
box-shadow:0 6px 14px rgba(0,0,0,0.15);
text-decoration:none;
display:block;
}

/* TOP IMAGE AREA */

.card-top{
background:linear-gradient(90deg,#163d8f,#2f6edb);
color:white;
display:flex;
align-items:center;
padding:10px;

}

.card-top img{
width:110px;
}

.card-title{
font-size:30px;
font-weight:bold;
line-height:1.1;
}

/* ORANGE ACTION BAR */

.card-bottom{
background:#ff9800;
color:white;
text-align:center;
font-size:26px;
font-weight:bold;
padding:5px;
}
.top-header{
    width: 100%;
    height: 15%;
    margin: 5px auto;
    border-radius: 15px;
    overflow: hidden;
    margin-bottom: 10%;
}
.top-header img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}