/* AP Architects Home mobile — canonical Figma 4202:460, isolated from desktop. */
@media (max-width: 767px) {
  .ap-home {
    --ap-mobile-content-width: min(320px, calc(100vw - 40px));
    width: 100%;
    overflow: clip;
    container-type: normal;
  }
  .ap-home .ap-hero { height: auto; min-height: 964px; background: #020202; }
  .ap-home .ap-hero::before {
    position: absolute;
    z-index: 1;
    inset: 0 0 auto;
    width: 100%;
    height: 540px;
    background: linear-gradient(to bottom, rgb(2 2 2 / .12) 0, transparent 22%, rgb(2 2 2 / .18) 44%, rgb(2 2 2 / .72) 68%, #020202 80%);
    content: "";
    pointer-events: none;
  }
  .ap-home .ap-hero::after,
  .ap-home .ap-hero__divider { display: none; }
  .ap-home .ap-hero__image { inset: 0; width: 100%; height: 430px; object-fit: cover; object-position: 42% center; }
  .ap-home .ap-hero__content { position: relative; display: flex; flex-direction: column; gap: 20px; padding: 310px 20px 70px; }
  .ap-home .ap-hero__side { position: static; width: 100%; color: #fff; font-size: 15px; font-weight: 500; line-height: 1.3; letter-spacing: -.03em; opacity: 1; text-shadow: 0 2px 14px rgba(0,0,0,.85); }
  .ap-home .ap-hero__title { position: static; width: 100%; font-size: 34px; line-height: 1.08; letter-spacing: -.02em; text-shadow: 0 2px 18px rgba(0,0,0,.45); }
  .ap-home .ap-hero__intro { position: static; width: 100%; font-size: 15px; line-height: 1.45; letter-spacing: -.03em; opacity: .9; }
  .ap-home .ap-stat-grid { position: static; display: flex; width: 100%; height: auto; margin-top: 24px; flex-direction: column; }
  .ap-home .ap-stat { display: grid; grid-template-columns: 110px 1fr; align-items: center; min-height: 62px; height: auto; padding: 0 !important; border-bottom: 1px solid rgba(255,255,255,.2); }
  .ap-home .ap-stat + .ap-stat { margin-top: 20px; }
  .ap-home .ap-stat:last-child { border-bottom: 0; }
  .ap-home .ap-stat__value { align-items: flex-start; gap: 0; height: auto; margin: 0; line-height: 1; }
  .ap-home .ap-stat__value span,
  .ap-home .ap-stat__value sup { font-size: 32px; line-height: 1; }
  .ap-home .ap-stat__label { margin: 0; font-size: 13px; line-height: 1.3; letter-spacing: -.03em; opacity: .85; }

  .ap-home .ap-about { height: auto; min-height: 0; background: var(--ap-paper); }
  .ap-home .ap-about::before { display: none; }
  .ap-home .ap-about__canvas { position: relative; inset: auto; display: flex; height: auto; padding: 50px 20px 48px; flex-direction: column; box-sizing: border-box; }
  .ap-home .ap-about__label,
  .ap-home .ap-about__title,
  .ap-home .ap-about__intro,
  .ap-home .ap-service { position: static; top: auto; left: auto; width: var(--ap-mobile-content-width); }
  .ap-home .ap-about__label { order: 1; margin: 0; font-size: 15px; line-height: 1.35; letter-spacing: -.02em; }
  .ap-home .ap-about__title { order: 2; margin: 16px 0 0; font-size: 30px; line-height: 1.1; letter-spacing: -.033em; }
  .ap-home .ap-about__intro { order: 3; margin: 10px 0 48px; font-size: 15px; line-height: 1.45; letter-spacing: -.02em; }
  .ap-home .ap-service { display: block; margin: 0 0 32px; }
  .ap-home .ap-service--interior { order: 4; }
  .ap-home .ap-service--construction { order: 5; }
  .ap-home .ap-service--architecture { order: 6; margin-bottom: 0; }
  .ap-home .ap-service__image,
  .ap-home .ap-service--interior .ap-service__image,
  .ap-home .ap-service--architecture .ap-service__image,
  .ap-home .ap-service--construction .ap-service__image { width: var(--ap-mobile-content-width); height: 240px; object-fit: cover; }
  .ap-home .ap-service__title { margin: 12px 0 0; font-size: 20px; line-height: 1.3; letter-spacing: -.02em; }
  .ap-home .ap-service__copy { width: var(--ap-mobile-content-width); margin: 4px 0 0; font-size: 14px; line-height: 1.4; letter-spacing: -.02em; }

  .ap-home .ap-approach { height: 838px; background: rgba(0,0,0,.03); }
  .ap-home .ap-approach::before { display: none; }
  .ap-home .ap-approach__canvas { position: relative; inset: auto; height: 100%; padding: 50px 20px; }
  .ap-home .ap-approach__copy { position: static; width: var(--ap-mobile-content-width); }
  .ap-home .ap-approach__title { font-size: 30px; line-height: 1.1; letter-spacing: -.033em; }
  .ap-home .ap-approach__intro { max-width: none; margin: 10px 0 0; font-size: 15px; line-height: 1.45; letter-spacing: -.02em; }
  .ap-home .ap-approach .ap-button { align-self: flex-start; min-height: 66px; margin-top: 20px; padding: 18px 30px 22px; gap: 12px; font-size: 16px; }
  .ap-home .ap-approach .ap-button .ap-cta__arrow { width: 14px; height: 19px; }
  .ap-home .ap-approach__image { position: absolute; top: 384px; left: 20px; width: var(--ap-mobile-content-width); height: 210px; object-fit: cover; }
  .ap-home .ap-approach__features { position: absolute; top: 634px; left: 20px; display: flex; width: var(--ap-mobile-content-width); flex-direction: column; }
  .ap-home .ap-approach-feature { display: flex; align-items: center; gap: 16px; min-height: 45px; border-bottom: 1px solid rgba(23,23,22,.1); }
  .ap-home .ap-approach-feature:last-child { border-bottom: 0; }
  .ap-home .ap-approach-icon { width: 24px; height: 24px; }
  .ap-home .ap-approach-feature p { margin: 0; font-size: 15px; line-height: 1.3; letter-spacing: -.02em; }
  .ap-home .ap-approach-feature p br { display: none; }

  .ap-home .ap-projects { height: auto; min-height: 0; overflow: visible; }
  .ap-home .ap-projects__stage,
  .ap-home .ap-projects__canvas { position: relative; height: auto; }
  .ap-home .ap-projects__canvas { inset: auto; display: flex; padding: 50px 20px; flex-direction: column; box-sizing: border-box; }
  .ap-home .ap-projects__label,
  .ap-home .ap-projects__title,
  .ap-home .ap-projects__intro,
  .ap-home .ap-projects__track,
  .ap-home .ap-projects__all { position: static; inset: auto; }
  .ap-home .ap-projects__label { font-size: 15px; line-height: 1.35; }
  .ap-home .ap-projects__title { width: var(--ap-mobile-content-width); margin: 40px 0 0; font-size: 30px; line-height: 1.3; letter-spacing: 0; }
  .ap-home .ap-projects__title br { display: none; }
  .ap-home .ap-projects__intro { width: var(--ap-mobile-content-width); margin: 6px 0 0; font-size: 15px; line-height: 1.45; letter-spacing: -.02em; }
  .ap-home .ap-projects__track { display: flex; width: var(--ap-mobile-content-width); margin: 40px 0 0; flex-direction: column; gap: 40px; }
  .ap-home .ap-project-card,
  .ap-home .ap-project-card:nth-child(n) { position: static; display: block; width: var(--ap-mobile-content-width); }
  .ap-home .ap-project-card:nth-child(n+7) { display: none; }
  .ap-home .ap-project-card:nth-child(n) .ap-project-card__media { width: var(--ap-mobile-content-width); height: 220px; }
  .ap-home .ap-project-card__hover { display: none; }
  .ap-home .ap-project-card__title { margin-top: 12px; font-size: 14px; line-height: 1.3; opacity: .6; }
  .ap-home .ap-project-card__copy { margin-top: 6px; color: #fff; font-size: 18px; line-height: 1.3; }
  .ap-home .ap-projects__all { align-self: flex-end; margin-top: 32px; gap: 8px; font-size: 16px; line-height: 1.3; }
  .ap-home .ap-projects__all img { width: 23px; height: 23px; }

  .ap-home .ap-process { height: auto; min-height: 0; overflow: visible; }
  .ap-home .ap-process::before { display: none; }
  .ap-home .ap-process__canvas{ position: relative; inset: auto; height: auto; padding: 48px 20px; display:block;}
  .ap-home .ap-process__lead { position: static; width: var(--ap-mobile-content-width); }
  .ap-home .ap-process__title { font-size: 30px; line-height: 1.1; letter-spacing: -.02em; }
  .ap-home .ap-process__intro { margin: 10px 0 0; font-size: 15px; line-height: 1.45; letter-spacing: -.02em; }
  .ap-home .ap-process__image { display: none; }
  .ap-home .ap-process__steps { position: static; width: var(--ap-mobile-content-width); margin-top: 24px; }
  .ap-home .ap-process-step { grid-template-columns: 42px 1fr; min-height: 130px; padding: 20px 0; border-bottom: 1px solid rgba(51,51,51,.15); }
  .ap-home .ap-process-step:nth-child(4) { min-height: 150px; }
  .ap-home .ap-process-step:nth-child(5) { min-height: 170px; }
  .ap-home .ap-process-step__number,
  .ap-home .ap-process-step__content strong { font-size: 20px; line-height: 1.3; letter-spacing: -.02em; }
  .ap-home .ap-process-step__number { opacity: .4; }
  .ap-home .ap-process-step:nth-child(4) .ap-process-step__content { width: auto; min-width: 0; }
  .ap-home .ap-process-step:nth-child(4) .ap-process-step__content > span { white-space: normal; overflow-wrap: break-word; }
  .ap-home .ap-process-step__content span { margin-top: 4px; font-size: 14px; line-height: 1.4; letter-spacing: -.02em; }

  .ap-home .ap-contact { height: auto; min-height: 0; }
  .ap-home .ap-contact::before,
  .ap-home .ap-contact__details { display: none; }
  .ap-home .ap-contact__background { top: 0; width: 100%; height: 100%; object-fit: cover; }
  .ap-home .ap-contact__canvas { position: relative; inset: auto; height: auto; min-height: 0; padding: 48px 20px; box-sizing: border-box; }
  .ap-home .ap-contact__form-column { position: static; width: var(--ap-mobile-content-width); }
  .ap-home .ap-contact__title { font-size: 30px; line-height: 1.08; letter-spacing: -.04em; }
  .ap-home .ap-contact-form { margin-top: 14px; }
  .ap-home .ap-contact-form__row { grid-template-columns: 1fr; gap: 6px; }
  .ap-home .ap-contact-field { min-height: 56px; padding: 18px 20px; font-size: 16px; }
  .ap-home .ap-contact-field::before { display: none; }
  .ap-home .ap-contact-form__services { height: 56px; margin-top: 6px; padding: 3px; }
  .ap-home .ap-contact-form__services .wpcf7-list-item-label { font-size: 10px; }
  .ap-home .ap-contact-field--comment { height: 100px; margin-top: 6px; }
  .ap-home .ap-contact-form__submit-row { display: flex; margin-top: 14px; flex-direction: column; align-items: stretch; gap: 8px; }
  .ap-home .ap-contact-form__submit-row .wpcf7-submit { width: var(--ap-mobile-content-width); min-height: 58px;  font-size: 17px; }
  .ap-home .ap-contact-form__submit-row p { width: var(--ap-mobile-content-width); font-size: 10px; line-height: 1.4; }
  .ap-home .ap-contact__promise { position: static; width: var(--ap-mobile-content-width); margin: 32px 0 0; }
  .ap-home .ap-contact__promise h3 { font-size: 18px; line-height: 1.3; }
  .ap-home .ap-contact__promise p { margin-top: 4px; font-size: 12px; line-height: 1.45; }

}

@media (max-width: 767px) and (orientation: landscape) {
  .ap-home {
    --ap-mobile-content-width: min(560px, calc(100vw - 40px));
  }
}
