body {
    background: linear-gradient(to bottom, rgba(247,237,235,1) 0%,rgba(247,237,235,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    min-height: 100vh; /* পুরো স্ক্রিনের উচ্চতা নেবে */
    display: flex;
    flex-direction: column;
}
.fbgs {
    background: linear-gradient(to bottom, rgba(247,237,235,1) 0%,rgba(247,237,235,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
header, footer {
    background: linear-gradient(135deg, #1e88e5, #0d47a1);
    color: #fff;
    padding: 10px;
    text-align: center;
}

footer {
    margin-top: auto; /* সবসময় নিচে ঠেলে দেবে */

}
.step-indicator-wrapper {
    overflow-x: auto;
    white-space: nowrap;
    margin-bottom: 10px;
}

.step-indicator {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    margin-bottom: 20px;
    min-width: 800px;
    position: relative;
}

/* একটানা লাইন (exact center fix) */
.step-indicator::before {
    content: '';
    position: absolute;
    top: calc(30% - 1.5px);  /* circle এর মাঝ বরাবর */
    left: 0;
    right: 0;
    height: 3px;
    background: #444;
    z-index: 0;
}

.step-indicator li {
    position: relative;
    text-align: center;
    flex: 1;
    margin: 0;
}

.step-indicator .step {
    display: inline-block;
    background: #5a3d1f;
    color: #fff;
    font-weight: bold;
    border-radius: 50%;
    position: relative;
    z-index: 1;

    /* Responsive size: ছোট স্ক্রিনে ছোট, বড় স্ক্রিনে বড় */
    width: clamp(35px, 2vw, 60px);
    height: clamp(35px, 2vw, 60px);
    line-height: clamp(35px, 2vw, 60px);
    font-size: clamp(14px, 2vw, 22px);
}

.step-indicator .label {
    display: block;
    margin-top: 8px;
    white-space: normal;
    font-weight: 600;

    /* Responsive font size */
    font-size: clamp(12px, 1.5vw, 20px);
}
.step-indicator li.active .step {
    background: #b30000;
}

.step-indicator li.active::after {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    border-left: clamp(12px, 2vw, 25px) solid transparent;
    border-right: clamp(12px, 2vw, 25px) solid transparent;
    border-top: clamp(20px, 3vw, 40px) solid orange;
    z-index: -1;
}
.form-step {
    display: none;
}
.form-step.active {
    display: block;
}

.hideX9uK {
    display: none !important;
}
.flexX9uK {
    display: flex !important;
}
.blockX9uK {
    display: block !important;
}

#cropImage{
    max-width: 100%;
}

.st_photo {
    max-width: 120px;
    max-height: 150px;
}