/*
 * Homepage final Figma QA overrides.
 * This file is intentionally loaded after the shared tablet/menu normalization
 * and is scoped to the front page only.
 */

body.home.fenix-figma-shell-page {
  overflow-x: hidden;
}

.fenix-home-hero__body-copy--desktop {
  display: none;
}

/* Static Japanese copy follows the handoff's explicit line breaks per frame. */
html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-static-copy {
  display: none !important;
  width: auto !important;
  max-width: none !important;
}

html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-static-copy__line,
html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-hero__title-line {
  display: block;
  width: auto !important;
  max-width: none !important;
  white-space: nowrap;
}

@media (min-width: 1280px) {
  html:lang(en) body.home.fenix-figma-shell-page .fenix-home-hero__body,
  html:lang(vi) body.home.fenix-figma-shell-page .fenix-home-hero__body {
    width: max-content !important;
    max-width: none !important;
  }

  html:lang(en) body.home.fenix-figma-shell-page .fenix-home-hero__body-copy--desktop,
  html:lang(vi) body.home.fenix-figma-shell-page .fenix-home-hero__body-copy--desktop {
    display: block;
  }

  html:lang(en) body.home.fenix-figma-shell-page .fenix-home-hero__body-copy--responsive,
  html:lang(vi) body.home.fenix-figma-shell-page .fenix-home-hero__body-copy--responsive {
    display: none;
  }

  html:lang(en) body.home.fenix-figma-shell-page .fenix-home-hero__body-line,
  html:lang(vi) body.home.fenix-figma-shell-page .fenix-home-hero__body-line {
    display: block;
    white-space: nowrap;
  }

  html body.home.fenix-figma-shell-page .fenix-home-button--hero {
    width: max-content !important;
    min-width: max-content !important;
    flex: 0 0 auto !important;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-static-copy--desktop {
    display: block !important;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-services .fenix-home-heading {
    width: 1000px !important;
    max-width: calc(100% - 64px) !important;
  }

  html:lang(vi) body.home.fenix-figma-shell-page .fenix-home-services .fenix-home-heading p {
    width: 1000px !important;
    max-width: none !important;
    flex-direction: column !important;
  }

  html:lang(vi) body.home.fenix-figma-shell-page .fenix-home-services-intro-line {
    display: block;
    white-space: nowrap;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-hero__body-line {
    display: block;
    white-space: nowrap;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-service-card__description-line {
    display: block;
    white-space: nowrap;
  }

  html:lang(ja) body.home.fenix-figma-shell-page :is(.fenix-test-strengths__intro-line, .fenix-test-strengths__feature-line) {
    display: block;
    white-space: nowrap;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-devflow__description-line {
    display: block;
    white-space: nowrap;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-devflow__heading p {
    width: 100% !important;
    text-align: center !important;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-devflow__group--6 h3 {
    width: max-content !important;
    white-space: nowrap !important;
  }

  html:lang(vi) body.home.fenix-figma-shell-page .fenix-home-devflow__heading p {
    width: 880px !important;
    max-width: 100% !important;
  }

  html:lang(en) body.home.fenix-figma-shell-page .fenix-home-devflow__group h3,
  html:lang(vi) body.home.fenix-figma-shell-page .fenix-home-devflow__group h3 {
    font-size: 13px !important;
    line-height: 20px !important;
  }

  html:lang(en) body.home.fenix-figma-shell-page :is(.fenix-home-devflow__group--1, .fenix-home-devflow__group--2) h3,
  html:lang(vi) body.home.fenix-figma-shell-page :is(.fenix-home-devflow__group--1, .fenix-home-devflow__group--2) h3 {
    white-space: nowrap !important;
  }

  html:lang(en) body.home.fenix-figma-shell-page .fenix-home-devflow__tile p {
    font-size: 11px !important;
    line-height: 18px !important;
  }

  html:lang(vi) body.home.fenix-figma-shell-page .fenix-home-devflow__tile p {
    font-size: 12px !important;
    line-height: 18px !important;
  }

  html:lang(en) body.home.fenix-figma-shell-page .fenix-home-devflow__group--2 .fenix-home-devflow__tile:first-child p,
  html:lang(vi) body.home.fenix-figma-shell-page .fenix-home-devflow__group--2 .fenix-home-devflow__tile:first-child p {
    white-space: nowrap !important;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-articles__subheading-line {
    display: block;
    white-space: nowrap;
  }
}

/* Keep the visual content gaps around Business Partners symmetrical. */
@media (min-width: 1280px) {

  html body.home.fenix-figma-shell-page .fenix-home > .fenix-home-articles.fenix-home-section {
    padding-block: var(--fenix-section-spacing) !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-articles__head {
    height: 136px !important;
    flex-direction: row !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    gap: 20px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-articles__copy {
    width: auto !important;
    min-width: 0 !important;
    min-height: 136px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-articles__copy > p {
    min-height: 56px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-articles .fenix-home-button--outline {
    margin-bottom: 6px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home > .fenix-home-partners.fenix-home-section {
    padding-block: 172px !important;
  }
}

@media (min-width: 768px) and (max-width: 1279px) {
  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-static-copy--tablet {
    display: block !important;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-hero h1 {
    min-height: 168px !important;
    font-size: 44px !important;
    line-height: 56px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home > .fenix-home-partners.fenix-home-section {
    margin-top: 0 !important;
  }
}

@media (max-width: 767px) {
  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-static-copy--mobile {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-static-copy--mobile .fenix-home-static-copy__line {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-hero__title-copy .fenix-home-static-copy__line {
    white-space: nowrap;
  }

  html:lang(ja) body.home.fenix-figma-shell-page .fenix-home-hero h1 {
    min-height: 156px !important;
    font-size: 40px !important;
    line-height: 52px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home > .fenix-home-partners.fenix-home-section {
    margin-top: 0 !important;
  }
}

/* Shared Case study block: keep the homepage instance aligned with the PC handoff. */
@media (min-width: 1280px) {
  html body.home.fenix-figma-shell-page .fenix-home > .fenix-home-cases {
    padding: 120px 0 !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-cases .fenix-home-shell {
    width: 1192px !important;
    max-width: calc(100% - 64px) !important;
    height: 608px !important;
    min-height: 608px !important;
    gap: 56px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-cases__header {
    width: 1192px !important;
    height: 108px !important;
    min-height: 108px !important;
    margin: 0 !important;
    gap: 32px !important;
    align-items: flex-end !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-cases .fenix-home-heading {
    width: 1000px !important;
    height: 108px !important;
    min-height: 108px !important;
    gap: 24px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-cases .fenix-home-heading h2 {
    font-size: 48px !important;
    line-height: 56px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-cases .fenix-home-heading p {
    width: 1000px !important;
    font-size: 20px !important;
    line-height: 28px !important;
    font-weight: 400 !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-cases__button {
    width: 160px !important;
    height: 44px !important;
    margin: 0 !important;
    flex: 0 0 160px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-case-grid {
    width: 1192px !important;
    height: 444px !important;
    grid-template-columns: repeat(3, 375px) !important;
    justify-content: start !important;
    gap: 32px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-case-card {
    width: 375px !important;
    height: 444px !important;
    gap: 24px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-case-card__image {
    width: 375px !important;
    height: 256px !important;
    border-radius: 24px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-case-card > div {
    width: 375px !important;
    height: 164px !important;
    min-height: 164px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-case-card h3 {
    width: 375px !important;
    height: 28px !important;
    min-height: 28px !important;
    margin: 0 !important;
    font-family: var(--fenix-font-en), var(--fenix-font-ja), sans-serif !important;
    font-size: 20px !important;
    line-height: 28px !important;
    font-weight: 700 !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-case-card p {
    width: 375px !important;
    height: 60px !important;
    min-height: 60px !important;
    margin: 16px 0 0 !important;
    font-size: 14px !important;
    line-height: 20px !important;
    font-weight: 400 !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-cases .fenix-home-tags {
    height: 44px !important;
    min-height: 44px !important;
    margin: 16px 0 0 !important;
    gap: 8px !important;
  }
}

body.home.fenix-figma-shell-page .fenix-home {
  gap: 0 !important;
}

body.home.fenix-figma-shell-page .fenix-home-service-card__media img,

body.home.fenix-figma-shell-page .fenix-home-case-card__image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

body.home.fenix-figma-shell-page .fenix-home-cases__header {
  margin-bottom: 0 !important;
}

body.home.fenix-figma-shell-page .fenix-home-cases .fenix-home-tags {
  flex-wrap: nowrap !important;
  align-items: center !important;
  overflow: hidden !important;
}

body.home.fenix-figma-shell-page .fenix-home-cases .fenix-home-tags span {
  flex: 0 0 auto !important;
}

body.home.fenix-figma-shell-page .fenix-home-articles :is(.fenix-home-article-main__image, .fenix-home-article-card__image) {
  color: inherit;
  text-decoration: none;
}

body.home.fenix-figma-shell-page .fenix-home-articles :is(.fenix-home-article-main__image, .fenix-home-article-card__image).has-image img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

body.home.fenix-figma-shell-page .fenix-home-articles :is(.fenix-home-article-main, .fenix-home-article-card) h3 a {
  color: inherit;
  text-decoration: none;
}

@media (min-width: 768px) {
  html body.home.fenix-figma-shell-page .fenix-home-articles .fenix-home-article-layout--single {
    height: auto !important;
    min-height: 0 !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home-articles .fenix-home-article-side--mobile-fallback {
    display: none !important;
  }
}

@media (min-width: 1280px) {

  body.home.fenix-figma-shell-page .fenix-home-services .fenix-home-shell {
    height: 644px !important;
    min-height: 644px !important;
    gap: 56px !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-services .fenix-home-service-grid {
    height: 452px !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-service-card {
    height: 452px !important;
    min-height: 452px !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-service-card__content {
    padding: 240px 32px 32px !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-devflow__inner {
    height: 768px !important;
    min-height: 768px !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-devflow__heading {
    height: 136px !important;
    min-height: 136px !important;
    margin-bottom: 56px !important;
    gap: 24px !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-devflow__heading h2 {
    min-height: 56px !important;
    height: auto !important;
    line-height: var(--fenix-type-line-height, var(--fenix-text-body-line-height)) !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-devflow__heading p {
    min-height: 56px !important;
    height: auto !important;
    line-height: var(--fenix-type-line-height, var(--fenix-text-body-line-height)) !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-cases .fenix-home-shell {
    height: 640px !important;
    min-height: 640px !important;
    gap: 56px !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-cases__header {
    height: 136px !important;
    min-height: 136px !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-case-grid {
    height: 444px !important;
    overflow: hidden !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-case-card {
    height: 444px !important;
    min-height: 444px !important;
    overflow: hidden !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-case-card h3 {
    min-height: 28px !important;
    height: auto !important;
    margin-top: 0 !important;
    --fenix-type-line-height: var(--fenix-text-h6-line-height) !important;
    font-size: var(--fenix-text-h6-size) !important;
    font-weight: var(--fenix-text-h6-weight) !important;
    line-height: var(--fenix-type-line-height, var(--fenix-text-body-line-height)) !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-case-card p {
    height: auto !important;
    min-height: 60px !important;
    margin-top: 16px !important;
    overflow: hidden !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-cases .fenix-home-tags {
    height: 44px !important;
    margin-top: 16px !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-partners .fenix-home-shell {
    height: 283px !important;
    min-height: 283px !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-testimonials .fenix-home-shell {
    height: 565px !important;
    min-height: 565px !important;
  }

  html body.home.fenix-figma-shell-page .fenix-home > .fenix-home-testimonials.fenix-home-section {
    padding-top: 0 !important;
    padding-bottom: 172px !important;
  }

  body.home.fenix-figma-shell-page .fenix-home-articles .fenix-home-shell {
    height: auto !important;
    min-height: 0 !important;
  }

}
