:root {
    --orange: #ffa500;
    --dark: #0c0c0d;
    --gray: #6b7280;
    --radius: 20px;
    --transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

body { font-family: 'Plus Jakarta Sans', sans-serif; color: var(--dark); overflow-x: hidden; }
.fw-800 { font-weight: 800; }
.text-orange { color: var(--orange); }
.section-padding { padding: 100px 0; }

/* --- NAVBAR --- */
#mainNav { padding: 20px 0; background: rgba(255,255,255,0.9); backdrop-filter: blur(10px); }
.navbar-brand { font-weight: 800; font-size: 1.6rem; color: var(--dark) !important; }
.navbar-brand span { color: var(--orange); }
.nav-link { font-weight: 600; color: var(--dark) !important; margin: 0 10px; }
.btn-nav-cta { background: var(--dark); color: white; padding: 10px 25px; border-radius: 50px; text-decoration: none; font-weight: 600; transition: 0.3s; }
.btn-nav-cta:hover { background: var(--orange); }

/* --- HERO --- */
.hero-main { position: relative; height: 90vh; background: url('../images/prizren.webp') center/cover no-repeat; }

.hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 100%); pointer-events: none; z-index: 1; }

.hero-content { position: relative; z-index: 2; color: white; display: flex; flex-direction: column; justify-content: center; height: 100%; }
.search-panel-main { background: white; padding: 15px; border-radius: 15px; box-shadow: 0 20px 40px rgba(0,0,0,0.15); margin-top: 30px; }
.search-input-box { display: flex; align-items: center; background: #f8f9fa; padding: 12px 15px; border-radius: 10px; height: 100%; }
.search-input-box i { color: var(--orange); margin-right: 10px; }
.search-input-box input, .search-input-box select { border: none; background: transparent; width: 100%; outline: none; font-weight: 600; }
.btn-search-hero { background: var(--orange); border: none; width: 100%; padding: 12px; border-radius: 10px; color: white; font-weight: 800; transition: 0.3s; }

/* --- STATS BAR --- */
.stats-bar { padding: 40px 0; background: #fff; margin-top: -50px; position: relative; z-index: 5; }
.stat-item { background: #fff; padding: 25px; border-radius: var(--radius); border: 1px solid #eee; transition: var(--transition); }
.stat-item:hover { transform: translateY(-5px); box-shadow: 0 10px 30px rgba(0,0,0,0.05); }
.stat-item i { font-size: 2rem; color: var(--orange); display: block; margin-bottom: 10px; }
.stat-item span { font-weight: 700; font-size: 0.9rem; }

/* --- PLACE CARDS --- */
.place-card-modern { background: white; border-radius: var(--radius); overflow: hidden; height: 100%; border: 1px solid #f0f0f0; transition: var(--transition); }
.place-card-modern:hover { transform: translateY(-12px); box-shadow: 0 30px 60px rgba(0,0,0,0.1); }
.pc-image { height: 260px; position: relative; overflow: hidden; }
.pc-image img { width: 100%; height: 100%; object-fit: cover; transition: 0.8s; }
.place-card-modern:hover .pc-image img { transform: scale(1.1); }
.pc-rating { position: absolute; top: 15px; right: 15px; background: white; padding: 5px 12px; border-radius: 50px; font-weight: 800; font-size: 0.8rem; }
.pc-content { padding: 25px; }
.pc-content h3 { font-size: 1.3rem; font-weight: 800; margin-bottom: 10px; }
.pc-content p { color: var(--gray); font-size: 0.9rem; }
.pc-link { color: var(--dark); font-weight: 800; text-decoration: none; border-bottom: 2px solid var(--orange); padding-bottom: 2px; }

/* --- JOURNAL --- */
.journal-main-card { position: relative; border-radius: var(--radius); overflow: hidden; height: 450px; }
.journal-main-card img { width: 100%; height: 100%; object-fit: cover; }
.j-overlay { position: absolute; bottom: 0; left: 0; padding: 40px; background: linear-gradient(transparent, rgba(0,0,0,0.9)); color: white; width: 100%; }
.journal-mini img { width: 100px; height: 100px; object-fit: cover; border-radius: 15px; }

/* --- FOOTER --- */
.footer-modern { background: #fff; padding: 100px 0 40px; border-top: 1px solid #eee; }
.footer-logo { font-weight: 800; }
.footer-logo span { color: var(--orange); }
.footer-links li { margin-bottom: 12px; }
.footer-links a { color: var(--gray); text-decoration: none; transition: 0.3s; }
.footer-links a:hover { color: var(--orange); padding-left: 5px; }
.newsletter-box { display: flex; background: #f8f9fa; padding: 5px; border-radius: 12px; margin-top: 15px; }
.newsletter-box input { border: none; background: transparent; padding: 10px; flex-grow: 1; outline: none; }
.newsletter-box button { background: var(--dark); color: white; border: none; padding: 10px 20px; border-radius: 8px; font-weight: 700; }
.social-box a { width: 40px; height: 40px; background: #f0f0f0; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; color: var(--dark); margin-right: 10px; transition: 0.3s; }
.social-box a:hover { background: var(--orange); color: white; }

@media (max-width: 768px) {
    .hero-main { height: auto; padding: 120px 0 80px; }
    .display-2 { font-size: 2.5rem; }
}