.porch-drawing {
    --label-left: 87%;
    --label-top: 85.5%;
    --label-width: 11%;
    --label-height: 6%;
    display: block;
    position: relative;
}

.porch-drawing::after {
    content: "";
    position: absolute;
    z-index: 1;
    left: var(--label-left);
    top: var(--label-top);
    width: var(--label-width);
    height: var(--label-height);
    background: #fff;
    pointer-events: none;
}

.porch-drawing--plan {
    --label-left: 81.25%;
    --label-top: 87.2%;
    --label-width: 16.2%;
    --label-height: 6.3%;
}

.porch-drawing--section {
    --label-left: 87.25%;
    --label-top: 84.1%;
    --label-width: 10.5%;
    --label-height: 7.7%;
}

.porch-plan-switch__toggle {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    font: inherit;
    line-height: 0;
    touch-action: pan-y pinch-zoom;
}

.porch-plan-switch[data-enhanced] .porch-plan-switch__toggle {
    position: relative;
    display: grid;
    aspect-ratio: 9600 / 7202;
}

.porch-plan-switch[data-enhanced] .porch-plan-switch__panel {
    grid-area: 1 / 1;
    transition: opacity 160ms ease;
}

.porch-plan-switch[data-enhanced] .porch-plan-switch__panel[aria-hidden="true"] {
    opacity: 0;
    pointer-events: none;
}

.porch-plan-switch__toggle:not(:disabled) {
    cursor: pointer;
}

.porch-plan-switch__toggle:focus-visible {
    outline: 2px solid var(--ring);
    outline-offset: 5px;
}

.porch-plan-switch__arrow {
    display: none;
    bottom: max(12px, 3%);
    z-index: 3;
}

.porch-plan-switch[data-enhanced="ready"] .porch-plan-switch__arrow {
    display: block;
}

@media (max-width: 760px) {
    .porch-plan-switch__arrow {
        width: 32px;
        height: 36px;
    }

    .porch-plan-switch .home-scroll-arrow.porch-plan-switch__arrow::before {
        width: 20px;
        height: 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .porch-plan-switch[data-enhanced] .porch-plan-switch__panel {
        transition: none;
    }

    .porch-plan-switch .home-scroll-arrow.porch-plan-switch__arrow::before {
        animation: none;
        transition: none;
    }
}
