/*
Theme Name: NexkSoft Theme
Author: Developer1
Description: Custom HTML theme for NexkSoft Program
Version: 1.0
*/

body {
    /* 40px (Contact Bar) 
     + 80px (Approx Height of White Header) 
     = 120px Total Space Needed 
    */
    padding-top: 120px; 
}



/* WhatsApp Button Styling */
.whatsapp-float {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 40px;
    background-color: #25d366; /* Official WhatsApp Green */
    color: #FFF;
    border-radius: 50%;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100; /* Ensures it floats on top of everything */
    
    /* Centering the icon */
    display: flex;
    justify-content: center;
    align-items: center;
    
    /* Smooth Hover Effect */
    transition: all 0.3s ease;
}

.whatsapp-float:hover {
    background-color: #128c7e; /* Darker green on hover */
    transform: scale(1.1);     /* Slightly bigger on hover */
}
/* --- Hero Section Styling (Fixed) --- */

.hero-section {
    position: relative;
    /* Change padding-top from 5rem (or 80px) to something smaller like 2rem */
    padding-top: 2rem !important; 
    padding-bottom: 5rem;
    
    /* Ensure the height is automatic so it doesn't force centering */
    height: auto; 
    min-height: 600px; /* Optional: Keeps the banner tall */    
}

.hero-section h1 {
    text-shadow: 2px 2px 0px #ffffff;
}

.hero-text-glow {
    /* A crisp white outline around the black text */
    text-shadow: 
        1px 1px 0 #fff,
        -1px 1px 0 #fff,
        1px -1px 0 #fff,
        -1px -1px 0 #fff;
    
    /* Make the font slightly bolder to stand out */
    font-weight: 600 !important;
}

/* SAP Training Institute Background */
.hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    /* The Generated Image URL */
    background-image: url('images/hero-sap.jpg');
    
    background-size: cover;

    /* --- THE FIX --- */
    /* center = Center Horizontally
       130px  = Push the image DOWN by 130px Vertically 
       (This clears your 120px Header area)
    */
    background-position: center 130px;
    
    background-repeat: no-repeat; /* Crucial so it doesn't repeat at the top */
    background-color: #000;       /* Fills the gap at the top with black if image moves too far */    

    background-attachment: fixed; /* Parallax effect */
    z-index: 1;
}

/* Overlay adjustments */
.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: 0.6; /* Keeps the whiteboard text visible but white text readable */
    z-index: 2;
}

/* Content */
.hero-content-wrapper {
    position: relative;
    z-index: 3;   /* Layer 3: The Text (Highest) */
    width: 100%;
}

/* Manual Button Hover Fix (Since Tailwind hover failed) */
.btn-sap-primary:hover {
    background-color: #1e40af !important; /* Dark Blue */
    transform: translateY(-2px); /* Slight lift effect */
}

/* =========================================
   STRONG AI PULSE ANIMATION
   ========================================= */
@keyframes deep-think-pulse {
    0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.7); }
    50% { 
        transform: scale(1.1); 
        border-color: #2563eb !important; /* Force Blue Border */
        box-shadow: 0 0 30px 10px rgba(37, 99, 235, 0.5); /* Big Blue Glow */
    }
    100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(37, 99, 235, 0); }
}

.thinking-mode {
    animation: deep-think-pulse 1.5s infinite ease-in-out !important;
    border: 4px solid #2563eb !important; /* Force Blue Border start */
    z-index: 50;
}

/* Gentle Floating/Bobbing Animation */
@keyframes float-bob {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); } /* Moves up 10px */
}

.animate-float {
    animation: float-bob 3s ease-in-out infinite;
}