/* A quiet botanical detail, with the logo area kept clear. */
@media (max-width: 991px) {
    .header-wrap-inner:not(.sticky) { position: relative; }
    /* Never place the cropped top ornament inside a regular browser header. */
    .header-wrap-inner::before { content: none; }

    html.sf-ios-home {
        --sf-status-height: env(safe-area-inset-top, 0px);
    }
    html.sf-ios-home {
        background: #fff;
    }
    .sf-ios-home body {
        padding-top: var(--sf-status-height);
    }
    .sf-ios-home body::before {
        content: "";
        position: fixed;
        inset: 0 0 auto;
        height: var(--sf-status-height);
        z-index: 1900;
        pointer-events: none;
        background: #fff;
    }
    .sf-ios-home .header-wrap-inner.sticky.show {
        top: 0;
        padding-top: calc(4px + var(--sf-status-height));
    }
    /* One continuous ornament crosses the safe-area boundary without clipping.
       Its transparent tail ends before the menu, logo and promo text. */
    .sf-ios-home body::after {
        content: "";
        position: fixed;
        inset: 0 0 auto;
        height: calc(var(--sf-status-height) + 18px);
        z-index: 1901;
        pointer-events: none;
        background: url("sendaflor-floral-corners-v1.svg") center top / 100% 110px no-repeat;
        -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 max(0px, calc(var(--sf-status-height) - 24px)), transparent 100%);
        mask-image: linear-gradient(to bottom, #000 0, #000 max(0px, calc(var(--sf-status-height) - 24px)), transparent 100%);
    }
    .sf-ios-home .flower-configurator,
    .sf-ios-home .sidebar-menu-wrap,
    .sf-ios-home .sidebar-cart-wrap,
    .sf-ios-home .product-filter-wrap.active {
        top: var(--sf-status-height);
    }
    .sf-ios-home .flower-configurator-dialog {
        max-height: min(96dvh, calc(100dvh - var(--sf-status-height) - 8px));
    }
}
/* Explicit state avoids repainting a fixed background inside the fixed status layer. */
@media (max-width: 991px) {
    html.sf-ios-home.sf-header-is-sticky {
        background-color: #d2b744;
        background-image: none;
        background-position: center top;
        background-size: 100% 110px;
        background-repeat: no-repeat;
    }
    .sf-ios-home.sf-header-is-sticky body::before {
        background-color: #d2b744;
        background-image: none;
        background-position: center top;
        background-size: 100% 110px;
        background-repeat: no-repeat;
        background-attachment: scroll;
    }
}
