@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&display=swap');

* {
  font-family: "Noto Sans TC", sans-serif;
}

.container {
  @media screen and (min-width: 1400px) {
    max-width: 1440px;
    padding: 0;
  }
}

a {
  text-decoration: none;
}

.md-btn {
  color: #fff;
  background: #137C68;
  padding: 10px 16px;
  border-radius: 200px;
  font-size: 1.125rem;
  line-height: 1;
  transition: all .2s ease-in;
  display: flex;
  align-items: center;
  justify-content: center;

  &:hover {
    background: #CF4625;
  }
  &.lg{
    height: 44px;
    padding-left: 20px;
    padding-right: 20px;
  }
  &.sm{
    font-size: 16px;
    height: 31px;
    padding: 6px 12px;
  }
}

/* h2 header */
.mc-core__header {
  display: flex;
  justify-content: center;
  margin-bottom: 50px;

  .title-box {
    position: relative;
    display: inline-flex;

    &::after {
      content: "";
      position: absolute;
      width: 73px;
      height: 53px;
      background-image: url(/sites/default/files/image/h2-title-leave.png);
      background-repeat: no-repeat;
      right: -25px;
      top: -30px;

      transform-origin: left bottom;
      animation: mc-core-service-title-rock 1s ease-in-out infinite alternate;
    }

    h2 {
      position: relative;
      display: inline-flex;
      font-size: 38px;
      color: #137C68;
      font-weight: 700;
      padding: 15px 38px;

      &::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: calc(100% - 60px);
        height: 70%;
        border-top: 4px solid #AACE95;
        border-left: 4px solid #AACE95;
        border-top-left-radius: 40px;
        pointer-events: none;
      }

      &::after {
        content: "";
        position: absolute;
        bottom: 0;
        right: 0;
        width: calc(100% - 60px);
        height: 70%;
        border-bottom: 4px solid var(--mc-green3);
        border-right: 4px solid var(--mc-green3);
        border-bottom-right-radius: 40px;
        pointer-events: none;
      }
    }
  }

  &.white {
    h2 {
      color: #fff;

      &::before {
        border-top: 4px solid #AACE95;
        border-left: 4px solid #AACE95;
      }

      &::after {
        border-bottom: 4px solid #22A68D;
        border-right: 4px solid #22A68D;
      }
    }
  }
}

/* slider nav icon */
.common-slider__nav-icon {
  display: block;
  width: 0.85rem;
  height: 0.85rem;
  border-top: 2.5px solid var(--mc-green, #007440);
  border-right: 2.5px solid var(--mc-green, #007440);
}

.common-slider__nav--prev svg {
  margin-right: 5px;
}

.common-slider__nav--next svg {
  margin-left: 5px;
}

/* homepage */
.path-frontpage {
  .region-content {
    padding: 0;
  }

  .home-slider-view {
    position: relative;
    left: 50%;
    right: 50%;
    width: 100vw;
    max-width: 99.6dvw;
    margin-left: -50vw;
    margin-right: -50vw;
    aspect-ratio: 1920/700;
    overflow: visible;
    background: #e8f4fb;

    .home-slider.swiper,
    .home-slider .swiper-wrapper,
    .home-slider .swiper-slide {
      height: 100%;
    }

    .swiper {
      overflow: hidden;
    }

    .home-slider__slide {
      position: relative;
      width: 100%;
      height: 100%;
      margin: 0;
      max-width: 100%;
      overflow: hidden;
    }

    .home-slider__media {
      position: relative;
      width: 100%;
      height: 100%;
      overflow: hidden;
      background: #000;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .home-slider__media>*,
    .home-slider__media .field,
    .home-slider__media .field__item,
    .home-slider__media .field>div {
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .home-slider__slide--remote-video .home-slider__media,
    .home-slider__slide--remote-video .home-slider__media>*,
    .home-slider__slide--remote-video .home-slider__media .field,
    .home-slider__slide--remote-video .home-slider__media .field__item,
    .home-slider__slide--remote-video .home-slider__media .field>div,
    .home-slider__slide--remote-video .home-slider__embed,
    .home-slider__slide--video .home-slider__media,
    .home-slider__slide--video .home-slider__media>*,
    .home-slider__slide--video .home-slider__media .field,
    .home-slider__slide--video .home-slider__media .field__item,
    .home-slider__slide--video .home-slider__media .field>div,
    .home-slider__slide--video .home-slider__embed {
      height: 100%;
    }

    .home-slider__media img,
    .home-slider__media video {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center center;
    }

    /*
    (i2 reference)
    .home-slider__media video {
      top: 50%;
      position: absolute;
      transform: translateY(-50%);
    } */

    .home-slider__embed {
      position: relative;
      width: 100%;
      height: 100%;
      min-height: 100%;
    }

    .home-slider__poster {
      position: absolute;
      inset: 0;
      z-index: 1;
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
      pointer-events: none;
      transition: opacity 0.35s ease;
    }

    .home-slider__slide.is-media-active.is-media-ready .home-slider__poster {
      opacity: 0;
    }

    .home-slider__iframe-wrap {
      position: absolute;
      inset: 0;
      z-index: 2;
      overflow: hidden;
      opacity: 0;
      transition: opacity 0.35s ease;
    }

    .home-slider__slide.is-media-active.is-media-ready .home-slider__iframe-wrap {
      opacity: 1;
    }

    .home-slider__iframe-wrap .home-slider__youtube,
    .home-slider__iframe-wrap .media-oembed-content {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 100%;
      height: 100%;
      min-width: 177.78vh;
      min-height: 56.25vw;
      border: 0;
      transform: translate(-50%, -50%);
    }

    /* YouTube controls need full 16:9 frame — avoid cropping the progress bar. */
    .home-slider__embed--has-controls .home-slider__iframe-wrap {
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .home-slider__embed--has-controls .home-slider__iframe-wrap .home-slider__youtube {
      position: relative;
      top: auto;
      left: auto;
      width: auto;
      height: 100%;
      min-width: 0;
      min-height: 0;
      max-width: 100%;
      aspect-ratio: 16 / 9;
      transform: none;
    }

    @media (max-aspect-ratio: 16/9) {
      .home-slider__embed--has-controls .home-slider__iframe-wrap .home-slider__youtube {
        width: 100%;
        height: auto;
      }
    }

    .home-slider__slide:not(.is-media-active) .home-slider__iframe-wrap {
      visibility: hidden;
      pointer-events: none;
    }

    .home-slider__link {
      display: block;
      width: 100%;
      height: 100%;
      color: inherit;
      text-decoration: none;
    }

    .home-slider__nav {
      position: absolute;
      z-index: 3;
      top: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 50px;
      height: 50px;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: #ffffff;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
      transform: translateY(-50%);
      cursor: pointer;
      transition: box-shadow 0.2s ease, transform 0.2s ease;
    }

    .common-slider__nav--prev {
      left: clamp(0.75rem, 2vw, 2.5rem);
    }

    .common-slider__nav--next {
      right: clamp(0.75rem, 2vw, 2.5rem);
    }
  }

  .home-slider__footer {
    position: absolute;
    z-index: 5;
    bottom: -30px;
    left: 50%;
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 10px 34px 10px 10px;
    border-radius: 999px;
    background: #F7F7F7;
    transform: translate(-50%, 50%);

    .home-slider__pagination.swiper-pagination {
      position: static;
      display: flex;
      align-items: center;
      gap: 10px;
      width: auto;
      transform: none;
    }

    .swiper-pagination-bullet {
      width: 10px;
      height: 10px;
      margin: 0 !important;
      border-radius: 50%;
      background: #a9d598;
      opacity: 1;
    }

    .swiper-pagination-bullet-active {
      background: #27977c;
    }

    .home-slider__toggle {
      position: absolute;
      top: 50%;
      right: 6px;
      width: 20px;
      height: 20px;
      padding: 0;
      border: 0;
      border-radius: 50%;
      background: #27977c;
      transform: translateY(-50%);
      cursor: pointer;
    }

    .home-slider__toggle:focus-visible {
      outline: 2px solid #137c68;
      outline-offset: 2px;
    }

    .home-slider__toggle-icon {
      display: none;
    }

    .home-slider__toggle.is-playing .home-slider__toggle-icon--pause {
      position: absolute;
      inset: 0;
      display: block;
    }

    .home-slider__toggle.is-playing .home-slider__toggle-icon--pause::before,
    .home-slider__toggle.is-playing .home-slider__toggle-icon--pause::after {
      content: "";
      position: absolute;
      top: 6px;
      width: 2px;
      height: 8px;
      border-radius: 1px;
      background: #fff;
    }

    .home-slider__toggle.is-playing .home-slider__toggle-icon--pause::before {
      left: 7px;
    }

    .home-slider__toggle.is-playing .home-slider__toggle-icon--pause::after {
      right: 7px;
    }

    .home-slider__toggle:not(.is-playing) .home-slider__toggle-icon--play {
      position: absolute;
      top: 6px;
      left: 8px;
      display: block;
      width: 0;
      height: 0;
      border-top: 4px solid transparent;
      border-bottom: 4px solid transparent;
      border-left: 6px solid #fff;
    }
  }

  .field__item {
    &:nth-of-type(2) {
      .paragraph {
        >div {
          @media screen and (max-width: 1023px) {
            margin: 100px auto;
          }

          &:nth-of-type(1) {
            margin: 110px auto 100px;

            @media screen and (max-width: 1023px) {
              display: none;
            }

            img {
              width: 100%;
            }
          }

          &:nth-of-type(2) {
            display: none;

            @media screen and (max-width: 1023px) {
              display: block;
            }

            img {
              width: 100%;
            }
          }
        }
      }
    }

    .mc-core-service-listing {
      .mc-core-service-listing__title {
        display: inline-block;
      }

      .mc-core-service-listing__grid {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 2.5rem;

        @media screen and (max-width: 1023px) {
          grid-template-columns: 1fr 1fr;
        }

        .mc-core-service-card {
          position: relative;
          overflow: hidden;
          border-radius: 1rem;

          .mc-core-service-card__icon {
            position: absolute;
            bottom: 30px;
            left: 50%;
            transform: translateX(-50%) rotate(0deg);
            transition: transform 0.6s ease;
          }

          &:hover .mc-core-service-card__icon {
            transform: translateX(-50%) rotate(360deg);
          }
        }
      }
    }

    .mc-news-listing {
      position: relative;
      left: 50%;
      right: 50%;
      width: 100vw;
      max-width: 99.6dvw;
      margin-top: 100px;
      margin-left: -50vw;
      margin-right: -50vw;
      padding: 100px 0 6.25rem;
      background: #137C68;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      overflow: hidden;

      .mc-news-listing__carousel {
        overflow: hidden;
        max-width: 99.6dvw;
      }

      .mc-news-listing__slide {
        height: auto;
      }

      /* card */
      .swiper-slide {
        width: 100%;
        background: #fff;
        overflow: hidden;
        border-radius: 1rem;
        height: auto;
        box-shadow: 0px 4px 8px 0px #0000001A;
        transition: transform 0.35s ease, opacity 0.35s ease;

        &:not(.swiper-slide-active) {
          transform: scale(0.82);
        }

        .mc-news-card {
          height: auto;

          a {
            height: auto;
            display: flex;
            flex-direction: column;
          }
        }

        .mc-news-card__media {
          height: clamp(240px, 28vw, 400px);
          overflow: hidden;

          div {
            height: 100%;
          }

          >div,
          .field,
          .field__item {
            height: 100%;
          }

          img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.35s ease;
          }
        }

        &:hover .mc-news-card__media img {
          transform: scale(1.15);
        }

        .mc-news-card__body {
          flex: 0 0 170px;
          height: 170px;
          padding: 15px;
          color: #00735F;
          display: flex;
          flex-direction: column;

          .mc-news-card__title {
            display: -webkit-box;
            margin-bottom: 4px;
            overflow: hidden;
            font-size: 24px;
            -webkit-box-orient: vertical;
            line-clamp: 2;
            -webkit-line-clamp: 2;
          }

          .mc-news-card__date {
            margin-top: auto;
          }

          .mc-news-card__summary,
          .mc-news-card__date {
            color: #515151;
            position: relative;
          }

          .mc-news-card__summary {
            font-size: 18px;
            display: -webkit-box;
            overflow: hidden;
            -webkit-box-orient: vertical;
            line-clamp: 1;
            -webkit-line-clamp: 1;
          }

          .mc-news-card__divider {
            position: relative;

            &::after {
              content: "";
              position: absolute;
              bottom: -15px;
              left: 0;
              font-size: 18px;
              width: 24px;
              height: 4px;
              background: #198D76;
              border-radius: 50px;
              transition: width 0.2s ease-in-out;
            }
          }
        }

        .mc-news-card:hover .mc-news-card__divider::after {
          width: 48px;
        }

        &:nth-child(even) .mc-news-card__body .mc-news-card__divider::after {
          background: #C7EDBB;
        }
      }

      .mc-news-listing__nav {
        position: absolute;
        left: var(--mc-news-nav-inset, 1rem);
        top: 50%;
        transform: translate(-50%, -50%);
        width: 50px;
        height: 50px;
        z-index: 3;
        background: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;

        &.common-slider__nav--next {
          left: auto;
          right: var(--mc-news-nav-inset, 1rem);
          transform: translate(50%, -50%);
        }
      }

      .mc-news-listing__footer {
        margin-top: 40px;
        line-height: 2;

        a {
          color: #fff;
          border: 1px solid #fff;
          border-radius: 400px;
          padding: 10px 20px;
          font-size: 1.25rem;
        }

        .mc-news-listing__more {
          gap: 6px;
          align-items: center;
          display: flex;
        }
      }
    }

    .mc-event-listing {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-top: 80px;

      .mc-event-listing__carousel-frame {
        position: relative;
        width: 100%;
        max-width: 1440px;
      }

      .mc-event-listing__carousel {
        width: 100%;
        padding-bottom: 12px;
      }

      .swiper-slide {
        width: 100%;
        max-width: 330px;
        background: rgb(255, 255, 255);
        border-radius: 1rem;
        height: auto;
        /* box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 8px 0px; */
        border: 1px solid #DDDDDD;
        transition: transform 0.35s, opacity 0.35s;

        /* margin-right: 30px !important; */
        article {
          height: 100%;
          display: flex;
          flex-direction: column;
        }

        .mc-event-card__media {
          height: clamp(220px, 24vw, 340px);
          overflow: hidden;
          border-top-left-radius: 16px;
          border-bottom-left-radius: 16px;
          >div,
          .field,
          .field__item {
            height: 100%;
          }

          img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.35s ease;
          }
        }

        &:hover .mc-event-card__media img {
          transform: scale(1.15);
        }

        .mc-event-card__body {
          flex: 1 1 auto;
          padding: 20px;
          display: flex;
          flex-direction: column;

          .mc-event-card__title {
            font-size: 22px;
            color: #00735F;
          }

          .mc-event-card__summary {
            padding-bottom: 35px;
            font-size: 18px;
            color: #515151;

            >div,
            >p {
              display: -webkit-box;
              line-clamp: 2;
              -webkit-line-clamp: 2;
              -webkit-box-orient: vertical;
              overflow: hidden;
              text-overflow: ellipsis;
            }

            p {
              margin-bottom: 0;
            }
          }

          .mc-event-card__footer {
            margin-top: auto;
            display: flex;
            justify-content: space-between;
            align-items: center;

            .mc-event-card__register {
              color: #fff;
              background: #137C68;
              padding: 10px 16px;
              border-radius: 200px;
              font-size: 1.125rem;
              line-height: 1;
              transition: all .2s ease-in;

              &:hover {
                background: #CF4625;
              }
            }
          }
        }
      }

      .mc-event-listing__nav {
        position: absolute;
        z-index: 3;
        top: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50px;
        height: 50px;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: #ffffff;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
        transform: translateY(-50%);
        cursor: pointer;
        transition: box-shadow 0.2s ease, transform 0.2s ease;
      }

      .common-slider__nav--prev {
        left: 0;
        transform: translate(-50%, -50%);
      }

      .common-slider__nav--next {
        right: 0;
        transform: translate(50%, -50%);
      }

      .mc-event-listing__footer {
        margin-top: 40px;

        a {
          color: var(--mc-green3);
          border: 1px solid var(--mc-green3);
          border-radius: 400px;
          padding: 10px 20px;
          font-size: 1.25rem;
        }
      }

      .mc-event-listing__more {
        gap: 6px;
        align-items: center;
        display: flex;
      }
    }

    .mc-our-numbers-section {
      margin-top: 100px;
      position: relative;
      margin-bottom: 230px;

      @media screen and (max-width: 1023px) {
        margin-bottom: 50px;
      }

      .mc-our-numbers-section__media {
        img {
          width: 100%;
        }
      }

      .mc-our-numbers-section__overlay {
        position: absolute;
        top: 50%;
        left: 70px;
        transform: translate(0, -50%);

        h2 {
          font-size: 50px;
          color: #fff;
        }

        .mc-our-numbers-section__title {
          margin-bottom: 0;
        }

        .mc-our-numbers-section__link {
          font-size: 20px;
          border-radius: 200px;
          background: #E95937;
          display: inline-flex;
          padding: 8px 30px;
          margin-top: 30px;

          a {
            color: #fff;
            font-weight: 600;
          }
        }

        @media screen and (max-width: 767px) {
          top: 6%;
          left: 30px;

          .mc-our-numbers-section__title {
            font-size: 30px;
          }

          .mc-our-numbers-section__link {
            margin-top: 10px;
          }
        }
      }

      .mc-our-numbers-section__cards-grid {
        position: absolute;
        bottom: -20%;
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        padding: 0 60px;
        width: 100%;
        gap: 40px;
        transform: translate(0, 0%);

        @media screen and (max-width: 1023px) {
          position: relative;
          grid-template-columns: 1fr;
          margin-top: 40px;
        }

        .mc-our-numbers__card {
          background: #fff;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          padding: 1.5rem;
          border: 1px solid #FBCC3F;
          border-radius: 30px;
          box-shadow: 0px 4px 15px 0px #113C0026;

          .mc-our-numbers__card-inner {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;

            .mc-our-numbers__icon {
              margin-bottom: 15px;
            }

            .mc-our-numbers__card-title,
            .mc-our-numbers__card-subtitle {
              font-size: 1.125rem;
              color: #01153E;
              font-weight: 500;
            }

            .mc-our-numbers__number {
              color: #787229;
              font-size: 50px;
              font-weight: 800;
            }
          }

          &.mc-our-numbers__card--gold .mc-our-numbers__number {
            color: #d4a72c;
          }

          &.mc-our-numbers__card--green .mc-our-numbers__number {
            color: var(--mc-green, #007440);
          }

          &.mc-our-numbers__card--orange .mc-our-numbers__number {
            color: #e65100;
          }

          &.mc-our-numbers__card--blue .mc-our-numbers__number {
            color: #1976d2;
          }
        }
      }
    }

    .mc-homepage-support-us {
      .mc-homepage-support-us__inner {
        background: #F9F9F9;
        box-shadow: 0px 4px 4px 0px #00000026;
        display: grid;
        grid-template-columns: 2fr 4fr;
        border-radius: 20px;
        overflow: hidden;

        @media screen and (max-width: 1023px) {
          grid-template-columns: auto;
        }

        .mc-homepage-support-us__content {
          display: flex;
          flex-direction: column;
          justify-content: center;
          background: #F2EDA3;
          padding: 30px;
          border-radius: 20px 20px 0 20px;

          .mc-homepage-support-us__title {
            font-size: 32px;
            font-weight: 700;
            margin-bottom: 0;
          }

          >div:nth-of-type(1) {
            font-size: 22px;
            margin-bottom: 20px;
            color: #000;
          }

          .mc-homepage-support-us__link {
            background: #137C68;
            border-radius: 200px;
            display: inline-flex;
            padding: 8px 20px;
            width: fit-content;
            font-size: 20px;
            align-items: center;
            gap: 6px;
            transition: all .2s ease-in;

            &:hover {
              background: #CF4625;
            }

            a {
              color: #fff;
            }
          }
        }

        .mc-homepage-support-us__media {
          div {
            height: 100%;
          }

          img {
            width: auto;
            height: 100%;
          }
        }
      }
    }

    .mc-award-listing {
      position: relative;
      margin: 100px auto 150px;
      padding: 60px 90px;
      background: #FCF9F2;
      border: 1px solid #C9E1BB;
      border-radius: 40px;

      .swiper-wrapper {
        .mc-award-card__title {
          font-size: 18px;
          text-align: center;
        }

        .swiper-slide {
          padding-right: 34px;
          position: relative;

          &::after {
            content: "";
            position: absolute;
            top: 0;
            right: 17px;
            height: 100%;
            width: 1px;
            background: #C9E1BB;
          }

          .mc-award-card__media {
            display: flex;
            align-items: center;
            justify-content: center;
            height: 140px;
            margin-bottom: 16px;

            >div,
            .field,
            .field__item {
              width: 100%;
              height: 100%;
              display: flex;
              align-items: center;
              justify-content: center;
            }

            img {
              display: block;
              max-width: 100%;
              max-height: 100%;
              width: auto;
              height: auto;
              object-fit: contain;
            }
          }
        }
      }

      .mc-award-listing__nav {
        position: absolute;
        z-index: 3;
        top: 56%;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 50px;
        height: 50px;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: #fff;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
        cursor: pointer;
      }

      .common-slider__nav--prev {
        left: 50px;
        transform: translate(-50%, -50%);
      }

      .common-slider__nav--next {
        right: 50px;
        transform: translate(50%, -50%);
      }

      .mc-award-listing__nav:focus-visible,
      .mc-award-listing__toggle:focus-visible {
        outline: 2px solid var(--mc-green3);
        outline-offset: 2px;
      }

      .mc-award-listing__footer {
        position: relative;
        display: flex;
        align-items: center;
        width: max-content;
        margin: 28px auto 0;
        max-width: stretch;
        overflow: hidden;
      }

      .mc-award-listing__pagination {
        &.swiper-pagination {
          position: static;
          display: inline-flex;
          align-items: center;
          gap: 7px;
          width: auto;
          padding: 10px 32px 10px 10px;
          border-radius: 999px;
          background: #fff;
          transform: none;
        }

        .swiper-pagination-bullet {
          width: 10px;
          height: 10px;
          margin: 0 !important;
          background: #a9d598;
          opacity: 1;
        }

        .swiper-pagination-bullet-active {
          background: #27977c;
        }
      }

      .mc-award-listing__toggle {
        position: absolute;
        z-index: 12;
        top: 50%;
        right: 3px;
        display: block;
        flex: 0 0 20px;
        width: 20px;
        height: 20px;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 50%;
        background: #27977c;
        transform: translateY(-50%);
        cursor: pointer;
      }

      .mc-award-listing__toggle-icon {
        display: none;
      }

      .mc-award-listing__toggle.is-playing .mc-award-listing__toggle-icon--pause {
        position: absolute;
        inset: 0;
        display: block;
      }

      .mc-award-listing__toggle.is-playing .mc-award-listing__toggle-icon--pause::before,
      .mc-award-listing__toggle.is-playing .mc-award-listing__toggle-icon--pause::after {
        content: "";
        position: absolute;
        top: 6px;
        width: 2px;
        height: 8px;
        border-radius: 1px;
        background: #fff;
      }

      .mc-award-listing__toggle.is-playing .mc-award-listing__toggle-icon--pause::before {
        left: 7px;
      }

      .mc-award-listing__toggle.is-playing .mc-award-listing__toggle-icon--pause::after {
        right: 7px;
      }

      .mc-award-listing__toggle:not(.is-playing) .mc-award-listing__toggle-icon--play {
        position: absolute;
        top: 6px;
        left: 8px;
        display: block;
        width: 0;
        height: 0;
        border-top: 4px solid transparent;
        border-bottom: 4px solid transparent;
        border-left: 6px solid #fff;
      }
    }
  }
}

@keyframes mc-core-service-title-rock {
  from {
    transform: rotate(5deg);
  }

  to {
    transform: rotate(-5deg);
  }
}

/* Admin local tasks (View, Edit, Delete, etc.) — fixed bottom-center */
#block-i2-theme-local-tasks,
.block-local-tasks-block {
  position: fixed;
  bottom: 1rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1050;
  margin: 0;
  max-width: calc(100vw - 2rem);
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--i2-color-border, #d8dee8);
  border-radius: 0.75rem;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
  backdrop-filter: blur(8px);
}

#block-i2-theme-local-tasks .block__title,
.block-local-tasks-block .block__title {
  display: none;
}

#block-i2-theme-local-tasks .tabs-wrapper,
.block-local-tasks-block .tabs-wrapper {
  margin: 0;
}

#block-i2-theme-local-tasks .tabs-wrapper+.tabs-wrapper--secondary,
#block-i2-theme-local-tasks .tabs-wrapper+.tabs-secondary,
.block-local-tasks-block .tabs-wrapper+.tabs-wrapper--secondary,
.block-local-tasks-block .tabs-wrapper+.tabs-secondary {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--i2-color-border, #d8dee8);
}

#block-i2-theme-local-tasks ul,
#block-i2-theme-local-tasks .tabs,
#block-i2-theme-local-tasks .nav.nav-tabs,
.block-local-tasks-block ul,
.block-local-tasks-block .tabs,
.block-local-tasks-block .nav.nav-tabs {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  list-style: none;
  margin: 0;
  padding: 0;
  border-bottom: 0;
}

#block-i2-theme-local-tasks .flex-column,
.block-local-tasks-block .flex-column {
  flex-direction: row !important;
}

#block-i2-theme-local-tasks li,
#block-i2-theme-local-tasks .tabs__tab,
#block-i2-theme-local-tasks .nav-item,
.block-local-tasks-block li,
.block-local-tasks-block .tabs__tab,
.block-local-tasks-block .nav-item {
  margin: 0;
}

#block-i2-theme-local-tasks a,
.block-local-tasks-block a {
  display: inline-block;
  width: auto;
  padding: 0.45rem 0.75rem;
  margin: 0;
  border: 1px solid var(--i2-color-border, #d8dee8);
  border-radius: 999px;
  background: var(--i2-color-surface, #ffffff);
  color: var(--i2-color-text, #1f2933);
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.3;
  white-space: nowrap;
  text-decoration: none;
  transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}

#block-i2-theme-local-tasks a:hover,
#block-i2-theme-local-tasks a:focus,
.block-local-tasks-block a:hover,
.block-local-tasks-block a:focus {
  border-color: rgba(0, 116, 64, 0.35);
  color: var(--mc-green, #007440);
  text-decoration: none;
}

#block-i2-theme-local-tasks li.is-active a,
#block-i2-theme-local-tasks li.active a,
#block-i2-theme-local-tasks .tabs__tab.is-active a,
#block-i2-theme-local-tasks a.is-active,
#block-i2-theme-local-tasks .nav-link.active,
.block-local-tasks-block li.is-active a,
.block-local-tasks-block li.active a,
.block-local-tasks-block .tabs__tab.is-active a,
.block-local-tasks-block a.is-active,
.block-local-tasks-block .nav-link.active {
  border-color: var(--mc-green, #007440);
  background: rgba(0, 116, 64, 0.08);
  color: var(--mc-green, #007440);
  font-weight: 600;
}

@media (max-width: 767.98px) {

  #block-i2-theme-local-tasks,
  .block-local-tasks-block {
    bottom: 0.75rem;
    left: 50%;
    transform: translateX(-50%);
    max-width: calc(100vw - 1.5rem);
    padding: 0.5rem 0.6rem;
  }

  #block-i2-theme-local-tasks ul,
  #block-i2-theme-local-tasks .tabs,
  #block-i2-theme-local-tasks .nav.nav-tabs,
  .block-local-tasks-block ul,
  .block-local-tasks-block .tabs,
  .block-local-tasks-block .nav.nav-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }

  #block-i2-theme-local-tasks a,
  .block-local-tasks-block a {
    font-size: 0.75rem;
    padding: 0.4rem 0.65rem;
  }
}

/* Header donate — heart icon image */
.mc-header__donate-icon {
  display: block;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  object-fit: contain;
}

/* Floating donate — bottom-left */
.mc-floating-donate {
  --mc-floating-donate-size: 100px;
  position: fixed;
  left: 1.25rem;
  bottom: 1.25rem;
  z-index: 1055;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  width: var(--mc-floating-donate-size);
  height: var(--mc-floating-donate-size);
  padding: 0;
  border-radius: 0.75rem;
  background: var(--mc-orange, #e95937);
  box-shadow: 0 8px 24px rgba(233, 89, 55, 0.35);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.15;
  text-align: center;
  text-decoration: none;
  transition: transform 0.2s ease, background-color 0.2s ease;
}

.mc-floating-donate:hover,
.mc-floating-donate:focus {
  transform: scale(1.03);
  background: var(--mc-orange-hover, #cf6818);
  color: #fff;
  text-decoration: none;
}

.mc-floating-donate__icon {
  display: block;
  width: 40px;
  height: 40px;
  object-fit: contain;
}

.mc-floating-donate__text {
  display: block;
}

@media (max-width: 767.98px) {
  .mc-floating-donate {
    left: 0.75rem;
    bottom: 0.75rem;
  }
}

@media screen and (min-width: 1024px) {
  .i2-accessibility-btn .header-function-panel {
    top: 77%;
  }
}

.mc-header__utility {
  position: relative;
}

.i2-accessibility-btn {
  position: relative;
}

.i2-accessibility-btn .header-function-panel {
  position: absolute;
  z-index: 60;
}

#block-i2-theme-breadcrumbs {
  nav {
    &.container {
      max-width: 100%;
      padding-left: 80px;
      padding-right: 80px;
    }

    ol {
      li {
        &:nth-of-type(1) {
          svg path {
            fill: #E95937;
          }
        }

        a {
          color: #000;
        }
      }
    }
  }
}
.container{
  &.lg-container{
    max-width: 1625px;
  }
  &[data-once="i2-service-unit-page-container"]{
    margin-top: 100px;
    .mc-core__header{
      justify-content: start;
    }
  }
}
.mc-service-unit-story{
  margin-bottom: 12.5rem;
}
.mc-service-unit-story__img{
  width: 100%;
}
.mc-service-unit-content__panel{
  background: #FCF9F2;
  border-radius: 16px;
  padding: 30px;
  ul{
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    row-gap: 30px;
    li{
      font-size: 22px;
      color: #000;
      display: flex;
      gap: 1.25rem;
      align-items: center;
    }
  }
}
.mc-service-unit-target{
  margin: 50px 0 100px;
  h3{
    font-weight: 700;
    font-size: 2rem;
    margin-bottom: 20px;
  }
}
.mc-service-unit-target__desc{
  font-size: 18px;
  color: #515151;
}

.mc-professional-team-listing{
  .mc-professional-team-listing__carousel-frame {
    position: relative;
    width: 100%;
  }

  .mc-professional-team-listing__nav {
    position: absolute;
    z-index: 3;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    transform: translateY(-50%);
    cursor: pointer;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
  }
  .mc-professional-team-card{
    padding: 20px 40px;
    background: #F2EDA3;
    border-radius: 16px;
    .mc-professional-team-card__media{
      margin-bottom: 20px;
    }
    .mc-professional-team-card__body{
      text-align: center;
    }
    .mc-professional-team-card__name{
      font-weight: 700;
    }
    .mc-professional-team-card__position{
      font-size: 18px;
    }
  }

  .mc-professional-team-listing__slide:nth-child(odd) .mc-professional-team-card {
    background: #D5EDBB;
  }

  .common-slider__nav--prev {
    left: 0;
    transform: translate(-50%, -50%);
  }

  .common-slider__nav--next {
    right: 0;
    transform: translate(50%, -50%);
  }

  .mc-professional-team-listing__footer {
    margin-top: 40px;
    text-align: center;
  }

  .mc-professional-team-listing__more {
    color: var(--mc-green3);
    border: 1px solid var(--mc-green3);
    border-radius: 400px;
    padding: 10px 20px;
    font-size: 1.25rem;
    gap: 6px;
    align-items: center;
    display: inline-flex;
  }
}
.mc-service-unit-event-listing{
  margin: 100px 0 100px;

  .mc-event-listing__carousel-frame {
    position: relative;
    width: 100%;
  }

  .swiper-slide{
    article{
      border-radius: 16px;
      border: 1px solid #ddd;
      display: flex;
      gap: 10px;
      overflow: hidden;
      .mc-event-card__media{
        width: 230px;
        flex-shrink: 0;
      }
      .mc-event-card__body{
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 20px;
        h3{
          font-size: 22px;
          color: #00735F;
        }
        p{
          font-size: 18px;
          color: #515151;
        }

        .mc-event-card__summary,
        .mc-event-card__summary > div,
        .mc-event-card__summary > p {
          display: -webkit-box;
          overflow: hidden;
          text-overflow: ellipsis;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 4;
          line-clamp: 4;
        }
      }
      .mc-event-card__footer{
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: auto;
        .mc-event-card__date{
          font-size: 16px;
          color: #515151;
        }
      }
    }
  }

  .mc-event-listing__nav {
    position: absolute;
    z-index: 3;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    transform: translateY(-50%);
    cursor: pointer;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
  }

  .mc-event-listing__nav.mc-event-listing__nav--prev.common-slider__nav--prev {
    left: 0;
    transform: translate(-50%, -50%);
  }

  .mc-event-listing__nav.mc-event-listing__nav--next.common-slider__nav--next {
    right: 0;
    transform: translate(50%, -50%);
  }

  .mc-event-listing__footer {
    margin-top: 40px;
    text-align: center;
  }

  .mc-event-listing__more {
    color: var(--mc-green3);
    border: 1px solid var(--mc-green3);
    border-radius: 400px;
    padding: 10px 20px;
    font-size: 1.25rem;
    gap: 6px;
    align-items: center;
    display: inline-flex;
  }
}

.mc-service-unit-morelink {
  .mc-service-unit-morelink__carousel-frame {
    position: relative;
    width: 100%;
  }

  .mc-service-unit-morelink__nav {
    position: absolute;
    z-index: 3;
    top: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    transform: translateY(-50%);
    cursor: pointer;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
  }

  .mc-service-unit-morelink__nav.mc-service-unit-morelink__nav--prev.common-slider__nav--prev {
    left: 0;
    transform: translate(-50%, -50%);
  }

  .mc-service-unit-morelink__nav.mc-service-unit-morelink__nav--next.common-slider__nav--next {
    right: 0;
    transform: translate(50%, -50%);
  }
}
.mc-service-unit-morelink__slide{
  article{
    height: 200px;
    display: flex;
    border-radius: 16px;
    align-items: center;
    justify-content: center;
    gap: 20px;
    flex-direction: column;
    background: #ececec ;
    .mc-service-unit-morelink__card-title{
      font-size: 22px;
      margin-bottom: 0;
    }
  }
}

.mc-service-unit-morelink__slide:nth-child(odd) article {
  background: #D5EDBB;
}

.mc-photo-gallery-listing--block-2 .mc-photo-gallery-card__overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  padding: 20px 18px 0;
}

.mc-photo-gallery-listing--block-2 .mc-photo-gallery-card--slider {
  overflow: visible;
}

.mc-photo-gallery-listing--block-2 .mc-photo-gallery-card__media {
  overflow: visible;
}

.mc-photo-gallery-listing--block-2 .mc-photo-gallery-listing__carousel {
  padding-bottom: 28px;
}

.mc-photo-gallery-listing--block-2 .mc-photo-gallery-card__title {
  margin: 0 0 10px;
}

.mc-photo-gallery-listing--block-2 .mc-photo-gallery-card__date {
  position: absolute;
  left: 50%;
  bottom: -18px;
  transform: translateX(-50%);
  display: inline-block;
  white-space: nowrap;
  padding: 6px 16px;
  border-radius: 10px;
  background: #D5EDBB;
  color: #000;
  font-size: 18px;
  font-weight: 500;
}

.mc-service-unit-apply {
  margin: 100px 0 120px;
  height: 170px;
}

.mc-service-unit-apply__banner {
  height: 100%;
  padding-right: 40px;
  display: grid;
  grid-template-columns: minmax(180px, 270px) 1fr auto;
  align-items: center;
  gap: 40px;
  border-radius: 16px;
  overflow: hidden;
  background: linear-gradient(90deg, #dcefbf 0%, #c9e9ab 52%, #d6efbd 100%);
}

.mc-service-unit-apply__media {
  height: 100%;
  min-height: 146px;
}

.mc-service-unit-apply__media img,
.mc-service-unit-apply__media picture,
.mc-service-unit-apply__media .field,
.mc-service-unit-apply__media .field__item {
  display: block;
  width: 100%;
  height: 100%;
}

.mc-service-unit-apply__media img {
  object-fit: cover;
}

.mc-service-unit-apply__title {
  margin: 0 0 20px;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.1;
  color: #111;
}

.mc-service-unit-apply__desc {
  margin: 0;
  font-size: 18px;
  color: #282828;
}

@media (max-width: 1199.98px) {
  .mc-service-unit-apply__title {
    font-size: clamp(26px, 3.2vw, 38px);
  }

  .mc-service-unit-apply__desc,
  .mc-service-unit-apply__btn {
    font-size: clamp(18px, 2.2vw, 24px);
  }
}

@media (max-width: 767.98px) {
  .mc-service-unit-apply {
    margin: 56px 0;
  }

  .mc-service-unit-apply__banner {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .mc-service-unit-apply__media {
    min-height: 170px;
  }

  .mc-service-unit-apply__content {
    padding: 18px 18px 10px;
  }

  .mc-service-unit-apply__title {
    margin-bottom: 8px;
    font-size: 30px;
  }

  .mc-service-unit-apply__desc {
    font-size: 18px;
  }

  .mc-service-unit-apply__btn {
    margin: 0 18px 18px;
    justify-self: start;
    font-size: 18px;
  }
}
.mc-service-unit-service-hr {
  margin: 90px 0 110px;
}

.mc-service-unit-service-hr__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.mc-service-unit-service-hr__card {
  display: flex;
  align-items: center;
  gap: 30px;
  padding: 20px;
  border-radius: 18px;
  background: #f7f4eb;
}

.mc-service-unit-service-hr__icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.mc-service-unit-service-hr__icon svg,
.mc-service-unit-service-hr__icon img {
  width: 120px;
  height: 120px;
  display: block;
}

.mc-service-unit-service-hr__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}

.mc-service-unit-service-hr__card-title {
  margin: 0 0 10px;
  color: #00735F;
  font-size: 24px;
  font-weight: 500;
}

.mc-service-unit-service-hr__card-desc {
  margin: 0;
  color: #282828;
  font-size: 18px;
}

@media (max-width: 1199.98px) {
  .mc-service-unit-service-hr__card-title {
    font-size: clamp(26px, 3vw, 34px);
  }

  .mc-service-unit-service-hr__card-desc {
    font-size: clamp(16px, 1.9vw, 22px);
  }
}

@media (max-width: 767.98px) {
  .mc-service-unit-service-hr {
    margin: 56px 0 70px;
  }

  .mc-service-unit-service-hr__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .mc-service-unit-service-hr__card {
    gap: 16px;
    padding: 16px 18px;
    align-items: flex-start;
  }

  .mc-service-unit-service-hr__icon {
    flex-basis: 120px;
    width: 120px;
    height: 120px;
  }

  .mc-service-unit-service-hr__card-title {
    margin-bottom: 6px;
    font-size: 28px;
  }

  .mc-service-unit-service-hr__card-desc {
    font-size: 18px;
  }
}

.mc-service-unit-contact {
  margin: 100px 0 120px;
}

.mc-service-unit-contact__panel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
  border-radius: 18px;
  overflow: hidden;
  background: #F5F5F5;
}

.mc-service-unit-contact__details {
  padding: 40px;
}

.mc-service-unit-contact__table {
  width: 100%;
  table-layout: fixed;  
  border-collapse: separate;
  border-spacing: 0 20px;
}

.mc-service-unit-contact__table th,
.mc-service-unit-contact__table td {
  padding: 0;
  vertical-align: top;
}

.mc-service-unit-contact__label {
  color: #0e8a75;
  width: 88px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  text-align: left;
}

.mc-service-unit-contact__value {
  color: #2f2f2f;
  font-size: 18px;
  line-height: 1.5;
  word-break: break-word;
  padding-left: 40px;
}

a.mc-service-unit-contact__value {
  text-decoration: none;
}

a.mc-service-unit-contact__value:hover,
a.mc-service-unit-contact__value:focus {
  color: #0e8a75;
}

.mc-service-unit-contact__map {
  min-height: 100%;
  height: 100%;
  overflow: hidden;
}

.mc-service-unit-contact__map iframe,
.mc-service-unit-contact__map img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 300px;
  border: 0;
  object-fit: cover;
}

@media (max-width: 767.98px) {
  .mc-service-unit-contact {
    margin: 56px 0 72px;
  }

  .mc-service-unit-contact__panel {
    grid-template-columns: 1fr;
  }

  .mc-service-unit-contact__details {
    padding: 18px 16px;
  }

  .mc-service-unit-contact__table {
    border-spacing: 0 14px;
  }

  .mc-service-unit-contact__label {
    width: 74px;
  }

  .mc-service-unit-contact__label,
  .mc-service-unit-contact__value {
    font-size: 18px;
    line-height: 1.45;
  }

  .mc-service-unit-contact__map iframe,
  .mc-service-unit-contact__map img {
    min-height: 220px;
  }
}