/* Import Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap'); /* Outfit font */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap'); /* Keep Inter for fallbacks */


/* Custom Font Stacks */
body {
    font-family: "Outfit", "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* Outfit for body */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6, .font-heading {
    font-family: "Outfit", "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* Outfit as primary for headings */
}

.font-noto-serif {
    font-family: "Noto Serif", serif;
}

.font-outfit-bold {
    font-family: 'Outfit', sans-serif;
    font-weight: 700; /* Bold */
}

.font-outfit-light {
    font-family: 'Outfit', sans-serif;
    font-weight: 300; /* Light */
}

.text-highlight-shadow { text-shadow: 0 1px 3px rgba(0,0,0,0.15); }

/* Custom Colors (Tailwind can be configured, but for simplicity direct hex or utility classes) */
.bg-true-red { background-color: #C8102E; }
.text-true-red { color: #C8102E; }
.border-true-red { border-color: #C8102E; }
.focus\:ring-true-red:focus { --tw-ring-color: #C8102E; }
.focus\:border-true-red:focus { border-color: #C8102E; }


.bg-butter-yellow { background-color: #F4E04D; }
.text-butter-yellow { color: #F4E04D; }
.border-butter-yellow { border-color: #F4E04D; }

.bg-emerald-green { background-color: #2E8B57; }
.text-emerald-green { color: #2E8B57; }

.bg-whatsapp-green { background-color: #25D366; }

.bg-brand-blue { background-color: #07128d; } 
.text-brand-blue { color: #07128d; } 

/* Hero Background Animation - Removed as per user request for solid hero */
/*
.hero-bg {
    background: linear-gradient(270deg, #000000, #1a0408, #c8102e, #502a0f, #f4e04d, #1e3a27,  #2E8B57, #000000);
    background-size: 1000% 1000%; 
    animation: gradientAnimation 45s ease infinite; 
}

@keyframes gradientAnimation {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
*/

/* Section reveal animations */
.reveal {
    opacity: 0;
    transform: translateY(25px);
    transition: opacity 0.7s ease-out, transform 0.7s ease-out;
}
.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Testimonial Grid - Basic styles removed as Tailwind grid handles layout */
/*
.testimonial-slider-container {
    overflow: hidden; 
    position: relative;
    min-height: 200px; 
}
.testimonial-slide {
    display: none; 
    opacity: 0;
    transition: opacity 0.6s ease-in-out;
    position: absolute; 
    width: 100%;
}
.testimonial-slide.active {
    display: block; 
    opacity: 1;
    position: relative; 
}
*/


/* FAQ Accordion styles (using <details> element) */
.faq-item summary {
    position: relative; /* For custom marker positioning */
    list-style: none; /* Remove default marker if any appears */
}
.faq-item summary::-webkit-details-marker {
    display: none; /* Hide default marker in WebKit */
}
.faq-item summary::after { /* Custom marker */
    content: '+';
    position: absolute;
    right: 1.25rem; /* p-5 sm:p-6 */
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.75em; /* Larger plus */
    line-height: 1;
    color: #07128d; /* brand-blue */
    transition: transform 0.3s ease-out;
}
.faq-item[open] summary::after {
    transform: translateY(-50%) rotate(45deg);
}
.faq-content {
    /* Tailwind classes handle padding and border */
}

/* Navbar style */
#navbar {
    background-color: #07128d; /* New solid blue background */
    /* backdrop-filter: blur(10px); Removed as background is solid */
    box-shadow: 0 4px 12px rgba(0,0,0,0.4); /* Keep shadow for depth */
    border-bottom-color: rgba(255, 255, 255, 0.1); /* Subtle light border, works with border-b border-transparent on HTML element */
}

/* Smooth scrolling (already on html tag, but good to note) */
html {
    scroll-behavior: smooth;
}

/* Ensure body has no horizontal scroll if any element slightly overflows due to animations/transforms */
body {
    overflow-x: hidden;
}