/* Global base */
html { font-size:14px; }
@media (min-width:768px) { html { font-size:16px; } }

body { margin-bottom:60px; }

/* Buttons focus */
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
 box-shadow:0000.1rem rgba(255,255,255,0.6),0000.25rem rgba(37,140,251,0.18);
}

/* Header / navbar */
.site-header { background: #fff; }
.navbar { align-items: center; }
.navbar-brand { margin-right:1rem; }
.logo-img { max-height:84px; height: auto; display: block; }
@media (max-width:991.98px) { .logo-img { max-height:64px; } }
@media (max-width:575.98px) { .logo-img { max-height:48px; } }

.contact-block { display: flex; align-items: center; }
.contact-block .phone-icon { opacity:0.95; }
@media (max-width:575.98px) { .contact-block .phone-icon { display: none !important; } .contact-block { display:none; } }

/* Navbar toggler on small screens */
@media (max-width:991.98px) {
 .navbar { position: relative; }
 .navbar-toggler { position: absolute; right:16px; top:50%; transform: translateY(-50%); z-index:1060; }
}

/* Utilities for headings */
.section-heading { text-align: center; margin-bottom:2rem; }
.section-heading h2 { font-size:2.25rem; font-weight:800; }
.section-heading p { color: #6c757d; }

/* Service cards */
.card.service-card { border-radius:12px; transition: transform220ms ease, box-shadow220ms ease; }
.card.service-card:hover { transform: translateY(-8px); box-shadow:018px40px rgba(15,23,42,0.12); }
.card.service-card img { display:block; }

/* Hero modern slider (kept concise) */
.hero-modern-slider { padding:2rem0; }
.hero-modern-slider .carousel-inner { border-radius:24px; overflow: hidden; position: relative; }
.hero-modern-slider .carousel-item { min-height:420px; background-size: cover; background-position: center; position: relative; }
.hero-modern-slider .bg-layer { position: absolute; inset:0; background-size: cover; background-position: center; z-index:0; transform: scale(1.05); transition: transform8000ms ease; }
.carousel-item.active .bg-layer { transform: scale(1); }
.hero-modern-slider .hero-overlay { position: absolute; inset:0; z-index:1; background: linear-gradient(90deg, rgba(0,0,0,0.55)20%, rgba(0,0,0,0.35)100%); }
.hero-modern-slider .hero-left { z-index:2; }
.hero-modern-slider .hero-title { font-size:2.6rem; font-weight:800; margin:0; }
.hero-modern-slider .hero-lead { color: rgba(255,255,255,0.92); max-width:560px; }
.btn-explore { background: linear-gradient(90deg,#c7f23a,#f7b500); color: #0b2b1f; border:0; padding:0.75rem1.25rem; border-radius:999px; font-weight:700; }

/* Indicators: vertical on desktop, bottom-centered on small screens */
.hero-modern-slider .carousel-indicators { position: absolute; right:20px; top:50%; transform: translateY(-50%); z-index:6; display: flex; flex-direction: column; gap:8px; padding:0; }
.hero-modern-slider .carousel-indicators button { width:12px; height:12px; border-radius:50%; background: rgba(255,255,255,0.45); border: none; }
.hero-modern-slider .carousel-indicators .active { background:#fff; box-shadow:06px18px rgba(0,0,0,0.25); }
@media (max-width:991.98px) { .hero-modern-slider .carousel-indicators { right:50%; left:50%; transform: translate(-50%,0); bottom:14px; top:auto; flex-direction:row; } }

/* Hero photo card */
.hero-photo-card { width:320px; border-radius:14px; overflow: hidden; border:8px solid rgba(255,255,255,0.95); box-shadow:012px40px rgba(0,0,0,0.35); transform: rotate(-6deg); }
.hero-photo-card img { display:block; width:100%; height:auto; }
@media (max-width:991.98px) { .hero-photo-card { width:240px; transform: none; } }

/* Popular packages: ensure images are fully visible */
.popular-card { border-radius:12px; overflow: hidden; transition: transform220ms ease, box-shadow220ms ease; }
.popular-card:hover { transform: translateY(-8px); box-shadow:020px50px rgba(0,0,0,0.12); }

/* Make package images fully visible using contain. Use fixed display area and center the image. */
.popular-card .card-img-top {
 display: block;
 width:100%;
 height:260px; /* fixed display area for consistency */
 object-fit: contain; /* show the whole image */
 object-position: center center;
 background: #f8fafc; /* subtle neutral background for letterboxing */
}

/* If you prefer no fixed height on very small screens reduce height */
@media (max-width:767.98px) { .popular-card .card-img-top { height:180px; } }

.price-badge { position: absolute; top:14px; left:14px; background: linear-gradient(90deg,#f7b500,#c7f23a); color: #072a20; padding:8px12px; border-radius:999px; font-weight:800; box-shadow:08px20px rgba(0,0,0,0.12); }
.popular-card .card-body { padding:1.25rem; }

/* CTA banner */
.cta-banner { background: linear-gradient(90deg,#0b7b6a,#f7b500); color: white; padding:40px0; border-radius:12px; }
.cta-banner h3 { font-size:2rem; font-weight:800; }
.cta-banner .btn-explore { background: #fff; color: #0b2b1f; }

/* Testimonials */
.testimonial-card { border-radius:12px; background: linear-gradient(180deg,#fff,#fafafa); box-shadow:012px30px rgba(11,29,29,0.06); }
.testimonial-author { color: #0b4f48; font-weight:700; margin-top: .75rem; }

/* Blog cards */
.article-card { border-radius:12px; overflow: hidden; }
.article-card .card-img-top { height:200px; object-fit: cover; }

/* Buttons */
.btn-explore { transition: transform180ms ease, box-shadow180ms ease; }
.btn-explore:hover { transform: translateY(-3px); box-shadow:010px30px rgba(87,128,0,0.12); }

/* Small utility */
.mb-5 { margin-bottom:3rem !important; }

/* Ensure hero remains visually separated */
.hero-modern-slider { margin-bottom: 2.5rem; }