/* Pallala Safari compatibility layer.
   Loaded after style.css. Small targeted fixes only; no redesign. */

/* 1. Vendor prefix: backdrop blur used by fixed header / drawer / ribbon star */
header.scrolled {
    -webkit-backdrop-filter: blur(18px) saturate(1.4);
}

.drawer {
    -webkit-backdrop-filter: blur(10px);
}

.ribbon-star {
    -webkit-backdrop-filter: blur(6px);
}

/* 2. iOS Safari dynamic toolbar: small viewport units when supported */
@supports (height: 100svh) {
    .hero {
        min-height: 100svh;
    }
}

@supports (height: 100dvh) {
    .hero {
        min-height: 100dvh;
    }
}

/* 3. iOS Safari does not support background-attachment: fixed; use scroll on touch */
@media (hover: none) {
    .cta-band {
        background-attachment: scroll;
    }
}

/* 4. Notched iOS Safari safe-area for the fixed drawer */
@supports (padding: env(safe-area-inset-top)) {
    .drawer {
        padding-top: env(safe-area-inset-top);
    }
}

/* 5. Defensive horizontal overflow guard (Safari keeps scrollbars stable) */
html,
body {
    overflow-x: clip;
}

@supports not (overflow: clip) {
    html,
    body {
        overflow-x: hidden;
    }
}

/* 6. Older Safari fallback for text-wrap */
@supports not (text-wrap: pretty) {
    p {
        overflow-wrap: break-word;
    }
}

/* 7. If only -webkit backdrop-filter exists, keep header readable */
@supports ((-webkit-backdrop-filter: blur(1px))) and (not (backdrop-filter: blur(1px))) {
    header.scrolled {
        background: rgba(21, 10, 15, 0.92);
    }
}
