/* --- 1. DEFINE LOCAL FONT --- */
@font-face {
    font-family: 'Italiana';
    src: url('fonts/italiana-regular.ttf') format('truetype');
    font-weight: 400; /* Regular */
    font-style: normal;
    font-display: swap; /* Ensures text is visible while loading */
}

/* --- 2. CONTAINER --- */
.fliker-slider-container {
    width: 100%;
    height: 100vh !important;
    min-height: 804px;
    background: #000;
    position: relative;
    overflow: hidden;
}

.fliker-vertical-swiper, 
.swiper-wrapper, 
.swiper-slide {
    width: 100%;
    height: 100% !important;
}

/* Background Image Layer */
.fliker-bg-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    z-index: 1;
}

/* Overlay */
.fliker-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
}

/* --- 3. CONTENT LAYER (Left Bottom) --- */
.fliker-content-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
    display: flex;
    align-items: flex-end; /* Bottom */
    justify-content: flex-start; /* Left */
    padding-left: 60px;
    padding-bottom: 145px;
    box-sizing: border-box;
}

.fliker-text-inner {
    width: 100%;
    max-width: 800px;
}

.fliker-text-inner h2 {
    font-family: 'Italiana', serif; /* UPDATED FONT HERE */
    font-size: 64px; /* Slight increase for this specific font as it is usually thinner */
    color: #000;
    margin: 0;
    line-height: 1.1;
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.8s ease 0.3s;
}

/* Active slide animation */
.swiper-slide-active .fliker-text-inner h2 {
    opacity: 1;
    transform: translateY(0);
}

/* --- 4. NAVIGATION CONTROLS --- */
.fliker-nav-controls {
    position: absolute;
    right: 40px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    display: flex;
    flex-direction: column; 
    align-items: center;
    justify-content: center;
    gap: 15px; 
}

/* Arrows */
.swiper-button-prev-custom,
.swiper-button-next-custom {
    cursor: pointer;
    width: 30px;
    height: 30px;
    opacity: 0.6;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.swiper-button-prev-custom:hover,
.swiper-button-next-custom:hover {
    opacity: 1;
    transform: scale(1.1);
}

.swiper-button-prev-custom svg,
.swiper-button-next-custom svg {
    width: 100%;
    height: 100%;
    fill: #000;
    
}

/* The Bar in the Middle */
.fliker-pagination-line {
    width: 2px !important;
    height: 250px !important; 
    background: rgb(30 30 30 / 31%);
    position: relative;
    border-radius: 2px;
}

.fliker-pagination-line .swiper-pagination-progressbar-fill {
    background: #000 !important; 
    border-radius: 2px;
}

/* Mobile Adjustments */
@media (max-width: 768px) {
    .fliker-content-layer {
        padding-left: 20px;
        padding-bottom: 60px;
    }
    
    .fliker-text-inner h2 {
        font-size: 32px;
    }
    
    .fliker-nav-controls {
        right: 15px;
        transform: translateY(-50%) scale(0.8);
    }
	
	
	.fliker-slider-container { width: 100%;  height: 50vh !important;  min-height: 420px;}
	
}