:root{
      --navy:#08213d;
      --navy-2:#0d315d;
      --blue:#315ce8;
      --purple:#49245f;
      --yellow:#ffc928;
      --cyan:#58d8d2;
      --text:#10233f;
      --muted:#6e7b8e;
      --line:#dce3eb;
      --soft:#f5f7f9;
      --white:#ffffff;
      --radius:22px;
      --shadow:0 18px 50px rgba(8,33,61,.10);
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:"Manrope",sans-serif;
      color:var(--text);
      background:#fff;
      overflow-x:hidden;
      line-height:1.6;
    }

    h1,h2,h3,h4,h5,h6{
      color:var(--navy);
      font-weight:800;
      letter-spacing:-.035em;
    }

    .section-space{padding:92px 0}
    .section-soft{background:var(--soft)}
    .section-title{
      font-size:clamp(2rem,4vw,3.3rem);
      line-height:1.08;
      margin-bottom:1rem;
    }
    .section-copy{
      color:var(--muted);
      max-width:760px;
    }
    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:.4rem;
      padding:.45rem .8rem;
      border-radius:999px;
      background:var(--yellow);
      color:#172334;
      font-size:.72rem;
      font-weight:800;
      text-transform:uppercase;
      letter-spacing:.08em;
    }

    /* HERO */
    .hero{
      position:relative;
      min-height:720px;
      display:flex;
      align-items:center;
      isolation:isolate;
      overflow:hidden;
      color:#fff;
      background:
        linear-gradient(90deg,rgba(5,25,47,.96) 0%,rgba(5,25,47,.82) 45%,rgba(5,25,47,.35) 100%),
        url("../img/bidaya.webp") center/cover no-repeat;
    }
    .hero::after{
      content:"";
      position:absolute;
      inset:auto -10% -45% auto;
      width:520px;
      height:520px;
      border-radius:50%;
      background:rgba(49,92,232,.2);
      filter:blur(2px);
      z-index:-1;
    }
    .hero-card{
      background: rgba(8, 45, 82, 0.52);
      backdrop-filter:blur(10px);
      border:1px solid rgba(255,255,255,.12);
      border-radius:var(--radius);
      padding:clamp(1.7rem,4vw,3.2rem);
      box-shadow:var(--shadow);
      height:100%;
    }
    .hero h1{
      color:#fff;
      font-size:clamp(2.35rem,5vw,5rem);
      line-height:.98;
      max-width:760px;
      margin:1.2rem 0;
    }
    .hero-copy{
      color:rgba(255,255,255,.86);
      max-width:650px;
      font-size:1.05rem;
    }
    .hero-meta{
      height:100%;
      min-height:170px;
      padding:1.5rem;
      border-radius:20px;
      color:#fff;
      display:flex;
      flex-direction:column;
      justify-content:space-between;
      box-shadow:0 16px 40px rgba(0,0,0,.18);
    }
    .meta-purple{background: #49245fc2;}
    .meta-blue{background:var(--blue)}
    .meta-lilac{background:#7b72ad}
    .hero-meta small{
      font-size:.75rem;
      text-transform:uppercase;
      letter-spacing:.08em;
      font-weight:800;
      opacity:.85;
    }
    .hero-meta h3{
      color:#fff;
      font-size:1.4rem;
      margin:0;
    }
    .hero-meta p{
      margin:0;
      font-size:.88rem;
      color:rgba(255,255,255,.86);
    }

    /* CARDS */
    .feature-card,
    .ecosystem-card,
    .track-card,
    .step-card{
      height:100%;
      background:#fff;
      border:1px solid var(--line);
      border-radius:18px;
      padding:1.4rem;
      transition:.25s ease;
    }
    .feature-card:hover,
    .ecosystem-card:hover,
    .track-card:hover,
    .step-card:hover{
      transform:translateY(-5px);
      box-shadow:var(--shadow);
      border-color:transparent;
    }
    .feature-card h4,
    .ecosystem-card h4,
    .track-card h4,
    .step-card h4{
      font-size:1rem;
      margin-bottom:.65rem;
      text-transform:uppercase;
      letter-spacing:-.01em;
    }
    .feature-card p,
    .ecosystem-card p,
    .track-card p,
    .step-card p{
      color:var(--muted);
      font-size:.9rem;
      margin:0;
    }

    .price-card{
      height:100%;
      background:var(--navy);
      color:#fff;
      border-radius:22px;
      padding:1rem;
      overflow:hidden;
      box-shadow:var(--shadow);
    }
    .price-card img{
      width:100%;
      aspect-ratio:16/10;
      object-fit:cover;
      border-radius:16px;
      margin-bottom:1.25rem;
    }
    .price-card h3{color:#fff;font-size:2rem}
    .price-card p{color:rgba(255,255,255,.78)}

    .icon-box{
      width:44px;
      height:44px;
      border-radius:13px;
      display:grid;
      place-items:center;
      background:#e9f8f7;
      color:var(--navy);
      font-size:1.2rem;
      margin-bottom:1rem;
    }

    .info-banner{
      border-radius:16px;
      padding:1rem 1.2rem;
      background:#b9d7fb;
      color:#17345e;
      font-size:.9rem;
    }

    /* JOURNEY */
    .journey-wrap{
      position:relative;
    }
    .journey-line{
      position:absolute;
      left:9%;
      right:9%;
      top:57px;
      height:2px;
      background:var(--line);
      z-index:0;
    }
    .journey-card{
      position:relative;
      z-index:1;
      height:100%;
      min-height:180px;
      border:1px solid var(--line);
      border-radius:20px;
      padding:1.6rem 1rem;
      text-align:center;
      background:#fff;
    }
    .journey-card.active{
      background:#292a30;
      color:#fff;
      border-color:#292a30;
    }
    .journey-card.active h4,
    .journey-card.active .step-number{color:#fff}
    .journey-icon{
      width:74px;
      height:74px;
      margin:0 auto 1rem;
      border-radius:50%;
      border:1px solid currentColor;
      display:grid;
      place-items:center;
      font-size:1.4rem;
      background:#fff;
      color:var(--navy);
    }
    .journey-card h4{
      font-size:.95rem;
      text-transform:uppercase;
      margin:0;
    }
    .step-number{
      font-size:.68rem;
      text-transform:uppercase;
      letter-spacing:.12em;
      color:var(--muted);
      font-weight:800;
    }

    /* PROCESS */
    .process-kicker{
      display:flex;
      align-items:center;
      gap:.65rem;
      color:#28a7a1;
      font-size:.75rem;
      letter-spacing:.16em;
      text-transform:uppercase;
      font-weight:800;
    }
    .process-kicker::before{
      content:"";
      width:30px;
      height:2px;
      background:#28a7a1;
    }
    .step-card{
      position:relative;
      padding:1.4rem;
      min-height:230px;
    }
    .step-card .badge-num{
      position:absolute;
      right:14px;
      bottom:14px;
      width:24px;
      height:24px;
      border-radius:50%;
      background:#24272d;
      color:#fff;
      display:grid;
      place-items:center;
      font-size:.65rem;
      font-weight:800;
    }

    /* ELIGIBILITY */
    .eligibility{
      border-radius:18px;
      overflow:hidden;
      border:1px solid var(--line);
      background:#fff;
      max-width:760px;
    }
    .eligibility-head{
      padding:1rem 1.25rem;
      color:#fff;
      background:var(--navy);
      display:flex;
      justify-content:space-between;
      font-size:.72rem;
      text-transform:uppercase;
      letter-spacing:.12em;
      font-weight:800;
    }
    .eligibility-row{
      display:grid;
      grid-template-columns:1fr 1.4fr;
      gap:1rem;
      padding:1rem 1.25rem;
      border-top:1px solid var(--line);
      font-size:.87rem;
    }
    .eligibility-row strong{
      font-size:.72rem;
      text-transform:uppercase;
      letter-spacing:.1em;
    }
    .eligibility-row span{
      color:var(--muted);
      text-align:right;
    }

    @media (max-width:991.98px){
      .hero{
        min-height:auto;
        padding:90px 0;
        background-position:65% center;
      }
      .journey-line{display:none}
      .section-space{padding:72px 0}
    }

    @media (max-width:767.98px){
      .hero{
        padding:68px 0;
        background:
          linear-gradient(rgba(5,25,47,.9),rgba(5,25,47,.9)),
          url("https://images.unsplash.com/photo-1523240795612-9a054b0db644?auto=format&fit=crop&w=1000&q=85") center/cover no-repeat;
      }
      .hero h1{font-size:2.55rem}
      .hero-card{padding:1.5rem}
      .hero-meta{min-height:145px}
      .section-space{padding:58px 0}
      .eligibility-row{
        grid-template-columns:1fr;
      }
      .eligibility-row span{text-align:left}
    }