/* Custom CSS for Bosgeluk Theme */

/* General Styles */
body {
    font-family: 'Inter', sans-serif; /* Use a modern, readable font */
    color: #333;
}

/* Hero Section Specific Styling */
#hero {
    /* Adjust this to ensure the image is full screen */
    background-size: cover;
    background-position: center;
    position: relative;
    /* Optional: Ensure text is vertically centered */
    display: flex;
    align-items: center;
    justify-content: center;
}

#hero .overlay {
    /* Dark overlay to make text pop over bright images */
    background: rgba(17, 17, 17, 0.4); 
    z-index: 0;
}

/* #hero h1 {
    font-size: 3rem;
    color: #C75000;
    text-shadow: 
      -1px -1px 0 black,  
      2px -1px 0 black,
      -1px 1px 0 black,
      2px 1px 0 black;

} */

#hero h1 {
  font-size: 3rem; /* Adjust as needed */
  font-weight: bold;
  color: #C75000; /* Color of the text itself */
  text-shadow: 
    -5px -5px 0 black,  
    5px -5px 0 black,
    -5px 5px 0 black,
    5px 5px 0 black; /* Creates a 1px black border */
}

#hero h2 {
    font-size: 2rem;
    /* Responsive font size for smaller screens */
}

#hero p {
    font-size: 1.5rem;
    /* Responsive font size for smaller screens */
}

@media (min-width: 992px) {
    #hero h1 {
        font-size: 5rem;
    }
}

/* Card Styling for Properties */
.card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    border-radius: 12px;
    overflow: hidden;
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}

.card-img-top {
    height: 250px;
    object-fit: cover;
}

/* Gallery Image Styles */
#gallery img {
    height: 200px;
    object-fit: cover;
    border-radius: 8px;
    transition: transform 0.3s ease;
}

#gallery img:hover {
    transform: scale(1.05);
}

/* Custom Colors (The 'Bushveld' Palette) */
.bg-dark {
    background-color: #1a2a1a !important; /* Deep Forest Green/Charcoal */
}

.bg-success {
    background-color: #4a6c4a !important; /* Muted Bush Green */
}

.text-success {
    color: #4a6c4a !important;
}

.btn-warning {
    background-color: #c75000 !important; /* Warm, booking-focused orange-tan */
    border-color: black !important;
    color: #1a2a1a !important;
    font-weight: bold;
}