/* ==========================================================================
   豐饒數位 iHarvest — responsive.css
   ========================================================================== */
@media (max-width: 1600px) {
  .partner {
    background: white;
  }
}

/* Small desktop / tablet landscape ---------------------------------------- */
@media (max-width: 1199px) {
  :root {
    --gutter: 64px;
  }

  .core-card__content {
    padding: 32px 36px;
    gap: 20px;
  }

  .core-card__number {
    font-size: 60px;
  }

  .partner-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }
}

/* Tablet ------------------------------------------------------------------- */
@media (max-width: 991px) {
  :root {
    --gutter: 48px;
    --header-height: 76px;
    --header-height-scrolled: 64px;
  }

  .nav {
    display: none;
  }

  .btn--header {
    display: none;
  }

  .menu-toggle {
    display: inline-flex;
  }

  .logo img {
    height: 44px;
  }

  .hero {
    height: auto;
    min-height: 560px;
    padding: calc(var(--header-height) + 56px) 0 64px;
  }

  .hero__slide-bg img {
    object-position: 70% 30%;
  }

  .hero__title {
    font-size: clamp(30px, 6vw, 46px);
  }

  .hero__desc {
    font-size: 18px;
  }

  .hero__scroll {
    display: none;
  }

  .about-core {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .about {
    padding-bottom: 200px;
  }

  .about__desc {
    font-size: 20px;
  }

  .core-card {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .core-card--reverse {
    direction: ltr;
  }

  .core-card__visual {
    order: -1;
    aspect-ratio: 16 / 9;
  }

  @supports not (aspect-ratio: 16 / 9) {
    .core-card__visual {
      height: 0;
      padding-top: 56.25%;
    }

    .core-card__img {
      position: absolute;
      inset: 0;
    }
  }

  .core-card__content {
    padding: 28px 28px 32px;
  }

  .partner {
    padding: 72px 0;
  }

  .partner-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .contact-cta__bg img {
    width: 100%;
    opacity: 0.35;
  }

  .contact-cta__bg::before {
    background: linear-gradient(180deg, var(--color-cta-bg) 20%, rgba(16, 55, 116, 0.55) 60%, rgba(16, 55, 116, 0.35) 100%);
  }

  .contact-cta__title {
    font-size: 32px;
  }

  .footer__top {
    flex-direction: column;
    gap: 40px;
  }
}

/* Mobile -------------------------------------------------------------------*/
@media (max-width: 767px) {
  :root {
    --gutter: 40px;
    --header-height: 64px;
    --header-height-scrolled: 56px;
  }

  .section-heading {
    text-align: center;
  }

  .section-heading__en {
    font-size: 18px;
  }

  .section-heading__title {
    font-size: 28px;
  }

  .about__divider {
    margin: 18px auto;
  }

  .hero {
    padding: calc(var(--header-height) + 40px) 0 56px;
    min-height: 480px;
  }

  .hero__divider {
    margin: 18px 0;
  }

  /* KV banner 2-5（Microsoft 365／Copilot／Pantone／BarTender）手機版只留品牌 logo，
     下面重複的大標文字隱藏，避免跟 logo 疊字、版面也更精簡 */
  .hero__title--slide .line:first-child {
    display: none;
  }

  .hero__desc {
    font-size: 18px;
    max-width: 80%;
    letter-spacing: 0.02em;
  }

  .hero__desc br {
    display: none;
  }

  .hero__desc--slide {
    font-size: 17px;
    max-width: 90%;
  }

  .hero__content {
    padding: clamp(0%, 10%, 12%) 5% 0;
  }

  .hero__dots {
    left: 50%;
    bottom: 6%;
    transform: translateX(-50%);
  }

  .about-core {
    padding-top: 48px;
    padding-bottom: 48px;
  }

  .about {
    padding-bottom: 160px;
  }

  .about__bg {
    height: 70%;
  }

  .about__desc {
    margin: 40px auto 0;
    max-width: 80%;
    font-size: 18px;
    line-height: 1.7;
    text-align: center;
    letter-spacing: 0.02em;
  }

  .core .section-heading {
    margin-bottom: 36px;
  }

  .core-list {
    gap: 25px;
  }

  .core-card__content {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 24px 20px 28px;
  }

  .core-card__number {
    font-size: 44px;
  }

  .core-card__title {
    font-size: 22px;
  }

  .partner {
    padding: 56px 0;
  }

  .partner__head {
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }

  .partner-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    width: 100%;
    justify-content: center;
    padding-bottom: 4px;
    margin: 0 calc(var(--gutter) / -2);
    padding-left: calc(var(--gutter) / 2);
    padding-right: calc(var(--gutter) / 2);
  }

  .partner-tabs::-webkit-scrollbar {
    display: none;
  }

  .partner-tabs__button {
    flex-shrink: 0;
    font-size: 18px;
    height: 46px;
    padding: 0 20px;
  }

  .partner-grid {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px 16px;
  }

  .partner-item {
    max-width: 100px;
  }

  .contact-cta {
    padding: 64px 0;
    text-align: center;
  }

  .contact-cta__inner {
    justify-content: center;
    text-align: center;
  }

  .contact-cta__title {
    font-size: 26px;
  }

  .contact-cta__bottom {
    flex-direction: column;
    align-items: center;
    width: 100%;
  }

  .contact-cta__desc {
    text-align: center;
  }

  .contact-cta .btn {
    width: 100%;
  }

  .footer {
    padding: 56px 0 24px;
  }

  .footer__top {
    padding-bottom: 36px;
    align-items: center;
  }

  .footer__aside {
    align-items: center;
  }

  .footer__contact {
    text-align: center;
  }

  .mobile-cta-bar {
    display: block;
  }

  .core-card__desc,
  .contact-cta__desc {
    font-size: 18px;
    letter-spacing: 0.02em;
  }

  .contact-cta__desc br {
    display: none;
  }
}

/* Small mobile ---------------------------------------------------------- */
@media (max-width: 520px) {
  .about {
    position: relative;
    padding: 80px 0 200px;
    background: #fafcff url(../img/about/about-globe.jpg) no-repeat 69% -57%;
    width: 100%;
  }

  .core {
    padding: 80px 0 80px;
  }

  .hero {
    align-items: flex-start;
    height: 90vh;
  }

  .hero__inner {
    align-items: flex-start;
  }

  .about {
    height: 80vh;
  }

  :root {
    --gutter: 40px;
  }

  .partner-tabs {
    gap: 1px;

  }

  .partner-tabs__button {
    padding: 0 8px;
  }

  .partner-grid {
    grid-template-columns: 1fr 1fr;
  }

  .core-card__number {
    font-size: 38px;
  }
}