/* -----------------------------------------------------------------
   1. Global & Utilities Overrides
----------------------------------------------------------------- */
        .border-t-dark { border-top: 1px solid rgba(11, 28, 48, 0.15); }
        .border-b-dark { border-bottom: 1px solid rgba(11, 28, 48, 0.15); }
        .border-t-light { border-top: 1px solid rgba(11, 28, 48, 0.12); }
        .border-b-light { border-bottom: 1px solid rgba(11, 28, 48, 0.12); }
        
        .accordion-item { border-bottom: 1px solid rgba(11, 28, 48, 0.15); padding: 1.5rem 0; display: flex; justify-content: space-between; align-items: center; cursor: pointer; }
        .accordion-item:last-child { border-bottom: none; }
        
        .comparison-table { width: 100%; border-collapse: collapse; }
        .comparison-table th, .comparison-table td { padding: 1.5rem 1rem; text-align: center; border-bottom: 1px solid rgba(11, 28, 48, 0.12); }
        .comparison-table td:first-child { text-align: left; font-weight: 500; }
        .accent-col { background-color: rgba(11, 28, 48, 0.07); }

        .follow-link {
            position: relative;
            text-decoration: none;
        }
        .follow-link::after {
            content: '';
            position: absolute;
            width: 100%;
            transform: scaleX(0);
            height: 1px;
            bottom: 0;
            left: 0;
            background-color: currentColor;
            transform-origin: bottom right;
            transition: transform 0.3s ease-out;
        }
        .follow-link:hover::after {
            transform: scaleX(1);
            transform-origin: bottom left;
        }

        .img-placeholder { width: 100%; aspect-ratio: 1; background-color: #b8cdd9; background-image: radial-gradient(rgba(11,28,48,0.12) 1px, transparent 1px); background-size: 10px 10px; display: flex; justify-content: center; align-items: center; }
		
		
        .bgform{
            background: rgba(255, 255, 255, 0.5);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
        }
/* -----------------------------------------------------------------
   2. Typography & Header Overrides
----------------------------------------------------------------- */

.textprime {
    color: #0B1C30;
}

.textpara {
    color: #333333;
}

.bgcool {
    background-color: #F0F8FF;
}

/* -----------------------------------------------------------------
   3. Draggable Infinite Carousel
----------------------------------------------------------------- */



/* -----------------------------------------------------------------
   4. Breakpoints & Responsive Logic
----------------------------------------------------------------- */


/* Mobile Menu Styles */
#togglemenu.active {
  opacity: 1;
  pointer-events: auto;
  display: flex !important;
}

/* Two-Line Toggle Animation */
#menu-toggle.active .menu-line:nth-child(1) {
  transform: translateY(0.35rem) rotate(45deg);
}

#menu-toggle.active .menu-line:nth-child(2) {
  transform: translateY(-0.1rem) rotate(-45deg);
}

/* Mobile Overrides */
@media (max-width: 767px) {
  .mb\:flex { display: flex !important; }
}

/* Ultrawide / Large Screens */
@media (min-width: 2000px) {
.ultra-w {
    padding-left: 17rem;
}

}


/* -----------------------------------------------------------------
   5. Custom Mouse Cursor
----------------------------------------------------------------- */
@media (hover: hover) and (pointer: fine) {
    /* Hide default cursor */
    body, a, button, input, textarea, select, .cursor-pointer {
        cursor: none !important;
    }

    

    .ape-cursor,
    .ape-follower {
        position: fixed;
        top: 0;
        left: 0;
        border-radius: 50%;
        pointer-events: none;
        z-index: 9999;
        background-color: #0B1C30;
        display: block;
        will-change: transform;
    }

    .ape-cursor {
        width: 0.8rem;
        height: 0.8rem;
    }

    .ape-follower {
        width: 3.5rem;
        height: 3.5rem;
        opacity: 0.7; /* Minimalist opacity */
    }
    }



/* Hide custom cursor on touch devices */
@media (hover: none), (pointer: coarse) {
    .ape-cursor, .ape-follower {
        display: none !important;
    }
}
/* -----------------------------------------------------------------
    6. Sticky Header & Custom Mobile Overlay
----------------------------------------------------------------- */

.sticky-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2000;
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(11, 28, 48, 0.1);
    transform: translateY(-101%);
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    padding: 1rem 5%;
}

.sticky-header.header-visible {
    transform: translateY(0);
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 100%;
    margin: 0 auto;
}

.header-logo {
    font-family: 'Anton', sans-serif;
    font-size: 1.5rem;
    color: #0B1C30;
    letter-spacing: 1px;
    text-decoration: none;
}

.header-nav {
    display: flex;
    gap: 2rem;
}

.header-nav a {
    font-family: 'Roboto', sans-serif;
    font-size: 0.9rem;
    font-weight: 500;
    color: #333;
    text-decoration: none;
    text-transform: capitalize;
    letter-spacing: 0.5px;
    transition: color 0.3s;
}

.header-nav a:hover {
    color: #0B1C30;
}

/* Mobile Toggle */
.header-toggle {
    display: none;
    flex-direction: column;
    gap: 6px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 5px;
}

.header-toggle span {
    display: block;
    width: 25px;
    height: 1px;
    background: #0B1C30;
    transition: 0.3s;
}

/* Mobile Overlay */
.custom-overlay {
    position: fixed;
    inset: 0;
    background: rgba(11, 28, 48, 0.5); /* Semi-transparent dark bg */
    z-index: 3000;
    display: flex;
    align-items: start;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s;
}

.custom-overlay.active {
    opacity: 1;
    pointer-events: auto;
}

.overlay-card {
    background: rgba(240, 248, 255, 0.25);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    width: 90%;
    max-width: 90vw;
    border-radius: 12px;
    margin-top: 5rem;
    padding: 3rem 2rem;
    position: relative;
    transform: scale(0.9);
    transition: transform 0.1s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
}

.custom-overlay.active .overlay-card {
    transform: scale(1);
}

.overlay-close {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 40px;
    height: 40px;
    background: rgba(235, 228, 216, 0.25); /* Matches the light brown box in image */
    border: none;
    border-radius: 4px;
    font-size: 1.2rem;
    color: #0B1C30;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

.overlay-close:hover {
    background: #dcd2c4;
}

.overlay-nav {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.overlay-nav a {
    font-family: 'Roboto', sans-serif;
    font-size: 1.5rem;
    font-weight: 500;
    color: #0B1C30;
    text-decoration: none;
    padding-bottom: 0.5rem;
    /* border-bottom: 1px solid rgba(11, 28, 48, 0.1); Removed for cleaner look like image */
}

/* Responsive */
@media (max-width: 767px) {
    .header-nav {
        display: none;
    }
    .header-toggle {
        display: flex;
    }
    .sticky-header {
        padding: 0.8rem 1.5rem;
    }
}