/* Decorative first-visit brand introduction. The homepage always remains beneath it. */
.ibbani-intro {
    position: fixed;
    inset: 0;
    z-index: 20000;
    display: none;
    place-items: center;
    overflow: hidden;
    background:
        radial-gradient(ellipse at 50% 42%, rgba(222, 180, 80, .09), transparent 28rem),
        #f4f1ea;
    opacity: 1;
    transition: opacity .46s ease, transform .46s cubic-bezier(.22, .7, .2, 1);
}

.ibbani-intro-enabled .ibbani-intro { display: grid; }
.ibbani-intro[hidden] { display: none; }
.ibbani-intro.is-leaving { pointer-events: none; opacity: 0; transform: translateY(-5px); }

.ibbani-intro__mark {
    display: grid;
    justify-items: center;
    width: min(30rem, 80vw);
    transform: translateY(5px) scale(.975);
    animation: ibbani-mark-settle .8s cubic-bezier(.22, .7, .2, 1) .2s forwards;
}

.ibbani-intro__icon {
    position: relative;
    width: min(18rem, 54vw);
    aspect-ratio: 3 / 2;
}

.ibbani-intro__icon::after {
    position: absolute;
    z-index: 3;
    top: 47%;
    left: 50%;
    width: 12%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: rgba(211, 164, 49, .12);
    content: '';
    filter: blur(12px);
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -50%);
    animation: ibbani-window-light .55s ease .72s forwards;
}

.ibbani-intro__icon-layer { position: absolute; inset: 0; overflow: hidden; }
.ibbani-intro__icon-layer img { display: block; width: 100%; height: 100%; object-fit: contain; }
.ibbani-intro__icon-base { clip-path: inset(0 0 100% 0); animation: ibbani-icon-descend .7s cubic-bezier(.22, .7, .2, 1) .2s forwards; }
.ibbani-intro__icon-roof { opacity: 0; clip-path: inset(20% 19% 33% 19%); animation: ibbani-roof-emerge .55s cubic-bezier(.22, .7, .2, 1) .6s forwards; }
.ibbani-intro__icon-leaf { clip-path: inset(61% 100% 0 0); animation: ibbani-leaf-sweep .5s cubic-bezier(.22, .7, .2, 1) .9s forwards; }

.ibbani-intro__wordmark {
    margin-top: .1rem;
    color: #1f4937;
    font-family: 'Cinzel', serif;
    font-size: clamp(2rem, 5.2vw, 3.4rem);
    font-weight: 700;
    letter-spacing: .25em;
    line-height: 1;
    opacity: 0;
    filter: blur(3px);
    clip-path: inset(0 50% 0 50%);
    transform: translateY(8px);
    animation: ibbani-wordmark-emerge .64s cubic-bezier(.22, .7, .2, 1) 1.25s forwards;
}

.ibbani-intro__subtext {
    display: flex;
    align-items: center;
    gap: .7rem;
    margin-top: .65rem;
    color: #ae8528;
    font-size: clamp(.58rem, 1.4vw, .72rem);
    font-weight: 600;
    letter-spacing: .24em;
    opacity: 0;
    transform: translateY(7px);
    animation: ibbani-text-arrive .48s cubic-bezier(.22, .7, .2, 1) 1.7s forwards;
}

.ibbani-intro__subtext span { width: clamp(1.75rem, 7vw, 3.5rem); height: 1px; background: rgba(174, 133, 40, .7); }
.ibbani-intro__subtext b { font-size: 1em; font-weight: 500; }
.ibbani-intro__tagline { margin: .75rem 0 0; color: #687066; font-size: clamp(.65rem, 1.5vw, .79rem); font-weight: 400; letter-spacing: .07em; opacity: 0; transform: translateY(5px); animation: ibbani-text-arrive .42s ease 2s forwards; }

@keyframes ibbani-icon-descend { to { clip-path: inset(0 0 0 0); } }
@keyframes ibbani-roof-emerge { to { opacity: 1; } }
@keyframes ibbani-leaf-sweep { to { clip-path: inset(61% 0 0 0); } }
@keyframes ibbani-window-light { to { opacity: 1; } }
@keyframes ibbani-wordmark-emerge {
    to { opacity: 1; filter: blur(0); clip-path: inset(0 0 0 0); transform: translateY(0); letter-spacing: .16em; }
}
@keyframes ibbani-text-arrive { to { opacity: 1; transform: translateY(0); } }
@keyframes ibbani-mark-settle { to { transform: translateY(0) scale(1); } }

@media (max-width: 600px) {
    .ibbani-intro__mark { width: min(20rem, 84vw); }
    .ibbani-intro__icon { width: min(13.5rem, 64vw); }
    .ibbani-intro__subtext { gap: .45rem; letter-spacing: .17em; }
    .ibbani-intro__tagline { letter-spacing: .03em; }
}

@media (prefers-reduced-motion: reduce) { .ibbani-intro { display: none !important; } }