/*!
Theme Name: sk netking
Theme URI: https://sknetking.com/
Author: shyam
Author URI: https://sknetking.com/
Description: this my first theme
Version: 1.1.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: sknetking
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

sk netking is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/* ============================================
   CUSTOM STYLES BEYOND TAILWIND
   ============================================ */

/* --- Global --- */
:root {
    --primary-gradient: linear-gradient(135deg, #00e5ff, #7b61ff);
    --bg-dark: #0b0f1a;
    --bg-darker: #070b12;
    --text-gray: #c8d0e0;
}

/* --- Header --- */
.technova-header {
    background: rgba(11, 15, 26, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(0, 229, 255, 0.15);
    transition: all 0.3s ease;
}

.technova-header.scrolled {
    background: rgba(7, 11, 18, 0.95);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5);
}

/* Logo glow */
.logo-glow {
    filter: drop-shadow(0 0 20px rgba(0, 229, 255, 0.15));
}

/* Desktop nav link */
.nav-link {
    position: relative;
    font-weight: 500;
    padding: 0.5rem 0;
    transition: color 0.3s ease;
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, #00e5ff, #7b61ff);
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

.nav-link:hover::after,
.nav-link.active::after {
    width: 100%;
}

.nav-link:hover {
    color: #ffffff;
}

/* Mobile menu */
.mobile-menu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.mobile-menu.open {
    max-height: 500px;
}

.mobile-menu-link {
    display: block;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    transition: all 0.2s ease;
    font-weight: 500;
}

.mobile-menu-link:hover {
    background: rgba(0, 229, 255, 0.1);
    color: #00e5ff;
    padding-left: 1.5rem;
}

/* --- Footer --- */
.whatsapp-float{
    position: fixed;
    bottom: 30px;
    right: 25px;
    z-index: 999;
}


.technova-footer {
    background: var(--bg-darker);
    border-top: 1px solid rgba(0, 229, 255, 0.08);
    position: relative;
    overflow: hidden;
}

.technova-footer::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle at 30% 0%, rgba(0, 229, 255, 0.03) 0%, transparent 50%);
    pointer-events: none;
}

.footer-heading {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #8b9bb5;
    margin-bottom: 1.25rem;
    position: relative;
    padding-bottom: 0.75rem;
}

.footer-heading::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 30px;
    height: 2px;
    background: linear-gradient(90deg, #00e5ff, #7b61ff);
    border-radius: 2px;
}

.footer-link {
    display: inline-block;
    color: #8b9bb5;
    transition: all 0.25s ease;
    padding: 0.25rem 0;
}

.footer-link:hover {
    color: #00e5ff;
    transform: translateX(4px);
}

/* Social icons */
.social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.05);
    color: #8b9bb5;
    transition: all 0.3s ease;
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.social-icon:hover {
    background: rgba(0, 229, 255, 0.15);
    color: #00e5ff;
    transform: translateY(-3px);
    border-color: rgba(0, 229, 255, 0.3);
    box-shadow: 0 8px 25px rgba(0, 229, 255, 0.15);
}



.newsletter-field-group.flex-1 {
    display: flex;
    gap: 10px;
} 

/* Newsletter input */
/* Newsletter Form */
.newsletter-wrapper {
    margin-bottom: 1rem;
}

.newsletter-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: #9CA3AF; /* gray-400 */
    display: block;
    margin-bottom: 0.75rem;
}

.newsletter-field-group {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

@media (min-width: 640px) {
    .newsletter-field-group {
        flex-direction: row;
    }
}

.newsletter-input-wrapper {
    flex: 1;
}

.newsletter-input {
    color:#000;
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid #D1D5DB;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    transition: border-color 0.15s ease-in-out;
}

.newsletter-input:focus {
    outline: none;
    border-color: #3B82F6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.newsletter-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem;
    background-color: #3B82F6;
    color: white;
    border: none;
    border-radius: 0.375rem;
    font-weight: 500;
    font-size: 0.875rem;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out;
    white-space: nowrap;
}

.newsletter-btn:hover {
    background-color: #2563EB;
}

.newsletter-btn i {
    margin-right: 0.5rem;
}

/* Space utility */
.space-y-3 > * + * {
    margin-top: 0.75rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .footer-heading::after {
        width: 20px;
    }
    
    .newsletter-btn {
        width: 100%;
        margin-top: 0.5rem;
    }
}