/* ============ HEART Theme ============ */
:root {
  --heart-dark: #0b1220;
  --heart-accent: #ffcc00;
  --heart-cta: #ff2d55;
  --heart-blue: #0d6efd;
}

body { font-family: Arial, "Hind Siliguri", sans-serif; background: #fff; }

/* Navbar */
.site-navbar { background: var(--heart-dark); }
.site-navbar .navbar-brand, .site-navbar .nav-link { color: #fff !important; font-weight: 500; }
.site-navbar .nav-link:hover, .site-navbar .nav-link.active { color: var(--heart-accent) !important; }
.site-navbar .navbar-toggler { border-color: rgba(255,255,255,.4); }
.site-navbar .navbar-toggler-icon { filter: invert(1); }
.brand-logo { width: 48px; height: 48px; object-fit: contain; background: #fff; border-radius: 8px; padding: 3px; }

.btn-cta {
  background: var(--heart-cta); color: #fff; font-weight: 700; border-radius: 999px;
  border: 2px solid transparent; box-shadow: 0 2px 8px rgba(255,45,85,.35); transition: .2s;
}
.btn-cta:hover { background: #e0264b; color: #fff; transform: translateY(-1px); box-shadow: 0 6px 14px rgba(255,45,85,.45); }

/* Section titles */
.section-title { font-weight: 700; position: relative; display: inline-block; margin-bottom: .4rem; }
.section-title:after { content: ""; display: block; width: 60px; height: 3px; background: var(--heart-cta); margin: 8px auto 0; border-radius: 3px; }
.section-subtitle { color: #6c757d; margin-bottom: 1.5rem; }

/* Hero slider */
.hero-slider { position: relative; width: 100%; height: 56vw; max-height: 520px; overflow: hidden; background: #000; }
.hero-slider .hs-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .6s ease; }
.hero-slider .hs-slide.active { opacity: 1; }
.hero-slider img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero-slider .hs-caption {
  position: absolute; left: 50%; bottom: 10%; transform: translateX(-50%);
  text-align: center; color: #fff; background: rgba(0,0,0,.45);
  padding: 14px 22px; border-radius: 12px; max-width: 90%;
}
.hero-slider .hs-caption h2 { margin: .2rem 0; font-size: clamp(18px, 3.5vw, 32px); font-weight: 700; }
.hero-slider .hs-caption p { margin: 0 0 6px; font-size: clamp(14px, 2.6vw, 18px); }
.hero-slider .hs-prev, .hero-slider .hs-next {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
  background: rgba(0,0,0,.35); color: #fff; border: 0; font-size: 26px;
  width: 42px; height: 42px; border-radius: 50%; cursor: pointer;
}
.hero-slider .hs-prev { left: 12px; } .hero-slider .hs-next { right: 12px; }
.hero-slider .hs-prev:hover, .hero-slider .hs-next:hover { background: rgba(0,0,0,.6); }
.hero-slider .hs-dots { position: absolute; left: 50%; transform: translateX(-50%); bottom: 12px; display: flex; gap: 8px; z-index: 5; }
.hero-slider .hs-dots button { width: 10px; height: 10px; border-radius: 50%; border: 0; background: #ffffff80; cursor: pointer; }
.hero-slider .hs-dots button.active { background: #fff; }
@media (max-width: 576px) { .hero-slider { height: 62vw; max-height: 420px; } }

/* Stats */
.stats-section { background: var(--heart-dark); color: #fff; }
.stat-box { padding: 24px 10px; }
.stat-box .stat-icon { font-size: 2rem; }
.stat-box .stat-value { font-size: 2.2rem; font-weight: 800; color: var(--heart-accent); }
.stat-box .stat-label { opacity: .85; }

/* Tour cards */
.tour-card { border: 0; border-radius: 14px; overflow: hidden; box-shadow: 0 4px 16px rgba(0,0,0,.08); transition: .25s; height: 100%; }
.tour-card:hover { transform: translateY(-4px); box-shadow: 0 10px 26px rgba(0,0,0,.14); }
.tour-card .tour-banner { height: 200px; object-fit: cover; width: 100%; background: #e9ecef; }
.tour-card .badge-fee { background: var(--heart-cta); font-size: .95rem; }
.countdown { display: flex; gap: 8px; justify-content: center; }
.countdown .cd-box { background: var(--heart-dark); color: #fff; border-radius: 8px; padding: 6px 10px; min-width: 56px; text-align: center; }
.countdown .cd-box b { display: block; font-size: 1.2rem; color: var(--heart-accent); }
.countdown .cd-box small { font-size: .7rem; opacity: .8; }

/* Logo slider (sponsors/donors) */
.logo-slider { display: flex; align-items: center; gap: 10px; }
.logo-marquee { overflow-x: auto; position: relative; padding: 10px 0; flex: 1; scrollbar-width: none; -ms-overflow-style: none; scroll-behavior: smooth; }
.logo-marquee::-webkit-scrollbar { display: none; }
.logo-track { display: flex; gap: 56px; align-items: center; width: max-content; margin: 0 auto; }
.logo-track img { height: 100px; width: auto; max-width: 220px; object-fit: contain; filter: grayscale(20%); transition: .2s; }
.logo-track img:hover { filter: none; transform: scale(1.06); }
.logo-arrow {
  width: 42px; height: 42px; min-width: 42px; border-radius: 50%; border: 0;
  background: var(--heart-dark); color: #fff; font-size: 18px; cursor: pointer;
  box-shadow: 0 3px 10px rgba(11,18,32,.25); transition: .2s; z-index: 2;
}
.logo-arrow:hover { background: var(--heart-cta); transform: scale(1.08); }
@media (max-width: 576px) { .logo-track img { height: 72px; } .logo-track { gap: 36px; } }

/* Gallery & memories */
.g-img { width: 100%; height: 220px; object-fit: cover; border-radius: 12px; transition: .25s; cursor: pointer; }
.g-img:hover { transform: scale(1.02); box-shadow: 0 8px 20px rgba(0,0,0,.18); }
.memory-card { border: 0; border-radius: 14px; overflow: hidden; box-shadow: 0 4px 14px rgba(0,0,0,.08); height: 100%; }
.memory-card img { height: 230px; width: 100%; object-fit: cover; }

/* Seat map */
.seat-map { display: inline-block; background: #f8f9fa; border: 2px solid #dee2e6; border-radius: 14px; padding: 18px 22px; }
.seat-row { display: flex; gap: 8px; margin-bottom: 8px; justify-content: center; }
.seat {
  width: 46px; height: 40px; border-radius: 8px 8px 4px 4px; border: 2px solid #adb5bd;
  font-size: .75rem; font-weight: 700; cursor: default; background: #fff; color: #333;
}
.seat-gap { width: 30px; display: inline-block; }
.seat-available { background: #fff; border-color: #198754; color: #198754; }
.seat-selectable { cursor: pointer; }
.seat-selectable:hover { background: #d1e7dd; }
.seat-selected { background: #198754 !important; color: #fff !important; }
.seat-pending { background: #fff3cd; border-color: #ffc107; color: #997404; }
.seat-booked { background: #dc3545; border-color: #b02a37; color: #fff; }
.seat-blocked { background: #adb5bd; border-color: #6c757d; color: #fff; }
.seat-legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: .85rem; margin-top: 10px; }
.seat-legend .seat { width: 26px; height: 22px; font-size: 0; pointer-events: none; }

/* Suggestions */
.suggestion-card { border: 0; border-radius: 12px; box-shadow: 0 3px 12px rgba(0,0,0,.07); }
.vote-btn { border: 1px solid #dee2e6; background: #fff; border-radius: 999px; padding: 4px 14px; font-size: .9rem; cursor: pointer; transition: .15s; }
.vote-btn.voted-up { background: #d1e7dd; border-color: #198754; color: #198754; }
.vote-btn.voted-down { background: #f8d7da; border-color: #dc3545; color: #dc3545; }
.reply-box { background: #f8f9fa; border-radius: 10px; padding: 10px 14px; margin-top: 8px; }
.reply-box.admin-reply { background: #fff8e1; border-left: 4px solid var(--heart-accent); }

/* Footer */
.site-footer { background: var(--heart-dark); color: #fff; padding: 36px 0; margin-top: 48px; }
.site-footer a { color: var(--heart-accent); text-decoration: none; }
.site-footer a:hover { text-decoration: underline; }
.footer-top { display: flex; flex-direction: column; gap: 10px; align-items: center; text-align: center; }
@media (min-width: 768px) { .footer-top { flex-direction: row; justify-content: space-between; text-align: left; } }
.footer-brand { display: flex; align-items: center; gap: 10px; font-weight: 600; }
.footer-brand img { width: 50px; height: 50px; object-fit: contain; background: #fff; border-radius: 8px; padding: 4px; }
.footer-sep { height: 1px; background: rgba(255,255,255,.12); margin: 18px 0; }
.footer-bottom { display: flex; flex-direction: column; gap: 6px; align-items: center; text-align: center; font-size: .95rem; }
@media (min-width: 768px) { .footer-bottom { flex-direction: row; justify-content: space-between; } }

/* Misc */
.bg-soft { background: #f6f8fb; }
.video-frame { max-width: 760px; margin: 0 auto; }
.video-frame iframe { width: 100%; aspect-ratio: 16/9; border: 0; border-radius: 14px; box-shadow: 0 8px 24px rgba(0,0,0,.15); }
