




.nusantara-journalPoster {
    box-shadow:
        0 4px 6px -1px rgba(8, 31, 48, 0.08),
        0 25px 50px -12px rgba(8, 31, 48, 0.25),
        0 50px 100px -40px rgba(8, 31, 48, 0.15);
    transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1),
        box-shadow 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.nusantara-journalPoster:hover {
    transform: translateY(-16px) scale(1.02);
    box-shadow:
        0 8px 12px -2px rgba(8, 31, 48, 0.1),
        0 40px 80px -20px rgba(8, 31, 48, 0.35),
        0 60px 120px -50px rgba(11, 114, 133, 0.2);
}


.nusantara-hero {
    box-shadow:
        0 4px 6px -1px rgba(8, 31, 48, 0.05),
        0 25px 60px -15px rgba(8, 31, 48, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.6);
}


.nusantara-section__header h2 {
    text-shadow: 0 2px 4px rgba(8, 31, 48, 0.08);
}




.nusantara-hero__search {
    background: rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 20px;
    padding: 1.25rem;
    box-shadow:
        0 8px 32px rgba(8, 31, 48, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
}


.nusantara-header--revealed {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow:
        0 4px 30px rgba(8, 31, 48, 0.08),
        0 1px 3px rgba(8, 31, 48, 0.05);
}


.nusantara-journalModal__backdrop {
    background: rgba(8, 31, 48, 0.4);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
}

.nusantara-journalModal__dialog {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow:
        0 25px 50px -12px rgba(8, 31, 48, 0.25),
        0 50px 100px -40px rgba(8, 31, 48, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
}




.nusantara-button--filled {
    position: relative;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease, background 0.3s ease;
}

.nusantara-button--filled::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.2) 0%, transparent 50%);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.nusantara-button--filled:hover {
    transform: translateY(-3px);
    box-shadow:
        0 10px 25px -8px rgba(11, 114, 133, 0.5),
        0 4px 6px -2px rgba(11, 114, 133, 0.25);
}

.nusantara-button--filled:hover::before {
    opacity: 1;
}


.nusantara-button--ghost {
    transition: transform 0.3s ease, box-shadow 0.3s ease,
        border-color 0.3s ease, background 0.3s ease;
}

.nusantara-button--ghost:hover {
    transform: translateY(-3px);
    background: rgba(11, 114, 133, 0.08);
    border-color: var(--nusantara-accent);
    box-shadow: 0 8px 20px -8px rgba(11, 114, 133, 0.25);
}


.nusantara-journalPoster__title {
    transition: box-shadow 0.35s ease, background 0.35s ease;
}

.nusantara-journalPoster:hover .nusantara-journalPoster__title {
    box-shadow:
        0 10px 30px -8px rgba(8, 31, 48, 0.4),
        0 0 0 1px rgba(255, 255, 255, 0.2);
    background: color-mix(in srgb, var(--nusantara-journal-deep) 80%, transparent 20%);
}


.nusantara-hero__searchControl {
    transition: box-shadow 0.3s ease, border-color 0.3s ease;
}

.nusantara-hero__searchControl:focus-within {
    border-color: var(--nusantara-accent);
    box-shadow:
        0 0 0 4px rgba(11, 114, 133, 0.15),
        0 8px 25px -8px rgba(11, 114, 133, 0.2);
}




@keyframes nusantaraFloat {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }
}

.nusantara-hero__aside {
    animation: nusantaraFloat 6s ease-in-out infinite;
    animation-play-state: paused;
}

.nusantara-hero__aside:hover {
    animation-play-state: running;
}


@keyframes nusantaraPulse {

    0%,
    100% {
        box-shadow: 0 0 0 0 rgba(11, 114, 133, 0.4);
    }

    50% {
        box-shadow: 0 0 0 12px rgba(11, 114, 133, 0);
    }
}

.nusantara-button--filled:not(:hover) {
    animation: nusantaraPulse 3s ease-in-out infinite;
}




.nusantara-journalGrid {
    perspective: 1200px;
    perspective-origin: center center;
}


.nusantara-journalPoster {
    transform-style: preserve-3d;
    transform: perspective(1000px) rotateX(0deg) rotateY(0deg);
    transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1),
        box-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1);
}


.nusantara-journalPoster:nth-child(odd):hover {
    transform: perspective(1000px) rotateX(-3deg) rotateY(5deg) translateY(-16px) scale(1.02);
}

.nusantara-journalPoster:nth-child(even):hover {
    transform: perspective(1000px) rotateX(-3deg) rotateY(-5deg) translateY(-16px) scale(1.02);
}


.nusantara-journalPoster__title {
    transform: translateZ(30px);
    transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.nusantara-journalPoster:hover .nusantara-journalPoster__title {
    transform: translateZ(50px);
}


.nusantara-hero {
    transform-style: preserve-3d;
    perspective: 1500px;
}

.nusantara-hero__content {
    transform: translateZ(20px);
}

.nusantara-hero__aside {
    transform: translateZ(40px) rotateY(-2deg);
    transition: transform 0.5s ease;
}

.nusantara-hero__aside:hover {
    transform: translateZ(60px) rotateY(0deg);
}


.nusantara-button--filled {
    transform-style: preserve-3d;
    transform: translateZ(0);
}

.nusantara-button--filled:hover {
    transform: translateZ(10px) translateY(-3px);
}


.nusantara-journalPoster::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg,
            rgba(255, 255, 255, 0.25) 0%,
            transparent 40%,
            transparent 60%,
            rgba(255, 255, 255, 0.1) 100%);
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
    z-index: 5;
    border-radius: inherit;
}

.nusantara-journalPoster:hover::before {
    opacity: 1;
}


.nusantara-journalPoster__overlay {
    transform: translateZ(20px);
}


.nusantara-tilt-glare {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    overflow: hidden;
    pointer-events: none;
    z-index: 10;
}

.nusantara-tilt-glare__inner {
    position: absolute;
    inset: -50%;
    width: 200%;
    height: 200%;
    transition: background 0.2s ease;
}



@media (prefers-reduced-motion: reduce) {

    .nusantara-hero__aside,
    .nusantara-button--filled {
        animation: none;
    }

    .nusantara-journalPoster,
    .nusantara-button--filled,
    .nusantara-button--ghost {
        transition-duration: 0.01ms !important;
    }
}

@media (max-width: 768px) {
    .nusantara-hero__search {
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
    }

    .nusantara-journalPoster:hover {
        transform: translateY(-8px) scale(1.01);
    }
}




.nusantara-footer {
    position: relative;
    overflow: hidden;
}


.nusantara-footer__particles {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: 0.96;
    filter: saturate(1.2) brightness(1.08);
}

.nusantara-footer__particles canvas {
    display: block;
    width: 100%;
    height: 100%;
    opacity: 1;
}


.nusantara-footer__inner {
    position: relative;
    z-index: 1;
}
