/* ── Cards Wrapper ── */









    .crowd-section {
      max-width: 1200px;
      margin: 0 auto;
      padding: 36px 0 0;
    }

    .crowd-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 26px;
    }

    /* ── Single Card ── */
    .cf-card {
      background: #fff;
      border-radius: 14px;
      overflow: hidden;
      box-shadow: 0 6px 28px rgba(0,0,0,0.11);
      display: flex;
      flex-direction: column;
      transition: transform 0.25s, box-shadow 0.25s;
      border: 1px solid #e4e8f0;
      margin-bottom: 40px;
    }

    .cf-card:hover {
      transform: translateY(-7px);
      box-shadow: 0 18px 48px rgba(0,0,0,0.15);
    }

    /* Image */
    .cf-img {
      width: 100%;
      height: 210px;
      overflow: hidden;
      position: relative;
      background: linear-gradient(135deg, #e8f5e9, #a5d6a7);
      display: flex; align-items: center; justify-content: center;
      font-size: 56px;
    }

    .cf-img img {
      width: 100%; height: 100%;
      object-fit: cover;
      transition: transform 0.4s;
      display: block;
    }


    

    .cf-card:hover .cf-img img { transform: scale(1.05); }

    /* Category tag on image */
    .cf-category {
      position: absolute;
      top: 12px; left: 12px;
      background: #ff691b;
      color: #fff;
      font-size: 10.5px;
      font-weight: 700;
      padding: 4px 12px;
      border-radius: 20px;
      letter-spacing: 0.5px;
      text-transform: uppercase;
      backdrop-filter: blur(4px);
    }

    /* Body */
    .cf-body {
      padding: 20px 20px 0;
      flex: 1;
      display: flex;
      flex-direction: column;
    }

    .cf-title {
      font-family: 'Nunito', sans-serif;
      font-size: 17px;
      font-weight: 900;
      color: #1a1a4e;
      line-height: 1.35;
      margin-bottom: 10px;
    }

    /* Meta row */
    .cf-meta {
      display: flex;
      align-items: center;
      gap: 16px;
      margin-bottom: 13px;
      flex-wrap: wrap;
    }

    .cf-meta-item {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 11.5px;
      color: #666;
      font-weight: 500;
    }

    .cf-meta-item i {
      font-size: 11px;
      color: #1a1a4e;
    }

    /* Description */
    .cf-desc {
      font-size: 12.8px;
      color: #555;
      line-height: 1.70;
      flex: 1;

      /* 4-line clamp */
      display: -webkit-box;
      -webkit-line-clamp: 5;
      -webkit-box-orient: vertical;
      overflow: hidden;
      margin-bottom: 18px;
    }

    /* Progress */
    .cf-progress-wrap {
      padding: 0 20px;
      margin-bottom: 6px;
    }

    .cf-raised-row {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 7px;
    }

    .cf-raised {
      font-size: 12.5px;
      font-weight: 700;
      color: #1a1a4e;
    }

    .cf-raised span { color: #2e7d32; }

    .cf-target {
      font-size: 12px;
      color: #666;
      font-weight: 500;
    }

    .cf-bar-bg {
      width: 100%;
      height: 8px;
      background: #e8eaf0;
      border-radius: 10px;
      overflow: hidden;
      margin-bottom: 5px;
    }

    .cf-bar-fill {
      height: 100%;
      border-radius: 10px;
      background: linear-gradient(90deg, #2e7d32, #66bb6a);
      transition: width 1.2s cubic-bezier(.4,0,.2,1);
    }

    .cf-percent {
      text-align: center;
      font-size: 11.5px;
      color: #888;
      font-weight: 600;
      margin-bottom: 16px;
    }

    /* Buttons */
    .cf-buttons {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
      padding: 0 20px 20px;
    }

    .cf-btn {
      padding: 10px 0;
      border-radius: 8px;
      font-family: 'Poppins', sans-serif;
      font-size: 13px;
      font-weight: 600;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 7px;
      border: none;
      transition: all 0.2s;
      letter-spacing: 0.2px;
    }

    .cf-btn-read {
      background: #fff;
      color: #1a1a4e;
      border: 2px solid #d0d5e8;
    }
    .cf-btn-read:hover {
      background: #f0f3ff;
      border-color: #1a1a4e;
    }

    .cf-btn-donate {
      background: #1a1a4e;
      color: #fff;
      border: 2px solid #1a1a4e;
    }
    .cf-btn-donate:hover {
      background: #2b2d7e;
      border-color: #2b2d7e;
    }

    /* ── Responsive ── */
    @media (max-width: 1024px) {
      .crowd-row { grid-template-columns: repeat(2, 1fr); }
    }

    @media (max-width: 640px) {
      .crowd-row { grid-template-columns: 1fr; }
      .crowd-section { padding: 24px 0 0; }
      body { padding: 0 14px 40px; }
    }