/* V17: the existing contact design with stable touch, keyboard and scroll behavior. */
html.contact-scroll-locked { overflow: hidden; }
body.public-site.contact-drawer-ready .immersive-contact {
    /* Enhancement changes a normal section into a fixed drawer. Visibility
       must not interpolate from that original visible section on first load. */
    visibility: hidden;
    pointer-events: none;
    transform: translateX(100%);
    transition: transform 240ms ease;
    top: var(--contact-viewport-top, 0px);
    bottom: auto;
    height: var(--contact-viewport-height, 100dvh);
    max-height: var(--contact-viewport-height, 100dvh);
    scroll-padding-block: 78px 24px;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    padding-bottom: env(safe-area-inset-bottom, 0px);
}
body.public-site.contact-drawer-ready.contact-is-open .immersive-contact {
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
}
body.public-site.contact-drawer-ready .contact-backdrop { transition: opacity 200ms ease; }
body.public-site.contact-drawer-ready [data-contact-close] {
    position: sticky;
    display: flex;
    z-index: 2;
    top: max(14px, env(safe-area-inset-top, 0px));
    right: auto;
    width: fit-content;
    margin: max(14px, env(safe-area-inset-top, 0px)) 22px 0 auto;
    background: var(--ja-dark, #24312a);
}
body.public-site.contact-drawer-ready .immersive-contact .contact-layout { padding-top: 14px; }
body.public-site.contact-drawer-ready .immersive-contact .contact-methods { grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); }
body.public-site.contact-drawer-ready .immersive-contact .contact-methods strong { overflow-wrap: anywhere; }
body.public-site.contact-drawer-ready .immersive-contact .form-grid :is(input, select, textarea) { font-size: 16px; }
body.public-site.contact-drawer-ready .immersive-contact :focus-visible { outline-offset: 4px; }
@media (max-width: 620px) {
    body.public-site.contact-drawer-ready [data-contact-close] { margin-right: max(18px, env(safe-area-inset-right, 0px)); }
    body.public-site.contact-drawer-ready .immersive-contact .contact-layout { padding-top: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    body.public-site.contact-drawer-ready .immersive-contact,
    body.public-site.contact-drawer-ready .contact-backdrop { transition: none; }
}
