:root {
    --brand-primary: #d7263d;
    --brand-accent: #8b5e3c;
    --brand-dark: #111827;
    --surface: #f8f9fb;
}

body {
    font-family: "Inter", "Segoe UI", sans-serif;
    background: radial-gradient(circle at 12% 10%, #ffe8eb, #f8f9fb 42%), radial-gradient(circle at 88% 5%, #f4ece4, transparent 35%);
}

.portal-header {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
}

.logo {
    width: 64px;
    height: 64px;
    object-fit: contain;
}

.banner-wrap {
    aspect-ratio: 1024 / 400;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    background: #dbeafe;
}

.banner-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.form-card {
    max-width: 860px;
    border: none;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.form-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12);
}

.form-control,
.form-select {
    border-radius: 10px;
    border: 1px solid #dbe4f6;
    transition: all 0.2s ease;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--brand-primary);
    box-shadow: 0 0 0 0.25rem rgba(215, 38, 61, 0.15);
}

.progress {
    height: 10px;
    background: #e2e8f0;
    border-radius: 999px;
}

.progress-bar {
    background: linear-gradient(90deg, var(--brand-primary), var(--brand-accent));
}

.video-section iframe {
    border: 0;
}

.tollfree-section {
    background: linear-gradient(90deg, #fff1f3, #f6efe8);
    border: 1px solid #f2c2c9;
}

.btn-primary {
    background: linear-gradient(90deg, var(--brand-primary), var(--brand-accent));
    border: none;
    border-radius: 10px;
    padding: 0.75rem 1rem;
    font-weight: 600;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(215, 38, 61, 0.30);
}

.footer-area {
    background: #15161f;
}

.footer-area a {
    color: #93c5fd;
    text-decoration: none;
}

.footer-area a:hover {
    text-decoration: underline;
}

@media (max-width: 575px) {
    .logo {
        width: 48px;
        height: 48px;
    }
}


.banner-section{
width:100%;
overflow:hidden;
}

.banner-full{
width:100%;
height:420px;
object-fit:cover;
display:block;
}

/* Tablet */
@media (max-width:992px){
.banner-full{
height:320px;
}
}

/* Mobile */
@media (max-width:576px){
.banner-full{
height:220px;
}
}