:root {
     --green-dark: #1a4731;
     --green-mid: #1d5e3e;
     --green-btn: #1e6b46;
     --green-light: #e8f5ee;
     --gold: #f5a623;
     --gold-light: #fef3dc;
     --text: #1a1a1a;
     --muted: #555;
     --white: #ffffff;
     --border: #d4e8da;
     --bg-section: #f7fbf8;
 }

 * {
     box-sizing: border-box;
     margin: 0;
     padding: 0;
 }

 body {
     font-family: 'Open Sans', sans-serif;
     color: var(--text);
     background: #fff;
     line-height: 1.6;
 }

 h1,
 h2,
 h3,
 h4 {
     font-family: 'Montserrat', sans-serif;
 }

 /* ─── NAV ─── */
 nav {
     background: #fff;
     padding: 8px 5%;
     display: flex;
     align-items: center;
     justify-content: space-between;
     border-bottom: 1px solid var(--border);
     position: sticky;
     top: 0;
     z-index: 100;
     box-shadow: 0 1px 6px rgba(0, 0, 0, .06);
 }

  .mompreneur-main{
	background: url(../images/mompreneur.png);
    background-repeat: no-repeat;
    background-size: 10%;
    background-position: 15%;	
  }
 .logo {
     display: flex;
     align-items: center;
     gap: 10px;
 }

 .logo-icon {
     width: 44px;
     height: 44px;
 }

 .logo-text {
     display: flex;
     flex-direction: column;
     line-height: 1.1;
 }

 .logo-text strong {
     font-family: 'Montserrat', sans-serif;
     font-size: 18px;
     font-weight: 900;
     color: var(--green-dark);
     letter-spacing: .5px;
 }

 .logo-text span {
	font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: bold;
 }

 .nav-cta {
     background: var(--green-btn);
     color: #fff;
     padding: 10px 22px;
     border-radius: 30px;
     font-weight: 700;
     font-size: 15px;
     text-decoration: none;
     display: flex;
     align-items: center;
     gap: 6px;
 }

 .features-main {
     padding: 0 5% 40px;
     position: absolute;
     right: 0;
     bottom: 0;
 }

 /* ─── HERO ─── */
 .hero {
     background: #FDFDFA;
     padding: 60px 5%;
     display: flex;
     align-items: center;
     gap: 40px;
     max-width: 100%;
     margin: 0 auto;
     background-image: url(../images/women.png);
     position: relative;
     background-size: contain;
     background-repeat: no-repeat;
     background-position: bottom right;
 }

 .hero-left {
     flex: 1;
     min-width: 0;
 }

 .badge-row {
     display: flex;
     gap: 10px;
     margin-bottom: 18px;
     flex-wrap: wrap;
 }

 .badge {
     display: inline-flex;
     align-items: center;
     gap: 6px;
     padding: 6px 14px;
     border-radius: 20px;
     font-weight: 700;
     letter-spacing: .4px;
 }

 .badge-gold {
     background: var(--gold);
     color: #fff;
 }

 .badge-outline {
     background: #fff;
     border: 1.5px solid var(--green-dark);
     color: var(--green-dark);
 }

 .hero h1 {
     font-size: clamp(32px, 5vw, 52px);
     font-weight: 900;
     line-height: 1.1;
     color: var(--green-dark);
     margin-bottom: 16px;
 }

 .hero p {
     font-size: 17px;
     color: var(--muted);
     margin-bottom: 28px;
     max-width: 640px;
 }

 .positions-pill {
     background: var(--green-dark);
     color: #fff;
     display: inline-flex;
     align-items: center;
     gap: 10px;
     padding: 12px 22px;
     border-radius: 10px;
     font-weight: 800;
     font-size: 15px;
     margin-bottom: 16px;
     letter-spacing: .3px;
 }

 .positions-pill span {
     color: var(--gold);
 }

 .wa-btn {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     background: var(--green-btn);
     color: #fff;
     padding: 15px 28px;
     border-radius: 10px;
     font-size: 16px;
     font-weight: 800;
     text-decoration: none;
     margin-bottom: 12px;
     transition: background .2s;
 }

 .wa-btn:hover {
     background: #155233;
 }

 .no-fee {
     font-size: 12px;
    color: var(--muted);
    display: flex;
    align-items: center;
    gap: 5px;
    font-weight: bold;
 }

 .hero-right {
     flex: 0 0 420px;
     max-width: 420px;
 }

 .hero-img-wrap {
     position: relative;
     border-radius: 20px;
     overflow: hidden;
     background: var(--green-light);
 }

 .hero-img-wrap img {
     width: 100%;
     display: block;
 }

 .school-hours-badge {
     position: absolute;
     bottom: 20px;
     right: 20px;
     background: #fff;
     border-radius: 14px;
     padding: 12px 16px;
     box-shadow: 0 4px 16px rgba(0, 0, 0, .12);
     text-align: center;
     min-width: 130px;
 }

 .school-hours-badge .crown {
     font-size: 20px;
     color: var(--gold);
 }

 .school-hours-badge strong {
     display: block;
     font-size: 11px;
     font-weight: 800;
     color: var(--green-dark);
     line-height: 1.2;
     margin: 4px 0;
 }

 .school-hours-badge p {
     font-size: 10px;
     color: var(--muted);
 }

 .mini-features {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 12px;
     margin-top: 20px;
     box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
     padding: 20px 15px;
     border-radius: 16px;
     background-color: #fff;
     opacity: 0.9;
 }

 .mini-feat {
     display: flex;
     align-items: flex-start;
     gap: 15px;
 }

 .mini-feat-icon {
     width: 60px;
     height: 60px;
     background: var(--green-light);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
     font-size: 40px;
     margin: 10px 0;
 }

 .mini-feat-text strong {
     display: block;
     font-size: 15px;
     font-weight: 700;
     color: var(--green-dark);
     text-transform: uppercase;
     line-height: normal;
 }

 .mini-feat-text span {
     font-size: 14px;
     color: var(--muted);
     font-weight: bold;
     display: block;
     line-height: normal;
     margin-top: 8px;
 }

 /* ─── SECTION WRAPPER ─── */

 .section-heading {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 15px;
 }

 .section-heading span {
     position: relative;
     width: 80px;
     height: 2px;
     background: #f5a623d6;
 }

 .footer-text.section-heading span::before,
 .footer-text.section-heading span::after {
     display: none;
 }

 .footer-text.section-heading span {
     height: 1px;
 }

 .section-heading span::before,
 .section-heading span::after {
     content: "";
     position: absolute;
     width: 4px;
     height: 4px;
     background: #f5a623d6;
     border-radius: 50%;
     top: 50%;
     transform: translateY(-50%);
 }

 .section-heading span::before {
     left: -2px;
 }

 .section-heading span::after {
     right: -2px;
 }


 .eyebrow {
     display: inline-block;
     background: var(--green-dark);
     color: #fff;
     font-size: 12px;
     font-weight: 700;
     letter-spacing: 2px;
     text-transform: uppercase;
     padding: 8px 15px;
     border-radius: 20px;
 }


 section {
     padding: 40px 5%;
 }

 .container {
     max-width: 1200px;
     margin: 0 auto;
 }

 .section-title {
     font-size: clamp(26px, 4vw, 40px);
     font-weight: 900;
     color: var(--green-dark);
     line-height: 1.15;
     margin-bottom: 12px;
     margin-top: 12px;
 }

 .section-title .accent {
     color: var(--green-btn);
 }

 .section-sub {
     font-size: 16px;
     color: var(--muted);
     max-width: 650px;
     margin: 0 auto 60px;
     text-align: center;
     font-weight: 500;
 }

 .text-center {
     text-align: center;
 }

 /* ─── WHY EVEREST ─── */
 .why-section {
     background: var(--bg-section);
 }

 .cards-5 {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
     gap: 18px;
     margin-bottom: 32px;
 }

 .card {
     background: #fff;
     border-radius: 14px;
     padding: 22px 18px;
     border: 1px solid var(--border);
 }

 .card-icon {
     width: 70px;
     height: 70px;
     background: var(--green-light);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 40px;
     margin: 0 auto;
     position: absolute;
     top: -23%;
     left: 30%;
 }

 .card h4 {
    font-size: 15px;
    font-weight: 700;
    color: var(--green-dark);
    text-align: center;
    border-bottom: 1px solid #f5a623d6;
    padding-bottom: 5px;
    max-width: 160px;
    margin: 0 auto;
    padding-top: 25px;
}

 .card p {
     font-size: 14px;
    color: var(--muted);
    line-height: 2;
    padding-top: 10px;
    text-align: center;
 }

 .photos-row {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
     gap: 16px;
     margin-top: 24px;
 }
.photo-card-body div{
	font-size: 14px;
    display: flex;
    margin-top: 5px;
}
.photo-card-body h5{
	font-size: 15px;
}
 .photo-placeholder {
     justify-content: center;
     align-items: center;
     float: left;
     display: flex;
     font-size: 40px;
     background: var(--green-light);
     border-radius: 50%;
     width: 60px;
     height: 60px;
     margin-right: 12px;
 }

 .photo-card-body strong {
     display: block;
     font-size: 12px;
     font-weight: 700;
     color: var(--green-dark);
 }

 .photo-card-body span {
     font-size: 11px;
     color: var(--muted);
     width: 85%;
     display: block;
     line-height: 20px;
 }

 .commitment-bar {
     background: var(--green-dark);
     color: #fff;
     border-radius: 14px;
     padding: 15px;
     align-items: center;
     gap: 12px;
     margin-top: 24px;
     display: flex;
     justify-content: center;
 }

 .commitment-bar p {
     font-size: 18px;
     font-weight: 600;
     text-align: center;
 }

 .commitment-bar p span {
     color: var(--gold);
 }

 /* ─── WHY BECOME ─── */
 .become-section {
     background: #fff;
 }

 .benefits-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
     gap: 20px;
 }

 .benefit-icon {
     width: 60px;
     height: 60px;
     background: var(--green-light);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 25px;
     flex-shrink: 0;
 }

 .icon-wrap-left, .icon-wrap-left1 {
     float: left;
     width: 22%;
 }

 .icon-wrap-right, .icon-wrap-right1 {
     float: left;
     width: 78%;
 }

 .benefit-card h4 {
     font-size: 13px;
     font-weight: 700;
     color: var(--green-dark);
     margin-bottom: 4px;
     text-transform: uppercase;
     letter-spacing: .5px;
 }

 .benefit-card p {
     font-size: 14px;
     color: var(--muted);
 }

 .empowered-banner {
     background: var(--green-light);
     border-radius: 14px;
     padding: 22px 28px;
     display: flex;
     align-items: center;
     gap: 20px;
     margin-top: 28px;
     flex-wrap: wrap;
 }

 .emp-left {
     flex: 1;
 }

 .emp-left strong {
     display: block;
     font-size: 14px;
     font-weight: 800;
     color: var(--green-dark);
 }

 .emp-left span {
     font-size: 13px;
     color: var(--muted);
 }

 .emp-right {
     font-size: 13px;
     font-style: italic;
     color: var(--green-dark);
     font-weight: 600;
 }

 /* ── BENEFITS GRID ── */
 .benefits-row1 {
     padding: 22px 48px;
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 20px;
 }

 .benefits-row2 {
     padding: 0 48px 40px;
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 20px;
 }

 .benefit-card {
     background: var(--white);
     border: 1.5px solid var(--green-light);
     border-radius: var(--radius);
     padding: 24px 20px 20px;
     box-shadow: var(--shadow);
     transition: transform 0.2s ease, box-shadow 0.2s ease;
     border-radius: 10px;
 }

 .benefit-card:hover {
     transform: translateY(-3px);
     box-shadow: 0 8px 28px rgba(26, 60, 46, 0.13);
 }

 /* ── FOOTER BANNER ── */
 .banner {
     background: var(--bg-section);
     border: 1.5px solid var(--green-light);
     border-radius: 20px;
     padding: 22px 10%;
     display: flex;
     align-items: center;
     gap: 28px;
 }

 .banner-mountain {
     flex-shrink: 0;
     width: 72px;
     height: 72px;
 }

 .banner-mountain svg {
     width: 100%;
     height: 100%;
 }

 .banner-text h2 {
     font-family: 'Inter', sans-serif;
     font-size: 26px;
     font-weight: 700;
     color: var(--green-dark);
     line-height: 1.4;
     margin-bottom: 6px;
 }

 .banner-text h2 .orange {
     color: var(--gold);
 }

 .banner-text p {
     font-size: 16px;
     color: var(--text-body);
     line-height: 1.5;
 }

 .banner-heart {
     margin-left: auto;
     flex-shrink: 0;
     opacity: 0.25;
 }

 .banner-heart svg {
     width: 56px;
     height: 56px;
     fill: none;
     stroke: var(--green-mid);
     stroke-width: 1.5;
 }

 /* ── RESPONSIVE ── */
 @media (max-width: 720px) {
     .hero {
         grid-template-columns: 1fr;
         padding: 32px 24px 28px;
     }

     .hero-img {
         height: 220px;
     }

     .benefits {
         grid-template-columns: 1fr;
         padding: 28px 24px;
     }

     .benefits-row2 {
         grid-template-columns: 1fr;
         padding: 0 24px 28px;
     }

     .banner {
         flex-wrap: wrap;
         margin: 0 24px 32px;
     }

     .banner-heart {
         display: none;
     }
 }

 .icon-wrap {
     width: 60px;
     height: 60px;
     border-radius: 50%;
     background: var(--green-light);
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 14px;
     font-size: 25px;
 }

 .icon-wrap svg {
     width: 35px;
     height: 35px;
     color: var(--green-mid);
     fill: none;
     stroke: currentColor;
     stroke-width: 1.8;
     stroke-linecap: round;
     stroke-linejoin: round;
 }

 .benefit-title {
     font-size: 15px;
    font-weight: bold;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: var(--green-dark);
    margin-bottom: 10px;
    line-height: 1.5;
 }

 .benefit-rule {
     width: 32px;
     height: 2.5px;
     background: var(--gold);
     border-radius: 2px;
     margin-bottom: 12px;
 }

 .benefit-desc {
     font-size: 13px;
     line-height: 1.5;
     color: var(--text-body);
 }

 .faq-main .circle {
     width: 70px;
     height: 60px;
     min-width: 12%;
 }

 .faq-main .circle-content {
     border-left: 2px solid #ccc;
     padding-left: 30px;
     margin-left: 20px;
 }

 /* ─── HOW YOU EARN ─── */
 .earn-section {
     background: var(--bg-section);
 }

 .earn-steps {
     display: flex;
     gap: 0;
     overflow-x: auto;
     padding-bottom: 40px;
 }

 .earn-step {
     flex: 1;
     min-width: 150px;
     text-align: center;
     position: relative;
     padding: 0 10px;
 }

 .earn-step:not(:last-child)::after {
     content: '→';
     position: absolute;
     right: -8px;
     top: 22px;
     color: var(--green-mid);
     font-size: 25px;
     font-weight: 700;
 }

 .selection-main:not(:last-child)::after,.steps-main:not(:last-child)::after {
     content: '→';
     position: absolute;
     right: -28px;
     top: 15%;
     color: var(--green-mid);
     font-size: 35px;
     font-weight: 700;
 }

 .selection-main .circle {
     border: 5px solid #fff;
     box-shadow: 0 0 0 2px #edf2ec;
 }

 .selection-main .do-num {
     position: absolute;
     top: 25px;
     left: 35px;
 }

 .info-icon {
     width: 90px;
     height: 90px;
     background: #0c6b38;
     color: #fff;
     border-radius: 50%;
     display: flex;
     justify-content: center;
     align-items: center;
     font-size: 42px;
     flex-shrink: 0;
 }

 .info-item {
     display: flex;
     gap: 20px;
 }

.number {
    position: absolute;
    left: 78px;
    top: 0px;
    width: 30px;
    height: 30px;
    background: var(--green-dark);
    color: #fff;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 700;
    font-family: 'Montserrat', sans-serif;
    font-size: 12px;
}

 .earn-highlight {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 16px;
     margin-top: 28px;
 }

 .earn-hl-box {
     background: #fff;
     border-radius: 14px;
     padding: 20px;
     border: 1px solid var(--border);
 }

 .earn-hl-box .bag {
     font-size: 28px;
     margin-bottom: 8px;
 }

 .earn-hl-box strong {
     display: block;
     font-size: 14px;
     font-weight: 800;
     color: var(--green-dark);
     margin-bottom: 4px;
 }

 .earn-hl-box p {
     font-size: 12px;
     color: var(--muted);
 }

 .earn-hl-box .formula {
     font-weight: 700;
     color: var(--green-dark);
     font-size: 13px;
     margin: 8px 0 4px;
 }

 .earn-footer {
     background: var(--green-dark);
     color: #fff;
     border-radius: 14px;
     padding: 18px 24px;
     margin-top: 20px;
     text-align: center;
 }

 .earn-footer p {
     font-size: 13px;
     font-weight: 600;
 }

 .earn-footer span {
     color: var(--gold);
 }

 /* ─── WHAT YOU'LL DO ─── */
 .do-section {
     background: #fff;
 }

 .do-steps {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
     gap: 16px;
     padding-bottom: 40px;
 }

 .do-step {
     border-radius: 14px;
     padding: 20px 20px;
     text-align: center;
     box-shadow: 0 0 3px var(--border), 0 0 3px var(--border);
 }

 .do-num {
     width: 34px;
     height: 34px;
     background: var(--green-dark);
     color: #fff;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 12px;
     font-weight: 800;
     font-family: 'Montserrat', sans-serif;
     margin: 0 auto;
     margin-top: -15px;
 }

 .icon-head {
     font-size: 13px;
     font-weight: bold;
 }

 .support-head {
     text-align: center;
     width: 18%;
     border-left: 2px solid #ccc;
     padding-left: 15px;
     margin-left: 15px;
 }

 .support-head .icon-wrap {
     margin: 0 auto;
 }

 .support-header {
     color: #F4BE2A !important;
     font-size: 16px !important;
     border-bottom: 1px solid #ccc;
     padding-bottom: 5px;
     margin-bottom: 8px;
     display: inline-block;
     font-weight: 700;
 }

 .do-step-icon {
     font-size: 22px;
     margin-bottom: 8px;
 }

 .do-step h4 {
     position: relative;
     display: inline-block;
     font-size: 15px;
     font-weight: 700;
     color: var(--green-dark);
     margin: 8px 0;
     text-align: center;
 }

 .do-step h4::after {
     content: "";
     position: absolute;
     left: 50%;
     transform: translateX(-50%);
     bottom: -5px;
     width: 70px;
     height: 2px;
     background: #f5a623d6;
     border-radius: 5px;
 }

 .do-step p {
     font-size: 14px;
     color: var(--muted);
     margin-top: 10px;
 }

 .support-box {
     background: var(--green-light);
     border-radius: 14px;
     padding: 22px 24px;
     margin-top: 24px;
     display: flex;
     gap: 20px;
     align-items: flex-start;
     flex-wrap: wrap;
 }

 .support-left {
     flex: 1;
 }

 .support-left strong {
     display: block;
     font-size: 15px;
     font-weight: 800;
     color: var(--green-dark);
 }

 .support-left span {
     color: var(--gold);
     font-weight: 700;
 }

 .support-left p {
     font-size: 12px;
     color: var(--muted);
     margin-top: 6px;
 }

 .support-pillars {
     display: flex;
     gap: 16px;
     flex-wrap: wrap;
     margin-top: 4px;
 }

 .support-pill {
     background: #fff;
     border: 1px solid var(--border);
     border-radius: 8px;
     padding: 8px 12px;
     font-size: 11px;
     font-weight: 600;
     color: var(--green-dark);
     display: flex;
     align-items: center;
     gap: 6px;
 }

 /* ─── ELIGIBILITY ─── */
 .eligibility-section {
     background: var(--bg-section);
 }

 .elig-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
     gap: 16px;
 }

 .elig-card {
     background: #fff;
     padding: 20px;
     border: 1px solid var(--border);
     border-bottom: 3px solid;
 }

 .elig-icon {
     font-size: 28px;
     margin-bottom: 10px;
 }

 .elig-card p {
     font-size: 14px;
     color: var(--muted);
 }

 .qualities-bar {
     background: #fff;
     border: 1px solid var(--border);
     border-radius: 14px;
     padding: 20px 24px;
     margin-top: 20px;
 }

 .qualities-bar h4 {
     font-size: 13px;
     font-weight: 700;
     color: var(--green-dark);
     margin-bottom: 14px;
     display: flex;
     align-items: center;
     gap: 8px;
 }

 .qualities-list {
     display: flex;
     flex-wrap: wrap;
     gap: 10px;
 }

 .quality-tag {
     background: var(--green-light);
     color: var(--green-dark);
     border-radius: 8px;
     padding: 7px 14px;
     font-size: 12px;
     font-weight: 600;
     display: flex;
     align-items: center;
     gap: 6px;
 }

 .elig-footer {
     background: var(--green-dark);
     color: #fff;
     border-radius: 14px;
     padding: 16px 24px;
     margin-top: 16px;
     display: flex;
     align-items: center;
     gap: 12px;
 }

 .elig-footer p {
     font-size: 13px;
     font-weight: 600;
 }

 .elig-footer span {
     color: var(--gold);
 }

 .eligibility-head h2 {
     font-size: 20px !important;
 }

 .eligibility-pillars {
     width: auto !important;
 }

 .cta-alert {
     background-color: #F4BE2A !important;
     color: #fff !important;
 }

 /* ─── SELECTION PROCESS ─── */
 .process-section {
     background: #fff;
 }

 .process-steps {
     display: flex;
     gap: 0;
     overflow-x: auto;
     padding-bottom: 8px;
 }

 .proc-step {
     flex: 1;
     min-width: 130px;
     text-align: center;
     position: relative;
     padding: 0 8px;
 }

 .proc-step:not(:last-child)::after {
     content: '→';
     position: absolute;
     right: -8px;
     top: 28px;
     color: var(--green-mid);
     font-size: 16px;
     font-weight: 700;
 }

 .proc-circle {
     width: 56px;
     height: 56px;
     background: var(--green-light);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 24px;
     margin: 0 auto 10px;
     border: 2px solid var(--green-mid);
 }

 .proc-num {
     font-size: 12px;
     font-weight: 800;
     color: var(--green-dark);
     margin-bottom: 6px;
     font-family: 'Montserrat', sans-serif;
 }

 .proc-step h4 {
     font-size: 12px;
     font-weight: 700;
     color: var(--green-dark);
     margin-bottom: 4px;
 }

 .proc-step p {
     font-size: 10px;
     color: var(--muted);
 }

 .proc-bottom {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 16px;
     margin-top: 24px;
 }

 .proc-bottom-box {
     background: var(--bg-section);
     border-radius: 14px;
     padding: 18px 20px;
     border: 1px solid var(--border);
     display: flex;
     gap: 12px;
 }

 .proc-bottom-icon {
     font-size: 24px;
 }

 .proc-bottom-box strong {
     display: block;
     font-size: 13px;
     font-weight: 700;
     color: var(--green-dark);
     margin-bottom: 4px;
 }

 .proc-bottom-box p {
     font-size: 12px;
     color: var(--muted);
 }

 .proc-footer {
     background: var(--green-dark);
     color: #fff;
     border-radius: 14px;
     padding: 18px 24px;
     margin-top: 20px;
     text-align: center;
 }

 .proc-footer p {
     font-size: 14px;
     font-weight: 700;
 }

 .proc-footer span {
     color: var(--gold);
 }

 /* ─── WHY JOIN ─── */
 .join-section {
     background: var(--bg-section);
 }

 .join-grid {
     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
     gap: 16px;
 }

 .join-card {
     background: #fff;
     border-radius: 14px;
     padding: 20px;
     border: 1px solid var(--border);
     text-align: center;
 }

 .join-icon {
     font-size: 40px;
     margin-bottom: 10px;
 }

 .join-card h4 {
     font-size: 13px;
     font-weight: 700;
     color: var(--green-dark);
     margin-bottom: 6px;
 }

 .join-card p {
     font-size: 12px;
     color: var(--muted);
 }

 .join-bottom {
     display: flex;
     gap: 16px;
     margin-top: 20px;
     flex-wrap: wrap;
 }

 .join-quote {
     flex: 1;
     background: var(--green-light);
     border-radius: 14px;
     padding: 20px;
     display: flex;
     align-items: center;
     gap: 12px;
 }

 .join-heart {
     font-size: 28px;
 }

 .join-quote p {
     font-size: 13px;
     font-weight: 700;
     color: var(--green-dark);
 }

 .join-quote span {
     font-size: 12px;
     color: var(--muted);
     font-style: italic;
 }

 .join-footer {
     background: var(--green-dark);
     color: #fff;
     border-radius: 14px;
     padding: 18px 24px;
     margin-top: 20px;
     display: flex;
     align-items: center;
     gap: 20px;
     flex-wrap: wrap;
 }

 .join-footer .logo-mark {
     font-size: 13px;
     font-weight: 800;
     letter-spacing: .5px;
 }

 .join-footer .cta-text {
     font-size: 12px;
 }

 .join-footer .cta-text span {
     color: var(--gold);
     font-weight: 700;
 }

 .join-footer .wa-text {
     color: var(--gold);
     font-weight: 700;
     font-size: 13px;
 }

 /* ─── FAQ ─── */
 .faq-section {
     background: var(--bg-section);
 }

 .faq-grid {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 16px;
     padding-bottom: 40px;
 }

 .faq-item {
     background: var(--bg-section);
     border-radius: 14px;
     padding: 20px;
     border: 1px solid var(--border);
     display: flex;
     gap: 14px;
 }

 .faq-icon {
     font-size: 24px;
     flex-shrink: 0;
 }

 .faq-item h4 {
     font-size: 16px;
     font-weight: 700;
     color: var(--green-dark);
     margin-bottom: 6px;
 }

 .faq-item p {
     font-size: 15px;
     color: var(--muted);
 }

 .faq-footer {
     background: var(--green-dark);
     color: #fff;
     border-radius: 14px;
     padding: 18px 24px;
     margin-top: 20px;
     display: flex;
     align-items: center;
     gap: 16px;
     flex-wrap: wrap;
 }

 .faq-footer strong {
     font-size: 14px;
 }

 .faq-footer p {
     font-size: 12px;
     color: #cde8d4;
 }

 /* ─── APPLY ─── */
 .apply-section {
     background: var(--bg-section);
 }

 .apply-box {
     background: var(--green-dark);
     border-radius: 20px;
     padding: 50px 40px;
     text-align: center;
     color: #fff;
 }

 .apply-box h2 {
     font-size: clamp(24px, 4vw, 38px);
     font-weight: 900;
     margin-bottom: 12px;
 }

 .apply-box h2 span {
     color: var(--gold);
 }

 .apply-box p {
     font-size: 16px;
     color: #cde8d4;
     margin-bottom: 28px;
 }

 .apply-positions {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     background: rgba(255, 255, 255, .1);
     border: 1px solid rgba(255, 255, 255);
     border-radius: 10px;
     padding: 12px 22px;
     font-weight: 800;
     font-size: 15px;
     margin-bottom: 20px;
 }

 .apply-positions span {
     color: var(--gold);
 }

 .apply-wa-btn {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     background: #fff;
     color: var(--green-dark);
     padding: 15px 32px;
     border-radius: 10px;
     font-size: 16px;
     font-weight: 800;
     text-decoration: none;
     margin-bottom: 12px;
 }

 .apply-wa-btn:hover {
     background: #e8f5ee;
 }

 .no-fee-white {
     font-size: 13px;
     color: #a8d5b8;
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 5px;
 }


 /* ── BENEFITS GRID ── */
 .benefits {
     padding: 8px 36px 12px;
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 18px;
 }

 .b-card {
     background: var(--white);
     border: 1.5px solid var(--green-light);
     border-radius: var(--radius);
     padding: 24px 16px 20px;
     display: flex;
     flex-direction: column;
     align-items: center;
     text-align: center;
     box-shadow: var(--shadow);
     transition: transform 0.2s, box-shadow 0.2s;
 }

 .b-card:hover {
     transform: translateY(-4px);
     box-shadow: 0 10px 28px rgba(26, 60, 46, 0.14);
 }

 .icon-circle {
     width: 78px;
     height: 78px;
     border-radius: 50%;
     background: #EFF5EC;
     border: 1.5px solid var(--green-light);
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 14px;
     flex-shrink: 0;
 }

 .icon-circle svg {
     width: 40px;
     height: 40px;
     stroke: var(--green-mid);
     fill: none;
     stroke-width: 1.6;
     stroke-linecap: round;
     stroke-linejoin: round;
 }

 .b-title {
     font-size: 16px;
     font-weight: 700;
     color: var(--green-mid);
     margin-bottom: 8px;
     line-height: 1.3;
 }

 .b-rule {
     width: 28px;
     height: 2.5px;
     background: var(--gold);
     border-radius: 2px;
     margin-bottom: 10px;
     flex-shrink: 0;
 }

 .b-desc {
     font-size: 16px;
     line-height: 1.6;
     color: var(--text-body);
 }

 /* ── QUOTE BANNER ── */
 .quote-banner {
     margin: 16px 36px 28px;
     background: var(--green-pale);
     border: 1.5px solid var(--green-light);
     border-radius: var(--radius);
     padding: 24px 28px;
     display: grid;
     grid-template-columns: auto 1fr auto;
     gap: 0;
     align-items: center;
     overflow: hidden;
 }

 .quote-left {
     display: flex;
     align-items: center;
     gap: 18px;
     padding-right: 28px;
     border-right: 1.5px solid var(--green-light);
 }

 .heart-badge {
     width: 56px;
     height: 56px;
     border-radius: 50%;
     background: var(--gold-bright);
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
 }

 .heart-badge svg {
     width: 28px;
     height: 28px;
     fill: var(--green-dark);
     stroke: none;
 }

 .quote-left-text h3 {
     font-size: 15px;
     font-weight: 800;
     color: var(--green-dark);
     line-height: 1.4;
     margin-bottom: 3px;
 }

 .quote-left-text p {
     font-size: 16px;
     font-weight: 800;
     color: var(--green-dark);
     line-height: 1.3;
 }

 .quote-right {
     display: flex;
     align-items: center;
     justify-content: center;
     padding-left: 28px;
     gap: 10px;
 }

 .quote-mark {
     font-size: 40px !important;
     color: var(--green-dark) !important;
     font-family: Georgia, serif;
     line-height: 1;
     flex-shrink: 0;
 }

 .quote-right p {
     font-size: 18px !important;
     font-style: italic;
     font-weight: 600;
     color: var(--green-dark) !important;
     line-height: 1.5 !important;
 }

 /* ── FOOTER CTA STRIP ── */
 .footer-strip {
     background: var(--green-dark);
     padding: 22px 36px;
     display: grid;
     grid-template-columns: auto 1px 1fr 1px 1fr;
     gap: 0;
     align-items: center;
 }

 .fs-divider {
     width: 1px;
     height: 48px;
     background: rgba(255, 255, 255, 0.18);
     margin: 0 24px;
 }

 /* brand */
 .fs-brand {
     display: flex;
     align-items: center;
     gap: 12px;
     padding-right: 8px;
 }

 .fs-brand-text .brand-name {
     font-size: 20px;
     font-weight: 900;
     color: var(--white);
     letter-spacing: 0.5px;
     line-height: 1;
 }

 .fs-brand-text .brand-sub {
     font-size: 9px;
     font-weight: 600;
     color: rgba(255, 255, 255, 0.6);
     letter-spacing: 1.2px;
     text-transform: uppercase;
     margin-top: 3px;
 }

 /* middle cta */
 .fs-cta {
     display: flex;
     align-items: center;
     gap: 14px;
     padding: 0 8px;
 }

 .fs-star {
     width: 44px;
     height: 44px;
     border-radius: 50%;
     background: var(--gold-bright);
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
     font-size: 20px;
 }

 .fs-cta-text p:first-child {
     font-size: 14px;
     font-weight: 600;
     color: var(--white);
     margin-bottom: 2px;
 }

 .fs-cta-text p:last-child {
     font-size: 14px;
     font-weight: 700;
     color: var(--gold-bright);
 }

 /* right cta */
 .fs-apply {
     display: flex;
     align-items: center;
     gap: 14px;
     padding: 0 8px;
 }


 /* ── RESPONSIVE ── */
 @media (max-width: 860px) {
     .hero {
         padding: 32px 20px 24px;
     }

     .benefits {
         grid-template-columns: repeat(2, 1fr);
         padding: 8px 20px 12px;
     }

     .quote-banner {
         grid-template-columns: 1fr;
         margin: 12px 20px 24px;
     }

     .quote-left {
         border-right: none;
         border-bottom: 1.5px solid var(--green-light);
         padding-right: 0;
         padding-bottom: 20px;
     }

     .quote-right {
         padding-left: 0;
         padding-top: 16px;
     }

     .footer-strip {
         grid-template-columns: 1fr;
         gap: 16px;
         padding: 24px 20px;
         text-align: center;
     }

     .fs-divider {
         width: 80%;
         height: 1px;
         margin: 0 auto;
     }

     .fs-brand,
     .fs-cta,
     .fs-apply {
         justify-content: center;
     }
 }

 @media (max-width: 480px) {
     .benefits {
         grid-template-columns: 1fr;
     }
 }

 /* ─── FOOTER ─── */
 footer {
     background: var(--bg-section);
 }

 .footer-inner {
	display: flex;
    align-items: center;
    gap: 0;
    flex-wrap: wrap;
    margin: 0 auto;
    max-width: fit-content;
 }

 .footer-logo {
     display: flex;
     align-items: center;
     gap: 10px;
     padding-right: 30px;
     border-right: 1px solid var(--border);
 }

 .footer-contacts {
     display: flex;
     align-items: center;
     gap: 0;
     flex: 1;
 }

 .footer-contact-item {
     display: flex;
     align-items: center;
     gap: 10px;
     padding: 0 28px;
     border-right: 1px solid var(--border);
 }

 .footer-contact-item:last-of-type {
     border-right: none;
 }

 .fc-icon {
     font-size: 24px;
     color: var(--green-dark);
 }

 .fc-label {
     font-size: 16px;
     font-weight: 700;
     color: var(--green-dark);
 }

 .fc-value {
     font-size: 15px;
     color: var(--muted);
 }

 .footer-copy {
     max-width: 1200px;
     margin: 20px auto 0;
     text-align: center;
     font-size: 13px;
     color: var(--muted);
     padding: 10px 0;
     border-top: 1px solid var(--border);
 }

 /* ─── SVG LOGO ─── */
 .mountain-svg {
     width: 60px;
     height: 60px;
 }

 /* ─── RESPONSIVE ─── */
 @media(max-width:768px) {
     .hero {
         flex-direction: column;
     }

     .hero-right {
         flex: none;
         max-width: 100%;
         width: 100%;
     }

     .faq-grid {
         grid-template-columns: 1fr;
     }

     .earn-highlight {
         grid-template-columns: 1fr;
     }

     .proc-bottom {
         grid-template-columns: 1fr;
     }

     .footer-contacts {
         flex-direction: column;
         align-items: flex-start;
         gap: 12px;
     }

     .footer-contact-item {
         border: none;
         padding: 0;
     }

     .footer-logo {
         border: none;
         padding: 0 0 12px 0;
     }

     .footer-inner {
         flex-direction: column;
         align-items: flex-start;
     }
 }

 @media(max-width:500px) {

     .earn-steps,
     .process-steps {
         flex-direction: column;
     }

     .earn-step::after,
     .proc-step::after {
         display: none;
     }

     .join-bottom {
         flex-direction: column;
     }

     section {
         padding: 40px 4%;
     }
 }


 /* ===============================
   STEP SECTION
================================= */

 .circle {
     width: 100px;
     height: 100px;
     margin: auto;
     border-radius: 50%;
     background: #EFF5EC;
     display: flex;
     justify-content: center;
     align-items: center;
     font-size: 40px;
 }

 .circle img {
     width: 78px;
 }

 .earn-step h4 {
     color: var(--green-dark);
     margin: 5px 0;
     line-height: normal;
 }

 .earn-step p {
     font-size: 14px;
     color: var(--muted);
     text-align: center;
     max-width: 155px;
     margin: 0 auto;
 }

 /* ===============================
   LADY IMAGE
================================= */

 .lady-image {
     margin-left: -20px;
 }

 .lady-image img {
     width: 100%;
     border-radius: 18px;
 }

 /* ===============================
   EARNING CARD
================================= */
 .earning-card {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: 40px;
     background: #fff;
     border-radius: 25px;
     padding: 25px;
     box-shadow: 0 8px 20px rgba(0, 0, 0, .08);
 }

 .earning-right,
 .banner-right {
     border-left: 2px solid #ccc;
     padding-left: 30px;
     margin-left: 20px;
 }

 .earning-right span {
     color: #f5a623d6;
     padding: 0 20px;
     font-size: 16px;
 }

 .earning-left {
     display: flex;
     align-items: center;
     gap: 25px;
 }

 .earning-left img {
     width: 90px;
     flex-shrink: 0;
 }

 .earning-left h2,
 .earning-right h2 {
     font-size: 16px;
     font-weight: 700;
     color: #0B5D3A;
     margin-bottom: 10px;
 }

 .earning-left p,
 .earning-right p {
     font-size: 15px;
     color: #444;
     line-height: 1.5;
 }


 @media (max-width:768px) {

     .earning-card {
         flex-direction: column;
         text-align: center;
     }

     .earning-left,
     .earning-right {
         width: 100%;
     }

     .earning-left {
         flex-direction: column;
     }

 }

 /* ===============================
   GREEN BANNER
================================= */
 .effort-main .circle {
     background: #FFF;
 }

 .faq-main .circle {
     background: #FFF;
 }

 .bottom-banner {
     margin-top: 30px;
     background: #0B5D3A;
     color: #fff;
     border-radius: 25px;
     padding: 15px 25px;
     display: flex;
 }

.banner-right {
	    margin: 0 auto;
}
 .banner-left {
    display: flex;
    align-items: center;
    gap: 25px;
    margin: 0 auto;
}
 .target {
     width: 70px;
     height: 70px;
     border-radius: 50%;
     background: #fff;
     color: #0B5D3A;
     display: flex;
     justify-content: center;
     align-items: center;
     font-size: 35px;
 }

 .eligibility-label {
     text-align: center;
     margin: 10px 0 30px;
 }

 .eligibility-label span {
     display: inline-block;
     background: var(--gold);
     color: var(--green-dark);
     font-size: 14px;
     font-weight: 800;
     padding: 8px 28px;
     border-radius: 100px;
     letter-spacing: 0.3px;
 }

 .banner-left h2 {
     font-size: 16px;
     font-weight: 700;
 }

 .banner-left h3 {
     color: #F4BE2A;
     font-size: 18px;
     font-weight: 700;
 }

 .logo {
     max-height: 95px;
 }

 /* ===============================
   FOOTER
================================= */

 .footer-text {
     margin-top: 15px;
     text-align: center;
     font-size: 15px;
     color: #333;
 }

 .footer-text strong {
     color: #1F8F52;
     font-size: 20px;
     line-height: 0;
 }

 /* ==========================================
   Hover Effects
========================================== */

 .step-box {
     transition: .35s ease;
 }

 .step-box:hover {
     transform: translateY(-8px);
 }

 .circle {
     transition: .35s;
 }


 .earning-card {
     transition: .35s;
 }

 .earning-card:hover {
     box-shadow: 0 20px 45px rgba(0, 0, 0, .15);
     transform: translateY(-3px);
 }

 .bottom-banner {
     transition: .35s;
 }

 .bottom-banner:hover {
     transform: translateY(-3px);
 }


 /* ==========================================
   Desktop Large
========================================== */

 @media(min-width:1600px) {

     .container {
         max-width: 1500px;
     }

     .main-title {
         font-size: 82px;
     }

     .sub-title {
         font-size: 30px;
     }

     .circle {
         width: 180px;
         height: 180px;
     }

     .circle img {
         width: 90px;
     }

     .step-box h4 {
         font-size: 34px;
     }

     .step-box p {
         font-size: 23px;
     }

 }


 /* ==========================================
   Laptop
========================================== */

 @media(max-width:1400px) {

     .main-title {
         font-size: 60px;
     }

     .sub-title {
         font-size: 24px;
     }

   

     .circle img {
         width: 70px;
     }

     .step-box h4 {
         font-size: 26px;
     }

     .step-box p {
         font-size: 18px;
     }

 }


 /* ==========================================
   Tablet
========================================== */

 @media(max-width:992px) {

     .heading-area {
         gap: 15px;
     }

     .top-line {
         width: 70px;
     }

     .badge-title {
         font-size: 22px;
         padding: 10px 28px;
     }

     .main-title {
         font-size: 46px;
     }

     .sub-title {
         font-size: 20px;
     }

     .steps-row {
         margin-top: 50px;
     }

     .step-box {
         margin-bottom: 50px;
     }

     .circle {
         width: 140px;
         height: 140px;
     }

     .number {
         width: 48px;
         height: 48px;
         font-size: 20px;
     }

     .earning-card {
         padding: 30px;
     }

     .earning-left {
         flex-direction: column;
         text-align: center;
     }

     .earning-right {
         margin-top: 30px;
         text-align: center;
     }

     .banner-left {
         flex-direction: column;
         text-align: center;
     }

    
 }


 /* ==========================================
   Mobile
========================================== */

 @media(max-width:768px) {

     .earn-section {
         padding: 40px 15px;
     }

     .heading-area {
         flex-direction: column;
     }

     .top-line {
         display: none;
     }

     .badge-title {
         font-size: 18px;
     }

     .main-title {
         font-size: 34px;
     }

     .sub-title {
         font-size: 17px;
     }

     .circle {
         width: 120px;
         height: 120px;
     }

     .circle img {
         width: 55px;
     }

     .step-box h4 {
         font-size: 21px;
     }

     .step-box p {
         font-size: 16px;
     }

     .number {
         left: 40px;
     }

     .earning-left img {
         width: 80px;
     }

     .earning-left h2 {
         font-size: 26px;
     }

     .earning-left p {
         font-size: 18px;
     }

     .earning-right h4 {
         font-size: 22px;
     }

     .earning-right p {
         font-size: 17px;
     }

     .target {
         width: 70px;
         height: 70px;
         font-size: 32px;
     }

     .banner-left h2 {
         font-size: 24px;
     }

     .banner-left h3 {
         font-size: 20px;
     }

     .footer-text {
         font-size: 18px;
     }

 }


 /* ==========================================
   Small Mobile
========================================== */

 @media(max-width:480px) {

     .main-title {
         font-size: 28px;
     }

     .circle {
         width: 100px;
         height: 100px;
     }

     .circle img {
         width: 45px;
     }

     .step-box h4 {
         font-size: 18px;
     }

     .step-box p {
         font-size: 14px;
     }

     .badge-title {
         width: 100%;
         text-align: center;
     }

 }

/* =======================================================
   FULLY RESPONSIVE – ALL DEVICES
   XL (1400+) | Desktop (1200) | Laptop (992) | Tablet (768) | Mobile (480) | XS (360)
======================================================= */

/* ── Shared helpers ─────────────────────────── */
img { max-width: 100%; height: auto; display: block; }
* { box-sizing: border-box; }

/* ── NAV ─────────────────────────────────────── */
nav {
    padding: 10px 4%;
    flex-wrap: wrap;
    gap: 8px;
}
nav .logo img { width: 80px !important; }
.logo-text strong { font-size: 16px; }
.nav-cta          { font-size: 15px; padding: 8px 16px; white-space: nowrap; }


/* ══════════════════════════════════════════════
   ≤ 1200px  –  Large Laptop
══════════════════════════════════════════════ */
@media (max-width: 1200px) {

    .hero {
        padding: 40px 4%;
    }

    .features-main {
        position: relative;
        right: auto;
        bottom: auto;
        padding: 0 4% 30px;
    }

    .mini-features {
        grid-template-columns: repeat(2, 1fr);
    }

    .benefits-row1 {
        grid-template-columns: repeat(2, 1fr);
        padding: 16px 20px;
    }

    .benefits-row2 {
        grid-template-columns: repeat(2, 1fr);
        padding: 0 20px 28px;
    }

    .benefits {
        grid-template-columns: repeat(2, 1fr);
        padding: 8px 20px 12px;
    }

    .cards-5 {
        grid-template-columns: repeat(3, 1fr);
    }

    .mompreneur-main {
        background-size: 8% !important;
        background-position: 5% !important;
    }
}


/* ══════════════════════════════════════════════
   ≤ 992px  –  Tablet Landscape / Small Laptop
══════════════════════════════════════════════ */
@media (max-width: 992px) {

    /* NAV */
    nav { justify-content: space-between; }

    /* HERO */
    .hero {
        flex-direction: column;
       /* background-image: none;*/
        padding: 32px 4% 24px;
        gap: 24px;
    }
    .hero-left { width: 100%; }
    .hero h1   { font-size: 18px !important}
    .hero p    { font-size: 15px; max-width: 100%; }

    /* Features strip – 2 columns on tablet */
    .features-main { padding: 0 4% 24px; }
    .mini-features  { grid-template-columns: repeat(2, 1fr); gap: 10px; }

    /* Why Everest */
    .cards-5   { grid-template-columns: repeat(2, 1fr); }
    .photos-row{ grid-template-columns: repeat(2, 1fr); }

    /* Become section */
    .benefits-row1 {
        grid-template-columns: repeat(2, 1fr);
        padding: 16px 10px;
    }
    .benefits-row2 {
        grid-template-columns: 1fr;
        padding: 0 10px 24px;
    }
    .mompreneur-main {
        background-image: none !important;
    }

    /* B-cards (why join) */
    .benefits { grid-template-columns: repeat(2, 1fr); padding: 8px 10px 12px; }

    /* Earn steps – allow wrapping */
    .earn-steps     { flex-wrap: wrap; gap: 16px; }
    .earn-step      { min-width: calc(33% - 12px); }
    .earn-step:not(:last-child)::after { display: none; }

    /* Do steps */
    .do-steps { grid-template-columns: repeat(3, 1fr); }

    /* Selection process */
    .process-steps { flex-wrap: wrap; gap: 16px; padding-bottom: 16px; }
    .proc-step     { min-width: calc(33% - 12px); }
    .proc-step:not(:last-child)::after { display: none; }

    /* FAQ */
    .faq-grid { grid-template-columns: 1fr; }

    /* Support box */
    .support-head {
        width: 100% !important;
        border-left: none;
        border-top: 2px solid #ccc;
        padding: 15px 0 0;
        margin: 15px 0 0;
        display: flex;
        flex-wrap: wrap;
        gap: 16px;
        justify-content: center;
    }
	.support-head .icon-wrap {
		margin: inherit;
	}
	.icon-head {
		font-size: 16px;
		font-weight: bold;
		align-content: center;
	}
	.selection-main .do-num {
		top: 28px !important;
		left: 30% !important;
	}
	.logo{
		 margin: 0 auto;
	}
    /* Bottom banner */
    .bottom-banner {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        padding: 20px;
    }
    .banner-right.text-end { text-align: left !important; }

    /* Earning card */
    .earning-card { flex-direction: column; gap: 20px; }
    .earning-right {
        border-left: none;
        border-top: 2px solid #ccc;
        padding: 16px 0 0;
        margin: 0;
    }

    /* Apply box */
    .apply-box { padding: 36px 20px; }

    /* Footer */
    .footer-inner {
        flex-direction: column;
        align-items: flex-start;
        padding: 20px;
    }
    .footer-logo   { border-right: none; border-bottom: 1px solid var(--border); padding: 0 0 16px; width: 100%; }
    .footer-contacts { flex-direction: column; gap: 14px; margin-top: 14px; }
    .footer-contact-item { border-right: none; padding: 0; }

    /* Eligibility */
    .elig-grid { grid-template-columns: repeat(2, 1fr); }

    /* Proc bottom */
    .proc-bottom { grid-template-columns: 1fr; }
}


@media (max-width: 500px) {
	
	.number {
        left: 30%;
    }
	
}
@media (max-width: 569px) {
	
	.earning-right h2 {
		font-size: 14px;
	}
	.earning-right span {
		padding: 0px 5px;
		font-size: 12px;
	}
}
.apply-wa-btn i.fa-brands.fa-whatsapp {
    font-size: 24px;
}
@media (max-width: 455px) {
	
	.earning-right h2 {
		font-size: 13px;
	}
	.earning-right span {
		padding: 0px 3px;
        font-size: 10px;
	}
}

@media (max-width: 419px) {
	
	.earning-right h2 {
		font-size: 10px;
	}
	.earning-right span {
		padding: 0px 2px;
        font-size: 8px;
	}
}

/* Mobile View */
@media (max-width: 767px) {
    .badge-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .badge-row .badge {
        display: block;
        width: fit-content;
    }
}

/* ══════════════════════════════════════════════
   ≤ 768px  –  Tablet Portrait / Large Mobile
══════════════════════════════════════════════ */
@media (max-width: 768px) {
	.hero p{
		width: 60%;
		font-size: 13px !important;
		font-weight: bold;
	}
    /* NAV */
    nav { padding: 10px 3%; }
   
    /* HERO */
    .hero {padding: 28px 4% 20px;
        background-size: cover; background-position: center; }
   
    /* Features – stack 2 columns */
    .mini-features { grid-template-columns: repeat(2, 1fr); }
    .mini-feat-icon { width: 48px; height: 48px; font-size: 22px; }

    /* Section padding */
    section { padding: 32px 4%; }

    /* Cards */
    .cards-5   { grid-template-columns: repeat(2, 1fr); }
    .photos-row{ grid-template-columns: repeat(2, 1fr); }

    /* Benefits rows */
    .benefits-row1 { grid-template-columns: 1fr; padding: 16px 0; }
    .benefits-row2 { grid-template-columns: 1fr; padding: 0 0 20px; }
    .benefits      { grid-template-columns: repeat(2, 1fr); padding: 8px 0 12px; }

    /* B-cards */
    .b-card { padding: 20px 12px 16px; }

    /* Earn steps */
    .earn-steps { flex-wrap: wrap; gap: 16px; }
    .earn-step  { min-width: calc(50% - 10px); flex: none; }

    /* Do steps */
    .do-steps { grid-template-columns: repeat(2, 1fr); }

    /* Process */
    .process-steps { flex-wrap: wrap; gap: 16px; }
    .proc-step     { min-width: calc(50% - 10px); flex: none; }

    /* Earn highlight */
    .earn-highlight { grid-template-columns: 1fr; }

    /* FAQ */
    .faq-grid { grid-template-columns: 1fr; }

    /* Apply */
    .apply-box { padding: 32px 16px; }
    .apply-wa-btn { font-size: 14px; padding: 13px 22px; }

    /* Commitment bar */
    .commitment-bar { flex-direction: column; text-align: center; gap: 8px; }
    .commitment-bar p { font-size: 15px; }

    /* Elig grid */
    .elig-grid { grid-template-columns: repeat(2, 1fr); }

    /* Bottom banner */
    .bottom-banner { flex-direction: column; gap: 16px; }
    .banner-right  { border-left: none !important; padding-left: 0 !important; margin-left: 0 !important; }

    /* Earning card */
    .earning-card  { flex-direction: column; text-align: center; padding: 20px; }
    .earning-left  { flex-direction: column; align-items: center; gap: 14px; }
    .earning-right { border-left: none; border-top: 2px solid #ccc; padding: 16px 0 0; margin: 0; }

    /* Section heading lines – shorter */
    .section-heading span { width: 40px; }

    /* Positions pill */
    .positions-pill { font-size: 13px; padding: 10px 16px; }

    /* WA btn */
    .wa-btn { font-size: 14px; padding: 12px 20px; }

    /* Footer */
    .footer-inner { padding: 16px; }
}
@media (max-width: 351px) {
.banner-left h2 { font-size: 13px !important; }
}

@media (max-width: 291px) {
.banner-left h2 { font-size: 10px !important; }
}
.banner-text{
	  text-align: center;
}
.banner-mountain{
		margin: 0 auto;
	}
/* ══════════════════════════════════════════════
   ≤ 576px  –  Mobile
══════════════════════════════════════════════ */
@media (max-width: 576px) {
	 .benefit-card p,.card p {
		 font-size: 16px;
	 }
	 .card h4 {
		font-size: 16px;
		max-width: 180px;
	 }
    /* NAV */
    .logo-text strong { font-size: 14px; }
    .nav-cta { padding: 7px 12px; gap: 4px; margin: 0 auto; }

    /* HERO */
    .hero { padding: 20px 4% 16px; }
    .hero h1 { font-size: clamp(24px, 8vw, 32px); }
    .hero p  { font-size: 14px; }

    /* Features – single column on small mobile */
    .mini-features { grid-template-columns: 1fr 1fr; gap: 8px; }
    .mini-feat-text strong { font-size: 13px; }
    .mini-feat-text span   { font-size: 12px; }
	
    /* Section */
    section { padding: 28px 3%; }
    .section-title { font-size: clamp(20px, 6vw, 28px); }
    .section-sub   { font-size: 16px; margin-bottom: 28px; }

    /* Cards – single column */
    .cards-5  { grid-template-columns: 1fr; }
    .card     {        
		padding: 18px 15px;
	   margin-top: 45px;
	}
	.photo-card-body h5,.banner-text p {
		font-size: 16px;
	}
	.photo-card-body div {
		font-size: 15px;
	}
	.card-icon {
		left: 40%;
	}
	.earn-step p {
		font-size: 15px;
		max-width: 220px;
	}
    /* Photos – single column */
    .photos-row { grid-template-columns: 1fr; }
	.do-step h4 {
		font-size: 15px;
	}
	.do-step p {
		font-size: 15px;
	}
	.do-step {
		margin-bottom: 15px;
	}
	    
    /* Benefits */
    .benefits-row1 { grid-template-columns: 1fr; padding: 8px 0; }
    .benefits-row2 { grid-template-columns: 1fr; padding: 0 0 16px; }
    .benefits      { grid-template-columns: 1fr; }
    .b-card        { padding: 18px 12px 14px;}

    /* Earn steps – 2 col */
    .earn-step { min-width: calc(50% - 8px);  margin-top: 20px;}

    /* Do steps – 2 col */
    .do-steps { grid-template-columns: repeat(2, 1fr); gap: 10px; }

    /* Process – 2 col */
    .proc-step { min-width: calc(50% - 8px); }

    /* Elig – single col */
    .elig-grid { grid-template-columns: 1fr; }

    /* Apply */
    .apply-box         { padding: 28px 14px; border-radius: 14px; }
    .apply-positions   { font-size: 13px; padding: 10px 14px; }
    .apply-wa-btn      { font-size: 13px; padding: 12px 18px; width: 100%; justify-content: center; }

    /* Positions pill full width */
    .positions-pill { width: 100%; justify-content: center; font-size: 13px; }

    /* WA btn full width */
    .wa-btn { width: 100%; justify-content: center; font-size: 14px; }

    /* Support box */
    .support-box { flex-direction: column; gap: 12px; }
    .support-pillars { gap: 8px; }
    .support-pill    { font-size: 10px; padding: 6px 10px; }

    /* Earn highlight */
    .earn-highlight { grid-template-columns: 1fr; }

    /* FAQ */
    .faq-grid { grid-template-columns: 1fr; }
    .faq-item { padding: 14px; }

    /* Footer */
    .footer-inner { padding: 12px; }
    .footer-copy  { font-size: 11px; }

    /* Commitment bar */
    .commitment-bar p { font-size: 13px; }

    /* Quote right */
    .quote-right { flex-direction: column; padding-left: 0; }
    .quote-mark  { font-size: 28px !important; }
    .quote-right p { font-size: 15px !important; }

    /* Banner */
    .bottom-banner { border-radius: 14px; padding: 16px; gap: 12px; }
    .banner-left h2 { font-size: 16px; }
    .target { width: 50px; height: 50px; font-size: 24px; }

    /* Proc bottom */
    .proc-bottom { grid-template-columns: 1fr; }

    /* Section heading */
    .section-heading span { width: 24px; }
    .section-heading      { gap: 8px; }
}


/* ══════════════════════════════════════════════
   ≤ 400px  –  Extra Small Mobile (iPhone SE etc)
══════════════════════════════════════════════ */
@media (max-width: 400px) {

    /* NAV */
    nav { flex-direction: column; align-items: flex-start; gap: 8px; }
       .nav-cta {
       justify-content: center;
        margin: 0 auto;
    }

    /* HERO */
    .hero h1 { font-size: 20px;margin-bottom: 40px; }
    .badge-row { gap: 6px; }
    .badge     { font-size: 11px; padding: 5px 10px; }

    /* Mini features – stack single */
    .mini-features { grid-template-columns: 1fr; }

    /* All grids – single col */
    .cards-5, .photos-row, .benefits-row1, .benefits-row2,
    .benefits, .do-steps, .elig-grid, .faq-grid,
    .earn-highlight, .proc-bottom { grid-template-columns: 1fr; }

    /* Earn & process steps – single col */
    .earn-steps, .process-steps { flex-direction: column; gap: 14px; }
    .earn-step, .proc-step      { min-width: 100%; flex: none; }
    .earn-step::after, .proc-step::after,
    .selection-main::after, .steps-main::after { display: none !important; }

    /* Apply */
    .apply-box { padding: 22px 12px; }
    .apply-wa-btn { font-size: 12px; }

    /* Bottom banner */
    .bottom-banner { flex-direction: column; }
    .banner-right  { display: none; }   /* hide logo on tiny screens */

    /* Earning card */
    .earning-card { padding: 16px; }
    .earning-left h2 { font-size: 14px; }

    /* Target circle – smaller */
    .target { width: 44px; height: 44px; font-size: 20px; }
}


/* ══════════════════════════════════════════════
   ≥ 1400px  –  Large Desktop / TV
══════════════════════════════════════════════ */
@media (min-width: 1400px) {
    .container   { max-width: 1320px; }
    .hero        { margin: 0 auto; padding: 70px 2% 60px; }
    .hero h1     { font-size: 58px; }
    .section-title { font-size: 44px; }
    .cards-5     { grid-template-columns: repeat(5, 1fr); }
    .photos-row  { grid-template-columns: repeat(4, 1fr); }
    .benefits    { grid-template-columns: repeat(4, 1fr); }
    .benefits-row1 { grid-template-columns: repeat(3, 1fr); }
    .mini-features { grid-template-columns: repeat(4, 1fr); }
    .earn-step   { min-width: 0; }
}


/* ── Features strip (moved outside hero) ──── */
.features-main {
    position: static !important;
    right: auto !important;
    bottom: auto !important;
    padding: 0 5% 40px !important;
    background: #fff;
}

/* ── Hero: hide bg image on tablet/mobile ── */
@media (max-width: 900px) {
    .hero p {
       /* ──  background-image: none !important;
		background-size: cover !important;── */
		background-color: #eeeeee;
        opacity: 0.9;
        padding: 10px 15px;
        border-radius: 15px;
    }
}

/* ── Ensure banner-right logo img responsive ── */
.banner-right img { width: auto !important; max-width: 60px; height: auto; }

/* ── Mompreneur bg – hide on mobile ─────── */
@media (max-width: 768px) {
    .mompreneur-main {
        background-image: none !important;
    }
}