@charset "utf-8";
/* CSS Document */

 :root {
      --page-bg: #183987;
      --blue: #183987;
      --rose: #4d7cbe;
      --white: #ffffff;

      --corner-1: #4fcf68;
      --corner-2: #183987;
      --corner-3: #4d7cbe;
      --corner-4: #183987;
      --corner-5: #4d7cbe;

      --arrow-1: #183987;
      --arrow-2: #4d7cbe;
      --arrow-3: #183987;
      --arrow-4: #4d7cbe;
	  --section-bg: #f7f8fb;
      --card-bg: #ffffff;
      --text-dark: #182033;
      --text-muted: #758096;
      --border: #e8ebf1;
      --accent: #1e438f;
      --shadow: 0 16px 40px rgba(25, 38, 69, 0.08);
    }

    * {
      box-sizing: border-box;
    }

 

    .division-wrapper {
      width: 100%;
      max-width: 1360px;
      margin: 0 auto; border: 1px solid rgba(255,255,255,1.00); border-top-left-radius: 66px;
		border-bottom-right-radius: 66px;
    }

    .division-track {
      display: flex;
      flex-wrap: nowrap;
      width: 100%;
      min-height: 432px;
    }

    .division-panel {
      --corner-color: transparent;
      position: relative;
      flex: 0 0 20%;
      min-width: 0;
      min-height: 432px;
      overflow: visible;
      color: var(--white);
      background: var(--corner-color); border-bottom-right-radius: 80px;
    }
	

    /*
    |--------------------------------------------------------------------------
    | Keep each outgoing arrow above the next panel
    |--------------------------------------------------------------------------
    */

    .division-panel:nth-child(1) {
      z-index: 5;
    }

    .division-panel:nth-child(2) {
      z-index: 4;
    }

    .division-panel:nth-child(3) {
      z-index: 3;
    }

    .division-panel:nth-child(4) {
      z-index: 2;
    }

    .division-panel:nth-child(5) {
      z-index: 1;
    }

    .panel-blue {
      background: var(--corner-color);
    }
	  .panel-blue-1 {
      background:rgba(1,31,83,1.00); border-bottom-right-radius: 70px;
    }

    .panel-rose {
      background: var(--corner-color);
    }

    /*
    |--------------------------------------------------------------------------
    | Main rounded panel surface
    |--------------------------------------------------------------------------
    */

    .panel-surface {
      position: absolute;
      z-index: 1;
      inset: 0;
      overflow: hidden;
      border-top-left-radius: 64px;
    }
	 .panel-surface-1 {
      position: absolute;
      z-index: 1;
      inset: 0;
      overflow: hidden;
      border-bottom-right-radius: 64px;
    }
    .panel-blue .panel-surface {
      background: var(--blue);
    }

    .panel-rose .panel-surface {
      background: var(--rose);
    }

    /*
    |--------------------------------------------------------------------------
    | Text
    |--------------------------------------------------------------------------
    */

    .panel-content {
      position: relative;
      z-index: 4;
      min-height: 432px;
      padding: 40px 36px 36px;
    }

    .division-title {
      margin: 0;
      color: var(--white);
      font-size:1.9rem;
      font-weight: 700;
      line-height: 1.08;
      letter-spacing: -0.035em;
    }

    .division-copy {
      position: absolute; padding-top: 50px;
      left: 36px;
      right: 28px;
      margin: 0;
      color: var(--white);
      font-size: .95rem;
      font-weight: 400;
      line-height: 1.35;
    }
 .division-copy-1 {
      position: absolute; padding-top: 50px;
      left: 36px;
      right: 28px;
      margin: 0;
      color: var(--white);
      font-size: .95rem;
      font-weight: 400;
      line-height: 1.35;
    }

    /*
    |--------------------------------------------------------------------------
    | Arrow connectors
    |--------------------------------------------------------------------------
    */

    .panel-arrow {
      position: absolute;
      z-index: 20;
      top: 79%;
      right: -28px;
      width: 0;
      height: 0;
      transform: translateY(-50%);
      border-top: 28px solid transparent;
      border-bottom: 28px solid transparent;
      border-left: 28px solid currentColor;
      pointer-events: none;
    }

    .arrow-red {
      color: var(--arrow-1);
    }

    .arrow-green {
      color: var(--arrow-2);
    }

    .arrow-yellow {
      color: var(--arrow-3);
    }

    .arrow-orange {
      color: var(--arrow-4);
    }

    /*
    |--------------------------------------------------------------------------
    | Corner colours
    |--------------------------------------------------------------------------
    */

    .corner-green {
      --corner-color: var(--corner-1);
    }

    .corner-magenta {
      --corner-color: var(--corner-2);
    }

    .corner-yellow {
      --corner-color: var(--corner-3);
    }

    .corner-orange {
      --corner-color: var(--corner-4);
    }

    .corner-cyan {
      --corner-color: var(--corner-5);
    }

    /*
    |--------------------------------------------------------------------------
    | Tablet
    |--------------------------------------------------------------------------
    */

    @media (max-width: 1199.98px) and (min-width: 576px) {
      .division-section {
        align-items: flex-start;
        min-height: auto;
        padding: 45px 20px;
      }

      .division-wrapper {
        overflow-x: auto;
        overflow-y: hidden;
        scrollbar-width: thin;
      }

      .division-track {
        width: 1220px;
      }

      .division-panel {
        flex: 0 0 244px;
      }
    }

    /*
    |--------------------------------------------------------------------------
    | Mobile: full-width panels, stacked one below another
    |--------------------------------------------------------------------------
    */

    @media (max-width: 575.98px) {
     

      .division-section {
        display: block;
        min-height: auto;
        padding: 18px 14px;
      }

      .division-wrapper {
        width: 100%;
        max-width: none;
        overflow: visible;
      }

      .division-track {
        display: block;
        width: 100%;
        min-height: 0;
      }

      .division-panel {
        width: 100%;
        min-height: 420px;
        margin-bottom: 36px;
        overflow: hidden;
      }

      .division-panel:last-child {
        margin-bottom: 0;
      }

      .panel-surface {
        border-top-left-radius: 58px;
      }

      .panel-content {
        min-height: 420px;
        padding: 34px 28px 32px;
      }

      .division-title {
        font-size: 2.15rem;
      }

      .division-copy {
        position: static;
        margin-top: 82px;
        font-size: 1.08rem;
        line-height: 1.42;
      }
 .division-copy-1 {
        position: static;
        margin-bottom: 22px;
        font-size: 1.08rem;
        line-height: 1.42;
      }
      .division-copy br {
        display: none;
      }

      .panel-arrow {
        display: block;
        top: auto;
        right: 50%;
        bottom: -18px;
        transform: translateX(50%);
        border-top: 22px solid currentColor;
        border-right: 22px solid transparent;
        border-left: 22px solid transparent;
        border-bottom: 0;
      }

      .division-panel:last-child .panel-arrow {
        display: none;
      }
    }

.button-row {
      position: relative;
      z-index: 4;
      margin-top: auto;
      padding-top: 24px;
    }

    .read-more-btn {
      min-width: 112px;
      padding: 8px 16px;
      border: 0;
      border-radius: 4px;
      background: var(--button-bg);
      color: var(--white);
      font-size: 1rem;
      line-height: 1.25;
      text-decoration: none;
      transition: transform .2s ease, background-color .2s ease;
    }

    .read-more-btn:hover,
    .read-more-btn:focus {
      color: var(--white);
      background: #00509f;
      transform: translateY(-2px);
    }
.clients-section {
      overflow: hidden;
      padding: 90px 0;
      background:
        radial-gradient(circle at top left, rgba(30, 67, 143, 0.08), transparent 34%),
        var(--section-bg);
    }

    .clients-heading {
      max-width: 700px;
      margin: 0 auto 42px;
      text-align: center;
    }

    .clients-kicker {
      display: inline-block;
      margin-bottom: 12px;
      color: var(--accent);
      font-size: .82rem;
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
    }

    .clients-title {
      margin: 0 0 12px;
      font-size: clamp(2rem, 4vw, 3.25rem);
      font-weight: 700;
      letter-spacing: -.04em;
    }

    .clients-subtitle {
      margin: 0;
      color: var(--text-muted);
      font-size: 1.05rem;
      line-height: 1.7;
    }

    .clients-slider-shell {
      position: relative;
      max-width: 1320px;
      margin: 0 auto;
      padding: 0 58px;
    }

    .clients-slider {
      overflow: hidden;
      border-radius: 24px;
      background: rgba(255,255,255,.72);
      backdrop-filter: blur(12px);
      box-shadow: var(--shadow);
    }

    .clients-track {
      display: flex;
      align-items: stretch;
      gap: 20px;
      width: max-content;
      padding: 24px;
      will-change: transform;
    }

    .client-card {
      flex: 0 0 230px;
      min-height: 150px;
      display: grid;
      place-items: center;
      padding: 24px;
      border: 1px solid var(--border);
      border-radius: 18px;
      background: var(--card-bg);
      transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
    }

    .client-card:hover {
      transform: translateY(-7px);
      border-color: rgba(30,67,143,.24);
      box-shadow: 0 16px 32px rgba(25,38,69,.12);
    }

    .client-logo {
      max-width: 155px;
      max-height: 68px;
      object-fit: contain;
      filter: grayscale(1);
      opacity: .68;
      transition: filter .3s ease, opacity .3s ease, transform .3s ease;
    }

    .client-card:hover .client-logo {
      filter: grayscale(0);
      opacity: 1;
      transform: scale(1.04);
    }

    .client-placeholder {
      display: flex;
      align-items: center;
      justify-content: center;
      min-width: 145px;
      min-height: 58px;
      padding: 12px 18px;
      border-radius: 12px;
      background: linear-gradient(135deg, #eef2f8, #fff);
      color: #44506a;
      font-size: 1.1rem;
      font-weight: 700;
      text-align: center;
    }

    .slider-button {
      position: absolute;
      z-index: 5;
      top: 50%;
      width: 46px;
      height: 46px;
      display: grid;
      place-items: center;
      border: 0;
      border-radius: 50%;
      color: #fff;
      background: var(--accent);
      box-shadow: 0 12px 26px rgba(30,67,143,.28);
      transform: translateY(-50%);
      transition: transform .25s ease;
    }

    .slider-button:hover {
      transform: translateY(-50%) scale(1.08);
    }

    .slider-button.prev { left: 0; }
    .slider-button.next { right: 0; }

    .clients-slider-shell::before,
    .clients-slider-shell::after {
      content: "";
      position: absolute;
      z-index: 3;
      top: 0;
      bottom: 0;
      width: 90px;
      pointer-events: none;
    }

    .clients-slider-shell::before {
      left: 58px;
      background: linear-gradient(to right, var(--section-bg), transparent);
    }

    .clients-slider-shell::after {
      right: 58px;
      background: linear-gradient(to left, var(--section-bg), transparent);
    }

    @media (max-width: 991.98px) {
      .clients-section { padding: 70px 0; }
      .clients-slider-shell { padding: 0 50px; }
      .client-card { flex-basis: 205px; min-height: 140px; }
      .clients-slider-shell::before { left: 50px; }
      .clients-slider-shell::after { right: 50px; }
    }

    @media (max-width: 575.98px) {
      .clients-section { padding: 54px 0; }

      .clients-heading {
        padding: 0 18px;
        margin-bottom: 30px;
      }

      .clients-slider-shell { padding: 0 14px; }
      .clients-slider { border-radius: 18px; }
      .clients-track { gap: 14px; padding: 18px; }

      .client-card {
        flex-basis: 170px;
        min-height: 120px;
        padding: 18px;
      }

      .client-placeholder {
        min-width: 120px;
        min-height: 52px;
        font-size: .95rem;
      }

      .slider-button,
      .clients-slider-shell::before,
      .clients-slider-shell::after {
        display: none;
      }
    }

.division-track {
  display: flex;
  align-items: stretch;
}

.division-panel {
  display: flex;
  position: relative;
}

.panel-content {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

/* Button stays at the bottom */
.panel-content .read-more-wrap {
  margin-top: auto;
  padding-top: 0;
  margin-bottom: 45px;
}

.division-panel {
  min-height: 480px;
}

@media (max-width: 767.98px) {
  .division-track {
    display: block;
  }

  .division-panel {
    min-height: auto;
  }

  .panel-content {
    min-height: 450px;
  }
}


.division-buttons {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
}

.division-buttons .btn {
    width: 100%;
    min-width: 0;
    min-height: 15px;
    padding: 10px 8px;
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* Mobile */
@media (max-width: 576px) {
    .division-buttons {
        gap: 4px;
    }

    .division-buttons .btn {
        padding: 8px 3px;
        font-size: 10px;
        line-height: 1.2;
        min-height: 15px;
    }
}