/* Page-specific typography for index.html. */
.motion-rich:not(.about-page) .hero__eyebrow {
  font-size: 12px;
  line-height: 1.5;
}

.motion-rich:not(.about-page) .hero__subcopy {
  width: min(36em, 100%);
  max-width: none;
  font-size: 15px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}

.motion-rich:not(.about-page) .hero__badge {
  font-size: 13px;
}

.motion-rich:not(.about-page) .service-intro__body {
  font-size: 16px !important;
  line-height: 1.9;
}

.motion-rich:not(.about-page) .service-intro .text-link {
  font-size: 14px;
}

.motion-rich:not(.about-page) .office .section-heading p,
.motion-rich:not(.about-page) .jobs .section-heading p,
.motion-rich:not(.about-page) .sns .section-heading p {
  font-size: 14px;
  line-height: 1.6;
}

.motion-rich:not(.about-page) .job-row__label {
  font-size: 13px;
  line-height: 1.5;
}

.motion-rich:not(.about-page) .job-row__copy > p:last-child {
  font-size: 15px;
  line-height: 1.75;
  overflow-wrap: anywhere;
}

.motion-rich:not(.about-page) .office-wheel__circle {
  font-size: 12px;
}

.motion-rich:not(.about-page) .sns-post-card__label {
  font-size: 12px;
  line-height: 1.4;
}

@media (max-width: 767px) {
  .motion-rich:not(.about-page) .hero__copy {
    width: calc(100% - 32px);
  }

  .motion-rich:not(.about-page) .hero__eyebrow {
    font-size: 11px;
  }

  .motion-rich:not(.about-page) .hero h1 {
    font-size: clamp(27px, 7.2vw, 34px);
    line-height: 1.45;
  }

  .motion-rich:not(.about-page) .hero__subcopy {
    width: min(25em, 100%);
    font-size: 14px;
    line-height: 1.7;
  }

  .motion-rich:not(.about-page) .hero__badge {
    min-height: 38px;
    font-size: 12px;
  }

  .motion-rich:not(.about-page) .service-intro__label {
    font-size: 12px;
  }

  .motion-rich:not(.about-page) .service-intro__inner h2 {
    font-size: clamp(20px, 5.4vw, 25px);
    line-height: 1.5;
  }

  .motion-rich:not(.about-page) .service-intro__body {
    font-size: 14px !important;
    line-height: 1.85;
  }

  .motion-rich:not(.about-page) .service-intro .text-link {
    font-size: 13px;
  }

  .motion-rich:not(.about-page) .office-card__copy h2 {
    font-size: 19px;
    line-height: 1.4;
  }

  .motion-rich:not(.about-page) .office-card__copy p {
    font-size: 14px;
    line-height: 1.75;
    overflow-wrap: anywhere;
  }

  .motion-rich:not(.about-page) .job-row__label {
    font-size: 12px;
  }

  .motion-rich:not(.about-page) .job-row__copy h2 {
    font-size: 18px;
    line-height: 1.3;
    overflow-wrap: anywhere;
  }

  .motion-rich:not(.about-page) .job-row__copy > p:last-child {
    font-size: 14px;
    line-height: 1.7;
  }

  .motion-rich:not(.about-page) .voice__center p,
  .motion-rich:not(.about-page) .voice__link {
    font-size: 13px;
  }

  .motion-rich:not(.about-page) .sns-post-card__label {
    font-size: 12px;
  }
}

@media (max-width: 767px) {
  .motion-rich:not(.about-page) .office__layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
  }

  .motion-rich:not(.about-page) .office-wheel {
    position: relative;
    top: auto;
    display: block;
    width: 100%;
    max-width: 360px;
    min-height: 0;
    aspect-ratio: 1;
    margin: 0 auto;
  }

  .motion-rich:not(.about-page) .office-wheel::before {
    display: block;
    top: 20%;
    bottom: auto;
    left: 7%;
    width: 86%;
    height: auto;
    aspect-ratio: 1.3;
    border: 1px dashed rgb(85 176 177 / 32%);
    border-radius: 50%;
    transform: rotate(var(--office-orbit-rotate, -7deg));
  }

  .motion-rich:not(.about-page) .office-wheel__circle {
    --office-anchor-x: 0%;
    --office-ring-inset: 7px;
    position: absolute;
    top: auto;
    right: auto;
    bottom: 14px;
    left: 14px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 1fr auto 1fr;
    gap: 4px;
    width: clamp(116px, 36vw, 160px);
    padding: 12px;
    font-size: 11px;
    transform: translateX(var(--office-anchor-x));
  }

  .motion-rich:not(.about-page) .office-wheel__circle--center {
    --office-anchor-x: -50%;
    top: 16px;
    bottom: auto;
    left: 50%;
  }

  .motion-rich:not(.about-page) .office-wheel__circle--right {
    right: 14px;
    left: auto;
  }

  .motion-rich:not(.about-page) .office-wheel__circle span,
  .motion-rich:not(.about-page) .office-wheel__circle strong {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .motion-rich:not(.about-page) .office-wheel__circle span:first-child {
    font-size: 8px;
    line-height: 1.25;
    letter-spacing: .06em;
  }

  .motion-rich:not(.about-page) .office-wheel__circle strong {
    font-size: clamp(14px, 4vw, 17px);
    line-height: 1.3;
  }

  .motion-rich:not(.about-page) .office-wheel__circle span:last-child {
    padding: 3px 5px;
    font-size: 10px;
    line-height: 1.35;
    word-break: keep-all;
    overflow-wrap: normal;
  }

  .motion-rich:not(.about-page) .office-wheel.is-tracking .office-wheel__circle,
  .motion-rich:not(.about-page) .office-wheel.is-tracking .office-wheel__circle--center {
    opacity: .72;
    transform: translateX(var(--office-anchor-x)) scale(.94);
  }

  .motion-rich:not(.about-page) .office-wheel.is-tracking .office-wheel__circle.is-active,
  .motion-rich:not(.about-page) .office-wheel.is-tracking .office-wheel__circle--center.is-active {
    opacity: 1;
    transform: translateX(var(--office-anchor-x)) translateY(-4px) scale(1.04);
  }

  .motion-rich:not(.about-page) .office-wheel.is-tracking .office-wheel__circle:not(.is-active):hover,
  .motion-rich:not(.about-page) .office-wheel.is-tracking .office-wheel__circle:not(.is-active):focus-visible,
  .motion-rich:not(.about-page) .office-wheel.is-tracking .office-wheel__circle--center:not(.is-active):hover,
  .motion-rich:not(.about-page) .office-wheel.is-tracking .office-wheel__circle--center:not(.is-active):focus-visible {
    opacity: 1;
    transform: translateX(var(--office-anchor-x)) translateY(-2px) scale(.98);
  }
}

@media (max-width: 480px) {
  .motion-rich:not(.about-page) .job-row {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 10px;
    min-height: 0;
    padding: 12px;
  }

  .motion-rich:not(.about-page) .job-row > img {
    grid-column: 1 / -1;
    height: 180px;
  }
}