:root {
    --mm-red: #E02D24;
    --mm-red-dark: #b91f19;
    --mm-red-soft: #fff1f0;
    --mm-navy: #0A1628;
    --mm-navy-soft: #1E3358;
    --mm-off: #F7F6F2;
    --mm-text: #2C2C2C;
}

html { scroll-behavior: smooth; }

.mm-referral-page {
    color: var(--mm-text);
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.7;
}

.mm-section { padding: 80px 0; }
.mm-light-bg { background: var(--mm-off); }
.mm-red { color: var(--mm-red) !important; }
.mm-link { color: var(--mm-red); text-decoration: none; }
.mm-link:hover { color: var(--mm-red-dark); }

.mm-section-title {
    color: var(--mm-navy);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.55rem, 3vw, 2rem);
    line-height: 1.25;
    margin-bottom: 1rem;
}

.mm-hero {
    background: linear-gradient(135deg, var(--mm-navy) 0%, var(--mm-navy-soft) 100%);
    color: #fff;
}

.py-lg-6 { padding-top: 5rem; padding-bottom: 5rem; }
.mm-hero h1 { font-family: Georgia, "Times New Roman", serif; color: #fff; }
.mm-hero-desc { color: rgba(255,255,255,.82); }
.mm-eyebrow {
    color: var(--mm-red);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .2em;
    text-transform: uppercase;
}

.mm-hero-image,
.mm-grow-image {
    border-radius: 16px;
    object-fit: cover;
}
.mm-hero-image { height: 420px; box-shadow: 0 20px 60px rgba(0,0,0,.35); }
.mm-grow-image { height: 400px; box-shadow: 0 16px 50px rgba(0,0,0,.12); }

.mm-btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--mm-red);
    --bs-btn-border-color: var(--mm-red);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--mm-red-dark);
    --bs-btn-hover-border-color: var(--mm-red-dark);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--mm-red-dark);
    --bs-btn-active-border-color: var(--mm-red-dark);
    font-weight: 600;
    border-radius: 6px;
}

.mm-btn-primary:disabled {
    opacity: .48;
    cursor: not-allowed;
}

.mm-btn-outline {
    color: var(--mm-red);
    border: 1px solid var(--mm-red);
    background: transparent;
    font-weight: 600;
}
.mm-btn-outline:hover,
.mm-btn-outline:focus {
    color: #fff;
    background: var(--mm-red);
    border-color: var(--mm-red);
}

.mm-info-card,
.mm-step-card {
    border-radius: 12px;
    transition: transform .2s ease, box-shadow .2s ease;
}
.mm-info-card:hover,
.mm-step-card:hover { transform: translateY(-4px); }

.mm-icon-circle,
.mm-step-number {
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--mm-red);
    color: #fff;
    font-size: 1.3rem;
}
.mm-step-number { width: 42px; height: 42px; font-weight: 800; font-size: 1rem; }

.mm-step-card {
    background: #fff;
    border: 1px solid #e8e8e8;
}
.mm-step-highlight {
    color: #fff;
    background: linear-gradient(135deg, var(--mm-navy), var(--mm-navy-soft));
    border-color: transparent;
}
.mm-step-highlight .mm-step-number { background: var(--mm-red); }

.mm-dark-section {
    background: linear-gradient(135deg, var(--mm-navy), var(--mm-navy-soft));
    color: #fff;
}
.mm-example-item {
    padding: 16px 20px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 10px;
    background: rgba(255,255,255,.06);
    color: rgba(255,255,255,.92);
}

.mm-form-heading {
    color: var(--mm-navy);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.3rem;
    padding-bottom: .7rem;
    margin-bottom: 1.25rem;
    border-bottom: 2px solid var(--mm-red);
}

.mm-referral-page .form-control,
.mm-referral-page .form-select {
    min-height: 48px;
    border-radius: 8px;
    border-color: #d9d9d9;
}
.mm-referral-page textarea.form-control { min-height: 115px; }
.mm-referral-page .form-control:focus,
.mm-referral-page .form-check-input:focus {
    border-color: var(--mm-red);
    box-shadow: 0 0 0 .2rem rgba(224,45,36,.14);
}
.mm-referral-page .form-check-input:checked {
    background-color: var(--mm-red);
    border-color: var(--mm-red);
}

.mm-notice {
    padding: 15px 18px;
    border: 1px solid #f3b6b2;
    border-radius: 8px;
    background: var(--mm-red-soft);
    color: #8a1b15;
    font-size: .92rem;
}

#otpHint.is-success { color: #198754; }
#otpHint.is-error { color: #dc3545; }

@media (max-width: 991.98px) {
    .mm-section { padding: 60px 0; }
    .mm-hero-image,
    .mm-grow-image { height: 300px; }
}

@media (max-width: 575.98px) {
    .mm-section { padding: 48px 0; }
    .mm-hero-image,
    .mm-grow-image { height: 260px; }
    .mm-referral-page .input-group { display: block; }
    .mm-referral-page .input-group > .form-control,
    .mm-referral-page .input-group > .btn {
        width: 100%;
        border-radius: 8px !important;
    }
    .mm-referral-page .input-group > .btn { margin-top: 8px; }
}

#referral-form form {
    background: #f7f6f2 !important;
    /* border: none !important; */
    box-shadow: none !important;
}
#sendOtpBtn {
    background: #e02d24;
    color: #fff;
}
#verifyOtpBtn{
    background: #e02d24;
    color: #fff;
}
.mm-btn-primary {
    background: #b91f19 !important;
    color: #fff !important;
}