/* Homepage final visual-audit refinements, 2026-08-06.
   Kept last in the cascade so approved layout decisions are not superseded
   by legacy module rules in the existing homepage stylesheet. */

/* Homepage content typography system.
   The approved hero and the conversion CTA keep their independent display
   scale; all desktop/tablet content sections share one title/subtitle level. */
@media (min-width: 761px) {
  .home-page {
    --home-content-title-size: clamp(42px, 3.2vw, 56px);
    --home-content-subtitle-size: clamp(15px, 1.12vw, 17px);
  }

  .home-page :is(#home-services, #cases, #home-scenes, #home-process, #home-knowledge, #home-faq) .section-heading h2 {
    font-size: var(--home-content-title-size);
    font-weight: 900;
    line-height: 1.12;
    letter-spacing: -0.035em;
    text-wrap: balance;
  }

  .home-page :is(#home-services, #cases, #home-scenes, #home-process, #home-knowledge, #home-faq) .section-heading > p {
    font-size: var(--home-content-subtitle-size);
    font-weight: 500;
    line-height: 1.7;
    letter-spacing: 0;
  }

  .home-page #home-knowledge .section-heading {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .home-page #home-knowledge .section-heading > p {
    width: min(760px, calc(100% - 26px));
    max-width: none;
    margin: 0 0 0 26px;
  }

  .home-page #home-faq .faq-expert-card > span {
    letter-spacing: 0.04em;
  }

  .home-page #home-faq .faq-heading-summary {
    display: none;
  }

  .home-page #home-faq .faq-expert-card {
    align-items: stretch;
    text-align: left;
  }

  .home-page #home-faq .faq-expert-card h3 {
    margin: 12px 0 14px;
  }

  .home-page #home-faq .faq-expert-card .faq-expert-intro {
    max-width: 272px;
    margin-bottom: 22px;
    color: rgba(220, 234, 248, 0.82);
    font-size: 13.5px;
    line-height: 1.75;
  }

  .home-page #home-faq .faq-expert-card img {
    width: 132px;
    height: 132px;
  }

  .home-page #home-faq .faq-expert-card :is(img, .button, a:last-child) {
    align-self: center;
  }
}

@media (min-width: 961px) {
  .home-page #home-knowledge .project-start-layout {
    min-height: 0;
    grid-template-rows: auto 62px;
  }

  .home-page #home-faq .section-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 680px);
    grid-template-rows: auto auto;
    column-gap: 64px;
    row-gap: 10px;
    align-items: end;
  }

  .home-page #home-faq .faq-heading-summary {
    grid-column: 1;
    grid-row: 1 / 3;
    align-self: end;
    max-width: 460px;
    padding-left: 18px;
    display: grid;
    gap: 5px;
    border-left: 3px solid rgba(91, 221, 255, 0.7);
  }

  .home-page #home-faq .faq-heading-summary span {
    color: #5bddff;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.06em;
  }

  .home-page #home-faq .faq-heading-summary strong {
    color: #ffffff;
    font-size: 21px;
    line-height: 1.35;
  }

  .home-page #home-faq .faq-heading-summary p {
    grid-column: auto;
    grid-row: auto;
    justify-self: start;
    width: auto;
    max-width: 440px;
    margin: 0;
    color: rgba(208, 225, 243, 0.72);
    font-size: 13.5px;
    line-height: 1.65;
    text-align: left;
  }

  .home-page #home-faq .section-heading h2 {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
    justify-self: end;
    padding-left: 0;
    padding-right: 22px;
    border-left: 0;
    border-right: 4px solid #1dbcf2;
    text-align: right;
  }

  .home-page #home-faq .section-heading > p {
    grid-column: 2;
    grid-row: 2;
    justify-self: end;
    width: min(680px, calc(100% - 26px));
    max-width: none;
    margin: 0 26px 0 0;
    text-align: right;
  }

  .home-page #home-faq .faq-list {
    align-content: stretch;
  }
}

@media (min-width: 761px) and (max-width: 960px) {
  .home-page #home-faq .faq-expert-card .faq-expert-intro {
    width: min(520px, calc(100% - 48px));
    max-width: none;
  }
}