/* Minimized Dark Theme Styling */
:root{--color-dark-bg:#0E1428;--color-card-bg:#1a233d;--color-text-light:#f9fafb;--color-primary:#35E8E4}body{font-family:'Roboto',sans-serif;margin:0;color:var(--color-text-light);background-image:linear-gradient(rgba(14,20,40,.95),rgba(14,20,40,.95)),url('background_image.png');background-size:cover;background-attachment:fixed;background-position:center center;background-color:var(--color-dark-bg);line-height:1.7}.container{max-width:1200px;margin:0 auto;padding:0 24px}.section{padding:80px 0}h2{font-size:3em;text-align:center;margin-bottom:20px}h2 span{color:var(--color-primary)}/* Header & Navigation */header{background-color:var(--color-card-bg);box-shadow:0 4px 6px rgba(0,0,0,.2)}
header .container{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding: 5px 20px 0px; 
}
.logo img {
    height: 55px;
    width: auto;
    /* DESKTOP FIX: Cyan color enforcement */
    filter: invert(1) grayscale(1) brightness(1.5) contrast(1.5) sepia(1) hue-rotate(140deg) saturate(5) drop-shadow(0 0 10px var(--color-primary)); 
}
nav ul{list-style:none;margin:0;padding:0;display:flex}nav ul li{margin-left:30px}
nav ul a{
    text-decoration:none;
    color:var(--color-text-light);
    padding:10px 0;
    position: relative;
    display: inline-block;
    transition: color 0.3s ease, border-color 0.3s ease;
    border-bottom: 2px solid transparent;
}
nav ul a:hover{
    color:var(--color-primary);
}
nav ul a.active{
    color:var(--color-primary);
    border-color: transparent;
    box-shadow: none;
    background-color: transparent;
}
nav ul a.active::after {
    content: '';
    position: absolute;
    bottom: -2px; 
    left: 0;
    width: 100%;
    height: 4px;
    background-color: var(--color-primary);
    box-shadow: 0 0 12px var(--color-primary);
}

/* Buttons */.btn{padding:14px 30px;text-decoration:none;border-radius:10px;font-weight:700;display:inline-block}.primary-btn{background-color:var(--color-primary);color:#0E1428}
.primary-btn{
    margin-right: 25px;
}
.secondary-btn{background-color:transparent;color:var(--color-primary);border:2px solid var(--color-primary)}/* Hero & Cards */
.hero{
    text-align:center;
    padding: 160px 20px 180px 20px;
}
.hero p {
    font-size: 1.15em;
    line-height: 2;
    max-width: 700px;
    margin: 0 auto 30px auto;
}

.hero .container div{display:flex;justify-content:center;flex-wrap:wrap;margin-top:20px}
.feature-card,.contact-form-container{
    background-color:var(--color-card-bg);
    padding: 60px 40px;
    border-radius:12px;
    box-shadow:0 10px 20px rgba(0,0,0,.3);
    z-index: 5;
}
/* FEATURE GRID */.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;margin-top:40px}

/* NEW: 5-Column Grid for new features */
.five-column-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 30px;
    margin-top: 40px;
    text-align: center;
}
.new-feature-card {
    padding: 30px 20px;
    background-color: transparent;
    box-shadow: none;
    border: 1px solid var(--color-card-bg);
}
.new-feature-card h4 {
    min-height: 4.5em;
}
.new-feature-card i {
    font-size: 3em;
    color: var(--color-primary); /* Default icon color */
    display: block;
    margin-bottom: 15px;
}
/* Font Awesome will provide the icon shapes. We only need the old icon definitions 
   if we were using the Unicode characters, which we are replacing. */
.icon-triangle::before { content: '▲'; }
.icon-orb::before { content: '◎'; }
.icon-polyhedron::before { content: '□'; } 
.icon-cube::before { content: '⛶'; }
.icon-x::before { content: '✕'; }

/* NEW ABOUT PAGE STYLES */
.hero-small {
    padding: 100px 0 40px 0;
}
.hero-small h2 {
    font-size: 3.5em;
    text-align: left;
}
.about-main-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-bottom: 60px;
}
.about-main-grid .feature-card {
    padding: 40px;
}
.about-main-grid h3 i {
    font-size: 1.5em;
    color: var(--color-primary);
    margin-right: 15px;
}
/* Core Values Grid */
.core-values-section h2 {
    margin-bottom: 60px;
}
.values-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    text-align: center;
}
.value-item i {
    font-size: 3em;
    color: var(--color-primary);
    display: block;
    margin-bottom: 15px;
    filter: drop-shadow(0 0 5px var(--color-primary)); /* Add glow to icons */
}
.value-item h4 {
    font-size: 1.4em;
    color: var(--color-primary);
}
/* DELETED OLD UNICODE PLACEHOLDERS for Mission/AI/Values - Font Awesome handles this now */


/* Testimonials Carousel */
.testimonials{overflow:hidden;position:relative}
.carousel-wrapper {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
    padding: 0 80px;
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: none;
}
.carousel-wrapper::-webkit-scrollbar {
    display: none;
}
.carousel{display:flex;transition:transform .5s ease;scroll-snap-type:x mandatory}
.testimonial-item{
    flex: 0 0 calc(100% - 60px);
    padding: 20px;
    box-sizing: border-box;
    scroll-snap-align: center;
    text-align: center;
    margin-right: 60px;
}
.testimonial-item:last-child {
    margin-right: 0;
}
.testimonial-quote{font-size:1.1em;line-height:1.6;margin-bottom:20px;position:relative;padding:30px 10px}.testimonial-quote::before,.testimonial-quote::after{content:'"';font-size:5em;color:var(--color-primary);position:absolute;opacity:.2}.testimonial-quote::before{top:0;left:0}.testimonial-quote::after{bottom:0;right:0;transform:rotate(180deg)}.carousel-nav{position:absolute;top:50%;width:100%;display:flex;justify-content:space-between;transform:translateY(-50%)}.carousel-btn{background-color:var(--color-primary);border:none;color:var(--color-dark-bg);padding:10px 15px;cursor:pointer;border-radius:50%;font-size:1.2em;z-index:10;transition:opacity .3s;margin:0 10px}.carousel-btn:hover{opacity:.8}
/* Form Styling */.contact-form-container{max-width:700px;margin:0 auto}.form-group{margin-bottom:25px}.form-group label{display:block;margin-bottom:8px}.form-group input,.form-group textarea{width:100%;padding:15px;border:1px solid #374151;background-color:#1f2937;color:var(--color-text-light);border-radius:8px;box-sizing:border-box}.submit-btn{width:100%}
/* Mobile */
@media (max-width:768px){
    h2{font-size:2em}
    .hero{
        padding: 100px 20px;
    }
    .btn{display:block;width:80%;margin:0 auto 15px auto;margin-right:0!important}
    header .container{flex-direction:column;align-items:center;padding:15px 0}
    .logo img{
        height: 40px;
        /* Mobile Logo Filter: Cyan enforcement */
        filter: invert(1) grayscale(1) brightness(1.5) contrast(1.5) sepia(1) hue-rotate(140deg) saturate(5) drop-shadow(0 0 8px var(--color-primary));
    }
    .new-feature-card i {
        color: var(--color-primary);
        filter: drop-shadow(0 0 5px var(--color-primary)); 
    }
    nav ul{margin-top:0;justify-content:center;flex-direction:row;align-items:center;padding:0;width:100%}
    nav ul li{margin:0 8px}
    nav ul a{padding:5px}
    h2{font-size:2.2em}
    .hero .container div{flex-direction:column;align-items:center}
    
    .primary-btn{
        margin-right: 0;
    }
    
    /* About page mobile adjustments */
    .hero-small h2 {
        text-align: center;
        font-size: 2.5em;
    }
    .about-main-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .values-grid {
        gap: 20px;
    }
    .value-item {
        padding: 20px;
        background-color: var(--color-card-bg);
        border-radius: 8px;
        box-shadow: 0 4px 8px rgba(0,0,0,.2);
    }
    .value-item i {
        margin-bottom: 10px;
        color: var(--color-primary);
        filter: drop-shadow(0 0 5px var(--color-primary)); 
    }
    
    /* Mobile Carousel Fixes */
    .carousel-wrapper {
        max-width: 100%;
        padding: 0 20px; 
    }
    .testimonial-item{
        flex: 0 0 80%; 
        padding: 40px 10px;
        margin-right: 40px;
    }
    .carousel-nav{
        width: 100%;
        padding: 0 10px; 
    }
    .carousel-btn {
        margin: 0;
    }
    .feature-card,.contact-form-container{
        padding: 40px 20px;
    }
    
    /* Mobile 5-Column Grid Fix */
    .five-column-grid {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    }
    .new-feature-card {
        padding: 30px;
        box-shadow: 0 5px 10px rgba(0,0,0,.3);
        background-color: var(--color-card-bg);
        border: none;
    }
}