/* Furever Feline — original-illustration alignment and contact finishing, revision 11.
   Final layer deliberately overrides older responsive size caps. */

/* The entire kitten illustration belongs on the same center line as the form,
   rather than being constrained by the earlier phone-only 100px image cap. */
.contact-document .inquiry-scene > .contact-kitten-roost {
  width: 100%;
  min-width: 0;
  max-height: none;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding: 0;
  margin: 0 auto -16px;
  overflow: visible;
  text-align: center;
}
.contact-document .inquiry-scene > .contact-kitten-roost > img.contact-peeker {
  display: block;
  width: min(100%, 680px);
  max-width: 100%;
  max-height: none;
  height: auto;
  flex: none;
  object-fit: contain;
  object-position: center bottom;
  position: relative;
  left: auto;
  right: auto;
  margin: 0;
  /* Align the visible illustration, not just the transparent canvas.
     Its alpha-weighted center sits about 1.6% left of its canvas center. */
  transform: translateX(1.6%);
}
.contact-document .inquiry-scene .inquiry-heading,
.contact-document .inquiry-scene .inquiry-heading h2,
.contact-document .inquiry-scene .inquiry-heading .form-intro {
  text-align: center;
}
.contact-document .inquiry-scene .inquiry-heading h2 {
  max-width: 100%;
  margin: 0 auto 8px;
  line-height: 1.12;
  letter-spacing: -.022em;
  text-wrap: balance;
}
.contact-document .inquiry-scene .inquiry-heading .form-intro {
  max-width: 46ch;
  margin: 0 auto;
  line-height: 1.48;
  text-wrap: pretty;
}
/* Consistent spacing between section titles, prompts and inputs. */
.contact-document #cat-inquiry .inquiry-group-title {
  margin-bottom: 15px;
}
.contact-document #cat-inquiry .field {
  gap: 6px;
}

/* Restore the editorial reading-cat artwork immediately above the FAQ.
   Earlier native layouts reduced it to only 190px (phone) or 240px (tablet). */
.contact-document .contact-faq {
  --faq-art-width: clamp(400px, 31vw, 465px);
  --faq-cover-overlap: calc(var(--faq-art-width) * .14551);
}
.contact-document .contact-faq .faq-mascot {
  width: var(--faq-art-width);
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: calc(-1 * var(--faq-cover-overlap));
  align-items: center;
}
.contact-document .contact-faq .faq-mascot img {
  display: block;
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: center bottom;
}

@media (min-width:761px) and (max-width:1099px) {
  .contact-document .contact-faq {
    --faq-art-width: clamp(345px, 42vw, 395px);
  }
  .contact-document .inquiry-scene .inquiry-heading h2 {
    font-size: clamp(1.806rem, 3.15vw, 2.1525rem);
    max-width: 19ch;
    margin: 0 auto 9px;
  }
  .contact-document .form-grid {
    gap: 15px 14px;
  }
}
@media (max-width:760px) {
  .contact-document .contact-intro {
    padding-top: 25px;
    padding-bottom: 0;
  }
  /* Provide a clear pause after the greeting before the kitten-and-form group. */
  .contact-document .contact-layout {padding-top: clamp(42px, 9vw, 52px);}
  .contact-document .inquiry-scene .inquiry-heading {
    padding: 21px 18px 19px;
    margin-bottom: 19px;
  }
  .contact-document .inquiry-scene .inquiry-heading h2 {
    max-width: 15.5ch;
    font-size: clamp(1.7325rem, 7.665vw, 1.995rem);
    margin: 0 auto 9px;
  }
  .contact-document .inquiry-scene .inquiry-heading .form-intro {
    font-size: clamp(0.966rem, 3.78vw, 1.029rem);
    max-width: 42ch;
  }
  .contact-document .form-grid {gap: 14px;}
  .contact-document .inquiry-scene > .contact-kitten-roost {
    margin-bottom: -16px;
    padding-top: 4px;
  }
  .contact-document .inquiry-scene > .contact-kitten-roost > img.contact-peeker {
    width: 100%;
    max-width: 100%;
    max-height: none;
    height: auto;
  }
  .contact-document .contact-faq {
    --faq-art-width: min(320px, calc(100vw - 36px));
    padding-top: 18px;
  }
}

/* On narrow screens, the oversized magazine should not cover the FAQ label. */
@media (max-width:760px) {
  .contact-document .contact-faq {
    --faq-cover-overlap: 18px;
  }
  .contact-document .contact-faq .faq-heading {
    padding-top: 40px;
  }
}

@media (min-width:1100px) {
  .contact-document .form-grid {gap:16px 18px;}
}

/* CONTACT CLOSING PAW ARTWORK — original user-supplied 3:2 illustration.
   Directly below FAQs and above the footer, with no card or crop. */
.contact-document .contact-door-art {
  display:block;
  width:min(700px, calc(100% - var(--feline-gutter, 18px) - var(--feline-gutter, 18px)));
  max-width:100%;
  margin:0 auto clamp(24px, 2.8vw, 40px);
  padding:0;
  line-height:0;
  background:transparent;
  overflow:visible;
}
.contact-document .contact-door-art img {
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3 / 2;
  object-fit:contain;
  border-radius:12px 12px 0 0;
}
@media (min-width:761px) and (max-width:1100px) {
  .contact-document .contact-door-art {
    width:min(540px, calc(100% - var(--feline-gutter, 28px) - var(--feline-gutter, 28px)));
    margin-bottom:32px;
  }
}
@media (max-width:760px) {
  .contact-document .contact-door-art {
    width:calc(100% - var(--feline-gutter, 18px) - var(--feline-gutter, 18px));
    max-width:none;
    margin-bottom:clamp(24px, 5vw, 32px);
  }
  .contact-document .contact-door-art img {border-radius:10px 10px 0 0;}
}

/* CONTACT INTRO TO KITTENS SPACING v11 — preserve the artwork-to-form seam.
   Give the opening paragraph its own breathing room on larger screens. */
@media (min-width:761px) and (max-width:1099px) {
  .contact-document .contact-layout { padding-top:23px; }
}
@media (min-width:1100px) {
  .contact-document .contact-layout { padding-top:25px; }
}

/* feline-type-plus-five-20261101 */