 /* ---- Page Hero ---- */
    .page-hero {
      background:
        radial-gradient(900px 600px at 90% -10%, rgba(188,153,67,0.18), transparent 60%),
        radial-gradient(700px 500px at -5% 110%, rgba(231,2,23,0.10), transparent 60%),
        linear-gradient(135deg, #01215C 0%, #0a3a8c 100%);
      color: #fff;
      padding: 70px 0 80px;
      position: relative;
      overflow: hidden;
    }
    .page-hero::before {
      content: "";
      position: absolute; inset: 0;
      background-image:
        linear-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px);
      background-size: 60px 60px;
      mask-image: radial-gradient(ellipse at center, black 30%, transparent 75%);
      pointer-events: none;
    }
    .page-hero h1 { color: #fff; font-size: clamp(34px, 4.5vw, 52px); font-weight: 800; letter-spacing: -0.02em; }
    .page-hero .breadcrumb-item,
    .page-hero .breadcrumb-item a { color: rgba(255,255,255,0.7); text-decoration: none; font-size: 14px; }
    .page-hero .breadcrumb-item.active { color: var(--finpe-gold); }

    /* ---- Service Nav Pills ---- */
    .service-nav { background: #fff; border-bottom: 1px solid rgba(1,33,92,0.08); position: sticky; top: 68px; z-index: 100; }
    .service-nav .container { overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
    .service-nav .container::-webkit-scrollbar { display: none; }
    .service-nav ul { list-style: none; margin: 0; padding: 0; display: inline-flex; gap: 4px; }
    .service-nav ul li a {
      display: inline-block; padding: 14px 18px;
      font-size: 13px; font-weight: 600; color: var(--finpe-navy);
      text-decoration: none; border-bottom: 2px solid transparent;
      transition: all .2s ease; white-space: nowrap;
    }
    .service-nav ul li a:hover,
    .service-nav ul li a.active { color: var(--finpe-red); border-bottom-color: var(--finpe-red); }

    /* ---- Service blocks ---- */
    .service-block { padding: 80px 0; }
    .service-block:nth-child(even) { background: var(--finpe-bg-soft); }

    .svc-icon-wrap {
      width: 72px; height: 72px; border-radius: 20px;
      display: inline-flex; align-items: center; justify-content: center;
      font-size: 30px; margin-bottom: 20px;
      background: linear-gradient(135deg, rgba(1,33,92,0.08), rgba(188,153,67,0.12));
      color: var(--finpe-navy);
    }
    .svc-icon-wrap.red   { background: rgba(231,2,23,0.08);   color: var(--finpe-red); }
    .svc-icon-wrap.gold  { background: rgba(188,153,67,0.14); color: var(--finpe-gold); }
    .svc-icon-wrap.navy  { background: rgba(1,33,92,0.09);    color: var(--finpe-navy); }

    .svc-tag {
      display: inline-block; padding: 5px 14px;
      border-radius: 50px; font-size: 12px; font-weight: 700;
      letter-spacing: 0.08em; text-transform: uppercase;
      background: rgba(188,153,67,0.13); color: var(--finpe-gold);
      border: 1px solid rgba(188,153,67,0.3); margin-bottom: 14px;
    }

    .svc-title { font-size: clamp(22px, 3vw, 32px); font-weight: 800; color: var(--finpe-navy); margin-bottom: 16px; }

    .svc-desc { font-size: 16px; line-height: 1.8; color: var(--finpe-text); margin-bottom: 16px; }

    /* Checklist */
    .svc-list { list-style: none; padding: 0; margin: 18px 0 0; }
    .svc-list li {
      padding: 7px 0 7px 30px;
      position: relative;
      font-size: 15px; color: var(--finpe-text); line-height: 1.55;
    }
    .svc-list li::before {
      content: "\f00c";
      font-family: "Font Awesome 6 Free"; font-weight: 900;
      color: var(--finpe-gold);
      position: absolute; left: 0; top: 8px; font-size: 13px;
    }

    /* Tick feature rows (✔ style) */
    .tick-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 24px; margin-top: 18px; }
    .tick-grid .tick-item {
      display: flex; align-items: flex-start; gap: 10px;
      font-size: 14px; color: var(--finpe-text); line-height: 1.5;
    }
    .tick-item .ti { color: var(--finpe-gold); font-size: 15px; flex-shrink: 0; margin-top: 2px; }

    @media (max-width: 575.98px) { .tick-grid { grid-template-columns: 1fr; } }

    /* Benefits box */
    .benefits-box {
      background: #fff;
      border-radius: 20px;
      padding: 32px;
      border: 1px solid rgba(1,33,92,0.08);
      height: 100%;
    }
    .benefits-box h5 { font-size: 17px; margin-bottom: 14px; color: var(--finpe-navy); }
    .benefits-box .b-item {
      display: flex; align-items: flex-start; gap: 10px;
      font-size: 14px; color: var(--finpe-text); padding: 6px 0;
      border-bottom: 1px dashed rgba(1,33,92,0.08);
    }
    .benefits-box .b-item:last-child { border: none; }
    .benefits-box .b-item i { color: var(--finpe-red); font-size: 14px; margin-top: 3px; flex-shrink: 0; }

    /* Illustration panel */
    .svc-illust-panel {
      background: #fff;
      border-radius: 24px;
      padding: 40px;
      display: flex; align-items: center; justify-content: center;
      box-shadow: 0 10px 40px rgba(1,33,92,0.07);
      min-height: 320px;
    }
    .svc-illust-panel svg { width: 100%; max-width: 340px; height: auto; }

    /* CTA strip */
    .services-cta { padding: 80px 0 80px; }