/* Progressive responsive and accessibility improvements for the public site. */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-padding-top: 5rem;
}

img,
picture,
svg,
video { max-width: 100%; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid var(--accent, #2997ff);
    outline-offset: 3px;
}

section[id] { scroll-margin-top: 5rem; }

.skip { z-index: 1200; }
.btn,
.link-btn,
.cart-btn,
.burger,
.drawer .dclose,
.sheet .x { min-width: 44px; min-height: 44px; }

.drawer {
    padding-top: max(16px, env(safe-area-inset-top, 0px));
    padding-right: max(18px, env(safe-area-inset-right, 0px));
    padding-bottom: max(18px, env(safe-area-inset-bottom, 0px));
    padding-left: max(18px, env(safe-area-inset-left, 0px));
    min-height: 100vh;
    min-height: 100dvh;
}

.sheet {
    min-height: 100vh;
    min-height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;
}
.sheet .body { overscroll-behavior-y: contain; }

.popin { padding: max(12px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px)) max(12px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px)); }
.popin .box {
    max-height: calc(100vh - 24px);
    max-height: calc(100dvh - 24px);
    overflow-y: auto;
    overscroll-behavior: contain;
}

.wa-float {
    right: calc(16px + env(safe-area-inset-right, 0px));
    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
}

@media (max-width: 767.98px) {
    .field input,
    .field select,
    .field textarea { min-height: 44px; font-size: 16px; }
    .sheet { width: 100vw; max-width: 100vw; border-left: 0; }
    .sheet .head { padding-top: max(14px, env(safe-area-inset-top, 0px)); }
    .sheet .body { padding-bottom: calc(22px + env(safe-area-inset-bottom, 0px)); }
    .popin .box { padding: clamp(18px, 6vw, 28px); }
}

@media (orientation: landscape) and (max-height: 520px) {
    .popin { align-items: flex-start; }
    .popin .box { margin-block: 4px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}