/* =====================================================
           PAGE HERO
        ====================================================== */

  .ib-about-hero {
      display: flex;
      align-items: center;
      position: relative;
      overflow: hidden;

      background:
          linear-gradient(90deg,
              rgba(255, 255, 255, .99) 0%,
              rgba(255, 255, 255, .96) 37%,
              rgba(255, 255, 255, .68) 57%,
              rgba(255, 255, 255, .08) 100%),
          url("/assets/images/photo-1497366811353-6870744d04b2.avif") center / cover no-repeat;
      padding: 60px 0;
  }

  .ib-about-hero-content {
      position: relative;
      z-index: 2;
  }

  .ib-about-hero h1 {
      font-size: clamp(48px, 6vw, 82px);
      line-height: .98;
      margin-bottom: 25px;
  }

  .ib-about-hero h1 span {
      color: var(--ib-primary);
  }

  .ib-about-hero-description {
      max-width: 650px;
      color: #4e5c5e;
      font-size: 17px;
      line-height: 1.7;
      margin-bottom: 32px;
  }

  .ib-hero-side-note {
      position: absolute;
      right: 4%;
      top: 50%;
      transform: translateY(-50%);
      width: 180px;
      color: rgba(0, 80, 79, .8);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: .16em;
      text-transform: uppercase;
      line-height: 1.8;
  }

  .ib-hero-side-note::after {
      content: "";
      display: block;
      width: 32px;
      height: 2px;
      background: var(--ib-primary);
      margin-top: 14px;
  }


  /* =====================================================
           INTRO / WHO WE ARE
        ====================================================== */

  .ib-intro-image {
      min-height: 540px;
      border-radius: 10px;
      background:
          linear-gradient(0deg,
              rgba(0, 55, 54, .25),
              rgba(0, 55, 54, .02)),
          url("/assets/images/photo-1521737711867-e3b97375f902.avif") center / cover no-repeat;
  }

  .ib-intro-content {
      padding-left: 30px;
  }

  .ib-intro-highlight {
      border-left: 3px solid var(--ib-primary);
      padding-left: 20px;
      margin-top: 30px;
  }

  .ib-intro-highlight p {
      font-family: "Manrope", sans-serif;
      font-size: 20px;
      font-weight: 700;
      line-height: 1.4;
      color: #263536;
      margin-bottom: 0;
  }


  /* =====================================================
           PURPOSE CARDS
        ====================================================== */

  .ib-purpose-card {
      height: 100%;
      border: 1px solid var(--ib-border);
      background: #fff;
      border-radius: 8px;
      padding: 30px;
      transition: .3s ease;
  }

  .ib-purpose-card:hover {
      transform: translateY(-5px);
      border-color: #a8cbc6;
      box-shadow: 0 18px 45px rgba(0, 70, 69, .08);
  }

  .ib-purpose-icon {
      width: 58px;
      height: 58px;
      border-radius: 50%;
      background: var(--ib-primary-light);
      color: var(--ib-primary);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 25px;
      margin-bottom: 23px;
  }

  .ib-purpose-card h3 {
      font-size: 21px;
      margin-bottom: 12px;
  }

  .ib-purpose-card p {
      color: var(--ib-muted);
      font-size: 14px;
      margin: 0;
  }


  /* =====================================================
           BUSINESS MODEL
        ====================================================== */

  .ib-business-model {
      background: var(--ib-light);
  }

  .ib-model-visual {
      min-height: 520px;
      border-radius: 10px;
      position: relative;
      overflow: hidden;

      background:
          linear-gradient(120deg,
              rgba(0, 53, 54, .86),
              rgba(0, 80, 79, .38)),
          url("/assets/images/photo-1526304640581-d334cdbbf45e.avif") center / cover no-repeat;
  }

  .ib-model-visual-content {
      position: absolute;
      left: 35px;
      right: 35px;
      bottom: 35px;
      color: #fff;
  }

  .ib-model-visual-content h3 {
      font-size: 38px;
      line-height: 1.05;
      max-width: 550px;
  }

  .ib-model-step {
      display: flex;
      gap: 18px;
      padding: 22px 0;
      border-bottom: 1px solid var(--ib-border);
  }

  .ib-model-step:last-child {
      border-bottom: 0;
  }

  .ib-model-number {
      width: 45px;
      height: 45px;
      min-width: 45px;
      border-radius: 50%;
      border: 1px solid #9dc6c1;
      color: var(--ib-primary);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      font-weight: 800;
  }

  .ib-model-step h3 {
      font-size: 18px;
      margin-bottom: 5px;
  }

  .ib-model-step p {
      color: var(--ib-muted);
      font-size: 13px;
      margin: 0;
  }


  /* =====================================================
           WHO WE WORK WITH
        ====================================================== */

  .ib-client-card {
      height: 100%;
      background: #fff;
      border: 1px solid var(--ib-border);
      border-radius: 8px;
      padding: 27px;
      transition: .3s ease;
  }

  .ib-client-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 18px 40px rgba(0, 60, 59, .08);
  }

  .ib-client-card i {
      font-size: 28px;
      color: var(--ib-primary);
      margin-bottom: 20px;
      display: block;
  }

  .ib-client-card h3 {
      font-size: 19px;
      margin-bottom: 9px;
  }

  .ib-client-card p {
      font-size: 13px;
      color: var(--ib-muted);
      margin-bottom: 0;
  }


  /* =====================================================
           VALUES
        ====================================================== */

  .ib-values-section {
      background: #f1f7f5;
  }

  .ib-value-item {
      background: #fff;
      border-radius: 8px;
      padding: 28px;
      height: 100%;
      border: 1px solid var(--ib-border);
  }

  .ib-value-number {
      color: var(--ib-primary);
      font-size: 11px;
      font-weight: 800;
      letter-spacing: .16em;
      margin-bottom: 25px;
  }

  .ib-value-item h3 {
      font-size: 20px;
      margin-bottom: 10px;
  }

  .ib-value-item p {
      color: var(--ib-muted);
      font-size: 13px;
      margin: 0;
  }


  /* =====================================================
           GLOBAL PERSPECTIVE
        ====================================================== */

  .ib-perspective-image {
      min-height: 560px;
      border-radius: 10px;

      background:
          linear-gradient(0deg,
              rgba(0, 40, 42, .56),
              rgba(0, 40, 42, .05)),
          url("/assets/images/ambre-esteve-gdCwuKCuJWY-unsplash.jpg") center / cover no-repeat;

      position: relative;
  }

  .ib-perspective-quote {
      position: absolute;
      left: 30px;
      bottom: 30px;
      max-width: 460px;
      color: #fff;
  }

  .ib-perspective-quote p {
      font-family: "Manrope", sans-serif;
      font-size: 27px;
      font-weight: 700;
      line-height: 1.2;
      margin-bottom: 15px;
  }

  .ib-perspective-quote span {
      color: rgba(255, 255, 255, .7);
      font-size: 12px;
      text-transform: uppercase;
      letter-spacing: .15em;
  }


  /* =====================================================
           APPROACH FEATURES
        ====================================================== */

  .ib-approach-item {
      display: flex;
      gap: 18px;
      padding: 22px 0;
      border-bottom: 1px solid var(--ib-border);
  }

  .ib-approach-item:last-child {
      border-bottom: 0;
  }

  .ib-approach-icon {
      width: 48px;
      height: 48px;
      min-width: 48px;
      background: var(--ib-primary-light);
      color: var(--ib-primary);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
  }

  .ib-approach-item h3 {
      font-size: 18px;
      margin-bottom: 5px;
  }

  .ib-approach-item p {
      color: var(--ib-muted);
      font-size: 13px;
      margin: 0;
  }



  /* =====================================================
           RESPONSIVE
        ====================================================== */

  @media (max-width: 1199.98px) {

      .ib-nav .nav-link {
          padding-left: 8px !important;
          padding-right: 8px !important;
          font-size: 12px;
      }

      .ib-header-actions .ib-btn-primary,
      .ib-header-actions .ib-btn-outline {
          padding-left: 11px;
          padding-right: 11px;
      }

      .ib-hero-side-note {
          display: none;
      }
  }


  @media (max-width: 991.98px) {

      .ib-section {
          padding: 70px 0;
      }

      .ib-nav .nav-link {
          padding: 11px 0 !important;
      }

      .ib-header-actions {
          padding: 15px 0;
          border-top: 1px solid var(--ib-border);
          margin-top: 10px;
      }

      .ib-about-hero {
          min-height: 620px;

          background:
              linear-gradient(90deg,
                  rgba(255, 255, 255, .97),
                  rgba(255, 255, 255, .72)),
              url("/assets/images/photo-1497366811353-6870744d04b2.avif") center / cover no-repeat;
      }

      .ib-intro-content {
          padding-left: 0;
      }

      .ib-model-visual {
          min-height: 420px;
      }

      .ib-perspective-image {
          min-height: 430px;
      }
  }


  @media (max-width: 767.98px) {

      .ib-section {
          padding: 55px 0;
      }

      .ib-section-title {
          font-size: 35px;
      }

      .ib-about-hero {
          min-height: auto;
          padding: 85px 0 70px;
      }

      .ib-about-hero h1 {
          font-size: 47px;
      }

      .ib-about-hero-description {
          font-size: 15px;
      }

      .ib-intro-image {
          min-height: 350px;
      }

      .ib-model-visual {
          min-height: 350px;
      }

      .ib-model-visual-content {
          left: 25px;
          right: 25px;
          bottom: 25px;
      }

      .ib-model-visual-content h3 {
          font-size: 30px;
      }

      .ib-perspective-image {
          min-height: 350px;
      }

      .ib-perspective-quote {
          left: 25px;
          bottom: 25px;
      }

      .ib-perspective-quote p {
          font-size: 23px;
      }

      .ib-footer-main {
          padding: 50px 0 35px;
      }
  }


  @media (max-width: 575.98px) {

      .ib-about-hero h1 {
          font-size: 41px;
      }

      .ib-section-title {
          font-size: 32px;
      }

      .ib-final-cta {
          padding: 65px 0;
      }

  }