/* ========================================
   VBT Custom Styles
   Styles that Tailwind CDN cannot handle
   ======================================== */

/* Base */
body { background-color: #FCFAF8; color: #141C2A; }

/* Line clamp utility (truncate text to N lines) */
.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ── Arabesque Motif: Structural boundary classes ── */
.shape-arabesque-hero { border-radius: 8rem 0 8rem 0; }
.shape-arabesque-img  { border-radius: 0 6rem 0 6rem; }
.shape-arabesque-alt  { border-radius: 6rem 0 6rem 0; }

@media (max-width: 768px) {
    .shape-arabesque-hero { border-radius: 4rem 0 4rem 0; }
    .shape-arabesque-img  { border-radius: 0 4rem 0 4rem; }
    .shape-arabesque-alt  { border-radius: 4rem 0 4rem 0; }
}

/* ── Scroll Reveal Animations ── */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 1.2s cubic-bezier(0.25, 0.1, 0.25, 1);
}
.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

/* Stagger delays for grids */
.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }
.delay-300 { transition-delay: 300ms; }

/* ── Marquee Animation ── */
@keyframes scroll-infinite {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.animate-scroll {
    animation: scroll-infinite 45s linear infinite;
    width: max-content;
}
.animate-scroll-fast {
    animation: scroll-infinite 25s linear infinite;
    width: max-content;
}
.animate-scroll:hover,
.animate-scroll-fast:hover {
    animation-play-state: paused;
}
.mask-edges {
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}

/* ── Scrollbar Hide (mobile menu) ── */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* ── Ticket Stub Styling ── */
.ticket-stub {
    position: relative;
}
.ticket-stub::before,
.ticket-stub::after {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    background-color: inherit;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
}
.ticket-stub::before {
    left: -10px;
    box-shadow: inset 5px 0 5px -3px rgba(0,0,0,0.08);
}
.ticket-stub::after {
    right: -10px;
    box-shadow: inset -5px 0 5px -3px rgba(0,0,0,0.08);
}

/* ── WordPress-specific ── */
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: 0.875rem; color: rgba(20, 28, 42, 0.6); }
.alignleft { float: left; margin-right: 1.5rem; }
.alignright { float: right; margin-left: 1.5rem; }
.aligncenter { display: block; margin: 0 auto; }

/* ── Gallery Item Transitions ── */
.gallery-item {
    transition: opacity 0.4s ease, transform 0.4s ease;
}
.gallery-item.hidden-filter {
    opacity: 0;
    transform: scale(0.95);
    position: absolute;
    pointer-events: none;
}